Adds unload event listener to handle clearing cache on signout.

plastic-labs · Dec 13, 2024 · 5b9abcd · 5b9abcd
1 parent 0cddbf6
commit 5b9abcd
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 19 deletions.
diff --git a/www/components/sidebar.tsx b/www/components/sidebar.tsx
@@ -7,7 +7,7 @@ import { usePostHog } from 'posthog-js/react';
 import Swal from 'sweetalert2';
 import { ConversationTab } from './conversationtab';
 import { useState } from 'react';
-import useSWR, { KeyedMutator } from 'swr';
+import useSWR, { KeyedMutator, useSWRConfig } from 'swr';
 import { FaUser } from 'react-icons/fa';
 import {
   createConversation,
@@ -21,6 +21,7 @@ const departureMono = localFont({
   src: '../fonts/DepartureMono-Regular.woff2',
 });
 
+
 export default function Sidebar({
   conversations,
   mutateConversations,
@@ -42,6 +43,7 @@ export default function Sidebar({
   const supabase = createClient();
   const [isMenuOpen, setIsMenuOpen] = useState(false);
   const router = useRouter();
+  const { mutate } = useSWRConfig();
 
   async function editConversation(cur: Conversation) {
     const { value: newName } = await Swal.fire({
@@ -261,10 +263,11 @@ export default function Sidebar({
                 </button>
                 <button
                   className="block px-4 py-2 text-sm text-gray-700 dark:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-700 w-full text-left"
-                  onClick={async () => {
-                    await supabase.auth.signOut();
+                  onClick={async () => {                    
                     clearSWRCache();
-                    location.reload();
+                    mutate(() => true, undefined, { revalidate: false });
+                    await supabase.auth.signOut();
+                    window.location.href = '/';
                   }}
                 >
                   Sign Out

diff --git a/www/utils/swrCache.ts b/www/utils/swrCache.ts
@@ -1,28 +1,35 @@
-import { Cache, State, useSWRConfig } from 'swr';
+import { Cache, State } from 'swr';
+
+export let unloadListener: ((ev: BeforeUnloadEvent) => void) | null = null;
 
 export function localStorageProvider(): Cache {
-  // When initializing, we restore the data from `localStorage` into a map.
   if (typeof window !== 'undefined') {
     const map: Map<string, State> = new Map(
       JSON.parse(localStorage.getItem('app-cache') || '[]')
     );
 
-    // Before unloading the app, we write back all the data into `localStorage`.
-    window.addEventListener('beforeunload', () => {
-      const appCache = JSON.stringify(Array.from(map.entries()));
-      localStorage.setItem('app-cache', appCache);
-    });
+    // Remove any existing listener
+    if (unloadListener) {
+      window.removeEventListener('beforeunload', unloadListener);
+    }
+
+    unloadListener = () => {
+      localStorage.setItem('app-cache', JSON.stringify(Array.from(map.entries())));
+    };
+    window.addEventListener('beforeunload', unloadListener);
+
     return map;
   }
-
   return new Map();
 }
 
-export const clearSWRCache = async () => {
-  const { mutate } = useSWRConfig();
-  mutate(
-    () => true, // clear all keys
-    undefined,  // set to undefined
-    { revalidate: false }
-  );
+export const clearSWRCache = () => {
+  if (typeof window !== 'undefined') {
+    // Remove the listener before clearing cache
+    if (unloadListener) {
+      window.removeEventListener('beforeunload', unloadListener);
+      unloadListener = null;
+    }
+    localStorage.removeItem('app-cache');
+  }
 };