Simple Managment webapp [LLM]

webapp/src/app/features/keys/key-list/key-list.component.html

@@ -168,10 +168,11 @@
               <label
                 nz-checkbox
                 [nzChecked]="isPermissionChecked(opt.value)"
+                [nzDisabled]="opt.value !== 'A' && isPermissionChecked('A')"
                 (nzCheckedChange)="onPermissionChange(opt.value, $event)"
               >
                 <nz-tag [nzColor]="getPermissionColor(opt.value)">{{ opt.value }}</nz-tag>
-                {{ opt.label }}
+                <span class="perm-label">{{ opt.label }}</span>
                 <span class="perm-desc">- {{ opt.description }}</span>
               </label>
             }

webapp/src/app/features/keys/key-list/key-list.component.scss

@@ -60,7 +60,17 @@
   label {
     display: flex;
     align-items: center;
-    gap: 4px;
+    margin-left: 0;
+  }
+
+  nz-tag {
+    width: 32px;
+    text-align: center;
+    margin-right: 8px;
+  }
+
+  .perm-label {
+    min-width: 100px;
   }
 
   .perm-desc {

webapp/src/app/features/keys/key-list/key-list.component.ts

@@ -184,7 +184,10 @@ export class KeyListComponent implements OnInit {
 
   onPermissionChange(perm: TokenPermission, checked: boolean): void {
     if (checked) {
-      if (!this.newKeyPermissions.includes(perm)) {
+      if (perm === 'A') {
+        // Admin selected - clear other permissions
+        this.newKeyPermissions = ['A'];
+      } else if (!this.newKeyPermissions.includes(perm)) {
         this.newKeyPermissions = [...this.newKeyPermissions, perm];
       }
     } else {