import { Head, Link, router } from '@inertiajs/react'; import type { ColumnDef } from '@tanstack/react-table'; import { format } from 'date-fns'; import { ArrowLeft, Trash2 } from 'lucide-react'; import { useState } from 'react'; import { DataTable } from '@/components/data-table'; import { DeleteConfirmDialog } from '@/components/delete-confirm-dialog'; import { PageHeader } from '@/components/page-header'; import { RowActions } from '@/components/row-actions'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { usePermissions } from '@/hooks/use-permissions'; import { index as courseClassIndex } from '@/routes/admin/manage/course-classes'; import { destroy } from '@/routes/admin/manage/course-classes/enrollments'; import { formatAcademicTermLabel } from '@/types/academic-term'; import type { ClassEnrollment } from '@/types/class-enrollment'; import type { CourseClass } from '@/types/course-class'; import { ClassMethodLabels } from '@/types/course-class'; type Props = { courseClass: CourseClass; enrollments: ClassEnrollment[]; }; export default function ClassEnrollmentIndex({ courseClass, enrollments, }: Props) { const [deleting, setDeleting] = useState(null); const { hasPermission } = usePermissions(); const canDelete = hasPermission('delete-course-class-enrollments'); function handleDelete() { if (!deleting) { return; } router.delete(destroy([courseClass.id, deleting.id]), { onSuccess: () => setDeleting(null), }); } const columns: ColumnDef[] = [ { id: 'identity', header: () => NIM, cell: ({ row }) => (

{row.original.student?.student_number ?? '-'} {row.original.student?.user?.profile?.full_name ?? '-'}

), }, { accessorKey: 'student.department.name', header: () => Jurusan, cell: ({ row }) => row.original.student?.department?.name ?? '-', }, { accessorKey: 'enrolled_at', header: () => Tanggal Daftar, cell: ({ row }) => { const enrolledAt = row.getValue('enrolled_at') as string | null; return enrolledAt ? format(new Date(enrolledAt), 'd MMM yyyy') : '-'; }, }, ]; if (canDelete) { columns.push({ id: 'actions', header: () => Aksi, meta: { className: 'w-[80px] text-center', headerClassName: 'w-[80px] text-center', }, cell: ({ row }) => ( ), show: canDelete, onClick: () => setDeleting(row.original), }, ]} /> ), }); } return ( <>

Kembali } /> Detail Kelas Mata Kuliah

Mata Kuliah: {courseClass.course?.code} -{' '} {courseClass.course?.name}

Dosen Pengampu:{' '} {courseClass.lecturer?.user?.profile?.full_name ?? '-'}

Periode:{' '} {courseClass.academic_term ? formatAcademicTermLabel( courseClass.academic_term, ) : '-'}

Metode:{' '} {courseClass.method ? ClassMethodLabels[courseClass.method] : '-'}

Jumlah Peserta: {enrollments.length}

Daftar Mahasiswa

{ if (!open) { setDeleting(null); } }} title="Keluarkan Mahasiswa" description={(enrollment) => `Apakah Anda yakin ingin mengeluarkan "${enrollment.student?.user?.profile?.full_name ?? 'mahasiswa ini'}" dari kelas ini?` } onConfirm={handleDelete} />

); }