bugfix(containers-dashboard): pod blijft in container overzicht staan na stoppen

webui/html/index.html

@@ -626,6 +626,9 @@
       const res = await api(`/pods/actions/${encodeURIComponent(action)}/${encodeURIComponent(name)}`, 'POST');
       showModal(`Pod ${action}: ${name}`, JSON.stringify(res, null, 2));
       await fetchPods();
+      if (currentTab === 'containers') {
+        await fetchContainers();
+      }
     } catch (e) {
       showModal(`Pod ${action} fout`, e.stack || e.message);
     }
@@ -681,7 +684,7 @@
     `;
   }
 
-  function renderContainersGrouped(list, tbody) {
+  function renderContainersGrouped(list, tbody, podStatus) {
     const groups = new Map();
     for (const c of (list || [])) {
       const k = _podKey(c);
@@ -689,6 +692,10 @@
       groups.get(k).push(c);
     }
 
+    for (const podName of Object.keys(podStatus || {})) {
+      if (!groups.has(podName)) groups.set(podName, []);
+    }    
+
     const keys = Array.from(groups.keys()).sort((a, b) => {
       if (a === '(geen pod)' && b !== '(geen pod)') return 1;
       if (b === '(geen pod)' && a !== '(geen pod)') return -1;
@@ -713,22 +720,24 @@
       const isRealPod = (pod !== '(geen pod)');
       const total = items.length;
 
-      const running = items.filter(x => {
+      let cls = 'muted';
-        const s = (x.Status || x.State || '').toLowerCase();
+      let label = '-';
-        return s === 'running';
-      }).length;
 
-      let cls = 'warn';                 // default
+      if (total > 0) {
-      let label = `${running}/${total}`;
+        const running = items.filter(x => {
+          const s = (x.Status || x.State || '').toLowerCase();
+          return s === 'running';
+        }).length;
 
-      if (total === 0) {                // edge case
+        label = `${running}/${total}`;
-        cls = 'muted';
+        if (running === total) cls = 'ok';
-      } else if (running === total) {
+        else if (running === 0) cls = 'bad';
-        cls = 'ok';                     // groen
+        else cls = 'warn';
-      } else if (running === 0) {
-        cls = 'bad';                    // rood
       } else {
-        cls = 'warn';                   // oranje
+        const ps = String((podStatus && podStatus[pod]) || '').toLowerCase();
+        if (ps === 'active') { cls = 'ok'; label = 'active'; }
+        else if (ps === 'inactive') { cls = 'bad'; label = 'inactive'; }
+        else { cls = 'muted'; label = ps || 'unknown'; }
       }
 
       html += `
@@ -796,12 +805,25 @@
   }
 
   async function fetchContainers() {
-    const containers = await api('/containers-dashboard', 'GET');
-    const list = Array.isArray(containers) ? containers : (containers?.containers || []);
-    document.getElementById('countContainers').textContent = list.length;
 
-    const tbody = document.getElementById('containersTbody');
+  const [containers, pods] = await Promise.all([
-    renderContainersGrouped(list, tbody);
+    api('/containers-dashboard', 'GET'),
+    api('/pods-dashboard', 'GET')
+  ]);
+
+  const list = Array.isArray(containers) ? containers : (containers?.containers || []);
+  document.getElementById('countContainers').textContent = list.length;
+
+  const podsList = Array.isArray(pods) ? pods : [];
+  const podStatus = {};
+  for (const p of podsList) {
+    const n = p?.Name || p?.name;
+    if (!n) continue;
+    podStatus[n] = (p?.Status || p?.status || '').toLowerCase(); // "active"/"inactive"/...
+  }
+
+  const tbody = document.getElementById('containersTbody');
+  renderContainersGrouped(list, tbody, podStatus);
   }
 
   let containersStatsES = null;