feat(users): add description field to permission definitions
This commit is contained in:
+16
-16
@@ -23,22 +23,22 @@ export const PERMISSIONS = {
|
||||
};
|
||||
|
||||
export const PERMISSION_DEFINITIONS = [
|
||||
{ key: 'admin.access', name: 'Accès au panneau admin', group_name: 'Administration' },
|
||||
{ key: 'content.view', name: 'Voir le contenu', group_name: 'Contenu' },
|
||||
{ key: 'content.create', name: 'Créer du contenu', group_name: 'Contenu' },
|
||||
{ key: 'content.edit', name: 'Modifier le contenu', group_name: 'Contenu' },
|
||||
{ key: 'content.delete', name: 'Supprimer le contenu', group_name: 'Contenu' },
|
||||
{ key: 'content.publish', name: 'Publier le contenu', group_name: 'Contenu' },
|
||||
{ key: 'media.view', name: 'Voir les médias', group_name: 'Médias' },
|
||||
{ key: 'media.upload', name: 'Téléverser des médias', group_name: 'Médias' },
|
||||
{ key: 'media.delete', name: 'Supprimer des médias', group_name: 'Médias' },
|
||||
{ key: 'users.view', name: 'Voir les utilisateurs', group_name: 'Utilisateurs' },
|
||||
{ key: 'users.edit', name: 'Modifier les utilisateurs', group_name: 'Utilisateurs' },
|
||||
{ key: 'users.delete', name: 'Supprimer les utilisateurs', group_name: 'Utilisateurs' },
|
||||
{ key: 'roles.view', name: 'Voir les rôles', group_name: 'Rôles' },
|
||||
{ key: 'roles.manage', name: 'Gérer les rôles', group_name: 'Rôles' },
|
||||
{ key: 'settings.view', name: 'Voir les paramètres', group_name: 'Paramètres' },
|
||||
{ key: 'settings.manage', name: 'Gérer les paramètres', group_name: 'Paramètres' },
|
||||
{ key: 'admin.access', name: 'Accès au panneau admin', description: "Permet d'accéder à l'interface d'administration.", group_name: 'Administration' },
|
||||
{ key: 'content.view', name: 'Voir le contenu', description: 'Permet de consulter les articles, pages et autres contenus.', group_name: 'Contenu' },
|
||||
{ key: 'content.create', name: 'Créer du contenu', description: 'Permet de rédiger et soumettre de nouveaux contenus.', group_name: 'Contenu' },
|
||||
{ key: 'content.edit', name: 'Modifier le contenu', description: 'Permet de mettre à jour des contenus existants.', group_name: 'Contenu' },
|
||||
{ key: 'content.delete', name: 'Supprimer le contenu', description: 'Permet de supprimer définitivement des contenus.', group_name: 'Contenu' },
|
||||
{ key: 'content.publish', name: 'Publier le contenu', description: 'Permet de rendre des contenus visibles publiquement.', group_name: 'Contenu' },
|
||||
{ key: 'media.view', name: 'Voir les médias', description: 'Permet de parcourir la médiathèque.', group_name: 'Médias' },
|
||||
{ key: 'media.upload', name: 'Téléverser des médias', description: 'Permet d\'uploader des images, vidéos et fichiers.', group_name: 'Médias' },
|
||||
{ key: 'media.delete', name: 'Supprimer des médias', description: 'Permet de supprimer des fichiers de la médiathèque.', group_name: 'Médias' },
|
||||
{ key: 'users.view', name: 'Voir les utilisateurs', description: 'Permet de consulter la liste des membres et leurs profils.', group_name: 'Utilisateurs' },
|
||||
{ key: 'users.edit', name: 'Modifier les utilisateurs', description: 'Permet de changer les informations et les rôles des membres.', group_name: 'Utilisateurs' },
|
||||
{ key: 'users.delete', name: 'Supprimer des utilisateurs', description: 'Permet de supprimer des comptes membres.', group_name: 'Utilisateurs' },
|
||||
{ key: 'roles.view', name: 'Voir les rôles', description: 'Permet de consulter la liste des rôles et leurs permissions.', group_name: 'Rôles' },
|
||||
{ key: 'roles.manage', name: 'Gérer les rôles', description: 'Permet de créer, modifier et supprimer des rôles.', group_name: 'Rôles' },
|
||||
{ key: 'settings.view', name: 'Voir les paramètres', description: 'Permet de consulter la configuration du site.', group_name: 'Paramètres' },
|
||||
{ key: 'settings.manage', name: 'Gérer les paramètres', description: 'Permet de modifier la configuration et les réglages du site.', group_name: 'Paramètres' },
|
||||
];
|
||||
|
||||
/**
|
||||
|
||||
@@ -150,21 +150,23 @@ const RoleEditModal = ({ roleId, isOpen, onClose, onSaved }) => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-2">
|
||||
<p className="text-xs font-semibold text-neutral-900 dark:text-white">Permissions</p>
|
||||
<div className="flex flex-col gap-3">
|
||||
<p className="text-xs font-semibold uppercase tracking-wide text-neutral-500 dark:text-neutral-400">Permissions</p>
|
||||
{Object.entries(PERMISSION_GROUPS).map(([group, perms]) => (
|
||||
<div key={group} className="flex flex-col">
|
||||
<p className="text-xs font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wide py-1">
|
||||
<div key={group} className="rounded-xl border border-neutral-200 dark:border-neutral-700/60 overflow-hidden">
|
||||
<div className="px-4 py-2.5 bg-neutral-50 dark:bg-neutral-800/60 border-b border-neutral-200 dark:border-neutral-700/60">
|
||||
<p className="text-xs font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wide">
|
||||
{group}
|
||||
</p>
|
||||
<div className="flex flex-col divide-y divide-neutral-100 dark:divide-neutral-700/50">
|
||||
</div>
|
||||
<div className="flex flex-col divide-y divide-neutral-100 dark:divide-neutral-700/40">
|
||||
{perms.map((perm) => (
|
||||
<Switch
|
||||
key={perm.key}
|
||||
checked={selectedPerms.includes(perm.key)}
|
||||
onChange={() => togglePerm(perm.key)}
|
||||
label={perm.name}
|
||||
description={perm.key}
|
||||
description={perm.description}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
||||
@@ -9,12 +9,12 @@ const Switch = ({
|
||||
}) => {
|
||||
return (
|
||||
<div
|
||||
className={`flex items-center justify-between gap-4 py-3 ${disabled ? 'opacity-50 cursor-not-allowed' : 'cursor-pointer'}`}
|
||||
className={`flex items-center justify-between gap-4 px-4 py-3 ${disabled ? 'opacity-50 cursor-not-allowed' : 'cursor-pointer'}`}
|
||||
onClick={() => !disabled && onChange?.(!checked)}
|
||||
>
|
||||
<div className="flex flex-col gap-0.5 min-w-0">
|
||||
{label && (
|
||||
<span className="text-sm text-neutral-900 dark:text-white select-none">{label}</span>
|
||||
<span className="text-sm font-medium text-neutral-900 dark:text-white select-none">{label}</span>
|
||||
)}
|
||||
{description && (
|
||||
<span className="text-xs text-neutral-500 dark:text-neutral-400 select-none">{description}</span>
|
||||
@@ -27,14 +27,14 @@ const Switch = ({
|
||||
aria-checked={checked}
|
||||
disabled={disabled}
|
||||
onClick={(e) => { e.stopPropagation(); !disabled && onChange?.(!checked); }}
|
||||
className={`relative flex-shrink-0 w-11 h-6 rounded-full transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-blue-700 focus:ring-offset-2 focus:ring-offset-white dark:focus:ring-offset-neutral-900 ${
|
||||
className={`relative flex-shrink-0 w-11 h-6 rounded-full transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-blue-700 focus:ring-offset-2 focus:ring-offset-white dark:focus:ring-offset-neutral-900 border ${
|
||||
checked
|
||||
? 'bg-blue-700'
|
||||
: 'bg-neutral-300 dark:bg-neutral-600'
|
||||
? 'bg-blue-700 border-blue-800'
|
||||
: 'bg-neutral-100 dark:bg-neutral-700 border-neutral-300 dark:border-neutral-600'
|
||||
} ${disabled ? 'cursor-not-allowed' : 'cursor-pointer'}`}
|
||||
>
|
||||
<span
|
||||
className={`absolute top-0.5 left-0.5 w-5 h-5 rounded-full bg-white shadow-sm transition-transform duration-200 ${
|
||||
className={`absolute top-1 left-1 w-4 h-4 rounded-full bg-white shadow-sm transition-transform duration-200 ${
|
||||
checked ? 'translate-x-5' : 'translate-x-0'
|
||||
}`}
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user