Fix authentication race condition

src/components/moderation/ModerationQueue.tsx

@@ -10,6 +10,7 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@
 import { supabase } from '@/integrations/supabase/client';
 import { useToast } from '@/hooks/use-toast';
 import { useUserRole } from '@/hooks/useUserRole';
+import { useAuth } from '@/hooks/useAuth';
 import { format } from 'date-fns';
 import { PhotoModal } from './PhotoModal';
 
@@ -57,6 +58,7 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
   const [selectedPhotoIndex, setSelectedPhotoIndex] = useState(0);
   const { toast } = useToast();
   const { isAdmin, isSuperuser } = useUserRole();
+  const { user } = useAuth();
 
   // Expose refresh method via ref
   useImperativeHandle(ref, () => ({
@@ -66,6 +68,11 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
   }), [activeEntityFilter, activeStatusFilter]);
 
   const fetchItems = async (entityFilter: EntityFilter = 'all', statusFilter: StatusFilter = 'pending') => {
+    if (!user) {
+      console.log('Skipping fetch - user not authenticated');
+      return;
+    }
+    
     try {
       setLoading(true);
       
@@ -312,11 +319,16 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
       console.log('Photo submissions:', formattedItems.filter(item => item.submission_type === 'photo'));
       
       setItems(formattedItems);
-    } catch (error) {
+    } catch (error: any) {
       console.error('Error fetching moderation items:', error);
+      console.error('Error details:', {
+        message: error.message,
+        code: error.code,
+        details: error.details
+      });
       toast({
         title: "Error",
-        description: "Failed to load moderation queue",
+        description: error.message || "Failed to load moderation queue",
         variant: "destructive",
       });
     } finally {
@@ -325,8 +337,10 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
   };
 
   useEffect(() => {
-    fetchItems(activeEntityFilter, activeStatusFilter);
+    if (user) {
-  }, [activeEntityFilter, activeStatusFilter]);
+      fetchItems(activeEntityFilter, activeStatusFilter);
+    }
+  }, [activeEntityFilter, activeStatusFilter, user]);
 
   const handleModerationAction = async (
     item: ModerationItem,

src/pages/Admin.tsx

@@ -27,38 +27,63 @@ export default function Admin() {
   });
 
   const fetchStats = useCallback(async () => {
+    if (!user) {
+      console.log('Skipping stats fetch - user not authenticated');
+      return;
+    }
+    
     try {
       setStats(prev => ({ ...prev, loading: true }));
       
       // Fetch pending submissions count
-      const { count: pendingCount } = await supabase
+      const { count: pendingCount, error: submissionsError } = await supabase
         .from('content_submissions')
         .select('*', { count: 'exact', head: true })
         .eq('status', 'pending');
 
+      if (submissionsError) {
+        console.error('Error fetching pending submissions:', submissionsError);
+        throw submissionsError;
+      }
+
       // Fetch open reports count
-      const { count: reportsCount } = await supabase
+      const { count: reportsCount, error: reportsError } = await supabase
         .from('reports')
         .select('*', { count: 'exact', head: true })
         .eq('status', 'pending');
 
+      if (reportsError) {
+        console.error('Error fetching reports:', reportsError);
+        throw reportsError;
+      }
+
       // Fetch flagged content count (reviews)
-      const { count: flaggedCount } = await supabase
+      const { count: flaggedCount, error: flaggedError } = await supabase
         .from('reviews')
         .select('*', { count: 'exact', head: true })
         .eq('moderation_status', 'flagged');
 
+      if (flaggedError) {
+        console.error('Error fetching flagged content:', flaggedError);
+        throw flaggedError;
+      }
+
       setStats({
         pendingSubmissions: pendingCount || 0,
         openReports: reportsCount || 0,
         flaggedContent: flaggedCount || 0,
         loading: false,
       });
-    } catch (error) {
+    } catch (error: any) {
       console.error('Error fetching admin stats:', error);
+      console.error('Error details:', {
+        message: error.message,
+        code: error.code,
+        details: error.details
+      });
       setStats(prev => ({ ...prev, loading: false }));
     }
-  }, []);
+  }, [user]);
 
   const handleRefresh = useCallback(() => {
     moderationQueueRef.current?.refresh();