Add _hasHydrated flag to authStore and update AuthGuard to wait for store hydration, ensuring stability during loading phases in tests and app.

This commit is contained in:
2025-11-02 14:16:56 +01:00
parent 29f98f059b
commit 6d1b730ae7
3 changed files with 36 additions and 5 deletions

View File

@@ -63,11 +63,16 @@ function LoadingSpinner() {
export function AuthGuard({ children, requireAdmin = false, fallback }: AuthGuardProps) {
const router = useRouter();
const pathname = usePathname();
const { isAuthenticated, isLoading: authLoading, user } = useAuthStore();
const { isAuthenticated, isLoading: authLoading, user, _hasHydrated } = useAuthStore();
// Fetch user data if authenticated but user not loaded
const { isLoading: userLoading } = useMe();
// Wait for store to hydrate from localStorage to prevent hook order issues
if (!_hasHydrated) {
return fallback ? <>{fallback}</> : <LoadingSpinner />;
}
// Determine overall loading state
const isLoading = authLoading || (isAuthenticated && !user && userLoading);