prefetchQuery has old data on page refresh
Hi folks, I have a Next.js 14 application (app dir) where I am trying to utilize TanStack Query with prefetchQuery, HydrationBoundary and client-side query after that. The problem I am currently facing is:
1. I make a query to my backend (prefetch + useQuery)
2. I make a simple mutation which updates data and invalidates the original query
3. Query gets invalidated sucessfuly, refetches the data and everything is OK
4. I refresh the page and I have old data (they come from the prefetch for 100%, if I give staleTime 0 to the client query, correct data is fetched [but it flickers as I get old data from server component])
Is this expected behaviour? Is there an obvious fix for this? Happy to send code snippets if needed.
Cheers.
1. I make a query to my backend (prefetch + useQuery)
2. I make a simple mutation which updates data and invalidates the original query
3. Query gets invalidated sucessfuly, refetches the data and everything is OK
4. I refresh the page and I have old data (they come from the prefetch for 100%, if I give staleTime 0 to the client query, correct data is fetched [but it flickers as I get old data from server component])
Is this expected behaviour? Is there an obvious fix for this? Happy to send code snippets if needed.
Cheers.
