I'm using Postgraphile to generate a Graphql schema for me. I am using Apollo Client 3 to help with querying/caching. Here is the relevant shape of my schema:
Query -> buckets: BucketsConnection -> edges: BucketsEdge -> node: Bucket
Query -> nuggets: NuggetsConnection -> edges: NuggetsEdge -> node: Nugget
nuggets
and buckets
have a many:many relationship.
When I try to create a new record for either nugget for bucket, I get this warning:
Cache data may be lost when replacing the nuggets field of a Query object.
To address this problem (which is not a bug in Apollo Client), define a custom merge function for the Query.nuggets field, so InMemoryCache can safely merge these objects:
existing: [{"**typename":"NuggetsEdge","node":{"**ref":"Nugget:0343d751-40de-4036-825e-837cb15674c4"}},......... incoming: {"**typename":"NuggetsConnection","edges":[{"**typename":"NuggetsEdge","node":{"__ref":"Nugget:0343d751-40de-4036-825e-837cb15674c4"}},.........
I notice that the shape of these 2 are different, and it makes sense that they should match one another, so I did this in my InMemoryCache
schema:
typePolicies: {
Query: {
fields: {
nuggets: {
merge: (existing = [], incoming) => {
return [
...existing,
...incoming.edges,
]
},
},
buckets: {
merge: (existing = [], incoming) => {
return [
...existing,
...incoming.edges,
]
},
},
},
},
},
However, this does not solve the issue, and it results in data = undefined
being returned from the apollo query.
Here is my update
function on the 'createNugget' mutation:
update(cache, { data: { createNugget } }) {
cache.modify({
fields: {
nuggets(existingNuggets = []) {
const newNuggetRef = cache.writeFragment({
data: createNugget.nugget,
fragment: gql`
fragment NewNugget on Nugget {
id
title
mediaItems
}
`,
})
return [
...existingNuggets,
newNuggetRef,
]
},
},
})
},
So I am curious to know why the cache doesn't seem to like the format I am passing it, because the incoming
seems to match the existing
.