Apollo-client: How to get model from cache by id and __typename

[bbakhrom]

I want to get model from the cache and update it having a model id and __typename. So, instead of:

    const data = proxy.readQuery({ query: TodoAppQuery });
    data.todos.push(createTodo);
    proxy.writeQuery({ query: TodoAppQuery, data });

do following:

    const model = proxy.readModel(__typename, id);
    model.todos.push(createTodo);
    proxy.writeModel(model);

This approach is much cleaner and readable, produces less boilerplate code and prevents confusion on what query to use to get and update the model (when I have multiple queries returning same models, for example TodoByIdQuery and TodoListQuery)

[Poincare]

Although this sounds like an interesting idea for some applications, I don't think it generalizes well enough to make it an "available everywhere" API.

For your usecase, is it possible for you to implement a class with the readModel and writeModel methods that you would like?

[bbakhrom]

I don't see a reason why it cannot be "available everywhere" API.

For your usecase, is it possible for you to implement a class with the readModel and writeModel methods that you would like?

can you please provide an example of what you mean?

Example of the problem.

We have list of posts (page) and post view page (viewing single post). Two queries - PostListQuery, PostViewQuery.

Each post has "likes". Likes is a separate module, because likes can also be on other objects (photos, videos, etc.). I have a "like widget" which adds a new like and updates "post.likes" counter. Now I need to update likes counter in the cache of the changed model from my "like widget" component.

How do I do that? The most logical way is to find object Im working with (by "id" and "type") in cache and update it. This way it will work for any object like is attached to. The most non-logical way is to find this object by any match (PostListQuery, PostQuery, PhotoQuery, PhotoListQuery, etc.), check their types and ids and update them. Currently Im not able to udpate my post in my view because there is no other way to find this object in the cache rather then use this second "non-logical" approach.

[hwillson]

To help provide a more clear separation between feature requests / discussions and bugs, and to help clean up the feature request / discussion backlog, Apollo Client feature requests / discussions are now being managed under the https://github.com/apollographql/apollo-feature-requests repository.

This feature request / discussion will be closed here, but anyone interested in migrating this issue to the new repository (to make sure it stays active), can click here to start the migration process. This manual migration process is intended to help identify which of the older feature requests are still considered to be of value to the community. Thanks!

[tushar-singh]

I was also looking for this. Looks like you can do it using client.cache.data.get (at least if you're using apollo-cache-inmemory)

<ApolloConsumer>
    {client => (
        <button
            onClick={() => {
                // get item from cache
                const item = client.cache.data.get(`TypeName:${id}`);

                // set new value
                client.cache.data.set(`TypeName:${id}`, {
                    ...item,
                    key: 'updated_value',
                });

                // update query components to reflect updated value
                client.cache.broadcastWatches();
            }}
        >
            update item
        </button>
    )}
</ApolloConsumer>

This approach probably has pitfalls that I'm not aware of, so use only if you must

[jedwards1211]

Of if you use a custom dataIdFromObject function you can use that to get the cache keys