From 37bdb3dad38268f5485f1e7770a5bc680e7a86de Mon Sep 17 00:00:00 2001
From: NicolasCantu <nicolas.cantu@pm.me>
Date: Sun, 27 Apr 2025 16:42:01 +0200
Subject: [PATCH] Add showConfirmationModal

---
 src/services/modal.service.ts | 75 ++++++++++++++++++++++-------------
 1 file changed, 47 insertions(+), 28 deletions(-)

diff --git a/src/services/modal.service.ts b/src/services/modal.service.ts
index 229cdec..37f9d05 100755
--- a/src/services/modal.service.ts
+++ b/src/services/modal.service.ts
@@ -171,37 +171,56 @@ export default class ModalService {
     if (this.modal) this.modal.style.display = 'none';
   }
 
-  // async confirmPairing() {
-  //   const service = await Services.getInstance();
-  //   if (this.modal) this.modal.style.display = 'none';
+  async showConfirmationModal(options: ConfirmationModalOptions): Promise<boolean> {
+    // Create modal element
+    const modalElement = document.createElement('div');
+    modalElement.id = 'confirmation-modal';
+    modalElement.innerHTML = `
+      <div class="modal-overlay">
+        <div class="modal-content">
+          <h2>${options.title}</h2>
+          <div class="modal-body">
+            ${options.content}
+          </div>
+          <div class="modal-footer">
+            <button id="cancel-button" class="btn btn-secondary">${options.cancelText || 'Annuler'}</button>
+            <button id="confirm-button" class="btn btn-primary">${options.confirmText || 'Confirmer'}</button>
+          </div>
+        </div>
+      </div>
+    `;
 
-  //   // We send the prd update
-  //   if (this.stateId && this.processId) {
-  //     try {
-  //       const createPrdUpdateReturn = service.createPrdUpdate(this.processId, this.stateId);
-  //       await service.handleApiReturn(createPrdUpdateReturn);
-  //     } catch (e) {
-  //       throw e;
-  //     }
-  //   } else {
-  //     throw new Error('No currentPcdCommitment');
-  //   }
+    // Add modal to document
+    document.body.appendChild(modalElement);
 
-  //   try {
-  //     const approveChangeReturn = await service.approveChange(this.processId!, this.stateId!);
-  //     await service.handleApiReturn(approveChangeReturn);
+    // Return promise that resolves with user choice
+    return new Promise((resolve) => {
+      const confirmButton = modalElement.querySelector('#confirm-button');
+      const cancelButton = modalElement.querySelector('#cancel-button');
+      const modalOverlay = modalElement.querySelector('.modal-overlay');
 
-  //     service.pairDevice(this.paired_addresses, this.processId);
-  //     this.paired_addresses = [];
-  //     this.processId = null;
-  //     this.stateId = null;
-  //     const newDevice = service.dumpDeviceFromMemory();
-  //     console.log(newDevice);
-  //     await service.saveDeviceInDatabase(newDevice);
-  //   } catch (e) {
-  //     throw e;
-  //   }
-  // }
+      const cleanup = () => {
+        modalElement.remove();
+      };
+
+      confirmButton?.addEventListener('click', () => {
+        cleanup();
+        resolve(true);
+      });
+
+      cancelButton?.addEventListener('click', () => {
+        cleanup();
+        resolve(false);
+      });
+
+      modalOverlay?.addEventListener('click', (e) => {
+        if (e.target === modalOverlay) {
+          cleanup();
+          resolve(false);
+        }
+      });
+    });
+  }
 
   async closeConfirmationModal() {
     const service = await Services.getInstance();