Skip to content

Latest commit

 

History

History
46 lines (38 loc) · 1.28 KB

File metadata and controls

46 lines (38 loc) · 1.28 KB

Persistence Mapper Example

The example persistence mapper uses the same strategy as apollo-cache-instorage and largely just copied the PersistLink from it.

Effectively you can decorate your queries with either the @persist directive or the __persist property in order to flag the query and objects for persistence. In order to make this possible you need to add the persist link to your apollo clients' link chain (see the useApolloClient hook). The persist links' responsibility is to strip the @persist/__persist tags from your query prior to it being sent to your graphql endpoint and then decorating the response from the query with those attributes.

Once that's completed the persistenceMapper simply parses the local cache and strips out any elements that don't have those properties on them from the persisted version of the cache.

Example

query FooQuery {
  foos @persist {
    id
    name
    description
  }
}

or

query FooQuery {
  foos {
    __persist
    id
    name
    description
  }
}

You can see this in action in the src/Launches.tsx and src/Ships.tsx components. launchesGQL is decorated and therefore will be persisted whereas shipsGQL is not (so it won't be persisted).