How to avoid re-fetching query after resource is deleted
The user is on a page with multiple items (query
Now the user deletes the currently selected item which triggers a mutation in a child component.
1. The mutation hook then invalidates
2. The child component uses the separate
3. The parent component removes the id from the search params and React Router re-renders the page without item details.
The problem is that the deleted item query
The query invalidation is necessary because the list of items should be re-fetched (and we don't want to have deleted data in the cache).
What's a good approach to handle such a case?
["items"]["items", id]Now the user deletes the currently selected item which triggers a mutation in a child component.
1. The mutation hook then invalidates
["items"]onSuccess2. The child component uses the separate
onSuccessmutate3. The parent component removes the id from the search params and React Router re-renders the page without item details.
The problem is that the deleted item query
["items", id]404The query invalidation is necessary because the list of items should be re-fetched (and we don't want to have deleted data in the cache).
What's a good approach to handle such a case?
