Clear persisted query cache on logout

src/Providers/AuthUserProvider.tsx

@@ -12,6 +12,7 @@ import { LocalStorageKeys } from "@/common/constants";
 
 import mutate from "@/Utils/request/mutate";
 import query from "@/Utils/request/query";
+import { clearQueryPersistenceCache } from "@/Utils/request/queryClient";
 import { userAtom } from "@/atoms/user-atom";
 import {
   JwtTokenObtainPair,
@@ -163,6 +164,7 @@ export default function AuthUserProvider({
     localStorage.removeItem(LocalStorageKeys.accessToken);
     localStorage.removeItem(LocalStorageKeys.refreshToken);
     localStorage.removeItem(LocalStorageKeys.patientTokenKey);
+    await clearQueryPersistenceCache();
     setAccessToken(null);
     setPatientToken(null);
 

src/Utils/request/queryClient.test.ts

@@ -0,0 +1,19 @@
+// @vitest-environment jsdom
+import { beforeEach, describe, expect, it } from "vitest";
+
+import { clearQueryPersistenceCache } from "@/Utils/request/queryClient";
+
+describe("clearQueryPersistenceCache", () => {
+  beforeEach(() => {
+    localStorage.setItem(
+      "REACT_QUERY_OFFLINE_CACHE",
+      JSON.stringify({ clientState: {}, timestamp: 0 }),
+    );
+  });
+
+  it("removes the persisted cache blob from localStorage", async () => {
+    expect(localStorage.getItem("REACT_QUERY_OFFLINE_CACHE")).not.toBeNull();
+    await clearQueryPersistenceCache();
+    expect(localStorage.getItem("REACT_QUERY_OFFLINE_CACHE")).toBeNull();
+  });
+});

src/Utils/request/queryClient.ts

@@ -33,6 +33,7 @@ const queryClient = new QueryClient({
 
 const localStoragePersister = createAsyncStoragePersister({
   storage: window.localStorage,
+  key: "REACT_QUERY_OFFLINE_CACHE",
 });
 
 persistQueryClient({
@@ -44,12 +45,11 @@ persistQueryClient({
   buster: localStorage.getItem("app-version") ?? "0.0.0",
 });
 
-export function clearQueryPersistenceCache() {
-  queryClient.invalidateQueries({
-    predicate: (query) => {
-      return query.meta?.persist === true;
-    },
+export function clearQueryPersistenceCache(): Promise<void> {
+  queryClient.removeQueries({
+    predicate: (query) => query.meta?.persist === true,
   });
+  return Promise.resolve(localStoragePersister.removeClient());
 }
 
 export default queryClient;