fix

client/src/components/employees/UpdateEmployee.js

@@ -121,6 +121,18 @@ const UpdateEmployee = () => {
     });
   };
 
+  const isPermissionGroupFullySelected = (permissionItems = []) =>
+    permissionItems.length > 0 && permissionItems.every((permissionKey) => permissions.includes(permissionKey));
+
+  const togglePermissionGroup = (permissionItems = [], checked) => {
+    if (isSuperPermissionLocked) return;
+    if (checked) {
+      setPermissions((prevPermissions) => Array.from(new Set([...prevPermissions, ...permissionItems])));
+      return;
+    }
+    setPermissions((prevPermissions) => prevPermissions.filter((permission) => !permissionItems.includes(permission)));
+  };
+
   const triggerShowDeleteModal = () => {
     setShowDeleteModal(true);
   }
@@ -328,7 +340,19 @@ const UpdateEmployee = () => {
           )}
           {Object.entries(EMPLOYEE_PERMISSION_GROUPS).map(([groupName, permissionItems]) => (
             <div key={groupName} className="mb-3">
-              <div className="text-primary mb-1">{groupName}</div>
+              <div className="d-flex align-items-center justify-content-between mb-1" style={{ gap: '16px' }}>
+                <div className="text-primary">{groupName}</div>
+                <label>
+                  <input
+                    type="checkbox"
+                    className="me-2"
+                    checked={isSuperPermissionLocked || isPermissionGroupFullySelected(permissionItems)}
+                    onChange={(e) => togglePermissionGroup(permissionItems, e.currentTarget.checked)}
+                    disabled={isSuperPermissionLocked}
+                  />
+                  Select All
+                </label>
+              </div>
               <div style={{ display: 'flex', flexWrap: 'wrap', gap: '10px 18px' }}>
                 {permissionItems.map((permissionKey) => (
                   <label key={permissionKey} style={{ minWidth: '280px' }}>