feat: support apollo client 2.5 local state features, closes #112

Akryum · Mar 19, 2019 · 9ddb8d2 · 9ddb8d2
1 parent 4c6c3db
commit 9ddb8d2
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 13 deletions.
diff --git a/docs/guide/client-state.md b/docs/guide/client-state.md
@@ -1,28 +1,35 @@
 # Client state
 
-You can use [apollo-link-state](https://github.com/apollographql/apollo-link-state) for client-only local data with the `clientState` option of `createApolloClient`:
+You can use [local state](https://www.apollographql.com/docs/react/essentials/local-state.html) for client-only local data with the related options of `createApolloClient`:
 
 ```js
+import gql from 'graphql-tag'
 import { createApolloClient } from 'vue-cli-plugin-apollo/graphql-client'
 
 const options = {
   // ...
 
-  clientState: {
-    defaults: {
-      connected: false,
-    },
-    resolvers: {
-      Mutation: {
-        connectedSet: (root, { value }, { cache }) => {
-          const data = {
-            connected: value,
-          }
-          cache.writeData({ data })
-        },
+  typeDefs: gql`
+  type Query {
+    connected: Boolean!
+  }
+  `,
+  resolvers: {
+    Mutation: {
+      connectedSet: (root, { value }, { cache }) => {
+        const data = {
+          connected: value,
+        }
+        cache.writeData({ data })
       },
     },
   },
+  onCacheInit: cache => {
+    cache.writeData({
+      connected: false,
+    })
+  },
+},
 }
 
 const { apolloClient } = createApolloClient(options)

diff --git a/graphql-client/src/index.js b/graphql-client/src/index.js
@@ -42,6 +42,12 @@ export function createApolloClient ({
   clientState = null,
   // Function returning Authorization header token
   getAuth = defaultGetAuth,
+  // Local Schema
+  typeDefs = undefined,
+  // Local Resolvers
+  resolvers = undefined,
+  // Hook called when you should write local state in the cache
+  onCacheInit = undefined,
 }) {
   let wsClient, authLink, stateLink
   const disableHttp = websocketsOnly && !ssr && wsEndpoint
@@ -128,6 +134,7 @@ export function createApolloClient ({
   }
 
   if (clientState) {
+    console.warn(`clientState is deprecated, see https://vue-cli-plugin-apollo.netlify.com/guide/client-state.html`)
     stateLink = withClientState({
       cache,
       ...clientState,
@@ -148,6 +155,8 @@ export function createApolloClient ({
       // Apollo devtools
       connectToDevTools: process.env.NODE_ENV !== 'production',
     }),
+    typeDefs,
+    resolvers,
     ...apollo,
   })
 
@@ -156,6 +165,13 @@ export function createApolloClient ({
     apolloClient.onResetStore(stateLink.writeDefaults)
   }
 
+  if (onCacheInit) {
+    onCacheInit(cache)
+    apolloClient.onResetStore(() => {
+      onCacheInit(cache)
+    })
+  }
+
   return {
     apolloClient,
     wsClient,