From 1da0e79c20684a780f6ba8da2e3ec44f847e7cf1 Mon Sep 17 00:00:00 2001
From: Alex TYRODE <alex@tyrode.dev>
Date: Fri, 25 Apr 2025 02:05:37 +0000
Subject: [PATCH 1/2] feat: enhance error handling in API utilities

- Added a new function to handle unauthorized errors by updating the auth state in the query cache, triggering the AuthModal.
- Updated the existing response handling to incorporate the new unauthorized error handling.
- Improved clarity in the response handling logic for different status codes, including 204 and JSON responses.
---
 src/frontend/src/api/apiUtils.ts | 52 +++++++++++++++++++++-----------
 src/frontend/src/api/hooks.ts    |  1 +
 2 files changed, 36 insertions(+), 17 deletions(-)

diff --git a/src/frontend/src/api/apiUtils.ts b/src/frontend/src/api/apiUtils.ts
index dec2f0f..5c6f6bf 100644
--- a/src/frontend/src/api/apiUtils.ts
+++ b/src/frontend/src/api/apiUtils.ts
@@ -1,25 +1,39 @@
+import { queryClient } from './queryClient';
+
+/**
+ * Handle unauthorized errors by updating the auth state in the query cache
+ * This will trigger the AuthModal to appear
+ */
+export function handleUnauthorized() {
+  // Set auth state to false to trigger the AuthModal
+  queryClient.setQueryData(['auth'], false);
+}
+
 // Common error handling for API responses
 export async function handleResponse(response: Response) {
-    if (!response.ok) {
-      if (response.status === 401) {
-        throw new Error('Unauthorized');
-      }
-      
-      const errorText = await response.text();
-      throw new Error(errorText || `API error: ${response.status}`);
+  if (!response.ok) {
+    if (response.status === 401) {
+      // Update auth state when 401 is encountered
+      handleUnauthorized();
+      throw new Error('Unauthorized');
     }
     
-    // For endpoints that return no content
-    if (response.status === 204) {
-      return null;
-    }
-    
-    // For endpoints that return JSON
-    return response.json();
+    const errorText = await response.text();
+    throw new Error(errorText || `API error: ${response.status}`);
   }
   
-  // Base fetch function with error handling
-  export async function fetchApi(url: string, options?: RequestInit) {
+  // For endpoints that return no content
+  if (response.status === 204) {
+    return null;
+  }
+  
+  // For endpoints that return JSON
+  return response.json();
+}
+
+// Base fetch function with error handling
+export async function fetchApi(url: string, options?: RequestInit) {
+  try {
     const response = await fetch(url, {
       ...options,
       credentials: 'include',
@@ -30,4 +44,8 @@ export async function handleResponse(response: Response) {
     });
     
     return handleResponse(response);
-  }
\ No newline at end of file
+  } catch (error) {
+    // Re-throw the error after handling it
+    throw error;
+  }
+}
diff --git a/src/frontend/src/api/hooks.ts b/src/frontend/src/api/hooks.ts
index 91373d1..4ad37e9 100644
--- a/src/frontend/src/api/hooks.ts
+++ b/src/frontend/src/api/hooks.ts
@@ -60,6 +60,7 @@ export const api = {
       // Map backend 'state' property to frontend 'status'
       return { ...result, status: result.state };
     } catch (error) {
+      // Let the error propagate to be handled by the global error handler
       throw error;
     }
   },

From 6b4d0648be8f27798cdaca2b40352a6d1200c0c8 Mon Sep 17 00:00:00 2001
From: Alex TYRODE <alex@tyrode.dev>
Date: Fri, 25 Apr 2025 02:06:46 +0000
Subject: [PATCH 2/2] refactor: rename cacheTime to gcTime in queryClient
 configuration

- Updated the queryClient configuration to rename the cacheTime property to gcTime for clarity, indicating its purpose more accurately as garbage collection time.
---
 src/frontend/src/api/queryClient.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/frontend/src/api/queryClient.ts b/src/frontend/src/api/queryClient.ts
index b20e5fe..bc91540 100644
--- a/src/frontend/src/api/queryClient.ts
+++ b/src/frontend/src/api/queryClient.ts
@@ -7,7 +7,7 @@ export const queryClient = new QueryClient({
       retry: 1,
       refetchOnWindowFocus: true,
       staleTime: 30000, // 30 seconds
-      cacheTime: 1000 * 60 * 5, // 5 minutes
+      gcTime: 1000 * 60 * 5, // 5 minutes (formerly cacheTime)
       refetchOnMount: true,
     },
   },