dolibarr user

components/groups/groups-table.tsx

@@ -352,7 +352,15 @@ export function GroupsTable({ userRole = [] }: GroupsTableProps) {
           onChange={(e) => setSearchTerm(e.target.value)}
           className="max-w-xs bg-white text-gray-900 border-gray-300"
         />
-        <Dialog open={newGroupDialog} onOpenChange={setNewGroupDialog}>
+        <Dialog open={newGroupDialog} onOpenChange={(open) => {
+          setNewGroupDialog(open);
+          if (!open) {
+            // Reset state when dialog closes
+            setTimeout(() => {
+              setNewGroupName("");
+            }, 100);
+          }
+        }}>
           <DialogTrigger asChild>
             <Button className="bg-blue-600 hover:bg-blue-700 text-white">
               <Plus className="mr-2 h-4 w-4" /> Ajouter un groupe
@@ -447,7 +455,19 @@ export function GroupsTable({ userRole = [] }: GroupsTableProps) {
         </TableBody>
       </Table>
 
-      <Dialog open={modifyGroupDialog} onOpenChange={setModifyGroupDialog}>
+      <Dialog 
+        open={modifyGroupDialog} 
+        onOpenChange={(open) => {
+          setModifyGroupDialog(open);
+          if (!open) {
+            // Reset state when dialog closes
+            setTimeout(() => {
+              setSelectedGroup(null);
+              setModifiedGroupName("");
+            }, 100);
+          }
+        }}
+      >
         <DialogContent className="bg-white text-black border border-gray-300">
           <DialogHeader>
             <DialogTitle className="text-gray-900">Modifier le groupe</DialogTitle>
@@ -460,6 +480,7 @@ export function GroupsTable({ userRole = [] }: GroupsTableProps) {
                 value={modifiedGroupName}
                 onChange={(e) => setModifiedGroupName(e.target.value)}
                 className="bg-white text-gray-900 border-gray-300"
+                autoFocus
               />
             </div>
             <Button 
@@ -472,7 +493,20 @@ export function GroupsTable({ userRole = [] }: GroupsTableProps) {
         </DialogContent>
       </Dialog>
 
-      <Dialog open={manageMembersDialog} onOpenChange={setManageMembersDialog}>
+      <Dialog 
+        open={manageMembersDialog} 
+        onOpenChange={(open) => {
+          setManageMembersDialog(open);
+          if (!open) {
+            // Reset state when dialog closes
+            setTimeout(() => {
+              setSelectedGroup(null);
+              setGroupMembers([]);
+              setAvailableUsers([]);
+            }, 100);
+          }
+        }}
+      >
         <DialogContent className="sm:max-w-[600px] max-h-[90vh] overflow-y-auto bg-white text-black border border-gray-300">
           <DialogHeader>
             <DialogTitle className="text-gray-900">

components/users/users-table.tsx

@@ -416,7 +416,22 @@ export function UsersTable({ userRole = [] }: UsersTableProps) {
           onChange={(e) => setSearchTerm(e.target.value)}
           className="max-w-sm bg-white text-gray-900 border-gray-300"
         />
-        <Dialog open={newUserDialog} onOpenChange={setNewUserDialog}>
+        <Dialog open={newUserDialog} onOpenChange={(open) => {
+          setNewUserDialog(open);
+          if (!open) {
+            setTimeout(() => {
+              setFormData({
+                username: "",
+                lastName: "",
+                firstName: "",
+                email: "",
+                password: "",
+                roles: [],
+                enabled: true,
+              });
+            }, 100);
+          }
+        }}>
           <DialogTrigger asChild>
             <Button className="bg-blue-600 hover:bg-blue-700 text-white">
               Ajouter un utilisateur
@@ -561,44 +576,28 @@ export function UsersTable({ userRole = [] }: UsersTableProps) {
                   <DropdownMenuContent align="end" className="bg-white border border-gray-300">
                     <DropdownMenuLabel className="text-gray-900">Actions</DropdownMenuLabel>
                     <DropdownMenuItem 
-                      onClick={(e) => {
+                      onClick={() => handleEdit(user.id)}
-                        e.preventDefault();
-                        e.stopPropagation();
-                        handleEdit(user.id);
-                      }}
                       className="text-gray-900 hover:bg-gray-100"
                     >
                       <Edit className="mr-2 h-4 w-4" />
                       Modifier
                     </DropdownMenuItem>
                     <DropdownMenuItem 
-                      onClick={(e) => {
+                      onClick={() => handleManageRoles(user.id)}
-                        e.preventDefault();
-                        e.stopPropagation();
-                        handleManageRoles(user.id);
-                      }}
                       className="text-gray-900 hover:bg-gray-100"
                     >
                       <UserPlus className="mr-2 h-4 w-4" />
                       Gérer les rôles
                     </DropdownMenuItem>
                     <DropdownMenuItem 
-                      onClick={(e) => {
+                      onClick={() => handleChangePassword(user.id)}
-                        e.preventDefault();
-                        e.stopPropagation();
-                        handleChangePassword(user.id);
-                      }}
                       className="text-gray-900 hover:bg-gray-100"
                     >
                       <Key className="mr-2 h-4 w-4" />
                       Changer le mot de passe
                     </DropdownMenuItem>
                     <DropdownMenuItem 
-                      onClick={(e) => {
+                      onClick={() => handleToggleUserStatus(user.id, user.enabled)}
-                        e.preventDefault();
-                        e.stopPropagation();
-                        handleToggleUserStatus(user.id, user.enabled);
-                      }}
                       className="text-gray-900 hover:bg-gray-100"
                     >
                       {user.enabled ? (
@@ -616,11 +615,7 @@ export function UsersTable({ userRole = [] }: UsersTableProps) {
                     <DropdownMenuSeparator />
                     <DropdownMenuItem
                       className="text-red-600 hover:bg-red-50 hover:text-red-700"
-                      onClick={(e) => {
+                      onClick={() => handleDelete(user.id, user.email)}
-                        e.preventDefault();
-                        e.stopPropagation();
-                        handleDelete(user.id, user.email);
-                      }}
                     >
                       <Trash className="mr-2 h-4 w-4" />
                       Supprimer
@@ -635,16 +630,18 @@ export function UsersTable({ userRole = [] }: UsersTableProps) {
 
       <Dialog open={editUserDialog} onOpenChange={(open) => {
         if (!open) {
-          setFormData({
+          setTimeout(() => {
-            username: "",
+            setFormData({
-            lastName: "",
+              username: "",
-            firstName: "",
+              lastName: "",
-            email: "",
+              firstName: "",
-            password: "",
+              email: "",
-            roles: [],
+              password: "",
-            enabled: true,
+              roles: [],
-          });
+              enabled: true,
-          setSelectedUser(null);
+            });
+            setSelectedUser(null);
+          }, 100);
         }
         setEditUserDialog(open);
       }}>
@@ -660,6 +657,7 @@ export function UsersTable({ userRole = [] }: UsersTableProps) {
                 value={formData.firstName}
                 onChange={(e) => setFormData(prev => ({ ...prev, firstName: e.target.value }))}
                 className="bg-white text-gray-900 border-gray-300"
+                autoFocus
               />
             </div>
             <div className="space-y-2">
@@ -712,8 +710,10 @@ export function UsersTable({ userRole = [] }: UsersTableProps) {
 
       <Dialog open={manageRolesDialog} onOpenChange={(open) => {
         if (!open) {
-          setFormData(prev => ({ ...prev, roles: [] }));
+          setTimeout(() => {
-          setSelectedUser(null);
+            setFormData(prev => ({ ...prev, roles: [] }));
+            setSelectedUser(null);
+          }, 100);
         }
         setManageRolesDialog(open);
       }}>