How can a graphql mutation automatically refresh a query being watched by Apollo Client?

I figured it out. Apollo-client by default caches our queries and re-runing the same query will of course return the results from cache not from the server.

Naturally, because I did a mutation to create a new record I would expect the server to refresh the dataset automatically which was not the case.

To solve this issue I came up with the idea of re-running my query from the success callback of our createVideo mutation but this time I add a special option called fetchPolicy which supports the following values:

'cache-first' | 'cache-and-network' | 'network-only' | 'cache-only' | 'standby'

Finally my fetch query looks like this:

this.apollo.query({query: VideoQuery, fetchPolicy: 'network-only'})
.subscribe(()=>{ console.log('refresh done, our watchQuery will update') })

Bonus tip:

Another intersting feature about Apollo is that you can set a pooling interval just like this so your data is always in sync with the server

this.data = this.apollo.watchQuery({query: VideoQuery, pollInterval: 10000});