host debug

modules/pi_control/assets/hosts.js

@@ -140,6 +140,8 @@
     const upd = card.querySelector('[data-update-badge]');
     const upg = card.querySelector('[data-upgrade-badge]');
     const time = card.querySelector('[data-update-time]');
+    const updDebug = card.querySelector('[data-update-debug]');
+    const upgDebug = card.querySelector('[data-upgrade-debug]');
     if (upd) {
       upd.classList.remove('badge-warn', 'badge-ok', 'badge-error');
       if (data.updates && data.updates.error) {
@@ -178,6 +180,14 @@
         }
       }
     }
+    if (updDebug) {
+      const raw = (data.updates && (data.updates.raw || data.updates.preview)) || '';
+      updDebug.textContent = raw ? `Update Debug: ${raw}` : 'Update Debug: –';
+    }
+    if (upgDebug) {
+      const raw = (data.os && data.os.raw) || '';
+      upgDebug.textContent = raw ? `Upgrade Debug: ${raw}` : 'Upgrade Debug: –';
+    }
     if (time && data.checked_at) {
       const dt = new Date(data.checked_at);
       time.textContent = isNaN(dt.getTime()) ? data.checked_at : dt.toLocaleString();

modules/pi_control/assets/pi_control.css

@@ -206,6 +206,19 @@
   border-radius: 12px;
 }
 
+.host-debug {
+  margin: 6px 0 0;
+  padding: 6px 8px;
+  background: #0b1020;
+  color: #c7d2fe;
+  border-radius: 8px;
+  font-size: 0.7rem;
+  white-space: pre-wrap;
+  word-break: break-word;
+  max-height: 120px;
+  overflow: auto;
+}
+
 .command-list {
   list-style: none;
   padding: 0;