Fix: Resolve perpetual loading state

This commit is contained in:
gpt-engineer-app[bot]
2025-10-11 16:28:30 +00:00
parent c0a5c3479d
commit 4d40bb7569

View File

@@ -35,6 +35,7 @@ function AuthProviderComponent({ children }: { children: React.ReactNode }) {
const novuUpdateTimeoutRef = useRef<NodeJS.Timeout | null>(null); const novuUpdateTimeoutRef = useRef<NodeJS.Timeout | null>(null);
const previousEmailRef = useRef<string | null>(null); const previousEmailRef = useRef<string | null>(null);
const loadingTimeoutRef = useRef<NodeJS.Timeout | null>(null); const loadingTimeoutRef = useRef<NodeJS.Timeout | null>(null);
const loadingStateRef = useRef(loading);
const fetchProfile = async (userId: string, retryCount = 0, onComplete?: () => void) => { const fetchProfile = async (userId: string, retryCount = 0, onComplete?: () => void) => {
try { try {
@@ -153,6 +154,12 @@ function AuthProviderComponent({ children }: { children: React.ReactNode }) {
} }
}; };
// Keep loading state ref in sync
useEffect(() => {
loadingStateRef.current = loading;
console.log('[Auth] Loading state changed:', loading);
}, [loading]);
useEffect(() => { useEffect(() => {
// CRITICAL: Set up listener FIRST to catch all events // CRITICAL: Set up listener FIRST to catch all events
const { const {
@@ -168,12 +175,17 @@ function AuthProviderComponent({ children }: { children: React.ReactNode }) {
// Clear any error // Clear any error
setSessionError(null); setSessionError(null);
// Explicitly handle SIGNED_IN event for iframe compatibility // Explicitly handle SIGNED_IN and INITIAL_SESSION events
if (event === 'SIGNED_IN' && session) { if (event === 'SIGNED_IN' && session) {
console.log('[Auth] SIGNED_IN detected, setting session and user'); console.log('[Auth] SIGNED_IN detected, setting session and user');
setSession(session); setSession(session);
setUser(session.user); setUser(session.user);
sessionVerifiedRef.current = true; sessionVerifiedRef.current = true;
} else if (event === 'INITIAL_SESSION' && session) {
console.log('[Auth] INITIAL_SESSION detected, setting session and user');
setSession(session);
setUser(session.user);
sessionVerifiedRef.current = true;
} else if (event === 'SIGNED_OUT') { } else if (event === 'SIGNED_OUT') {
console.log('[Auth] SIGNED_OUT detected, clearing session'); console.log('[Auth] SIGNED_OUT detected, clearing session');
setSession(null); setSession(null);
@@ -260,11 +272,13 @@ function AuthProviderComponent({ children }: { children: React.ReactNode }) {
} }
// Defer profile fetch to avoid deadlock // Defer profile fetch to avoid deadlock
const shouldWaitForProfile = event === 'SIGNED_IN'; const shouldWaitForProfile = event === 'SIGNED_IN' || event === 'INITIAL_SESSION';
console.log('[Auth] Profile fetch deferred, shouldWaitForProfile:', shouldWaitForProfile, 'event:', event);
profileFetchTimeoutRef.current = setTimeout(() => { profileFetchTimeoutRef.current = setTimeout(() => {
if (!isMountedRef.current) return; if (!isMountedRef.current) return;
fetchProfile(session.user.id, 0, () => { fetchProfile(session.user.id, 0, () => {
if (isMountedRef.current && shouldWaitForProfile) { if (isMountedRef.current && shouldWaitForProfile) {
console.log('[Auth] Profile fetch complete, setting loading to false');
setLoading(false); setLoading(false);
} }
}); });
@@ -276,10 +290,11 @@ function AuthProviderComponent({ children }: { children: React.ReactNode }) {
} }
} }
// Only set loading false immediately for non-SIGNED_IN events // Only set loading false immediately for events that don't need profile fetch
if (event !== 'SIGNED_IN') { if (event !== 'SIGNED_IN' && event !== 'INITIAL_SESSION') {
setLoading(false); console.log('[Auth] Setting loading to false immediately for event:', event);
} setLoading(false);
}
}); });
// THEN get initial session // THEN get initial session
@@ -311,8 +326,8 @@ function AuthProviderComponent({ children }: { children: React.ReactNode }) {
// Add a safety timeout to force loading to resolve // Add a safety timeout to force loading to resolve
loadingTimeoutRef.current = setTimeout(() => { loadingTimeoutRef.current = setTimeout(() => {
if (isMountedRef.current && loading) { if (isMountedRef.current && loadingStateRef.current) {
console.warn('[Auth] Loading timeout reached, forcing loading to false'); console.warn('[Auth] Loading timeout reached after 5 seconds, forcing loading to false');
setLoading(false); setLoading(false);
} }
}, 5000); }, 5000);