Implement monitoring overview features

Add comprehensive monitoring dashboard scaffolding:
- Extend queryKeys with monitoring keys
- Create hooks: useCombinedAlerts, useRecentActivity, useDatabaseHealth, useModerationHealth
- Build UI components: SystemHealthStatus, CriticalAlertsPanel, MonitoringQuickStats, RecentActivityTimeline, MonitoringNavCards
- Create MonitoringOverview page and integrate routing (MonitoringOverview route)
- Wire AdminSidebar to include Monitoring navigation
- Introduce supporting routing and admin layout hooks/utilities
- Align with TanStack Query patterns and plan for auto-refresh and optimistic updates

src/hooks/admin/useModerationHealth.ts

@@ -0,0 +1,36 @@
+import { useQuery } from '@tanstack/react-query';
+import { supabase } from '@/integrations/supabase/client';
+import { queryKeys } from '@/lib/queryKeys';
+
+export interface ModerationHealth {
+  queueLength: number;
+  activeLocks: number;
+}
+
+export function useModerationHealth() {
+  return useQuery({
+    queryKey: queryKeys.monitoring.moderationHealth(),
+    queryFn: async () => {
+      const [queue, oldestSubmission] = await Promise.all([
+        supabase
+          .from('content_submissions')
+          .select('id', { count: 'exact', head: true })
+          .eq('status', 'pending_review'),
+        supabase
+          .from('content_submissions')
+          .select('created_at')
+          .eq('status', 'pending_review')
+          .order('created_at', { ascending: true })
+          .limit(1)
+          .single(),
+      ]);
+
+      return {
+        queueLength: queue.count || 0,
+        activeLocks: 0, // Not tracking locks for now
+      } as ModerationHealth;
+    },
+    staleTime: 30000,
+    refetchInterval: 60000,
+  });
+}