import { Activity, CheckCircle, Layers, Package, XCircle } from 'lucide-react'; import { useRef } from 'react'; import { Head, Link } from '@inertiajs/react'; import { AdminDataTable } from '@/Components/admin/AdminDataTable'; import { AdminStatsGrid, type StatCard } from '@/Components/admin/AdminStatsGrid'; import { SortHeader } from '@/Components/admin/SortHeader'; import PageHeader from '@/Components/layout/PageHeader'; import { Badge } from '@/Components/ui/badge'; import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, } from '@/Components/ui/breadcrumb'; import { ExportButton } from '@/Components/ui/export-button'; import { Input } from '@/Components/ui/input'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '@/Components/ui/select'; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from '@/Components/ui/table'; import { useAdminFilters } from '@/hooks/useAdminFilters'; import { useAdminKeyboardShortcuts } from '@/hooks/useAdminKeyboardShortcuts'; import { useNavigationState } from '@/hooks/useNavigationState'; import AdminLayout from '@/Layouts/AdminLayout'; import { formatRelativeTime } from '@/lib/format'; import type { PaginatedResponse } from '@/types'; interface BatchJobRow { id: number; site_id: number | null; site_name: string | null; site_domain: string | null; user_id: number | null; user_email: string | null; status: string; total_jobs: number; completed_jobs: number; failed_jobs: number; progress_percent: number; total_actual_cost: string | null; started_at: string | null; completed_at: string | null; created_at: string; } interface Props { jobs: PaginatedResponse; stats: { total: number; processing: number; completed: number; failed: number; pending: number; }; filters: { search?: string; status?: string; sort?: string; dir?: string; }; statuses: string[]; } const STATUS_VARIANTS: Record = { pending: 'secondary', processing: 'warning', completed: 'success', failed: 'destructive', cancelled: 'outline', }; export default function AdminBatchJobsIndex({ jobs, stats, filters, statuses }: Props) { const searchInputRef = useRef(null); const { search, setSearch, updateFilter, handleSort, handlePage } = useAdminFilters({ route: '/admin/batch-jobs', filters, }); const isNavigating = useNavigationState(); const exportParams: Record = {}; if (filters.search) exportParams.search = filters.search; if (filters.status) exportParams.status = filters.status; useAdminKeyboardShortcuts({ onSearch: () => searchInputRef.current?.focus(), onNextPage: jobs.current_page < jobs.last_page ? () => handlePage(jobs.current_page + 1) : undefined, onPrevPage: jobs.current_page > 1 ? () => handlePage(jobs.current_page - 1) : undefined, }); const statCards: StatCard[] = [ { title: 'Total', value: stats.total, icon: Layers }, { title: 'Processing', value: stats.processing, icon: Activity, valueClassName: stats.processing > 0 ? 'text-primary' : '', }, { title: 'Completed', value: stats.completed, icon: CheckCircle }, { title: 'Failed', value: stats.failed, icon: XCircle, valueClassName: stats.failed > 0 ? 'text-destructive' : '', }, ]; return (
Admin Batch Jobs
} />
Batch Job Filters setSearch(e.target.value)} className="max-w-sm" aria-label="Search batch jobs" />
ID Site User Progress Cost {jobs.data.map((job) => ( #{job.id} {job.site_id ? ( {job.site_name ?? '—'} ) : (
{job.site_name ?? '—'}
)} {job.site_domain && (
{job.site_domain}
)} {job.user_id ? ( {job.user_email ?? '—'} ) : ( job.user_email ?? '—' )} {job.status}
{job.completed_jobs}/{job.total_jobs}
{job.failed_jobs > 0 && (
({job.failed_jobs} failed)
)}
{job.progress_percent}%
 {job.total_actual_cost ? `$${Number(job.total_actual_cost).toFixed(4)}` : '—'} {formatRelativeTime(job.created_at)} View ))}
); }