get_members_from_a_process

public/style/chat.css

@@ -455,6 +455,43 @@ body {
     color: var(--primary-color);
   }
 
+  /* REQUEST MODAL */
+  .request-modal {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.5);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 1000;
+}
+
+.modal-content {
+    background: var(--background-color);
+    padding: 20px;
+    border-radius: 8px;
+    position: relative;
+    min-width: 300px;
+}
+
+.close-modal {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    border: none;
+    background: none;
+    font-size: 1.5em;
+    cursor: pointer;
+    font-weight: bold;
+}
+
+.close-modal:hover {
+    color: var(--accent-color);
+}
+
 #message-input {
     width: 100%;
     height: 50px;

src/pages/chat/chat.ts

@@ -1035,6 +1035,7 @@ class ChatElement extends HTMLElement {
                         }
 
                         li.setAttribute('data-process-id', oneProcess);
+                        //----MANAGE THE CLICK ON PROCESS ----
                         li.onclick = async (event) => {
                             event.stopPropagation();
                             console.log("CLICKED ON PROCESS:", oneProcess);
@@ -1049,6 +1050,8 @@ class ChatElement extends HTMLElement {
                             //afficher les roles dans chaque processus
                             console.log('🎯 Roles de signature:', roles);
                             await this.loadAllRolesAndMembersInSignature(roles);
+                            //----MANAGE THE CLICK ON NEW REQUEST ----
+                            await this.newRequest(oneProcess);
                         };
                         groupList.appendChild(li);
 
@@ -1136,46 +1139,112 @@ class ChatElement extends HTMLElement {
         });
     }
 
+    private async newRequest(processId: string) {
+        console.log("CLICKED ON NEW REQUEST:", processId);
+        const emoji = await addressToEmoji(processId);
+        const members = await this.getMembersFromProcess(processId);
+        console.log("Je suis les membres :", members);
+        const newRequestButton = this.shadowRoot?.querySelector('#request-document-button');
+        if (newRequestButton) {
+            newRequestButton.replaceWith(newRequestButton.cloneNode(true));
+            const freshButton = this.shadowRoot?.querySelector('#request-document-button');
+            freshButton?.addEventListener('click', () => {
+
+                const modal = document.createElement('div');
+                modal.className = 'request-modal';
+                modal.innerHTML = `
+                    <div class="modal-content">
+                        <h2>New Request for ${emoji}</h2>
+                        <button class="close-modal">&times;</button>
+                        <h2>To:</h2>
+                        <ul>
+                            <li>${members}</li>
+                        </ul>
+                        <div class="modal-body">
+                            <textarea id="message-input" placeholder="Write your message here..."></textarea>
+                            <input type="file" id="file-input" placeholder="Select a file">
+                            <input type="date" id="date-input" placeholder="Select a date">
+                            <button id="send-request-button">Send</button>
+                        </div>
+                    </div>
+                `;
+
+                this.shadowRoot?.appendChild(modal);
+
+                const closeButton = modal.querySelector('.close-modal');
+                closeButton?.addEventListener('click', () => {
+                    modal.remove();
+                });
+            });
+        }
+    }
+
+
+    //Send a set of members from a process
+    private async getMembersFromProcess(processId: string) {
+        const service = await Services.getInstance();
+        const process = await service.getProcess(processId);
+        console.log("Process récupéré:", process);
+        
+        // Récupérer les rôles directement depuis le dernier état
+        const roles = process.states[0].encrypted_pcd.roles;
+        console.log("Roles trouvés:", roles);
+        
+        if (!roles) return [];
+        type RoleData = {
+            members?: { sp_addresses?: string[] }[];
+        };
+        const uniqueMembers = new Set<string>();
+        Object.values(roles as unknown as Record<string, RoleData>).forEach((roleData: RoleData) => {
+            roleData.members?.forEach((member) => {
+                if (member.sp_addresses && member.sp_addresses[0]) {
+                    uniqueMembers.add(member.sp_addresses[0]);
+                }
+            });
+        });
+        return Array.from(uniqueMembers);
+    }
+
     private async loadAllRolesAndMembersInSignature(roles: any) {
         console.log('🎯 Roles:', roles);
         const signatureDescription = this.shadowRoot?.querySelector('.signature-description');
-                            if (signatureDescription) {
+        if (signatureDescription) {
-                                signatureDescription.innerHTML = '';
+        signatureDescription.innerHTML = '';
-                                Object.entries(roles).forEach(([roleName, roleData]: [string, any]) => {
+            Object.entries(roles).forEach(([roleName, roleData]: [string, any]) => {
-                                    const roleItem = document.createElement('li');
+                const roleItem = document.createElement('li');
-                                    roleItem.className = 'role-signature';
+                roleItem.className = 'role-signature';
                                     
-                                    const roleContainer = document.createElement('div');
+                const roleContainer = document.createElement('div');
-                                    roleContainer.className = 'role-signature-container';
+                roleContainer.className = 'role-signature-container';
 
-                                    const roleNameSpan = document.createElement('span');
+                const roleNameSpan = document.createElement('span');
-                                    roleNameSpan.className = 'role-signature-name';
+                roleNameSpan.className = 'role-signature-name';
-                                    roleNameSpan.textContent = roleName;
+                roleNameSpan.textContent = roleName;
 
-                                    const uniqueMembers = new Map<string, any>();
+                const uniqueMembers = new Map<string, any>();
-                                    roleData.members?.forEach((member: any) => {
+                roleData.members?.forEach((member: any) => {
-                                    const spAddress = member.sp_addresses?.[0];
+                const spAddress = member.sp_addresses?.[0];
-                                    if (spAddress && !uniqueMembers.has(spAddress)) {
+                if (spAddress && !uniqueMembers.has(spAddress)) {
-                                        uniqueMembers.set(spAddress, member);
+                    uniqueMembers.set(spAddress, member);
-                                    }
+                }
-                                    });
+                });
 
-                                    const filteredRoleData = {
+                const filteredRoleData = {
-                                    ...roleData,
+                ...roleData,
-                                    members: Array.from(uniqueMembers.values())
+                members: Array.from(uniqueMembers.values())
-                                    };
+                };
 
-                                    roleContainer.addEventListener('click', async (event) => {
+                roleContainer.addEventListener('click', async (event) => {
-                                        console.log("CLICKED ON ROLE:", roleName);
+                    console.log("CLICKED ON ROLE:", roleName);
-                                        event.stopPropagation();
+                    event.stopPropagation();
-                                        await this.toggleMembers(filteredRoleData, roleItem);
+                    await this.toggleMembers(filteredRoleData, roleItem);
-                                    });
+                });
                 
-                                    roleContainer.appendChild(roleNameSpan);
+                roleContainer.appendChild(roleNameSpan);
-                                    roleItem.appendChild(roleContainer);
+                roleItem.appendChild(roleContainer);
-                                    signatureDescription.appendChild(roleItem);
+                signatureDescription.appendChild(roleItem);
-                                });
+            });
-                            }
+        }
     }
 
     //fonction qui ferme la signature