Skip to content

Commit

Permalink
Document directives argument for @refetchable (#4520)
Browse files Browse the repository at this point in the history
Summary:
Title says it all 😃

Pull Request resolved: #4520

Reviewed By: monicatang

Differential Revision: D52876765

Pulled By: captbaritone

fbshipit-source-id: 8401d80ff2b18fe74ba5c157e6530430aa42f58e
  • Loading branch information
Daniel15 authored and facebook-github-bot committed Jan 18, 2024
1 parent 95b4694 commit 8392b68
Show file tree
Hide file tree
Showing 2 changed files with 30 additions and 2 deletions.
16 changes: 15 additions & 1 deletion website/docs/api-reference/graphql/graphql-directives.md
Original file line number Diff line number Diff line change
Expand Up @@ -110,10 +110,24 @@ Notes:

With `usePaginationFragment`, Relay expects connection fields to be annotated with a `@connection` directive. For more detailed information and an example, check out the [docs on `usePaginationFragment`](../../guided-tour/list-data/rendering-connections).

## `@refetchable(queryName: String!)`
## `@refetchable(queryName: String!, directives: [String])`

With `useRefetchableFragment` and `usePaginationFragment`, Relay expects a `@refetchable` directive. The `@refetchable` directive can only be added to fragments that are "refetchable", that is, on fragments that are declared on `Viewer` or `Query` types, or on a type that implements `Node` (i.e. a type that has an id). The `@refetchable` directive will autogenerate a query with the specified `queryName`. This will also generate Flow types for the query, available to import from the generated file: `<queryName>.graphql.js`. For more detailed information and examples, check out the docs on [`useRefetchableFragment`](../use-refetchable-fragment/) or [`usePaginationFragment`](../use-pagination-fragment/).

Optionally, you can pass in a list of directives to add to the autogenerated query. For example, this can be used to add the `@relay_test_operation` directive for [testing](../../guides/testing-relay-components):

```javascript
graphql`
fragment FriendsListComponent_user on User
@refetchable(
queryName: "FriendsListFetchQuery"
directives: ["@relay_test_operation"]
) {
...
}
`
```

## `@relay(plural: Boolean)`

When defining a fragment for use with a Fragment container, you can use the `@relay(plural: true)` directive to indicate that container expects the prop for that fragment to be a list of items instead of a single item. A query or parent that spreads a `@relay(plural: true)` fragment should do so within a plural field (ie a field backed by a [GraphQL list](http://graphql.org/learn/schema/#lists-and-non-null). For example:
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -110,10 +110,24 @@ Notes:

With `usePaginationFragment`, Relay expects connection fields to be annotated with a `@connection` directive. For more detailed information and an example, check out the [docs on `usePaginationFragment`](../../guided-tour/list-data/rendering-connections).

## `@refetchable(queryName: String!)`
## `@refetchable(queryName: String!, directives: [String])`

With `useRefetchableFragment` and `usePaginationFragment`, Relay expects a `@refetchable` directive. The `@refetchable` directive can only be added to fragments that are "refetchable", that is, on fragments that are declared on `Viewer` or `Query` types, or on a type that implements `Node` (i.e. a type that has an id). The `@refetchable` directive will autogenerate a query with the specified `queryName`. This will also generate Flow types for the query, available to import from the generated file: `<queryName>.graphql.js`. For more detailed information and examples, check out the docs on [`useRefetchableFragment`](../use-refetchable-fragment/) or [`usePaginationFragment`](../use-pagination-fragment/).

Optionally, you can pass in a list of directives to add to the autogenerated query. For example, this can be used to add the `@relay_test_operation` directive for [testing](../../guides/testing-relay-components):

```javascript
graphql`
fragment FriendsListComponent_user on User
@refetchable(
queryName: "FriendsListFetchQuery"
directives: ["@relay_test_operation"]
) {
...
}
`
```

## `@relay(plural: Boolean)`

When defining a fragment for use with a Fragment container, you can use the `@relay(plural: true)` directive to indicate that container expects the prop for that fragment to be a list of items instead of a single item. A query or parent that spreads a `@relay(plural: true)` fragment should do so within a plural field (ie a field backed by a [GraphQL list](http://graphql.org/learn/schema/#lists-and-non-null). For example:
Expand Down

0 comments on commit 8392b68

Please sign in to comment.