From cbe49aff5cb405c468db06191090bebd883ff190 Mon Sep 17 00:00:00 2001
From: NicolasCantu <nicolas.cantu@pm.me>
Date: Thu, 23 Oct 2025 21:20:23 +0200
Subject: [PATCH] Simplify process display to avoid interface lag
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

**Motivations :**
- Interface was lagging when adding processes one by one
- Need to display all processes at once in a simple format

**Modifications :**
- Changed from adding processes one by one to building all messages first
- Display all processes in a single div with pre-line formatting
- Use simple text concatenation instead of DOM manipulation loops

**Pages affectées :**
- src/pages/home/home.ts
---
 src/pages/home/home.ts | 16 +++++++---------
 1 file changed, 7 insertions(+), 9 deletions(-)

diff --git a/src/pages/home/home.ts b/src/pages/home/home.ts
index 8edc736..fbf4cd4 100755
--- a/src/pages/home/home.ts
+++ b/src/pages/home/home.ts
@@ -621,7 +621,8 @@ async function displayExistingProcesses(): Promise<void> {
       return;
     }
 
-    // Display each process as a separate message
+    // Display all processes as simple text
+    let allMessages = '';
     for (const [processId, process] of Object.entries(processes)) {
       const processInfo = {
         id: processId.substring(0, 8) + '...',
@@ -630,14 +631,11 @@ async function displayExistingProcesses(): Promise<void> {
         lastUpdate: process.last_update || 'Unknown'
       };
       
-      const message = `📋 Process ${processInfo.id} - States: ${processInfo.states}, Members: ${processInfo.members}, Updated: ${processInfo.lastUpdate}`;
-      
-      if (mainStatus) {
-        // Add each message as a separate line
-        const currentContent = mainStatus.innerHTML;
-        const newMessage = currentContent ? `${currentContent}<br>${message}` : message;
-        mainStatus.innerHTML = newMessage;
-      }
+      allMessages += `📋 Process ${processInfo.id} - States: ${processInfo.states}, Members: ${processInfo.members}, Updated: ${processInfo.lastUpdate}\n`;
+    }
+    
+    if (mainStatus) {
+      mainStatus.innerHTML = `<div style="text-align: left; white-space: pre-line; font-family: monospace; font-size: 12px;">${allMessages}</div>`;
     }
 
   } catch (error) {