redux-toolkit
redux-toolkit copied to clipboard
[question] - invalidate a result in cache when using "merge"
Description
I am trying to understand the right approach. Can you please give me an advice?
I am using a query enpoint with merge feature to "paginate" and keep all the results rendered on the page (clicking "next page" will display more results under those already displayed).
I use the merge functionality to group all results together (along with forceRefetch and serializeQueryArgs). Which works. Now I want to be able to "remove" one of the results. Invalidating the cache (using invalidateTags or even calling api.utils.invalidateTags doesn't have the desired effect. While the query IS triggered, the cache is NOT updated and the deleted result is still displayed.
In https://redux-toolkit.js.org/rtk-query/api/createApi#merge, I read: "no automatic structural sharing will be applied - it's up to you to update the cache appropriately"
What's the recommended way of achieving it? Reading the docs, I don't see a way to achieve that. Read some SO answers about using entityAdapter or using prevPage, currentPage and nextPage, but it just sounds too complicated approach for such a simple functionality I am trying to achieve = delete a single result from the cache, identified by it's ID
My expectation (sort of what I thought would happen) I assumed the result would be invalidated the moment I define
invalidateTags: ({id}) => [{type: "Result", id }] // just illustrates what I mean
Seems, when I opt for using merge, this feature gets skipped