import { Head, router } from '@inertiajs/react';
import { Plus } from 'lucide-react';
import { useCallback, useState } from 'react';
import { ConfirmDialog } from '@/components/confirm-dialog';
import { DataTable } from '@/components/data-table';
import type { PaginationState } from '@/components/data-table';
import { Button } from '@/components/ui/button';
import {
index as rolesIndex,
create as roleCreate,
edit as roleEdit,
destroy as roleDestroy,
} from '@/routes/admin/settings/roles';
import { createRoleColumns } from './columns';
import type { Role } from './columns';
type Props = {
roles: {
data: Role[];
current_page: number;
last_page: number;
per_page: number;
total: number;
};
};
export default function RoleIndex({ roles }: Props) {
const [deleting, setDeleting] = useState(null);
const [search, setSearch] = useState('');
const pagination: PaginationState = {
current_page: roles.current_page,
last_page: roles.last_page,
per_page: roles.per_page,
total: roles.total,
};
function handlePageChange(page: number) {
router.get(
rolesIndex.url(),
{
page,
per_page: pagination.per_page,
search,
},
{ preserveState: true, replace: true },
);
}
function handlePerPageChange(perPage: number) {
router.get(
rolesIndex.url(),
{
page: 1,
per_page: perPage,
search,
},
{ preserveState: true, replace: true },
);
}
const handleSearchChange = useCallback(
(value: string) => {
setSearch(value);
router.get(
rolesIndex.url(),
{
page: 1,
per_page: pagination.per_page,
search: value,
},
{ preserveState: true, replace: true },
);
},
[pagination.per_page],
);
function handleDelete() {
if (!deleting) {
return;
}
router.delete(roleDestroy.url(deleting.id), {
onSuccess: () => setDeleting(null),
});
}
const columns = createRoleColumns({
handleEdit: (role) => {
window.location.href = roleEdit.url(role.id);
},
handleDeleteClick: (role) => setDeleting(role),
});
return (
<>
{
if (!open) {
setDeleting(null);
}
}}
title="Hapus Role"
description={`Apakah Anda yakin ingin menghapus role "${deleting?.name}"? Semua user dengan role ini akan kehilangan permission terkait.`}
confirmLabel="Hapus"
onConfirm={handleDelete}
/>
>
);
}