From edbc966ff9b2a7018b587c4c8028e69be71d5bd9 Mon Sep 17 00:00:00 2001
From: Pascal <pascal@debian.pascallim>
Date: Wed, 29 Jan 2025 11:15:36 +0100
Subject: [PATCH] can show_roles_and_members

---
 public/style/chat.css  | 12 ++++++++++
 src/pages/chat/chat.ts | 50 +++++++++++++++++++++++++++++++++++++++++-
 2 files changed, 61 insertions(+), 1 deletion(-)

diff --git a/public/style/chat.css b/public/style/chat.css
index 43ffcea..1956031 100755
--- a/public/style/chat.css
+++ b/public/style/chat.css
@@ -356,6 +356,18 @@ body {
     padding-left: 4%;
 }
 
+.signature-content {
+    padding: 10px;
+    background-color: var(--secondary-color);
+    color: var(--primary-color);
+    height: 100%;
+    border-radius: 10px;
+    margin: 1%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
 #close-signature {
     cursor: pointer;
     align-items: center;
diff --git a/src/pages/chat/chat.ts b/src/pages/chat/chat.ts
index 90d051f..7ed5628 100755
--- a/src/pages/chat/chat.ts
+++ b/src/pages/chat/chat.ts
@@ -1013,6 +1013,7 @@ class ChatElement extends HTMLElement {
                         const li = document.createElement('li');
                         li.className = 'group-list-item';
                         const oneProcess = process.states[0].commited_in;
+                        const roles = process.states[0].encrypted_pcd.roles;
 
                         // Si le processus est dans notre Set, ajouter la classe my-process
                         if (this.userProcessSet && this.userProcessSet.has(oneProcess)) {
@@ -1041,6 +1042,10 @@ class ChatElement extends HTMLElement {
                                 signatureHeader.textContent = `Signature of ${emoji}`;
                             }
                             this.openSignature();
+
+                            //afficher les roles dans chaque processus
+                            console.log('🎯 Roles de signature:', roles);
+                            await this.loadAllRolesAndMembersInSignature(roles);
                         };
                         groupList.appendChild(li);
 
@@ -1063,7 +1068,7 @@ class ChatElement extends HTMLElement {
                         li.appendChild(container);
 
                         // afficher les roles dans chaque processus
-                        const roles = process.states[0].encrypted_pcd.roles;
+                        
                         //console.log('🎯 Roles:', roles);
                         const roleList = document.createElement('ul');
                         roleList.className = 'role-list';
@@ -1128,6 +1133,49 @@ class ChatElement extends HTMLElement {
         });
     }
 
+    private async loadAllRolesAndMembersInSignature(roles: any) {
+        console.log('🎯 Roles:', roles);
+        const signatureDescription = this.shadowRoot?.querySelector('.signature-description');
+                            if (signatureDescription) {
+                                signatureDescription.innerHTML = '';
+                                Object.entries(roles).forEach(([roleName, roleData]: [string, any]) => {
+                                    const roleItem = document.createElement('li');
+                                    roleItem.className = 'role-signature';
+                                    
+                                    const roleContainer = document.createElement('div');
+                                    roleContainer.className = 'role-signature-container';
+                    
+                                    const roleNameSpan = document.createElement('span');
+                                    roleNameSpan.className = 'role-signature-name';
+                                    roleNameSpan.textContent = roleName;
+                    
+                                    // Filtrer les membres dupliqués ici, avant de les passer à toggleMembers
+                                    const uniqueMembers = new Map<string, any>();
+                                    roleData.members?.forEach((member: any) => {
+                                    const spAddress = member.sp_addresses?.[0];
+                                    if (spAddress && !uniqueMembers.has(spAddress)) {
+                                        uniqueMembers.set(spAddress, member);
+                                    }
+                                    });
+                    
+                                    const filteredRoleData = {
+                                    ...roleData,
+                                    members: Array.from(uniqueMembers.values())
+                                    };
+        
+                                    roleContainer.addEventListener('click', async (event) => {
+                                        console.log("CLICKED ON ROLE:", roleName);
+                                        event.stopPropagation();
+                                        await this.toggleMembers(filteredRoleData, roleItem);
+                                    });
+                                    
+                                    roleContainer.appendChild(roleNameSpan);
+                                    roleItem.appendChild(roleContainer);
+                                    signatureDescription.appendChild(roleItem);
+                                });
+                            }
+    }
+
     //fonction qui ferme la signature
     private closeSignature() {
         const closeSignature = this.shadowRoot?.querySelector('#close-signature');