From 0edd5841d69689f129d19a0e93d9b020558e113e Mon Sep 17 00:00:00 2001
From: John Haverlack <code@appliedbitlogistics.io>
Date: Sun, 8 Feb 2026 10:54:36 -0900
Subject: [PATCH] Refactoing Worker Dashboard

---
 sdl-mgr/html/js/dash.js              | 66 +++++++++++++++++++++-------
 sdl-wkr/app/modules/sdl-wkr/index.js |  3 +-
 2 files changed, 51 insertions(+), 18 deletions(-)

diff --git a/sdl-mgr/html/js/dash.js b/sdl-mgr/html/js/dash.js
index c883858..a73b87f 100644
--- a/sdl-mgr/html/js/dash.js
+++ b/sdl-mgr/html/js/dash.js
@@ -502,27 +502,35 @@ function renderWorkersTable(msg) {
   html += '<tr>';
   html += '<th>Hostname</th>';
   html += '<th>Status</th>';
-  html += '<th>Hardware</th>';
   html += '<th><i class="fa fa-microchip"></i> CPU</th>';
   html += '<th><i class="fa fa-memory"></i> RAM</th>';
   html += '<th><i class="fa fa-dice-d20"></i> GPU</th>';
-  html += '<th>Uptime</th>';
-  html += '<th>Last Seen</th>';
   html += '</tr>';
   html += '</thead>';
   html += '<tbody>';
 
+  const nowSec = Math.floor(Date.now() / 1000);
+  const staleThresholdSec = 60;
+
   for (const [sdl_id, worker] of Object.entries(workers)) {
-    const status = worker.status === 'active'
+    const ageSec = nowSec - worker.last_seen_utime;
+    const isActive = ageSec <= staleThresholdSec;
+    
+    // Status badge
+    const statusBadge = isActive
       ? '<span class="badge bg-success">Active</span>'
-      : '<span class="badge bg-secondary">Inactive</span>';
+      : '<span class="badge bg-danger">Inactive</span>';  // ✅ Red instead of grey
 
     // Hardware info
     const hwType = worker.hardware?.type || 'unknown';
     const hwIcon = hwType === 'hw' ? '🖥️' : hwType === 'vm' ? '💠' : '❓';
     const hwManuf = worker.hardware?.manufacturer || 'Unknown';
     const hwModel = worker.hardware?.model || 'Unknown';
-    const hardware = `<span title="${hwManuf} - ${hwModel}">${hwIcon} ${hwType === 'vm' ? hwModel : hwManuf}</span>`;
+    
+    // ✅ Full hardware display with model
+    const hardwareDisplay = hwType === 'vm' 
+      ? `${hwIcon} ${hwModel}` 
+      : `${hwIcon} ${hwManuf} ${hwModel}`;
 
     // CPU
     const cpuAvail = worker.resources?.cpus?.available || 0;
@@ -536,7 +544,6 @@ function renderWorkersTable(msg) {
     
     const memAvailGB = Math.round(memAvail / (1024 * 1024 * 1024));
     const memTotalGB = Math.round(memTotal / (1024 * 1024 * 1024));
-    const memUsedGB = Math.round(memUsed / (1024 * 1024 * 1024));
     const memPercent = worker.usage?.memory?.percent_used || 0;
 
     // GPU
@@ -548,32 +555,57 @@ function renderWorkersTable(msg) {
     const gpuMemGB = Math.round(gpuMemMB / 1024);
 
     // Uptime
-    const uptime = worker.uptime?.proc_dhms || 'N/A';
+    const procUptime = worker.uptime?.proc_dhms || 'N/A';
+    const sysUptime = worker.uptime?.sys_dhms || 'N/A';
     
-    // Last seen
-    const lastSeen = worker.last_seen 
-      ? new Date(worker.last_seen).toLocaleString()
-      : 'N/A';
+    // ✅ Last seen age
+    const days = Math.floor(ageSec / 86400);
+    const hours = Math.floor((ageSec % 86400) / 3600);
+    const minutes = Math.floor((ageSec % 3600) / 60);
+    const seconds = Math.floor(ageSec % 60);
+    
+    let lastSeenAge = '';
+    if (days > 0) lastSeenAge += `${days}d `;
+    if (hours > 0 || days > 0) lastSeenAge += `${hours}h `;
+    if (minutes > 0 || hours > 0 || days > 0) lastSeenAge += `${minutes}m `;
+    lastSeenAge += `${seconds}s ago`;
 
     html += '<tr>';
-    html += `<td><strong>${worker.hostname}</strong><br><small class="text-muted" style="font-size:0.7em">${worker.sdl_id.substring(0, 8)}...</small></td>`;
-    html += `<td>${status}</td>`;
-    html += `<td><small>${hardware}</small></td>`;
+    
+    // ✅ Hostname column with hardware underneath
+    html += `<td>
+      <strong>${worker.hostname}</strong><br>
+      <small class="text-muted" style="font-size:0.7em">${worker.sdl_id}</small><br>
+      <small class="text-muted" style="font-size:0.8em">${hardwareDisplay}</small>
+    </td>`;
+    
+    // ✅ Status column with uptime and last seen
+    html += `<td>
+      ${statusBadge}<br>
+      <small class="text-muted">SDL: ${procUptime}</small><br>
+      <small class="text-muted">OS: ${sysUptime}</small><br>
+      <small class="text-muted">${lastSeenAge}</small>
+    </td>`;
+    
+    // CPU
     html += `<td>
       <span class="dash-val">${cpuAvail}</span> / ${cpuTotal}
       ${cpuUsed > 0 ? `<br><small class="text-muted">${cpuUsed}% load</small>` : ''}
     </td>`;
+    
+    // Memory
     html += `<td>
       <span class="dash-val">${memAvailGB}</span> / ${memTotalGB} GB
       ${memPercent > 0 ? `<br><small class="text-muted">${memPercent}% used</small>` : ''}
     </td>`;
+    
+    // GPU
     html += `<td>
       <span class="dash-val">${gpuAvail}</span> / ${gpuTotal}
       ${gpuMemGB > 0 ? `<br><small class="text-muted">(${gpuMemGB} GB)</small>` : ''}
       ${gpuUsed > 0 ? `<br><small class="text-muted">${gpuUsed}% load</small>` : ''}
     </td>`;
-    html += `<td><small>${uptime}</small></td>`;
-    html += `<td><small>${lastSeen}</small></td>`;
+    
     html += '</tr>';
   }
 
diff --git a/sdl-wkr/app/modules/sdl-wkr/index.js b/sdl-wkr/app/modules/sdl-wkr/index.js
index e64af4f..79d684c 100644
--- a/sdl-wkr/app/modules/sdl-wkr/index.js
+++ b/sdl-wkr/app/modules/sdl-wkr/index.js
@@ -525,11 +525,12 @@ function getSystemHardware() {
   try {
     const piModel = fs.readFileSync('/proc/device-tree/model', 'utf8')
       .replace(/\0/g, '')
+      .replace(/Raspberry Pi/, '')
       .trim();
     
     if (piModel) {
       hardware.type = 'hw';  // ✅ Changed from 'physical'
-      hardware.manufacturer = 'Raspberry Pi Foundation';
+      hardware.manufacturer = 'Raspberry Pi';
       hardware.model = piModel;
       return hardware;
     }