4nk/ihm_client
5
0
Fork 0
Code Issues 6 Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify process display to simple text messages

Browse Source 
**Motivations :**
- User wants simple text messages, one per line, not complex UI
- Simplify the process display to basic text format

**Modifications :**
- Changed from complex HTML cards to simple text messages
- Each process displayed as one line of text with basic info
- Messages joined with newlines and displayed in monospace font
- Removed complex styling and containers

**Pages affectées :**
- src/pages/home/home.ts
This commit is contained in:
NicolasCantu 2025-10-23 21:17:31 +02:00
parent a9f3ff8037
commit 60ab17bb26
1 changed files with 12 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/pages/home/home.ts
View File

@ -590,7 +590,7 @@ async function handleMainPairing(): Promise<void> {
} catch (error) {
console.error('Pairing failed:', error);
if (mainStatus) {
mainStatus.innerHTML = '<span style="color: var(--error-color)">❌ Authentication failed</span>';
}
@ -602,28 +602,27 @@ async function displayExistingProcesses(): Promise<void> {
try {
const service = await Services.getInstance();
const processes = await service.getProcesses();
const container = getCorrectDOM('login-4nk-component') as HTMLElement;
const mainStatus = container.querySelector('#main-status') as HTMLElement;
if (!mainStatus) {
console.warn('Main status element not found');
return;
}
const processCount = Object.keys(processes).length;
console.log(`📊 Found ${processCount} existing processes`);
if (processCount === 0) {
if (mainStatus) {
mainStatus.innerHTML = '<span style="color: var(--info-color)">📋 No existing processes found</span>';
}
return;
}
// Create a list of processes to display
let processesHtml = `<div style="text-align: left; max-height: 200px; overflow-y: auto; border: 1px solid #e9ecef; border-radius: 8px; padding: 10px; background: #f8f9fa;">
<h4 style="margin: 0 0 10px 0; color: var(--primary-color);">📋 Existing Processes (${processCount})</h4>`;
// Create simple text messages for each process
let messages = [];
for (const [processId, process] of Object.entries(processes)) {
const processInfo = {
@ -633,21 +632,15 @@ async function displayExistingProcesses(): Promise<void> {
lastUpdate: process.last_update || 'Unknown'
};
processesHtml += `
<div style="margin: 8px 0; padding: 8px; background: white; border-radius: 4px; border-left: 3px solid var(--primary-color);">
<strong>Process:</strong> ${processInfo.id}<br>
<small style="color: #666;">
States: ${processInfo.states} | Members: ${processInfo.members} | Updated: ${processInfo.lastUpdate}
</small>
</div>`;
messages.push(`📋 Process ${processInfo.id} - States: ${processInfo.states}, Members: ${processInfo.members}, Updated: ${processInfo.lastUpdate}`);
}
processesHtml += '</div>';
const messagesText = messages.join('\n');
if (mainStatus) {
mainStatus.innerHTML = processesHtml;
mainStatus.innerHTML = `<pre style="white-space: pre-wrap; font-family: monospace; font-size: 12px; text-align: left;">${messagesText}</pre>`;
}
} catch (error) {
console.error('❌ Error displaying processes:', error);
const container = getCorrectDOM('login-4nk-component') as HTMLElement;