T
TanStack2mo ago
plain-purple

Struggling to build a PWA with react-query

Hey guys! I am using PersistQueryClientProvider with localStorage. I have this specific use case where I have refetchOnWindowFocus enabled, which provides a better overal UX imo. The issue is that when a user is on another application, looses his network connection somehow, then returns to my PWA, the queries will be executed (be cause of refetchOnWindowFocus) and ultimately fail which will then delete the cached data in local storage, why does this happen? Btw im not using the offlineFirst network mode (just using the default one) because that would require me to cache the API data in my service worker (which I might consider now because of all the issues I have building an offline experience). Tips are welcome! 🙏
1 Reply
harsh-harlequin
harsh-harlequin2mo ago
and ultimately fail which will then delete the cached data in local storage, why does this happen?
queries that are in error state aren't persisted per default because you can't serialize Error instances. You can opt-in though however, when you refetchOnWindowFocus, and you have the default networkMode: 'online', the fetch should pause if there is no network connection, so I don't understand the premise that it "ultimately fails" ....

Did you find this page helpful?