import React from 'react' import { Head } from '@inertiajs/react' import { router } from '@inertiajs/react' import { toast } from 'react-toastify' import { useModalState } from '@/Hooks' import { hasPermission } from '@/utils' import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout' import Pagination from '@/Components/Pagination' import ModalConfirm from '@/Components/ModalConfirm' import FormModal from './FormModal' export default function Types(props) { const { data: regions, links } = props.regions const formModal = useModalState(false) const toggle = (region = null) => { formModal.setData(region) formModal.toggle() } const confirmModal = useModalState(false) const handleDelete = (region) => { confirmModal.setData(region) confirmModal.toggle() } const onDelete = () => { const region = confirmModal.data if(region != null) { router.delete(route('regions.destroy', region), { onSuccess: () => toast.success('The Data has been deleted'), }) } } const canCreate = hasPermission('create-region', props.auth.user) const canUpdate = hasPermission('update-region', props.auth.user) const canDelete = hasPermission('delete-region', props.auth.user) return (
{canCreate && (
toggle()} > Tambah
)}
{regions?.map((region) => ( ))}
Id Nama Group Email
{region.id} {`${region.name} (${region.group.name})`} {region.group.name} {region.email} {canUpdate && (
toggle(region) } > Edit
)} {canDelete && (
handleDelete(region) } > Delete
)}
) }