diff --git a/src/pages/Admin.tsx b/src/pages/Admin.tsx index 68b40879..c9ed0b4c 100644 --- a/src/pages/Admin.tsx +++ b/src/pages/Admin.tsx @@ -1,4 +1,4 @@ -import { useRef, useEffect, useCallback } from 'react'; +import { useRef, useEffect, useCallback, useState } from 'react'; import { useNavigate } from 'react-router-dom'; import { Shield, Users, FileText, Flag, AlertCircle } from 'lucide-react'; import { useUserRole } from '@/hooks/useUserRole'; @@ -10,16 +10,60 @@ import { ModerationQueue, ModerationQueueRef } from '@/components/moderation/Mod import { ReportsQueue } from '@/components/moderation/ReportsQueue'; import { UserManagement } from '@/components/admin/UserManagement'; import { AdminHeader } from '@/components/layout/AdminHeader'; +import { supabase } from '@/integrations/supabase/client'; export default function Admin() { const { user, loading: authLoading } = useAuth(); const { isModerator, loading: roleLoading } = useUserRole(); const navigate = useNavigate(); const moderationQueueRef = useRef(null); + + // State for dashboard stats + const [stats, setStats] = useState({ + pendingSubmissions: 0, + openReports: 0, + flaggedContent: 0, + loading: true, + }); + + const fetchStats = useCallback(async () => { + try { + setStats(prev => ({ ...prev, loading: true })); + + // Fetch pending submissions count + const { count: pendingCount } = await supabase + .from('content_submissions') + .select('*', { count: 'exact', head: true }) + .eq('status', 'pending'); + + // Fetch open reports count + const { count: reportsCount } = await supabase + .from('reports') + .select('*', { count: 'exact', head: true }) + .eq('status', 'pending'); + + // Fetch flagged content count (reviews) + const { count: flaggedCount } = await supabase + .from('reviews') + .select('*', { count: 'exact', head: true }) + .eq('moderation_status', 'flagged'); + + setStats({ + pendingSubmissions: pendingCount || 0, + openReports: reportsCount || 0, + flaggedContent: flaggedCount || 0, + loading: false, + }); + } catch (error) { + console.error('Error fetching admin stats:', error); + setStats(prev => ({ ...prev, loading: false })); + } + }, []); const handleRefresh = useCallback(() => { moderationQueueRef.current?.refresh(); - }, []); + fetchStats(); // Also refresh stats + }, [fetchStats]); useEffect(() => { if (!authLoading && !roleLoading) { @@ -32,8 +76,11 @@ export default function Admin() { navigate('/'); return; } + + // Fetch stats when user is authenticated and authorized + fetchStats(); } - }, [user, authLoading, roleLoading, isModerator, navigate]); + }, [user, authLoading, roleLoading, isModerator, navigate, fetchStats]); if (authLoading || roleLoading) { return ( @@ -69,7 +116,13 @@ export default function Admin() { -
--
+
+ {stats.loading ? ( + -- + ) : ( + stats.pendingSubmissions + )} +

Content submissions awaiting moderation

@@ -82,7 +135,13 @@ export default function Admin() { -
--
+
+ {stats.loading ? ( + -- + ) : ( + stats.openReports + )} +

User reports to review

@@ -95,7 +154,13 @@ export default function Admin() { -
--
+
+ {stats.loading ? ( + -- + ) : ( + stats.flaggedContent + )} +

Auto-flagged items