apollo-link-state | ✨ Manage your application 's state with Apollo | GraphQL library
kandi X-RAY | apollo-link-state Summary
kandi X-RAY | apollo-link-state Summary
️ WARNING ️ Apollo Client 2.5 is going to be released very shortly, and will include integrated local state handling capabilities. The functionality offered by apollo-link-state will be included in the Apollo Client core, which means this project/repository will be deprecated. For those interested in trying out the new integrated local state features of AC, see apollographql/apollo-client#4155 (the changes are currently available via apollo-client@alpha and react-apollo@alpha). We're still in alpha, but will be cutting over to beta soon (so if you have any feedback, please add your comments in apollographql/apollo-client#4155). Thanks!.
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of apollo-link-state
apollo-link-state Key Features
apollo-link-state Examples and Code Snippets
Lines of Code : 27
License : No License
Copyconst defaults = {
todos: [],
visibilityFilter: 'SHOW_ALL',
networkStatus: {
__typename: 'NetworkStatus',
isConnected: false,
}
};
const resolvers = { /* ... */ };
const cache = new InMemoryCache();
const stateLink = withClientStat npm install apollo-link-state --save
import { withClientState } from 'apollo-link-state';
// This is the same cache you pass into new ApolloClient
const cache = new InMemoryCache(...);
const stateLink = withClientState({
cache,
resolvers: {
const WrappedComponent = graphql(
gql`
mutation updateStatus($text: String) {
status(text: $text) @client
}
`,
)(({ mutate }) => (
mutate({ variables: { text: 'yo' } })} />
));
withClientMutations(({ writeField }) => ( Community Discussions
Trending Discussions on apollo-link-state
QUESTION
I'm working with Apollo Client local state and cache and although I've gone through the docs (https://www.apollographql.com/docs/react/essentials/local-state), a couple of tutorials (for example, https://www.robinwieruch.de/react-apollo-link-state-tutorial/) and looked at some examples, I'm a bit befuddled. In addition to any insight you might be able provide with the specific questions below, any links to good additional docs/resources to put things in context would be much appreciated.
In particular, I understand how to store local client side data and retrieve it, but I'm not seeing how things integrate with data retrieved from and sent back to the server.
Taking the simple 'todo app' as a starting point, I have a couple of questions.
1) If you download a set of data (in this case 'todos') from the server using a query, what is the relationship between the cached data and the server-side data? That is, I grab the data with a query, it's stored in the cache automatically. Now if I want to grab that data locally, and, say, modify it (in this case, add a todo or modify it), how I do that? I know how to do it for data I've created, but not data that I've downloaded, such as, in this case, my set of todos. For instance, some tutorials reference the __typename -- in the case of data downloaded from the server, what would this __typename be? And if I used readQuery to grab the data downloaded from the server and stored in the cache, what query would I use? The same I used to download the data originally?
2) Once I've modified this local data (for instance, in the case of todos, setting one todo as 'completed'), and written it back to the cache with writeData, how does it get sent back to the server, so that the local copy and the remote copy are in sync? With a mutation? So I'm responsible for storing a copy to the local cache and sending it to the server in two separate operations?
3) As I understand it, unless you specify otherwise, if you make a query from Apollo Client, it will first check to see if the data you requested is in the cache, otherwise it will call the server. Why, then, do you need to make an @client in the example code to grat the todos? Because these were not downloaded from the server with a prior query, but are instead only local data?
ANSWER
Answered 2019-Dec-28 at 04:37The
__typenameis Apollo's built-in auto-magic way to track and cache results from queries. By default you can look up items in your cache by using the__typenameandidof your items. You usually don't need to worry about__typenameuntil you manually need to tweak the cache. For the most part, just re-run your server queries to pull from the cache after the original request. The server responses are cached by default, so the next time you run a query it will pull from the cache.It depends on your situation, but most of the time if you set your IDs properly Apollo client will automatically sync up changes from a mutation. All you should need to do is return the
idproperty and any changed fields in your mutation query and Apollo will update the cache auto-magically. So, in the case you are describing where you mark a todo as completed, you should probably just send the mutation to the server, then in the mutation response you request the completed field and the id. The client will automatically update.You can use the original query. Apollo client essentially caches things using a
query + variable->resultsmap. As long as you submit the same query with the same variables it will pull from the cache (unless you explicitly tell it not to).See my answer to #2 above, but Apollo client will handle it for you as long as you include the
idand any modified data in your mutation. It won't handle it for you if you add new data, such as adding a todo to a list. Same for removing data.
QUESTION
I use vue-cli-plugin-apollo and I want to send language chosen by user from frontend to backend via cookie.
As a vue-apollo.js I use the next template
ANSWER
Answered 2019-Oct-26 at 13:40Found solution.
FRONT END SETTINGS
- Create cookie:
QUESTION
I'm attempting to use the modern Context API within React-Native, but I'm getting the following error:
TypeError: TypeError: undefined is not an object (evaluating 'Context._context')
my createDataContext.js:
...ANSWER
Answered 2019-Oct-09 at 04:02I had the same error and it's because I was importing Context like this:
import {Context} from '...'
INSTEAD OF
import Context from '..'
QUESTION
I've been following the Apollo Client docs on local state.
I've implemented a very simple query of the client cache:
...ANSWER
Answered 2019-May-03 at 13:33From the docs:
⚠️ If you want to use Apollo Client's
@clientsupport to query the cache without using local resolvers, you must pass an empty object into theApolloClientconstructorresolversoption. Without this Apollo Client will not enable its integrated@clientsupport, which means your@clientbased queries will be passed to the Apollo Client link chain. You can find more details about why this is necessary here.
In other words, just add an empty resolvers object to your configuration like this:
QUESTION
I'm using apollo-link-state for locally storing errors, but I get the following error after clearing cache.
I've set the default value of errors to an empty array [] in apollo client configuration options.
However, after apolloClient.cache.reset() or apolloClient.store.reset(), it seems that I lose all default values, causing this error:
Any ideas how to resolve this issue?
...ANSWER
Answered 2018-Nov-14 at 16:47From the docs:
Sometimes you may need to reset the store in your application, for example when a user logs out. If you call client.resetStore anywhere in your application, you will need to write your defaults to the store again. apollo-link-state exposes a writeDefaults function for you. To register your callback to Apollo Client, call client.onResetStore and pass in writeDefaults.
So you can do something like:
QUESTION
I have a React app which is using Apollo Client. I'm using apollo-link-state and apollo-cache-persist and need to reset my store to its default values when client.resetStore() is called in my app.
The docs say that when creating a client you should call client.onResetStore(stateLink.writeDefaults) and this will do the job but writeDefaults is exposed by Apollo Link State which i don't have direct access to as I’m using Apollo Boost.
Here is my Apollo Client code:
...ANSWER
Answered 2018-Sep-23 at 02:26AFAIK the only way to this is to migrate from Apollo Boost which configures a lot of things under the hood for you and set up Apollo Client manually. After migrating I was able to call onResetStore() as per the docs and everything is working :)
Apollo Boost migration: https://www.apollographql.com/docs/react/advanced/boost-migration.html
QUESTION
Perhaps I am just not getting what apollo-link-state does, but I figured if I had a "default" value, THAT would show up in my props via the Provider. Yet, I can't locate it. How do you access the "cache" or local state?
I have:
...ANSWER
Answered 2019-Feb-06 at 06:00As outlined in the docs, you query your local state just like you query a remote server, except you tack on a @client directive to let Apollo know that you're requesting something through apollo-link-state. So we need a GraphQL query, wrapped with a graphql-tag template literal tag:
QUESTION
When running an @client mutation using apollo-link-state, then response from the resolver is merely:
...ANSWER
Answered 2019-Feb-01 at 07:57const UPDATE_ITEM = gql
mutation updateInventoryItem($product: InventoryItem!) {
return updateInventoryItem(product: $product) @client {
__typename
id
...and so on
}
}
;
QUESTION
The setup:
My basic setup is a Next.js app querying data from a GraphQL API.
I am fetching an array of objects from the API and am able to display that array on the client.
I want to be able to filter the data based on Enum values that are defined in the API schema. I am able to pass these values programmatically and the data is correctly updated.
I want those filters to be persistent when a user leaves the page & come back. I was originally planning to use Redux, but then I read about apollo-link-state and the ability to store local (client) state into the Apollo store, so I set out to use that instead. So far, so good.
The problem:
When I try to combine the local query and the remote query into a single one, I get the following error: networkError: TypeError: Cannot read property 'some' of undefined
My query looks like this:
...ANSWER
Answered 2019-Jan-26 at 13:14Add an empty object as your resolver map to the config you pass to withClientState:
QUESTION
Here's what I'm trying to accomplish: I have a graphql API endpoint that returns me a Project object like this(unrelated fields removed):
...ANSWER
Answered 2018-Dec-20 at 06:14You need to provide a client side resolver to your clientState configuration.
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install apollo-link-state
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page
