siakad-itm/resources/js/pages/admin/master/academic-terms/columns.tsx
Yoga Pangestu 5994f38f01 feat: implement permission checks for academic terms, courses, departments, and user management
- Added permission checks for creating, updating, and deleting academic terms, courses, and departments.
- Updated the routes to enforce permissions for various actions in the admin panel.
- Enhanced user management by adding permissions for administrators, lecturers, and students.
- Refactored components to conditionally render actions based on user permissions.
- Updated the auth type to include optional permissions array for user roles.
2026-08-30 23:27:31 +07:00

126 lines
4.2 KiB
TypeScript

import type { ColumnDef } from '@tanstack/react-table';
import { Pencil, Trash2 } from 'lucide-react';
import { ActiveStatusSwitch } from '@/components/active-status-switch';
import { RowActions } from '@/components/row-actions';
import { SemesterLabels } from '@/types/academic-term';
import type { AcademicTerm } from '@/types/academic-term';
import type { Semester } from '@/types/academic-term';
export type { AcademicTerm } from '@/types/academic-term';
type CreateColumnsParams = {
handleEdit: (academicTerm: AcademicTerm) => void;
handleDeleteClick: (academicTerm: AcademicTerm) => void;
handleStatusChange: (academicTerm: AcademicTerm, isActive: boolean) => void;
canUpdate: boolean;
canDelete: boolean;
canUpdateStatus: boolean;
};
export function createAcademicTermColumns(
params: CreateColumnsParams,
): ColumnDef<AcademicTerm>[] {
const {
handleEdit,
handleDeleteClick,
handleStatusChange,
canUpdate,
canDelete,
canUpdateStatus,
} = params;
return [
{
accessorKey: 'name',
header: () => <span>Nama</span>,
cell: ({ row }) => (
<span className="font-medium">
{row.getValue('name') as string}
</span>
),
},
{
accessorKey: 'semester',
header: () => <span>Semester</span>,
cell: ({ row }) => {
const semester = row.getValue('semester') as Semester;
return <span>{SemesterLabels[semester]}</span>;
},
},
{
accessorKey: 'formatted_start_date',
header: () => <span>Tanggal Mulai</span>,
cell: ({ row }) => (
<span>
{row.getValue('formatted_start_date') as string | null}
</span>
),
},
{
accessorKey: 'formatted_end_date',
header: () => <span>Tanggal Selesai</span>,
cell: ({ row }) => (
<span>
{row.getValue('formatted_end_date') as string | null}
</span>
),
},
{
accessorKey: 'is_active',
header: () => <span className="block text-center">Status</span>,
meta: {
className: 'w-[100px] text-center',
headerClassName: 'w-[100px] text-center',
},
cell: ({ row }) => {
const academicTerm = row.original;
return (
<div className="flex justify-center">
<ActiveStatusSwitch
isActive={academicTerm.is_active}
onChange={(isActive) =>
handleStatusChange(academicTerm, isActive)
}
disabled={!canUpdateStatus}
/>
</div>
);
},
},
{
id: 'actions',
header: () => <span className="block text-center">Aksi</span>,
meta: {
className: 'w-[100px] text-center',
headerClassName: 'w-[100px] text-center',
},
cell: ({ row }) => {
const academicTerm = row.original;
return (
<RowActions
actions={[
{
label: 'Edit',
icon: <Pencil className="h-4 w-4" />,
show: canUpdate,
onClick: () => handleEdit(academicTerm),
},
{
label: 'Hapus',
icon: (
<Trash2 className="h-4 w-4 text-destructive" />
),
show: canDelete,
onClick: () => handleDeleteClick(academicTerm),
},
]}
/>
);
},
},
];
}