Refactor authentication flows and improve logout handling

Split authentication logic into a reusable `MainLayout` component for better structure and consistency. Enhanced logout functionality to ensure proper state resetting and added minor delays for reliable redirect behavior. Improved safeguards for unauthenticated access, reducing potential edge case errors.

frontend/src/context/auth-context.tsx

@@ -189,23 +189,27 @@ export const AuthProvider: React.FC<AuthProviderProps> = ({ children }) => {
 
   // Logout function
   const logout = useCallback((): void => {
-    // Clear tokens
+    // Clear tokens first
     storeToken(null);
 
-    // Remove auth headers
+    // Remove auth headers from client
     client.setConfig({
       headers: {
         Authorization: undefined,
       },
     });
 
-    // Clear user from cache
-    queryClient.invalidateQueries({
-      queryKey: getCurrentUserInfoOptions().queryKey,
-    });
+    // Properly reset the cache - use null instead of undefined
+    queryClient.setQueryData(getCurrentUserInfoOptions().queryKey, undefined);
 
-    // Redirect to login page
-    router.push("/login");
+    // Reset the entire cache to be safe
+    queryClient.clear();
+
+    // Wait for all state updates to process
+    setTimeout(() => {
+      // Redirect to login page
+      router.push("/login");
+    }, 100);
   }, [router, queryClient]);
 
   // Refresh token function