react native - Apollo-client custom network interface to make different gql queries when offline/online? -


i'm developing offline-first expo/react native app, using graphql + apollo client + join monster, , storing data in sqlite db client-side.

my schema (and rest of code) looks similar 1 https://github.com/tslater/reactnative-relay-offline/blob/master/graphql/relay-schema/index.js except instead of using relay, using apollo client graphql client.

i have custom networkinterface looks like:

import schema './graphql/relay-schema'  class localnetworkinterface implements networkinterface {   constructor(schema) {     this.schema = schema   }   query(request) {     const { query, variables } = request     return graphql(       this.schema,       printast(query),       null,       null,       variables,     )   }   getschema() {     return this.schema   } }  export function createlocalnetworkinterface(options) {   const { schema } = options   return new localnetworkinterface(schema) }  const networkinterface = createlocalnetworkinterface({ schema }) const client = new apolloclient({networkinterface}) 

and works offline queries.

however, i'm unsure of how adapt in order able make queries against real server when app detects has internet connection. gql query issue against server different 1 issue against local db, if matters. https://github.com/apollographql/apollo-link helpful here?

i found excellent documentation apollo data deals issue, http://dev.apollodata.com/core/network.html#customnetworkinterfaceexample

i combined react-native-offline package me isconnected prop, can pass alongside query variables, , created new hybridnetworkinterface:

import {createnetworkinterface} 'apollo-client' import {createlocalnetworkinterface} './localnetworkinterface'  export class hybridnetworkinterface {   constructor(opts) {     this.localinterface = createlocalnetworkinterface(opts)     this.networkinterface = createnetworkinterface(opts) // createnetworkinterface   }   query(request) {     if (request.variables && request.variables.isconnected) {       return this.networkinterface.query(request)     }     return this.localinterface.query(request)   }   use(middlewares) {     this.networkinterface.use(middlewares)     this.localinterface.use(middlewares)     return   }   useafter(afterwares) {     this.networkinterface.useafter(afterwares)     this.localinterface.useafter(afterwares)     return   } }  export function createhybridnetworkinterface(opts) {   return new hybridnetworkinterface(opts) } 

Comments

Popular posts from this blog

PHP and MySQL WP -

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

go - golang pprof for c library code -