Graphql how to match queries with apollo's refetchQuery

Graphql how to match queries with apollo's refetchQuery,graphql,apollo,apollo-client,Graphql,Apollo,Apollo Client,My fundimental question is do the variables for queries need to be exact for refetchQueries to work. Or can you give it a subset of variables and it will match similar queries. Consider the following .... <Query<NotesQuery, NotesQueryVariables> query={notesQuery} variables={{ input: { notebookId: notebookContext.id, first: 20 } }} > </Query> and the following mutation: client .mutate<NoteCreateOrUpdat

My fundimental question is do the variables for queries need to be exact for refetchQueries to work. Or can you give it a subset of variables and it will match similar queries.

Consider the following ....

  <Query<NotesQuery, NotesQueryVariables>
      query={notesQuery}
      variables={{
        input: {
          notebookId: notebookContext.id,
          first: 20
        }
      }}
    >
</Query>

and the following mutation:

    client
      .mutate<NoteCreateOrUpdateMutation, NoteCreateOrUpdateMutationVariables>({
        mutation: noteCreateOrUpdateMutation,
        variables: {
          input: {
            noteId: note ? note.id : undefined,
            subjectIds: noteSubjects,
            notebookId: notebookContext.id,
            authorId: userContext.id,
            content: noteContent,
            context: noteCaption,
          }
        },
        refetchQueries: [
          {
            query: notesQuery,
            variables: { input: { notebookId: notebookContext.id } } as NotesQueryVariables
          }
        ]
      })

when I do that mutation it is NOT refetching the note query with the pagination

If I add the

first: 20
parameter -- it works.

I would like it to clear all noteQueries that match with the given parameters. Is that possible?


#1

I believe you'll be wanting to add @connection directives to your gql definitions of notesQuery and measurementsQuery. You didn't post those, so unfortunately I can't show you exactly what that would look like for your use case.

Anyway, the @connection directive will allow Apollo to match on notebookId for example, while ignoring the value of first.

Unfortunately, you've bundled all your input into the object input, and I don't know how you would select just notebookId with the filter. Assuming that your gql definition looks something like this for notesQuery:

const notesQuery = gql`
  query notes($input: InputType!) {
    notes(input: $input) @connection(key: "notes", filter: ["input['notebookId']"]) {
      id
      ...
    }
  }
`;

^^^ Unfortunately, that won't work because of the way that apollo-utilities/lib/storeUtils.js -> getStoreKeyName() function works. It'll just ignore the above attempt to get better resolution than an arg name, i.e. can't go beyond input. Any string in the filter array that doesn't match an arg name is silently ignored.

Looks like you'll have to modify your schema.

More info at: https://www.apollographql.com/docs/react/features/pagination.html#connection-directive