unreal crown
I have an API that returns the new record on create/update so I am using setQueryData inside the update mutation to update the cache instead of invalidating and refetching.
In my app I show the list of records, with an option to hide some inactive records.
const showActiveOnlyFn = (records) => records.filter(r => r.active)
const {data} = useGetRecordsQuery(onlyShowActive ? { select: showActiveOnlyFn } : undefined)
And here is the custom hook:
const useGetRecordsQuery = (options) => useQuery({queryKey: "records", queryFn: axiosFn, select: options?.select});
If I update the record to be inactive, it will dissapear when onlyShowActive is ticked.
When I untick onlyShowActive the record appears again.
But then when I update the record back to active, and tick onlyShowActive, the record is not shown, even though in react query devtools I can see that the record is correctly marked as active.