Updating cached data from multiple parameterized queries after a mutation

[c10b10]

Suppose I have a paginated infinite scroll list of Items. The list pulls data from a GraphQL server by using two parameterized queries: ITEMLIST_QUERY and ITEMLIST_MORE_QUERY. Both of those queries have arguments for ordering, and filtering, and whatever else is needed for pagination. The only difference between them is that the MORE query has an extra $skip argument (I know I could have used a single query with a default $skip set to 0, but that's not the point of the question).

Now suppose a user loads a few pages of data, ie.

• ITEMLIST_QUERY gets called at component mount, data is loaded into the store, first 10 Items are rendered on the page.
• User scrolls, ITEMLIST_MORE_QUERY gets called with a $skip: 10 arg, data is loaded into the store, the 10 new items are appened in the UI.
• User scrolls again, ITEMLIST_MORE_QUERY gets called again with a different $skip, data is loaded into the store, the UI now contains 30 `Items.

Now suppose the user clicks Delete for a certain item in the list, and the ITEM_DELETE_MUTATION mutation gets called.

How does one update the data for the appropriate query in the store through the recommended update in ordered to update the UI to reflect the deletion?

proxy.readQuery seem not be able to help, since I can't be sure of the number of queries executed, or of which query contains the deleted Item.

Is there a way to get all data from all queries that match a certain pattern? For example:

proxy.readQuery({ queriesMatch: 'allItems' })

It's pretty clear how to do this with the query reducer, but I'm wondering if there's a way of doing this by using update since reducer might be deprecated in the future.

[c10b10]

Ran into the same need with refetchQueries since I have the same query with multiple arguments cached, and I want to update only the queries that contain a certain just favorited Item.

[timbrandin]

I have the same issue, this is very common for paginated queries, and you want to update all of the cached data in the store, like for example remove an item.

[c10b10]

@timbrandin Maybe you can chip in here: apollographql/react-apollo#708

[jonmanzo]

Take a look at this response... It's how I handled a similar situation:

#1779 (comment)

[helfer]

Thanks for opening the issue @c10b10. Let's keep all the discussion in one place: apollographql/react-apollo#708