Skip to main content

refetchQueries

Overview

refetchQueries is analogous to refetchQueries option passed to mutate method in Apollo.
It enables refetching queries after a mutation has executed.

Usage

Let's modify bookState to refetch the full list of books from the server instead of modifying the cache on the client when ADD_BOOK_MUTATION is executed.

library/states/book.state.ts
import { state } from '@apollo-orbit/angular/state';
import { ADD_BOOK_MUTATION, BOOKS_QUERY } from '../../graphql/types';

export const bookState = state(descriptor => descriptor
.refetchQueries(ADD_BOOK_MUTATION, info => [BOOKS_QUERY])
.mutationUpdate(ADD_BOOK_MUTATION, (cache, info) => {
const addBook = info.data?.addBook;
if (!addBook) return;
cache.updateQuery({ query: BOOKS_QUERY }, data => data ? { books: [...data.books, addBook] } : data);
})
);

Now, whenever ADD_BOOK_MUTATION is executed, BOOKS_QUERY will be refetched from the server and any components watching BOOKS_QUERY will be updated with the new data.

API

type RefetchQueryDescriptor = Array<string | DocumentNode | PureQueryOptions | QueryOptions> | 'all' | 'active';