import AdminLayout from '@/Layouts/AdminLayout'; import { DataTable } from '@/components/admin/DataTable'; import PageHeader from '@/components/admin/PageHeader'; import { Badge } from '@/components/ui/badge'; import { Button } from '@/components/ui/button'; import { useDataTable } from '@/hooks/useDataTable'; import { cn } from '@/lib/utils'; import { Head } from '@inertiajs/react'; import { keepPreviousData, useQuery, useQueryClient, } from '@tanstack/react-query'; import { Download, SlidersHorizontal } from 'lucide-react'; import { useCallback, useState } from 'react'; import FiltersPanel from './components/FiltersPanel'; import QuickView from './components/QuickView'; import type { ReviewStatus } from './components/StatusBadge'; import { buildAuditColumns } from './components/audit-columns'; import { EMPTY_FILTERS, EMPTY_META, fetchLogs, type AdvancedFilters, type AuditResponse, type AuditRow, } from './components/audit-table'; interface Props { filterCounts: { all: number; unreviewed: number; critical: number; warning: number; failed: number; }; } export default function AuditLogsIndex({ filterCounts }: Props) { const qc = useQueryClient(); const { params, setParams } = useDataTable({ sort: 'created_at', dir: 'desc', }); const [advanced, setAdvanced] = useState(EMPTY_FILTERS); const [showFilters, setShowFilters] = useState(false); const [quickViewId, setQuickViewId] = useState(null); const { data, isLoading, isFetching } = useQuery({ queryKey: ['admin.audit', params, advanced], queryFn: () => fetchLogs(params, advanced), placeholderData: keepPreviousData, }); const invalidate = useCallback( () => qc.invalidateQueries({ queryKey: ['admin.audit'] }), [qc], ); const patchAdvanced = (patch: Partial) => setAdvanced((prev) => ({ ...prev, ...patch })); const handleReviewUpdate = ( id: string, review_status: ReviewStatus, reviewed_at: string | null, reviewed_by_name: string | null, ) => { qc.setQueryData( ['admin.audit', params, advanced], (old) => { if (!old) return old; return { ...old, data: old.data.map((r) => r.id === id ? { ...r, review_status, reviewed_at, reviewed_by_name, } : r, ), }; }, ); }; const exportUrl = (() => { const sp = new URLSearchParams(); if (params.filter && params.filter !== 'all') sp.set('filter', params.filter); if (advanced.from) sp.set('from', advanced.from); if (advanced.to) sp.set('to', advanced.to); return `/admin/audit/export${sp.toString() ? '?' + sp.toString() : ''}`; })(); const activeFilterCount = advanced.severities.length + advanced.categories.length + advanced.statuses.length + (advanced.actor_type ? 1 : 0) + (advanced.from || advanced.to ? 1 : 0); const columns = buildAuditColumns(setQuickViewId); return (
Export CSV
} /> {showFilters && ( setAdvanced(EMPTY_FILTERS)} /> )} { const csv = [ 'Time,Event,Category,Actor,Role,Severity,Status,IP', ] .concat( rows.map((r) => [ r.created_at, r.event, r.category, r.actor_name ?? '', r.actor_role ?? '', r.severity, r.status, r.ip_address ?? '', ].join(','), ), ) .join('\n'); const a = document.createElement('a'); a.href = 'data:text/csv,' + encodeURIComponent(csv); a.download = 'audit-logs.csv'; a.click(); }, }, ]} exportUrl={exportUrl} onRefresh={invalidate} searchPlaceholder="Search events, actors, IPs…" noun="events" getRowId={(row) => String(row.id)} /> setQuickViewId(null)} onReviewUpdate={handleReviewUpdate} /> ); }