import { Head, router } from '@inertiajs/react'; import { format } from 'date-fns'; import { Download } from 'lucide-react'; import { useState } from 'react'; import type { PaginationState } from '@/components/data-table'; import { DataTable } from '@/components/data-table'; import type { FilterField } from '@/components/filter-dialog'; import { FilterDialog } from '@/components/filter-dialog'; import { PageHeader } from '@/components/page-header'; import { Badge } from '@/components/ui/badge'; import { Button } from '@/components/ui/button'; import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, } from '@/components/ui/dialog'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '@/components/ui/select'; import { useServerTable } from '@/hooks/use-server-table'; import { index as logsIndex, download } from '@/routes/admin/developer/logs'; import type { LogEntry, LogFile } from '@/types/log-entry'; import { LogLevels } from '@/types/log-entry'; import { createLogColumns } from './columns'; type Props = { entries: { data: LogEntry[]; current_page: number; last_page: number; per_page: number; total: number; } | null; files: LogFile[]; selectedFile: string | null; filters: { file?: string; level?: string; }; }; function formatFileSize(bytes: number): string { if (bytes < 1024) { return `${bytes} B`; } if (bytes < 1024 * 1024) { return `${(bytes / 1024).toFixed(1)} KB`; } return `${(bytes / (1024 * 1024)).toFixed(1)} MB`; } export default function LogIndex({ entries, files, selectedFile, filters, }: Props) { const [detail, setDetail] = useState(null); const filterFields: FilterField[] = [ { key: 'level', label: 'Level', options: LogLevels.map((level) => ({ value: level, label: level, })), }, ]; const pagination: PaginationState = { current_page: entries?.current_page ?? 1, last_page: entries?.last_page ?? 1, per_page: entries?.per_page ?? 25, total: entries?.total ?? 0, }; const { search, handlePageChange, handlePerPageChange, handleSearchChange, applyFilters, } = useServerTable({ route: () => logsIndex.url(), pagination, filters, }); function handleFileChange(file: string) { router.get( logsIndex.url(), { file, level: filters.level }, { preserveState: true, replace: true }, ); } const columns = createLogColumns({ handleViewDetail: (entry) => setDetail(entry), }); return ( <>

Unduh ) } />

{entries ? ( } /> ) : (

Belum ada file log yang tersedia.

)}

); }