From ecd3980f616ebd486d3270f7abe41bee3242737f Mon Sep 17 00:00:00 2001
From: Lucas Lara <llara@localhost>
Date: Fri, 7 Feb 2025 14:03:18 +0100
Subject: [PATCH] refs #1475. Update delete function. Add actions menu to cards
 view.

---
 .../components/groups/groups.component.css    |  3 ++-
 .../components/groups/groups.component.html   | 26 +++++++++++++++----
 .../app/components/groups/groups.component.ts | 21 ++++++++++-----
 3 files changed, 37 insertions(+), 13 deletions(-)

diff --git a/ogWebconsole/src/app/components/groups/groups.component.css b/ogWebconsole/src/app/components/groups/groups.component.css
index 2556853..d2a5b90 100644
--- a/ogWebconsole/src/app/components/groups/groups.component.css
+++ b/ogWebconsole/src/app/components/groups/groups.component.css
@@ -514,6 +514,7 @@ button[mat-raised-button] {
   font-size: x-large;
   display: block;
   padding: 1rem 1rem 1rem 13px;
+  margin-left: 0.6rem;
 }
 
 .no-clients-info {
@@ -521,5 +522,5 @@ button[mat-raised-button] {
   align-items: center;
   gap: 10px;
   margin-top: 1.5rem;
-  margin-left: 16px;
+  margin-left: 1.6rem;
 }
diff --git a/ogWebconsole/src/app/components/groups/groups.component.html b/ogWebconsole/src/app/components/groups/groups.component.html
index 7abe12a..0233678 100644
--- a/ogWebconsole/src/app/components/groups/groups.component.html
+++ b/ogWebconsole/src/app/components/groups/groups.component.html
@@ -219,15 +219,31 @@
                       mat-icon-button color="primary">
                       <mat-spinner diameter="24"></mat-spinner>
                     </button>
-
-                    <button mat-icon-button color="primary" (click)="onShowClientDetail($event, client)">
-                      <mat-icon>visibility</mat-icon>
-                    </button>
+                 
                     <app-execute-command
                       [clientData]="[client]"
                       [buttonType]="'icon'"
                       [icon]="'terminal'"
                     ></app-execute-command>
+
+                    <button mat-icon-button [matMenuTriggerFor]="clientMenu" color="primary">
+                      <mat-icon>more_vert</mat-icon>
+                    </button>
+                
+                    <mat-menu #clientMenu="matMenu">
+                      <button mat-menu-item (click)="onEditClick($event, client.type, client.uuid)">
+                        <mat-icon>edit</mat-icon>
+                        <span>{{ 'edit' | translate }}</span>
+                      </button>
+                      <button mat-menu-item (click)="onShowClientDetail($event, client)">
+                        <mat-icon>visibility</mat-icon>
+                        <span>{{ 'viewDetails' | translate }}</span>
+                      </button>
+                      <button mat-menu-item (click)="onDeleteClick($event, client)">
+                        <mat-icon>delete</mat-icon>
+                        <span>{{ 'delete' | translate }}</span>
+                      </button>
+                    </mat-menu>
                   </div>
                 </div>
               </div>
@@ -309,7 +325,7 @@
               <ng-container matColumnDef="actions">
                 <th mat-header-cell *matHeaderCellDef mat-sort-header> {{ 'actions' | translate }} </th>
                 <td mat-cell *matCellDef="let client">
-                  <button mat-icon-button [matMenuTriggerFor]="clientMenu">
+                  <button mat-icon-button [matMenuTriggerFor]="clientMenu" color="primary">
                     <mat-icon>more_vert</mat-icon>
                   </button>
                   <app-execute-command [clientData]="[client]" [buttonType]="'icon'"
diff --git a/ogWebconsole/src/app/components/groups/groups.component.ts b/ogWebconsole/src/app/components/groups/groups.component.ts
index 5476c85..746192a 100644
--- a/ogWebconsole/src/app/components/groups/groups.component.ts
+++ b/ogWebconsole/src/app/components/groups/groups.component.ts
@@ -399,20 +399,27 @@ export class GroupsComponent implements OnInit, OnDestroy {
   }
 
 
-  onDeleteClick(event: MouseEvent, node: TreeNode | null): void {
+  onDeleteClick(event: MouseEvent, entity: TreeNode | Client | null): void {
+    console.log('Entity to delete:', entity);
     event.stopPropagation();
-    const uuid = node ? this.extractUuid(node['@id']) : null;
+    if (!entity) return;
+  
+    const uuid = entity['@id'] ? this.extractUuid(entity['@id']) : null;
+    const type = entity.hasOwnProperty('mac') ? NodeType.Client : NodeType.OrganizationalUnit;
+  
+    console.log('UUID:', uuid);
+    console.log('Type:', type);
+  
     if (!uuid) return;
-
-    if (!node) return;
+  
     const dialogRef = this.dialog.open(DeleteModalComponent, {
       width: '400px',
-      data: { name: node.name },
+      data: { name: entity.name },
     });
-
+  
     dialogRef.afterClosed().subscribe((result) => {
       if (result === true) {
-        this.deleteEntityorClient(uuid, node?.type);
+        this.deleteEntityorClient(uuid, type);
       }
     });
   }