import { Head, router } from '@inertiajs/react'; import { Plus } from 'lucide-react'; import { useState } from 'react'; import type { PaginationState } from '@/components/data-table'; import { DataTable } from '@/components/data-table'; import { DeleteConfirmDialog } from '@/components/delete-confirm-dialog'; import { FormDialog } from '@/components/form-dialog'; import InputError from '@/components/input-error'; import { PageHeader } from '@/components/page-header'; import { Button } from '@/components/ui/button'; import { Input } from '@/components/ui/input'; import { Label } from '@/components/ui/label'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '@/components/ui/select'; import { usePermissions } from '@/hooks/use-permissions'; import { useServerTable } from '@/hooks/use-server-table'; import { index as departmentIndex, destroy, store, update, } from '@/routes/admin/master/departments'; import { DegreeLevels } from '@/types/department'; import type { Department } from '@/types/department'; import { createDepartmentColumns } from './columns'; type Props = { departments: { data: Department[]; current_page: number; last_page: number; per_page: number; total: number; }; highlight?: number; }; export default function DepartmentIndex({ departments, highlight }: Props) { const [createOpen, setCreateOpen] = useState(false); const [editing, setEditing] = useState(null); const [deleting, setDeleting] = useState(null); const { hasPermission } = usePermissions(); const canCreate = hasPermission('create-departments'); const canUpdate = hasPermission('update-departments'); const canDelete = hasPermission('delete-departments'); const pagination: PaginationState = { current_page: departments.current_page, last_page: departments.last_page, per_page: departments.per_page, total: departments.total, }; const { search, handlePageChange, handlePerPageChange, handleSearchChange, } = useServerTable({ route: () => departmentIndex.url(), pagination, }); function handleDelete() { if (!deleting) { return; } router.delete(destroy(deleting.id), { onSuccess: () => setDeleting(null), }); } const columns = createDepartmentColumns({ handleEdit: (department) => setEditing(department), handleDeleteClick: (department) => setDeleting(department), canUpdate, canDelete, }); return ( <>
Menampilkan jurusan dari notifikasi.

) } actions={ canCreate && ( ) } /> { if (!open) { setEditing(null); } }} editing={editing} /> { if (!open) { setDeleting(null); } }} title="Hapus Jurusan" description={(department) => `Apakah Anda yakin ingin menghapus jurusan "${department.name}"? Tindakan ini tidak dapat dibatalkan.` } onConfirm={handleDelete} />
); } function CreateForm({ open, onOpenChange, }: { open: boolean; onOpenChange: (open: boolean) => void; }) { return ( onOpenChange(false)} > {({ errors }) => (
)} ); } function EditForm({ open, onOpenChange, editing, }: { open: boolean; onOpenChange: (open: boolean) => void; editing: Department | null; }) { return ( onOpenChange(false)} > {({ errors }) => editing && (
) } ); }