Removing an item from an array with cache.updateQuery

Trying to update the apollo cache by removing an item from an array and always get this warning

invariant.esm.js:45 Cache data may be lost when replacing the <field_name> field of a object.

We update the cache with a new array (see below). From the apollo docs (Customizing the behavior of cached fields - Client (React) - Apollo GraphQL Docs)

By default, the field’s existing array is completely replaced by the incoming array

Yet, when we update the the array in the cache with an item removed it throws the warning. ie.

existing = [{id:1}, {id:2}, {id:3}]
incoming = [{id:1}, {id:2}]

Based on the default I expect that the incoming overwrites the existing in a valid way. Now it does work. But the warning raises questions all the time.

We do this like

cache.updateQuery(
  {
    query: QUERY,
  },
  (cache) => ({
    ...cache,
    list: cache.list.filter((i) => i.id !== something.id),
  })
)

It comes from apollo-client/writeToStore.ts at main · apollographql/apollo-client · GitHub
as that tries to confirm that all items in existing are in incoming which is not true when removing an item.

How do we resolve this so the warning doesn’t happen? If we ignore it we’ll end up ignoring all warnings like that that may be more real.

Also, this might be real so how do I fix this? I tried evict but got the same warning.

Thanks

1 Like