Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DOCS: New nested fields, args for ApolloGraphQLManager #8469

Merged
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -1086,7 +1086,61 @@ const transformReadNotes = (manager) => {
export default transformReadNotes;
```

Simple! The transformation passes us a `ApolloGraphQLManager` instance that provides a fluent API for updating a query definition the same way the `FormStateManager` allows us to update Redux form state. In this case, our need is really straightforward. We'l just add a new field and be done with it.
Simple! The transformation passes us a `ApolloGraphQLManager` instance that provides a fluent API for updating a query definition the same way the `FormStateManager` allows us to update Redux form state.

#### Adding fields

In the above example, we added a single field to a query. Here's how that works:


```js
manager.addField(fieldName, fieldPath = 'root')
```

The `fieldPath` argument tells the manager at what level to add the field. In this case, since the `Priority` field is going on the root query (`readNotes`), we'll use `root` as the path. But suppose we had a more complex query like this:

```
query readMembers {
FirstName
Surname
Friends {
Email
Company {
Name
}
}
}
```

If we wanted to add a field to the nested `Company` query on `Friends`, we would use a path syntax.

```js
manager.addField('Tagline', 'root/Friends/Company');
```

#### Adding field arguments

Let's suppose we had the following query:

```
query ReadMembers($ImageSize: String!) {
readMembers {
FirstName
Avatar(Size: $ImageSize)
Company {
Name
}
}
}
```

Maybe the `Company` type has a `Logo`, and we want to apply the `ImageSize` parameter as an argument to that field.

```js
manager.addArg('Size', 'ImageSize', 'root/Company/Logo');
```

Where `root/Company/Logo` is the path to the field, `Size` is the name of the argument on that field, and `ImageSize` is the name of the variable.

#### Applying the transforms

Expand Down