import { DataTable } from '@/components/core/data-table'; import { DeleteDialog } from '@/components/core/delete-dialog'; import { Badge } from '@/components/ui/badge'; import { Button } from '@/components/ui/button'; import { Card } from '@/components/ui/card'; import { Input } from '@/components/ui/input'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'; import AppLayout from '@/layouts/app-layout'; import { Head, Link, router } from '@inertiajs/react'; import { useState, useEffect, useMemo } from 'react'; import { Search, Pencil, Eye, X } from 'lucide-react'; interface Reseller { id: number; name: string; } interface DriverDocument { id: number; name: string; resellers: Reseller[]; type?: string; required?: boolean; active?: boolean; created_at: string; } interface DriverDocumentsIndexProps { driverDocuments: DriverDocument[]; } export default function DriverDocumentsIndex({ driverDocuments }: DriverDocumentsIndexProps) { const [deleteDialog, setDeleteDialog] = useState<{ open: boolean; document: DriverDocument | null; }>({ open: false, document: null, }); const [deleteAllDialog, setDeleteAllDialog] = useState(false); const [searchQuery, setSearchQuery] = useState(''); const [selectedReseller, setSelectedReseller] = useState('all'); // Reload page when window gains focus to check for deleted drivers useEffect(() => { const handleFocus = () => { router.reload({ only: ['driverDocuments'], preserveState: true, preserveScroll: true }); }; window.addEventListener('focus', handleFocus); return () => window.removeEventListener('focus', handleFocus); }, []); const handleDelete = (document: DriverDocument) => { setDeleteDialog({ open: true, document }); }; const confirmDelete = () => { if (deleteDialog.document && deleteDialog.document.id) { // Delete the document name (which will cascade delete all related lead documents) router.delete(`/leads/lead-documents/${deleteDialog.document.id}`, { onSuccess: () => { setDeleteDialog({ open: false, document: null }); router.reload({ only: ['driverDocuments'] }); }, }); } }; const handleDeleteAll = () => { setDeleteAllDialog(true); }; const confirmDeleteAll = () => { router.delete('/leads/lead-documents', { onSuccess: () => { setDeleteAllDialog(false); }, }); }; // Get unique resellers for filter const resellers = useMemo(() => { const map = new Map(); driverDocuments.forEach((doc) => { doc.resellers?.forEach((r) => { if (r.id && r.name) map.set(r.id, r.name); }); }); return Array.from(map.entries()).map(([id, name]) => ({ id, name })); }, [driverDocuments]); const filteredDocuments = useMemo(() => { let filtered = driverDocuments; if (selectedReseller !== 'all') { const companyId = parseInt(selectedReseller); filtered = filtered.filter((doc) => doc.resellers?.some((r) => r.id === companyId)); } if (searchQuery.trim()) { const q = searchQuery.toLowerCase().trim(); filtered = filtered.filter((doc) => { const name = doc.name?.toLowerCase() || ''; const resellerNames = doc.resellers?.map((r) => r.name?.toLowerCase() || '').join(' ') || ''; return name.includes(q) || resellerNames.includes(q); }); } return filtered; }, [driverDocuments, searchQuery, selectedReseller]); return (

Documents Required

Manage required documents and approvals

{driverDocuments.length > 0 && ( )}
{driverDocuments.length > 0 ? ( <> {/* Search and Filter */}
setSearchQuery(e.target.value)} className="pl-10 w-full" />
{(selectedReseller !== 'all' || searchQuery) && ( )}
{(searchQuery || selectedReseller !== 'all') && (

Showing {filteredDocuments.length} of {driverDocuments.length} document(s)

)} (
{row.name || '-'}
), }, { header: 'Resellers', accessor: (row) => (
{row.resellers && row.resellers.length > 0 ? ( row.resellers.map((r) => ( {r.name} )) ) : ( - )}
), }, { header: 'Status', accessor: (row) => ( row.active === false ? ( Inactive ) : ( Active ) ), }, { header: 'Actions', accessor: (row) => (
), }, ]} /> ) : (

No documents found.

)} setDeleteDialog({ open, document: null })} onConfirm={confirmDelete} title="Delete Document" description={ `Are you sure you want to delete the document "${deleteDialog.document?.name}"? This will delete this document name and all associated documents for all reseller companies. This action cannot be undone.` } /> setDeleteAllDialog(open)} onConfirm={confirmDeleteAll} title="Delete All Documents" description={`Are you sure you want to delete all ${driverDocuments.length} document(s)? This action cannot be undone and will also delete all associated files.`} />
); }