import { Activity, AlertTriangle, CheckCircle, Clock, Key, Server, ShieldCheck, ShieldX, Wifi, WifiOff } from 'lucide-react'; import { useState } from 'react'; import { Head, Link, router } from '@inertiajs/react'; import { AdminDataTable } from '@/Components/admin/AdminDataTable'; import { AdminStatsGrid, type StatCard } from '@/Components/admin/AdminStatsGrid'; import { ChartErrorBoundary } from '@/Components/admin/ChartErrorBoundary'; import PageHeader from '@/Components/layout/PageHeader'; import { Badge } from '@/Components/ui/badge'; import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, } from '@/Components/ui/breadcrumb'; import { Button } from '@/Components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/Components/ui/card'; import { ConfirmDialog } from '@/Components/ui/confirm-dialog'; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from '@/Components/ui/table'; import { useAdminKeyboardShortcuts } from '@/hooks/useAdminKeyboardShortcuts'; import { useNavigationState } from '@/hooks/useNavigationState'; import AdminLayout from '@/Layouts/AdminLayout'; import { cn } from '@/lib/utils'; interface StuckJob { type: string; id: number; site_name: string | null; started_at: string | null; hours_stuck: number; } interface RecentFailure { uuid: string; connection: string; queue: string; exception: string; failed_at: string; } interface ByokHealth { total: number; valid: number; invalid: number; never_validated: number; rate_limited: number; quota_exceeded: number; consecutive_failures_3plus: number; } interface ConnectionHealthSide { total: number; unhealthy: number; } interface ConnectionHealth { gsc: ConnectionHealthSide; wp: ConnectionHealthSide; } interface QueueDepthEntry { queue: string; depth: number; oldest_job_minutes: number; } interface Props { active_jobs: { analysis_runs: number; ai_jobs: number; batch_jobs: number; }; queue_health: { pending: number; failed_24h: number; failed_1h: number; oldest_pending_minutes: number | null; by_queue: QueueDepthEntry[]; }; stuck_jobs: StuckJob[]; recent_failures: RecentFailure[]; byok_health: ByokHealth; connection_health: ConnectionHealth; } function jobTypeSlug(type: string): string { return type === 'AnalysisRun' ? 'analysis_run' : 'ai_job'; } export default function Index({ active_jobs, queue_health, stuck_jobs, recent_failures, byok_health, connection_health }: Props) { const totalActive = active_jobs.analysis_runs + active_jobs.ai_jobs + active_jobs.batch_jobs; const [cancellingJob, setCancellingJob] = useState(null); const isNavigating = useNavigationState(); useAdminKeyboardShortcuts({}); const handleCancel = () => { if (!cancellingJob) return; router.post( route('admin.operations.jobs.cancel', { type: jobTypeSlug(cancellingJob.type), id: cancellingJob.id, }), {}, { preserveScroll: true, onFinish: () => setCancellingJob(null), }, ); }; const statCards: StatCard[] = [ { title: 'Active Jobs', value: totalActive, icon: Activity }, { title: 'Queue Pending', value: queue_health.pending, icon: Clock }, { title: 'Failed (24h)', value: queue_health.failed_24h, icon: AlertTriangle, valueClassName: queue_health.failed_24h > 0 ? 'text-destructive' : '', }, { title: 'Stuck Jobs', value: stuck_jobs.length, icon: Server, valueClassName: stuck_jobs.length > 0 ? 'text-destructive' : '', }, ]; return (
Admin Operations
Analysis Runs

{active_jobs.analysis_runs}

processing

 AI Jobs

{active_jobs.ai_jobs}

processing

 Batch Jobs

{active_jobs.batch_jobs}

processing
{queue_health.pending > 0 && (
Queue Depth {queue_health.oldest_pending_minutes !== null && ( = 60 ? 'text-destructive' : queue_health.oldest_pending_minutes >= 15 ? 'text-warning-high' : queue_health.oldest_pending_minutes >= 5 ? 'text-warning' : 'text-muted-foreground', )} > Oldest job: {queue_health.oldest_pending_minutes}m ago )}
{queue_health.failed_1h > 0 && (
{queue_health.failed_1h} failed in last hour {queue_health.failed_24h > queue_health.failed_1h && ( ({queue_health.failed_24h} in 24h) )}
)} {queue_health.by_queue.length > 0 && (
{queue_health.by_queue.map((q) => (
{q.queue}
50 ? 'text-destructive' : q.depth > 10 ? 'text-warning' : 'text-foreground', )} > {q.depth} {q.oldest_job_minutes}m wait
))}
)} {queue_health.oldest_pending_minutes !== null && queue_health.oldest_pending_minutes >= 15 && (
{queue_health.oldest_pending_minutes >= 60 ? 'Jobs have been pending for over 1 hour — workers may be down or unavailable' : 'Jobs have been pending for over 15 minutes — workers may be slow or backlogged'}
)} )} {stuck_jobs.length > 0 && (

Stuck Jobs ({stuck_jobs.length})

Manage failed jobs →
Type ID Site Hours Stuck {stuck_jobs.map((job, idx) => ( {job.type} {job.id} {job.site_name ?? '—'} {job.hours_stuck}h ))}
)} {recent_failures.length > 0 && (

Recent Failures ({recent_failures.length})

Dead Letter Queue →
Queue Error Failed At {recent_failures.map((failure) => ( {failure.queue} {failure.exception} {failure.failed_at} ))}
)} {byok_health.total > 0 && (
BYOK AI Key Health View all keys →

Valid

{byok_health.valid}

Invalid / Errors

{byok_health.invalid}

Never Validated

{byok_health.never_validated}

{(byok_health.rate_limited > 0 || byok_health.quota_exceeded > 0 || byok_health.consecutive_failures_3plus > 0) && (
{byok_health.rate_limited > 0 && ( {byok_health.rate_limited} rate-limited )} {byok_health.quota_exceeded > 0 && ( {byok_health.quota_exceeded} quota exceeded )} {byok_health.consecutive_failures_3plus > 0 && ( {byok_health.consecutive_failures_3plus} with 3+ failures )}
)} )} {(connection_health.gsc.total > 0 || connection_health.wp.total > 0) && (
Connection Health
{connection_health.gsc.unhealthy > 0 ? ( ) : ( )}

GSC Connections

{connection_health.gsc.total}

{connection_health.gsc.unhealthy > 0 ? ( {connection_health.gsc.unhealthy} unhealthy ) : ( All healthy )}
View all →
{connection_health.wp.unhealthy > 0 ? ( ) : ( )}

WP Connections

{connection_health.wp.total}

{connection_health.wp.unhealthy > 0 ? ( {connection_health.wp.unhealthy} unhealthy ) : ( All healthy )}
View all →
)} {totalActive === 0 && queue_health.pending === 0 && queue_health.failed_24h === 0 && stuck_jobs.length === 0 && recent_failures.length === 0 && (

All systems operational

No active jobs, failures, or stuck processes.

)}
{ if (!open) setCancellingJob(null); }} title="Cancel stuck job?" description={ cancellingJob ? `This will mark ${cancellingJob.type} #${cancellingJob.id} as failed. The job has been stuck for ${cancellingJob.hours_stuck}h.` : '' } variant="destructive" confirmLabel="Cancel Job" onConfirm={handleCancel} /> ); }