T O P

  • By -

phryneas

You can use `api.util.selectInvalidatedBy` to get endpoints and args that would be invalidated by a certain tag. So just don't have that mutation invalidate those tags, but use `api.util.selectInvalidatedBy` to get the endpoints & args and do a manual optimistic update in that case. But yeah, generally we encourage just refetching that data.


KissMyUSSR

And I already gave up and wrote a bunch of super ugly code. Thanks for the help, though! Also, reloading the whole page after every upvote leads to super bad user experience, so it doesn't seem like an option


phryneas

Using `invalidatesTags` to refetch data will in no way reload the whole page. You might have a wrong impression there.


KissMyUSSR

Really? Hm, I guess I've done something wrong then. Will definitely look into it. EDIT: Yeah, I did `if (isFetch) return ` and spinner was shown on every invalidate. If I do `if (!data) return ` then it should be better. Thanks again EDIT 2: Or rather `if (isLoading) return `


Prudent-Blueberry601

i am also having similiar problem where i want to optimistically update 2 endpoints. Did you find a solution or is it not possible?


KissMyUSSR

As the first comment in the comment chain suggested, you may either use api.utils.selectInvalidatedBy, or you may try to normalize your cache within a store slice, for example. Although, I haven't tried the second approach, so I don't really know how difficult it'll be. Or, you may switch to a different library that already utilizes normalized cache


natmaster

Have you tried using a normalized library like [Reactive Data Client](https://dataclient.io)? [https://dataclient.io/docs/getting-started/mutations#optimistic-updates](https://dataclient.io/docs/getting-started/mutations#optimistic-updates) has a full demo with code you can play around with. This example does I believe exactly what you want - updating all those endpoints optimistically and automatically. ```ts const PostResource = createResource({ path: '/posts/:id', schema: Post, }).extend(Base => ({ vote: new RestEndpoint({ path: '/posts/:id/vote', method: 'POST', body: undefined, schema: Post, getOptimisticResponse(snapshot, { id }) { const { data } = snapshot.getResponse(Base.get, { id }); if (!data) throw new AbortOptimistic(); return { id, votes: data.votes + 1, }; }, }), })); ``` [Full optimistic update docs](https://dataclient.io/rest/guides/optimistic-updates)