import { Head, router } from '@inertiajs/react'; import { Plus } from 'lucide-react'; import { useState } from 'react'; import type { PaginationState } from '@/components/data-display'; import { DataTable } from '@/components/data-display'; import { DeleteConfirmDialog } from '@/components/dialogs'; import { FormDialog } from '@/components/dialogs'; import { InputError } from '@/components/ui'; import { PageHeader } from '@/components/layout'; import { PhoneNumberInput } from '@/components/inputs'; import { Button } from '@/components/ui/button'; import { Input } from '@/components/ui/input'; import { Label } from '@/components/ui/label'; import { useCan } from '@/hooks/use-can'; import { useServerTable } from '@/hooks/use-server-table'; import { destroy, index as supplierIndex, store, update, } from '@/routes/admin/master/suppliers'; import type { Supplier } from './columns'; import { createSupplierColumns } from './columns'; type Props = { suppliers: { data: Supplier[]; current_page: number; last_page: number; per_page: number; total: number; }; }; export default function SupplierIndex({ suppliers }: Props) { const { can } = useCan(); const [createOpen, setCreateOpen] = useState(false); const [editing, setEditing] = useState(null); const [deleting, setDeleting] = useState(null); const pagination: PaginationState = { current_page: suppliers.current_page, last_page: suppliers.last_page, per_page: suppliers.per_page, total: suppliers.total, }; const { search, handlePageChange, handlePerPageChange, handleSearchChange, } = useServerTable({ route: () => supplierIndex.url(), pagination, }); function handleDelete() { if (!deleting) { return; } router.delete(destroy(deleting.id), { onSuccess: () => setDeleting(null), }); } const columns = createSupplierColumns({ handleEdit: (supplier) => setEditing(supplier), handleDeleteClick: (supplier) => setDeleting(supplier), can, }); return ( <>
) : undefined } /> setCreateOpen(false)} > {({ errors }) => (
)} { if (!open) { setEditing(null); } }} title="Edit Supplier" action={editing ? update(editing.id) : ''} resetOnSuccess onSuccess={() => setEditing(null)} > {({ errors }) => editing && (
) } { if (!open) { setDeleting(null); } }} title="Hapus Supplier" description={(supplier) => `Apakah Anda yakin ingin menghapus supplier "${supplier.name}"? Tindakan ini tidak dapat dibatalkan.` } onConfirm={handleDelete} />
); }