import { Form, Head, Link, router } from '@inertiajs/react'; import { useState } from 'react'; import RoleController from '@/actions/App/Http/Controllers/Admin/RoleController'; import { ConfirmDialog } from '@/components/confirm-dialog'; import Heading from '@/components/heading'; import InputError from '@/components/input-error'; import { Button } from '@/components/ui/button'; import { Input } from '@/components/ui/input'; import { Label } from '@/components/ui/label'; import { dashboard } from '@/routes'; import { index } from '@/routes/admin/roles'; import { PermissionGroupsPicker, type PermissionGroup, } from './permission-groups-picker'; type EditableRole = { id: number; name: string; label: string; is_system: boolean; is_protected: boolean; permissions: string[]; }; export default function RolesEdit({ role, permissions, can, }: { role: EditableRole; permissions: PermissionGroup[]; can: { update: boolean; delete: boolean }; }) { const [selected, setSelected] = useState(role.permissions); const readOnly = !can.update || role.is_protected; return ( <>

{({ processing, errors }) => ( <>

Nom technique {(readOnly || role.is_system) && ( )}

{!readOnly && ( )} {can.delete && !role.is_system && ( Supprimer } title={`Supprimer le rôle ${role.label} ?`} description="Cette action est irréversible." confirmLabel="Supprimer" onConfirm={() => { router.delete( RoleController.destroy.url( role.id, ), ); }} /> )}

)}

); } RolesEdit.layout = { breadcrumbs: [ { title: 'Tableau de bord', href: dashboard() }, { title: 'Rôles', href: index() }, { title: 'Modifier', href: '#' }, ], };