import { Head, Link, router, useForm } from "@inertiajs/react"; import { ArchiveRestore, Box, ChevronDown, History, Info, Layers, LogIn, RotateCcw, ShieldCheck, Trash2, } from "lucide-react"; import { useState, type FormEvent } from "react"; import { StatStrip } from "@/components/crm/kpi-tile"; import { Callout, EmptyState, PageHeader, } from "@/components/crm/page-header"; import { StatusPill } from "@/components/crm/status-badge"; import { toneClasses } from "@/components/crm/tone"; import { DataPagination, FilterBar, FilterField, SearchInput, TableCard, } from "@/components/crm/toolbar"; import { Button } from "@/components/ui/button"; import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, } from "@/components/ui/dialog"; import { formatDate, formatRelative } from "@/lib/format"; import { cn } from "@/lib/utils"; import type { Paginated, RecycleCategory, RecycleItem, RecycleStats, } from "@/types"; type Props = { items: Paginated; categories: RecycleCategory[]; current: RecycleCategory | null; filters: { type: string | null; search: string | null; }; stats: RecycleStats; }; /** * The recycle bin. * * Removing something in this CRM hides it. This is where the hidden rows are — * grouped by the module they came from, so a client is found under Clients and * a job under Jobs — and the only action is putting one back. There is no * "delete permanently" button, because the whole point is that a mis-click * costs nothing. */ export default function RecycleBin({ items, categories, current, filters, stats, }: Props) { const [search, setSearch] = useState(filters.search ?? ""); const [expanded, setExpanded] = useState(null); const [pending, setPending] = useState(null); // The form exists for one reason: its errors, so a refused restore can say // why instead of failing silently. No field is actually sent. const restore = useForm({ record: "" }); const go = (params: { type?: string | null; search?: string }): void => { const query: Record = {}; if (params.type) { query.type = params.type; } if (params.search?.trim()) { query.search = params.search.trim(); } router.get("/settings/audit/deleted", query, { preserveState: true, preserveScroll: true, replace: true, }); }; const submitSearch = (event: FormEvent): void => { event.preventDefault(); go({ type: filters.type, search }); }; const confirmRestore = (): void => { if (!pending) { return; } restore.post( `/settings/audit/deleted/${pending.key}/${pending.id}/restore`, { preserveScroll: true, onSuccess: () => setPending(null), }, ); }; return ( <> Owner only · Nothing is ever destroyed from here } title="Recycle bin" description="Removing a client, site, job, ticket, account or document hides it; it does not delete it. Everything hidden is listed below by the module it came from, and can be put back exactly as it was." actions={ <> } /> 0 ? "warning" : "slate", icon: Trash2, }, { label: "Modules affected", value: stats.modules, tone: "blue", icon: Layers, }, { label: "Can be restored now", value: stats.restorable, tone: "success", icon: RotateCcw, }, { label: "Waiting on a parent", value: Math.max(0, stats.total - stats.restorable), tone: "amber", icon: Info, }, ]} /> {stats.total === 0 ? ( ) : ( <>

go({ type: null })} /> {categories .filter((category) => category.count > 0) .map((category) => ( go({ type: category.key }) } /> ))}

{!current ? ( These are the most recently hidden records from every module. Choose one above to see everything it holds, search inside it, and restore. ) : null} {items.data.length === 0 ? ( )} ); } function CategoryCard({ label, module, count, tone, active, onClick, }: { label: string; module: string; count: number; tone: string; active: boolean; onClick: () => void; }) { const classes = toneClasses(tone); return ( ); } function BinRow({ item, showModule, open, onToggle, onRestore, }: { item: RecycleItem; showModule: boolean; open: boolean; onToggle: () => void; onRestore: () => void; }) { return (

{item.title} {showModule ? ( {item.module} ) : null}

{item.label} {item.subtitle ? ` · ${item.subtitle}` : ""} {item.deleted_at ? ` · hidden ${formatRelative(item.deleted_at)} by ${item.deleted_by}` : ""}

{!item.can_restore && item.blocked_reason ? (

{item.blocked_reason}

) : null}

{open ? (

{field.label}: {field.value}

{item.deleted_at ? `Hidden on ${formatDate(item.deleted_at)}` : "Hidden"} {" · "} {item.deleted_by} {" · Record #"} {item.id}

) : null}

); }