diff --git a/src/components/context/Auth.tsx b/src/components/context/Auth.tsx index f76062a..5d66f04 100644 --- a/src/components/context/Auth.tsx +++ b/src/components/context/Auth.tsx @@ -102,7 +102,6 @@ export const AuthProvider = ({ children }: { children: ReactNode }) => { useEffect(() => { const supabase = createClient(); - // Initial fetch with loading fetchUserData(true).catch((error) => { console.error('💥 Initial fetch error:', error); @@ -111,8 +110,8 @@ export const AuthProvider = ({ children }: { children: ReactNode }) => { const { data: { subscription }, } = supabase.auth.onAuthStateChange(async (event, _session) => { - console.log('Auth state change:', event); // Debug log + console.log('Auth state change:', event); // Debug log if (event === 'SIGNED_IN') { // Background refresh without loading state await fetchUserData(false); @@ -126,12 +125,53 @@ export const AuthProvider = ({ children }: { children: ReactNode }) => { await fetchUserData(false); } }); - return () => { subscription.unsubscribe(); }; }, [fetchUserData]); + useEffect(() => { + const supabase = createClient(); + + // Handle visibility changes (tab switching) + const handleVisibilityChange = () => { + if (!document.hidden && isInitialized) { + // Refresh auth state when tab becomes visible + fetchUserData(false).catch(console.error); + } + }; + + document.addEventListener('visibilitychange', handleVisibilityChange); + + // Initial fetch with loading + fetchUserData(true).catch((error) => { + console.error('💥 Initial fetch error:', error); + }); + + const { + data: { subscription }, + } = supabase.auth.onAuthStateChange(async (event, session) => { + console.log('Auth state change:', event, session?.expires_at); + + if (event === 'SIGNED_IN') { + await fetchUserData(false); + } else if (event === 'SIGNED_OUT') { + setUser(null); + setProfile(null); + setAvatarUrl(null); + setIsLoading(false); + } else if (event === 'TOKEN_REFRESHED') { + console.log('Token refreshed, updating user data'); + await fetchUserData(false); + } + }); + + return () => { + document.removeEventListener('visibilitychange', handleVisibilityChange); + subscription.unsubscribe(); + }; + }, [fetchUserData, isInitialized]); + const updateProfile = useCallback( async (data: { full_name?: string; diff --git a/src/components/default/SubmitButton.tsx b/src/components/default/SubmitButton.tsx index cf124b5..aeef9e5 100644 --- a/src/components/default/SubmitButton.tsx +++ b/src/components/default/SubmitButton.tsx @@ -7,12 +7,14 @@ import { Loader2 } from 'lucide-react'; type Props = ComponentProps & { disabled?: boolean; + disabledNotLoading?: boolean; pendingText?: string; }; export const SubmitButton = ({ children, disabled = false, + disabledNotLoading = false, pendingText = 'Submitting...', ...props }: Props) => { @@ -26,7 +28,7 @@ export const SubmitButton = ({ disabled={disabled} {...props} > - {pending || disabled ? ( + {pending || (disabled && !disabledNotLoading) ? ( <> {pendingText} diff --git a/src/components/status/TechTable.tsx b/src/components/status/TechTable.tsx index 2340c3c..8e72800 100755 --- a/src/components/status/TechTable.tsx +++ b/src/components/status/TechTable.tsx @@ -8,8 +8,9 @@ import { updateStatuses, updateUserStatus, type UserWithStatus, -} from '@/lib/hooks/status'; +} from '@/lib/hooks'; import { Drawer, DrawerTrigger, Loading } from '@/components/ui'; +import { SubmitButton } from '@/components/default'; import { toast } from 'sonner'; import { HistoryDrawer } from '@/components/status'; import type { Profile } from '@/utils/supabase'; @@ -115,6 +116,13 @@ export const TechTable = ({ useEffect(() => { if (!isAuthenticated) return; + //if (channelRef.current) { + //const supabase = createClient(); + //supabase.removeChannel(channelRef.current).catch((error) => { + //console.error(`Error unsubscribing from status updates: ${error}`); + //}); + //channelRef.current = null; + //} const supabase = createClient(); const channel = supabase @@ -284,20 +292,19 @@ export const TechTable = ({ } }} /> - + )}