diff --git a/frontend/src/core/auth/auth-gate.ts b/frontend/src/core/auth/auth-gate.ts index aa074a2..6b6391b 100644 --- a/frontend/src/core/auth/auth-gate.ts +++ b/frontend/src/core/auth/auth-gate.ts @@ -3,6 +3,8 @@ * @ai-context Prevents race conditions between IndexedDB init and API calls */ +import { useState, useEffect } from 'react'; + // Global authentication readiness state let authInitialized = false; let authInitPromise: Promise | null = null; @@ -99,4 +101,26 @@ const processRequestQueue = async () => { isProcessingQueue = false; console.log('[Auth Gate] Finished processing queued requests'); +}; + +/** + * React hook to track auth initialization state + * Returns true once auth is fully initialized with token + */ +export const useIsAuthInitialized = () => { + const [initialized, setInitialized] = useState(authInitialized); + + useEffect(() => { + if (authInitialized) { + setInitialized(true); + return; + } + + // Wait for auth to initialize + waitForAuthInit().then(() => { + setInitialized(true); + }); + }, []); + + return initialized; }; \ No newline at end of file diff --git a/frontend/src/features/stations/hooks/useSavedStations.ts b/frontend/src/features/stations/hooks/useSavedStations.ts index 8fba966..4524273 100644 --- a/frontend/src/features/stations/hooks/useSavedStations.ts +++ b/frontend/src/features/stations/hooks/useSavedStations.ts @@ -3,6 +3,7 @@ */ import { useQuery, useQueryClient } from '@tanstack/react-query'; +import { useIsAuthInitialized } from '../../../core/auth/auth-gate'; import { stationsApi } from '../api/stations.api'; import { SavedStation } from '../types/stations.types'; @@ -33,12 +34,15 @@ interface UseSavedStationsOptions { * ``` */ export function useSavedStations(options?: UseSavedStationsOptions) { + const isAuthInitialized = useIsAuthInitialized(); + return useQuery({ queryKey: SAVED_STATIONS_QUERY_KEY, queryFn: () => stationsApi.getSavedStations(), staleTime: options?.staleTime ?? 5 * 60 * 1000, // 5 minutes default refetchOnWindowFocus: options?.refetchOnWindowFocus ?? true, - refetchOnMount: true + refetchOnMount: true, + enabled: isAuthInitialized // Only fetch once auth is initialized }); }