import { AlertTriangle, CheckCircle, Key, XCircle } from 'lucide-react'; import { useRef } from 'react'; import { Head, Link } from '@inertiajs/react'; import { AdminPagination } from '@/Components/admin/AdminPagination'; import { AdminStatsGrid, type StatCard } from '@/Components/admin/AdminStatsGrid'; 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 { 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 AdminLayout from '@/Layouts/AdminLayout'; import { formatRelativeTime } from '@/lib/format'; import type { PaginatedResponse } from '@/types'; interface AiKeyRow { id: number; user_name: string | null; user_email: string | null; provider: string; is_validated: boolean; last_validation_status: string | null; last_validation_message: string | null; last_validation_at: string | null; invalidated_at: string | null; consecutive_failures: number; created_at: string | null; } interface Filters extends Record { search?: string; status?: string; per_page?: string; } interface Props { keys: PaginatedResponse; stats: { total: number; validated: number; invalid: number; never_validated: number; consecutive_failures_gt0: number; }; by_status: Record; filters: Filters; } function validationStatusBadge(status: string | null, isValidated: boolean) { if (status === null) return Not checked; if (isValidated) return valid; if (status === 'rate_limited') return rate_limited; if (status === 'quota_exceeded') return quota_exceeded; return {status}; } const STATUS_OPTIONS = [ { value: 'valid', label: 'Valid' }, { value: 'invalid_auth', label: 'Invalid Auth' }, { value: 'rate_limited', label: 'Rate Limited' }, { value: 'quota_exceeded', label: 'Quota Exceeded' }, { value: 'network_error', label: 'Network Error' }, { value: 'provider_error', label: 'Provider Error' }, { value: 'never_validated', label: 'Never Validated' }, ]; export default function Index({ keys, stats, by_status, filters }: Props) { const { search, setSearch, updateFilter, handlePage, clearFilters } = useAdminFilters({ route: '/admin/user-ai-keys', filters, }); const searchInputRef = useRef(null); useAdminKeyboardShortcuts({ onSearch: () => searchInputRef.current?.focus() }); const hasFilters = !!(filters.search || filters.status); const statCards: StatCard[] = [ { title: 'Total Keys', value: stats.total, icon: Key, }, { title: 'Validated', value: stats.validated, icon: CheckCircle, }, { title: 'Invalid', value: stats.invalid, icon: XCircle, valueClassName: stats.invalid > 0 ? 'text-destructive' : '', }, { title: 'Never Validated', value: stats.never_validated, icon: AlertTriangle, valueClassName: stats.never_validated > 0 ? 'text-warning' : '', }, ]; return (

Admin BYOK AI Keys {Object.keys(by_status).length > 0 && (

{Object.entries(by_status).map(([status, count]) => ( {status} {count} ))}

)}

setSearch(e.target.value)} className="max-w-xs" /> {hasFilters && ( )}

User Provider Status Message Failures Last Checked {keys.data.length === 0 ? ( {hasFilters ? 'No keys match the current filters.' : 'No BYOK keys registered.'} ) : ( keys.data.map((key) => (

{key.user_name ?? '—'}

{key.user_email}

{key.provider} {validationStatusBadge(key.last_validation_status, key.is_validated)} {key.last_validation_message ?? '—'} {key.consecutive_failures > 0 ? ( {key.consecutive_failures} ) : ( 0 )} {key.last_validation_at ? formatRelativeTime(key.last_validation_at) : '—'} )) )}

); }