Consolidate Admin Logs Hub

- Implement new unified monitoring hub by adding EdgeFunctionLogs, DatabaseLogs, CorrelatedLogsView, and UnifiedLogSearch components
- Integrate new tabs (edge-functions, database, traces) into ErrorMonitoring and expose TraceViewer route
- Update admin sidebar link to reflect Monitoring hub and extend error modals with log-correlation actions
- Wire up app to include trace viewer route and adjust related components for unified log correlation

src/pages/admin/ErrorMonitoring.tsx

@@ -13,6 +13,10 @@ import { ErrorDetailsModal } from '@/components/admin/ErrorDetailsModal';
 import { ApprovalFailureModal } from '@/components/admin/ApprovalFailureModal';
 import { ErrorAnalytics } from '@/components/admin/ErrorAnalytics';
 import { PipelineHealthAlerts } from '@/components/admin/PipelineHealthAlerts';
+import { EdgeFunctionLogs } from '@/components/admin/EdgeFunctionLogs';
+import { DatabaseLogs } from '@/components/admin/DatabaseLogs';
+import { UnifiedLogSearch } from '@/components/admin/UnifiedLogSearch';
+import TraceViewer from './TraceViewer';
 import { format } from 'date-fns';
 
 // Helper to calculate date threshold for filtering
@@ -59,6 +63,14 @@ export default function ErrorMonitoring() {
   const [searchTerm, setSearchTerm] = useState('');
   const [errorTypeFilter, setErrorTypeFilter] = useState<string>('all');
   const [dateRange, setDateRange] = useState<'1h' | '24h' | '7d' | '30d'>('24h');
+  const [activeTab, setActiveTab] = useState('errors');
+
+  const handleNavigate = (tab: string, filters: Record<string, string>) => {
+    setActiveTab(tab);
+    if (filters.requestId) {
+      setSearchTerm(filters.requestId);
+    }
+  };
 
   // Fetch recent errors
   const { data: errors, isLoading, refetch, isFetching } = useQuery({
@@ -170,8 +182,8 @@ export default function ErrorMonitoring() {
       <div className="space-y-6">
         <div className="flex justify-between items-center">
           <div>
-            <h1 className="text-3xl font-bold tracking-tight">Error Monitoring</h1>
-            <p className="text-muted-foreground">Track and analyze application errors</p>
+            <h1 className="text-3xl font-bold tracking-tight">Monitoring & Logs</h1>
+            <p className="text-muted-foreground">Unified monitoring hub for errors, logs, and distributed traces</p>
           </div>
           <RefreshButton
             onRefresh={async () => { await refetch(); }}
@@ -181,17 +193,23 @@ export default function ErrorMonitoring() {
           />
         </div>
 
+        {/* Unified Log Search */}
+        <UnifiedLogSearch onNavigate={handleNavigate} />
+
         {/* Pipeline Health Alerts */}
         <PipelineHealthAlerts />
 
         {/* Analytics Section */}
         <ErrorAnalytics errorSummary={errorSummary} approvalMetrics={approvalMetrics} />
 
-        {/* Tabs for Errors and Approval Failures */}
-        <Tabs defaultValue="errors" className="w-full">
-          <TabsList>
+        {/* Tabs for All Log Types */}
+        <Tabs value={activeTab} onValueChange={setActiveTab} className="w-full">
+          <TabsList className="grid w-full grid-cols-5">
             <TabsTrigger value="errors">Application Errors</TabsTrigger>
             <TabsTrigger value="approvals">Approval Failures</TabsTrigger>
+            <TabsTrigger value="edge-functions">Edge Functions</TabsTrigger>
+            <TabsTrigger value="database">Database Logs</TabsTrigger>
+            <TabsTrigger value="traces">Distributed Traces</TabsTrigger>
           </TabsList>
 
           <TabsContent value="errors" className="space-y-4">
@@ -350,6 +368,18 @@ export default function ErrorMonitoring() {
               </CardContent>
             </Card>
           </TabsContent>
+
+          <TabsContent value="edge-functions">
+            <EdgeFunctionLogs />
+          </TabsContent>
+
+          <TabsContent value="database">
+            <DatabaseLogs />
+          </TabsContent>
+
+          <TabsContent value="traces">
+            <TraceViewer />
+          </TabsContent>
         </Tabs>
       </div>