PyObservability 1.3.0__py3-none-any.whl → 1.4.1__py3-none-any.whl

pyobservability/config/settings.py

@@ -51,6 +51,7 @@ def detailed_log_config(filename: str | None = None, debug: bool = False) -> Dic
             "uvicorn": {"handlers": ["default"], "level": level},
             "uvicorn.error": {"handlers": ["default"], "level": level, "propagate": False},
             "uvicorn.access": {"handlers": ["default"], "level": level, "propagate": False},
+            "uvicorn.default": {"handlers": ["default"], "level": level, "propagate": False},
         },
         "root": {"handlers": ["default"], "level": level},
     }

pyobservability/main.py

@@ -2,7 +2,7 @@ import logging
 import pathlib
 import warnings
 from datetime import datetime
-from typing import Dict
+from typing import Any, Dict
 
 import uiauth
 import uvicorn
@@ -39,7 +39,7 @@ async def index(request: Request):
         TemplateResponse:
         Rendered HTML template with targets and version.
     """
-    args = dict(request=request, targets=settings.env.targets, version=__version__)
+    args: Dict[str, Any] = dict(request=request, targets=settings.env.targets, version=__version__)
     if settings.env.username and settings.env.password:
         args["logout"] = uiauth.enums.APIEndpoints.fastapi_logout.value
     return templates.TemplateResponse("index.html", args)
@@ -49,7 +49,7 @@ async def health() -> Dict[str, str]:
     """Health check endpoint.
 
     Returns:
-        dict:
+        Dict[str, str]:
         Health status.
     """
     return {"status": "ok"}

pyobservability/monitor.py

@@ -174,7 +174,7 @@ class Monitor:
                         "ts": asyncio.get_event_loop().time(),
                         "data": [
                             {
-                                "name": self.base_url,
+                                "name": self.name,
                                 "base_url": self.base_url,
                                 "metrics": payload,
                             }
@@ -188,13 +188,12 @@ class Monitor:
                             _ = q.get_nowait()
                             q.put_nowait(result)
             except Exception as err:
-                LOGGER.debug("Stream error for %s: %s", self.base_url, err)
                 if errors.get(self.base_url):
                     if errors[self.base_url] < 10:
+                        LOGGER.debug("Stream error for %s: %s", self.base_url, err)
                         errors[self.base_url] += 1
                     else:
-                        LOGGER.error(err.with_traceback())
-                        LOGGER.error("%s exceeded error threshold.", self.base_url)
+                        LOGGER.error("Stream error for %s: %s", self.base_url, err)
 
                         # notify subscribers before stopping
                         error_msg = {
@@ -209,7 +208,7 @@ class Monitor:
                             except asyncio.QueueFull as warn:
                                 LOGGER.warning(warn)
                                 _ = q.get_nowait()
-                                q.put_nowait(result)
+                                q.put_nowait(error_msg)
                         await self.stop()
                         return
                 else:

pyobservability/static/app.js

@@ -5,7 +5,7 @@
     // ------------------------------------------------------------
     const MAX_POINTS = 60;
     const targets = window.MONITOR_TARGETS || [];
-    const DEFAULT_PAGE_SIZE = 15;
+    const DEFAULT_PAGE_SIZE = 10;
     const panelSpinners = {};
 
     // ------------------------------------------------------------
@@ -117,11 +117,26 @@
             const chunk = rows.slice(start, start + state.pageSize);
 
             info.textContent =
-                `Showing ${start + 1} to ${Math.min(start + state.pageSize, rows.length)} of ${rows.length} entries`;
+                `Showing ${rows.length ? start + 1 : 0} to ${rows.length ? Math.min(start + state.pageSize, rows.length) : 0} of ${rows.length} entries`;
 
             bodyEl.innerHTML = "";
             chunk.forEach(r => bodyEl.insertAdjacentHTML("beforeend", r));
 
+            const fillerCount = Math.max(0, state.pageSize - chunk.length);
+            const shouldPad = state.page > 1 && fillerCount > 0;
+            if (shouldPad) {
+                const colCount = state.columns?.length || headEl.querySelectorAll("th").length || 1;
+                for (let i = 0; i < fillerCount; i++) {
+                    const fillerRow = document.createElement("tr");
+                    fillerRow.className = "placeholder-row";
+                    for (let c = 0; c < colCount; c++) {
+                        const cell = document.createElement("td");
+                        cell.innerHTML = "&nbsp;";
+                        fillerRow.appendChild(cell);
+                    }
+                    bodyEl.appendChild(fillerRow);
+                }
+            }
             renderPagination(pages);
         }
 
@@ -370,6 +385,336 @@
     const memChart = makeMainChart(memCtx, "Memory %");
     const loadChart = makeMainChart(loadCtx, "CPU Load");
 
+    // Unified metrics: three parallel charts (memory, CPU, disk)
+    const unifiedPanel = document.getElementById("unified-panel");
+    const unifiedLegend = document.getElementById("unified-legend");
+    const unifiedMemCtx = document.getElementById("unified-mem-chart").getContext("2d");
+    const unifiedCpuCtx = document.getElementById("unified-cpu-chart").getContext("2d");
+    const unifiedDiskCtx = document.getElementById("unified-disk-chart").getContext("2d");
+
+    // Unified tables DOM references
+    const unifiedServicesTable = document.getElementById("unified-services-table");
+    const unifiedServicesHead = unifiedServicesTable?.querySelector("thead");
+    const unifiedServicesBody = unifiedServicesTable?.querySelector("tbody");
+
+    const unifiedProcessesTable = document.getElementById("unified-processes-table");
+    const unifiedProcessesHead = unifiedProcessesTable?.querySelector("thead");
+    const unifiedProcessesBody = unifiedProcessesTable?.querySelector("tbody");
+
+    const unifiedDockerTable = document.getElementById("unified-docker-table");
+    const unifiedDockerHead = unifiedDockerTable?.querySelector("thead");
+    const unifiedDockerBody = unifiedDockerTable?.querySelector("tbody");
+
+    const unifiedDisksTable = document.getElementById("unified-disks-table");
+    const unifiedDisksHead = unifiedDisksTable?.querySelector("thead");
+    const unifiedDisksBody = unifiedDisksTable?.querySelector("tbody");
+
+    const unifiedPyudiskTable = document.getElementById("unified-pyudisk-table");
+    const unifiedPyudiskHead = unifiedPyudiskTable?.querySelector("thead");
+    const unifiedPyudiskBody = unifiedPyudiskTable?.querySelector("tbody");
+
+    const unifiedCertsTable = document.getElementById("unified-certificates-table");
+    const unifiedCertsHead = unifiedCertsTable?.querySelector("thead");
+    const unifiedCertsBody = unifiedCertsTable?.querySelector("tbody");
+
+    // Paginated unified tables
+    const PAG_UNIFIED_SERVICES = unifiedServicesTable && createPaginatedTable(
+        unifiedServicesTable, unifiedServicesHead, unifiedServicesBody
+    );
+    const PAG_UNIFIED_PROCESSES = unifiedProcessesTable && createPaginatedTable(
+        unifiedProcessesTable, unifiedProcessesHead, unifiedProcessesBody
+    );
+    const PAG_UNIFIED_DOCKER = unifiedDockerTable && createPaginatedTable(
+        unifiedDockerTable, unifiedDockerHead, unifiedDockerBody
+    );
+    const PAG_UNIFIED_DISKS = unifiedDisksTable && createPaginatedTable(
+        unifiedDisksTable, unifiedDisksHead, unifiedDisksBody
+    );
+    const PAG_UNIFIED_PYUDISK = unifiedPyudiskTable && createPaginatedTable(
+        unifiedPyudiskTable, unifiedPyudiskHead, unifiedPyudiskBody
+    );
+    const PAG_UNIFIED_CERTS = unifiedCertsTable && createPaginatedTable(
+        unifiedCertsTable, unifiedCertsHead, unifiedCertsBody
+    );
+
+    let unifiedNodes = [];
+    // TODO: Update colorPalette to use contrasting colors
+    const colorPalette = ["#63b3ff", "#ff99c8", "#7dd3fc", "#fbbf24", "#a3e635", "#f87171", "#c084fc", "#38bdf8"];
+    const nodeColor = {};
+    const unifiedCharts = {memory: null, cpu: null, disk: null};
+
+    function normalizeNodes(nodes) {
+        return nodes
+            .filter(node => node.base_url && node.base_url !== "*")
+            .sort((a, b) => (a.name || a.base_url).localeCompare(b.name || b.base_url));
+    }
+
+    function assignColors(nodes) {
+        nodes.forEach((node, idx) => {
+            nodeColor[node.base_url] = colorPalette[idx % colorPalette.length];
+        });
+    }
+
+    function renderLegend(nodes) {
+        unifiedLegend.innerHTML = "";
+        nodes.forEach(node => {
+            const item = document.createElement("div");
+            item.className = "unified-legend-item";
+            item.innerHTML = `<span class="legend-dot" style="background:${nodeColor[node.base_url]}"></span>${node.name || node.base_url}`;
+            unifiedLegend.appendChild(item);
+        });
+    }
+
+    function makeUnifiedChart(ctx, nodes) {
+        return new Chart(ctx, {
+            type: "line",
+            data: {
+                labels: Array(MAX_POINTS).fill(""),
+                datasets: nodes.map(node => ({
+                    label: node.name || node.base_url,
+                    meta: {base_url: node.base_url},
+                    data: Array(MAX_POINTS).fill(null),
+                    borderColor: nodeColor[node.base_url],
+                    backgroundColor: `${nodeColor[node.base_url]}33`,
+                    borderWidth: 2,
+                    fill: false,
+                    tension: 0.3,
+                    pointRadius: 0,
+                }))
+            },
+            options: {
+                animation: false,
+                responsive: true,
+                maintainAspectRatio: false,
+                scales: {
+                    x: {display: false},
+                    y: {beginAtZero: true, suggestedMax: 100}
+                },
+                plugins: {legend: {display: false}}
+            }
+        });
+    }
+
+    function setUnifiedMode(enabled) {
+        document.body.classList.toggle("unified-mode", enabled);
+        if (!enabled) {
+            unifiedPanel.classList.add("hidden");
+        }
+    }
+
+    function ensureUnifiedChart(metrics) {
+        const nodes = normalizeNodes(metrics);
+        if (!nodes.length) return false;
+        const changed =
+            nodes.length !== unifiedNodes.length ||
+            nodes.some((node, idx) => unifiedNodes[idx]?.base_url !== node.base_url);
+
+        if (changed) {
+            // Destroy any existing unified charts
+            Object.keys(unifiedCharts).forEach(key => {
+                if (unifiedCharts[key]) {
+                    unifiedCharts[key].destroy();
+                    unifiedCharts[key] = null;
+                }
+            });
+            assignColors(nodes);
+            unifiedCharts.memory = makeUnifiedChart(unifiedMemCtx, nodes);
+            unifiedCharts.cpu = makeUnifiedChart(unifiedCpuCtx, nodes);
+            unifiedCharts.disk = makeUnifiedChart(unifiedDiskCtx, nodes);
+            unifiedNodes = nodes;
+        }
+
+        unifiedPanel.classList.remove("hidden");
+        renderLegend(nodes);
+        return true;
+    }
+
+    function sampleForMetric(host, metric) {
+        if (!host.metrics) return null;
+        if (metric === "memory") return host.metrics.memory_info?.percent ?? null;
+        if (metric === "cpu") {
+            const values = (host.metrics.cpu_usage || [])
+                .map(v => Number(v))
+                .filter(Number.isFinite);
+            if (!values.length) return null;
+            return values.reduce((a, b) => a + b, 0) / values.length;
+        }
+        if (metric === "disk") {
+            const m = host.metrics;
+            if (m.disk_info && m.disk_info[0]) {
+                const m = host.metrics;
+                const agg = aggregateDiskInfo(m.disk_info);
+                return agg.percent;
+            }
+            return host.metrics.disk_info?.[0]?.percent ?? null;
+        }
+        return null;
+    }
+
+    function updateUnified(metrics) {
+        const ts = new Date().toLocaleTimeString();
+        const metricKeys = ["memory", "cpu", "disk"];
+        metricKeys.forEach(metric => {
+            const chart = unifiedCharts[metric];
+            if (!chart) return;
+
+            chart.data.labels.push(ts);
+            if (chart.data.labels.length > MAX_POINTS) {
+                chart.data.labels.shift();
+            }
+
+            chart.data.datasets.forEach(ds => {
+                const host = metrics.find(h => h.base_url === ds.meta.base_url);
+                const value = host ? sampleForMetric(host, metric) : null;
+                ds.data.push(value);
+                if (ds.data.length > MAX_POINTS) ds.data.shift();
+            });
+
+            chart.update("none");
+        });
+
+        // --- Unified tables aggregation ---
+        // Helper to get display name for node
+        const getNodeLabel = (host) => host.name || host.base_url || "";
+
+        // Services
+        if (PAG_UNIFIED_SERVICES) {
+            const svcRows = [];
+            metrics.forEach(host => {
+                if (!host.metrics) return;
+                const m = host.metrics;
+                const label = getNodeLabel(host);
+                const services = (m.service_stats || m.services || []).filter(s =>
+                    (s.pname || s.Name || "").toLowerCase().includes(
+                        svcFilter.value.trim().toLowerCase()
+                    )
+                );
+                services.forEach(s => {
+                    svcRows.push({
+                        Node: label,
+                        PID: s.PID ?? s.pid ?? "",
+                        Name: s.pname ?? s.Name ?? s.name ?? "",
+                        Status: s.Status ?? s.active ?? s.status ?? s.Active ?? "4",
+                        CPU: objectToString(s.CPU, s.cpu),
+                        Memory: objectToString(s.Memory, s.memory),
+                        Threads: s.Threads ?? s.threads ?? "4",
+                        "Open Files": s["Open Files"] ?? s.open_files ?? "4"
+                    });
+                });
+            });
+            const svcCols = ["Node", "PID", "Name", "Status", "CPU", "Memory", "Threads", "Open Files"];
+            PAG_UNIFIED_SERVICES.setData(svcRows, svcCols);
+        }
+
+        // Processes
+        if (PAG_UNIFIED_PROCESSES) {
+            const procRows = [];
+            const procColsSet = new Set(["Node", "PID", "Name", "Status", "CPU", "Memory", "Uptime", "Threads", "Open Files"]);
+            metrics.forEach(host => {
+                if (!host.metrics) return;
+                const m = host.metrics;
+                const label = getNodeLabel(host);
+                const processes = (m.process_stats || []).filter(p =>
+                    (p.Name || "").toLowerCase().includes(
+                        procFilter.value.trim().toLowerCase()
+                    )
+                );
+                processes.forEach(p => {
+                    const row = {Node: label};
+                    Object.entries(p).forEach(([k, v]) => {
+                        procColsSet.add(k);
+                        row[k] = v;
+                    });
+                    procRows.push(row);
+                });
+            });
+            const procCols = Array.from(procColsSet);
+            PAG_UNIFIED_PROCESSES.setData(procRows, procCols);
+        }
+
+        // Docker
+        if (PAG_UNIFIED_DOCKER) {
+            const dockerRows = [];
+            const dockerColsSet = new Set(["Node"]);
+            metrics.forEach(host => {
+                if (!host.metrics || !Array.isArray(host.metrics.docker_stats)) return;
+                const label = getNodeLabel(host);
+                host.metrics.docker_stats.forEach(s => {
+                    const row = {Node: label};
+                    Object.entries(s).forEach(([k, v]) => {
+                        dockerColsSet.add(k);
+                        row[k] = v;
+                    });
+                    dockerRows.push(row);
+                });
+            });
+            const dockerCols = Array.from(dockerColsSet);
+            PAG_UNIFIED_DOCKER.setData(dockerRows, dockerCols);
+        }
+
+        // Disks
+        if (PAG_UNIFIED_DISKS) {
+            const diskRows = [];
+            const diskColsSet = new Set(["Node"]);
+            metrics.forEach(host => {
+                if (!host.metrics || !Array.isArray(host.metrics.disks_info)) return;
+                const label = getNodeLabel(host);
+                host.metrics.disks_info.forEach(d => {
+                    const row = {Node: label};
+                    Object.entries(d).forEach(([k, v]) => {
+                        if (k === "Node") return;
+                        diskColsSet.add(k);
+                        row[k] = v;
+                    });
+                    diskRows.push(row);
+                });
+            });
+            const diskCols = Array.from(diskColsSet);
+            PAG_UNIFIED_DISKS.setData(diskRows, diskCols);
+        }
+
+        // PyUdisk
+        if (PAG_UNIFIED_PYUDISK) {
+            const pyuRows = [];
+            const pyuColsSet = new Set(["Node"]);
+            metrics.forEach(host => {
+                if (!host.metrics || !Array.isArray(host.metrics.pyudisk_stats)) return;
+                const label = getNodeLabel(host);
+                host.metrics.pyudisk_stats.forEach(pyu => {
+                    const row = {Node: label};
+                    Object.entries(pyu).forEach(([k, v]) => {
+                        if (k === "Mountpoint") return;
+                        pyuColsSet.add(k);
+                        row[k] = v;
+                    });
+                    pyuRows.push(row);
+                });
+            });
+            const pyuCols = Array.from(pyuColsSet);
+            PAG_UNIFIED_PYUDISK.setData(pyuRows, pyuCols);
+        }
+
+        // Certificates
+        if (PAG_UNIFIED_CERTS) {
+            const certRows = [];
+            const certColsSet = new Set(["Node"]);
+            metrics.forEach(host => {
+                if (!host.metrics || !Array.isArray(host.metrics.certificates)) return;
+                const label = getNodeLabel(host);
+                host.metrics.certificates.forEach(c => {
+                    const row = {Node: label};
+                    Object.entries(c).forEach(([k, v]) => {
+                        certColsSet.add(k);
+                        row[k] = v;
+                    });
+                    certRows.push(row);
+                });
+            });
+            const certCols = Array.from(certColsSet);
+            PAG_UNIFIED_CERTS.setData(certRows, certCols);
+        }
+    }
+
     // ------------------------------------------------------------
     // CORE CHARTS
     // ------------------------------------------------------------
@@ -398,9 +743,9 @@
         return coreMini[coreName] || createCoreChart(coreName);
     }
 
-    function pruneOldCores(latest) {
+    function pruneOldCores(keep) {
         for (const name of Object.keys(coreMini)) {
-            if (!latest.includes(name)) {
+            if (!keep.includes(name)) {
                 try {
                     coreMini[name].chart.destroy();
                 } catch {
@@ -422,6 +767,12 @@
         PAG_DISKS.setData([], []);
         PAG_PYUDISK.setData([], []);
         PAG_CERTS.setData([], []);
+        if (PAG_UNIFIED_SERVICES) PAG_UNIFIED_SERVICES.setData([], []);
+        if (PAG_UNIFIED_PROCESSES) PAG_UNIFIED_PROCESSES.setData([], []);
+        if (PAG_UNIFIED_DOCKER) PAG_UNIFIED_DOCKER.setData([], []);
+        if (PAG_UNIFIED_DISKS) PAG_UNIFIED_DISKS.setData([], []);
+        if (PAG_UNIFIED_PYUDISK) PAG_UNIFIED_PYUDISK.setData([], []);
+        if (PAG_UNIFIED_CERTS) PAG_UNIFIED_CERTS.setData([], []);
     }
 
     function resetUI() {
@@ -440,11 +791,23 @@
         resetChart(memChart);
         resetChart(loadChart);
 
+        // Reset unified charts as well
+        Object.keys(unifiedCharts).forEach(key => {
+            const chart = unifiedCharts[key];
+            if (chart) {
+                try {
+                    chart.destroy();
+                } catch {}
+                unifiedCharts[key] = null;
+            }
+        });
+        unifiedNodes = [];
+        unifiedPanel.classList.add("hidden");
+
         for (const name of Object.keys(coreMini)) {
             try {
                 coreMini[name].chart.destroy();
-            } catch {
-            }
+            } catch {}
             coreMini[name].el.remove();
             delete coreMini[name];
         }
@@ -460,6 +823,19 @@
     // ------------------------------------------------------------
     // MISC HELPERS
     // ------------------------------------------------------------
+    function aggregateDiskInfo(diskInfo) {
+        let totalDisk = 0;
+        let usedDisk = 0;
+        let freeDisk = 0;
+        diskInfo.forEach(d => {
+            totalDisk += num(d.total || 0);
+            usedDisk += num(d.used || 0);
+            freeDisk += num(d.free || 0);
+        });
+        let percentDisk = totalDisk > 0 ? (usedDisk / totalDisk) * 100 : 0.0;
+        return {"total": totalDisk, "used": usedDisk, "free": freeDisk, "percent": percentDisk};
+    }
+
     function pushPoint(chart, value) {
         const ts = new Date().toLocaleTimeString();
         chart.data.labels.push(ts);
@@ -519,6 +895,16 @@
 
         const now = new Date().toLocaleTimeString();
 
+        if (selectedBase === "*") {
+            if (ensureUnifiedChart(list)) {
+                setUnifiedMode(true);
+                updateUnified(list);
+            }
+            return;
+        }
+
+        setUnifiedMode(false);
+
         for (const host of list) {
             if (host.base_url !== selectedBase) continue;
             const m = host.metrics || {};
@@ -541,17 +927,19 @@
                 `GPU: ${m.gpu_name || "-"}`;
 
             if (m.disk_info && m.disk_info[0]) {
-                const d = m.disk_info[0];
+                const agg = aggregateDiskInfo(m.disk_info);
                 diskEl.textContent =
-                    `Total: ${formatBytes(d.total)}\n` +
-                    `Used: ${formatBytes(d.used)}\n` +
-                    `Free: ${formatBytes(d.free)}`;
+                    `Total: ${formatBytes(agg.total)}\n` +
+                    `Used: ${formatBytes(agg.used)}\n` +
+                    `Free: ${formatBytes(agg.free)}\n` +
+                    `Percent: ${round2(agg.percent)}%`;
             }
 
             if (m.memory_info) {
                 memEl.textContent =
                     `Total: ${formatBytes(m.memory_info.total)}\n` +
                     `Used: ${formatBytes(m.memory_info.used)}\n` +
+                    `Free: ${formatBytes(m.memory_info.free)}\n` +
                     `Percent: ${round2(m.memory_info.percent)}%`;
                 pushPoint(memChart, num(m.memory_info.percent));
             }
@@ -644,11 +1032,25 @@
                 hideSpinner("certificates-table");
             }
         }
+
+        // When not in unified ("*") mode, ensure unified panel is hidden and charts cleared
+        unifiedPanel.classList.add("hidden");
+        unifiedNodes = [];
+        Object.keys(unifiedCharts).forEach(key => {
+            if (unifiedCharts[key]) {
+                unifiedCharts[key].destroy();
+                unifiedCharts[key] = null;
+            }
+        });
     }
 
     // ------------------------------------------------------------
     // EVENT BINDINGS
     // ------------------------------------------------------------
+    targets.push({
+        base_url: "*",
+        name: "*"
+    });
     targets.forEach(t => {
         const opt = document.createElement("option");
         opt.value = t.base_url;
@@ -664,6 +1066,7 @@
         resetUI();
         resetTables();
         showAllSpinners();
+        if (selectedBase !== "*") unifiedPanel.classList.add("hidden");
         ws.send(JSON.stringify({type: "select_target", base_url: selectedBase}));
     });
 

pyobservability/static/styles.css

@@ -201,6 +201,16 @@ html, body {
     text-align: left;
 }
 
+.table tbody tr.placeholder-row td {
+    color: transparent;
+    border-bottom: 1px solid transparent;
+    padding: 8px;
+}
+
+.table tbody tr.placeholder-row td::after {
+    content: "";
+}
+
 .pre {
     background: rgba(255, 255, 255, 0.02);
     padding: 8px;
@@ -265,6 +275,10 @@ input#proc-filter {
     .meta-row {
         grid-template-columns: 1fr;
     }
+
+    .unified-grid {
+        grid-template-columns: 1fr;
+    }
 }
 
 /* ---------------- SPINNER ------------------- */
@@ -324,3 +338,137 @@ input#proc-filter {
     margin-bottom: 4px;
     opacity: 0.85;
 }
+
+.panel-helper {
+    margin: 0 0 8px;
+    font-size: 12px;
+    color: var(--muted);
+}
+
+.metric-switch {
+    display: inline-flex;
+    border: 1px solid rgba(255, 255, 255, 0.08);
+    border-radius: 4px;
+    overflow: hidden;
+}
+
+.metric-btn {
+    background: transparent;
+    color: inherit;
+    border: none;
+    padding: 6px 12px;
+    font-size: 12px;
+    cursor: pointer;
+    transition: background 0.2s, color 0.2s;
+}
+
+.metric-btn:not(.active):hover {
+    background: rgba(255, 255, 255, 0.05);
+}
+
+.metric-btn.active {
+    background: var(--accent);
+    color: #020617;
+}
+
+.unified-header {
+    align-items: center;
+    justify-content: center;
+    gap: 12px;
+}
+
+.unified-title-group {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    gap: 2px;
+}
+
+.unified-indicator {
+    font-size: 12px;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    color: var(--muted);
+}
+
+.unified-legend {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+    margin-top: 10px;
+}
+
+.unified-legend-item {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    padding: 4px 8px;
+    border-radius: 4px;
+    background: rgba(255, 255, 255, 0.05);
+    font-size: 12px;
+}
+
+.legend-dot {
+    width: 10px;
+    height: 10px;
+    border-radius: 50%;
+}
+
+/* New unified-grid layout for three unified charts */
+.unified-grid {
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 12px;
+    margin-top: 8px;
+}
+
+.unified-metric-panel {
+    background: var(--panel);
+    border-radius: 8px;
+    padding: 8px 8px 4px;
+    box-shadow: 0 4px 12px rgba(2, 6, 23, 0.6);
+}
+
+.unified-metric-panel .panel-header h3 {
+    font-size: 13px;
+}
+
+.unified-tables {
+    margin-top: 12px;
+}
+
+.unified-tables-title {
+    margin: 0 0 8px;
+    font-size: 13px;
+    color: var(--muted);
+}
+
+.unified-tables-grid {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+}
+
+.unified-table-panel {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+}
+
+.unified-table-panel .table {
+    font-size: 12px;
+}
+
+body.unified-mode .meta-row,
+body.unified-mode .charts-row > :not(#unified-panel),
+body.unified-mode .details-row,
+body.unified-mode .tables-row,
+body.unified-mode footer {
+    display: none !important;
+}
+
+body.unified-mode #unified-panel {
+    flex: 1;
+}

pyobservability/templates/index.html

@@ -75,6 +75,78 @@
             <div class="panel-header"><h3>Memory (%)</h3></div>
             <canvas id="mem-chart" class="chart"></canvas>
         </div>
+
+        <div class="panel hidden" id="unified-panel">
+            <div class="panel-header unified-header">
+                <div class="unified-title-group">
+                    <h3>Aggregated Metrics</h3>
+                    <span class="unified-indicator">Holistic node comparison</span>
+                </div>
+            </div>
+            {# <p class="panel-helper">Select "All nodes" (*) to compare every host.</p> #}
+            <div class="unified-grid">
+                <div class="unified-metric-panel">
+                    <div class="panel-header"><h3>Memory (%)</h3></div>
+                    <canvas id="unified-mem-chart" class="chart"></canvas>
+                </div>
+                <div class="unified-metric-panel">
+                    <div class="panel-header"><h3>CPU Avg (%)</h3></div>
+                    <canvas id="unified-cpu-chart" class="chart"></canvas>
+                </div>
+                <div class="unified-metric-panel">
+                    <div class="panel-header"><h3>Disk (%)</h3></div>
+                    <canvas id="unified-disk-chart" class="chart"></canvas>
+                </div>
+            </div>
+            {# TODO: Make the following tables into multiple div containers #}
+            <div id="unified-legend" class="unified-legend"></div>
+            <div class="unified-tables">
+                <div class="unified-tables-grid">
+                    <div class="panel unified-table-panel">
+                        <div class="panel-header"><h3>Services</h3></div>
+                        <table class="table" id="unified-services-table">
+                            <thead></thead>
+                            <tbody></tbody>
+                        </table>
+                    </div>
+                    <div class="panel unified-table-panel">
+                        <div class="panel-header"><h3>Processes</h3></div>
+                        <table class="table" id="unified-processes-table">
+                            <thead></thead>
+                            <tbody></tbody>
+                        </table>
+                    </div>
+                    <div class="panel unified-table-panel">
+                        <div class="panel-header"><h3>Docker Containers</h3></div>
+                        <table class="table" id="unified-docker-table">
+                            <thead></thead>
+                            <tbody></tbody>
+                        </table>
+                    </div>
+                    <div class="panel unified-table-panel">
+                        <div class="panel-header"><h3>Disks</h3></div>
+                        <table class="table" id="unified-disks-table">
+                            <thead></thead>
+                            <tbody></tbody>
+                        </table>
+                    </div>
+                    <div class="panel unified-table-panel">
+                        <div class="panel-header"><h3>PyUdisk Metrics</h3></div>
+                        <table class="table" id="unified-pyudisk-table">
+                            <thead></thead>
+                            <tbody></tbody>
+                        </table>
+                    </div>
+                    <div class="panel unified-table-panel">
+                        <div class="panel-header"><h3>Certificates</h3></div>
+                        <table class="table" id="unified-certificates-table">
+                            <thead></thead>
+                            <tbody></tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </div>
     </section>
 
     <section class="details-row">

pyobservability/transport.py

@@ -1,6 +1,7 @@
 import asyncio
 import json
 import logging
+from typing import Dict, List
 
 from fastapi import WebSocket, WebSocketDisconnect
 
@@ -22,6 +23,99 @@ async def _forward_metrics(websocket: WebSocket, q: asyncio.Queue) -> None:
         await websocket.send_json(payload)
 
 
+def _normalize_targets() -> List[Dict[str, str]]:
+    """Return configuration targets sorted so legend colors are consistent."""
+    return sorted(settings.env.targets, key=lambda t: t["name"].lower())
+
+
+async def _forward_metrics_multi(
+    websocket: WebSocket,
+    queues: List[asyncio.Queue],
+    targets: List[Dict[str, str]],
+) -> None:
+    """Fan-in metrics from multiple monitors and emit once every node updates.
+
+    Args:
+        websocket: FastAPI WebSocket connection.
+        queues: List of asyncio.Queues from multiple monitors.
+        targets: List of target configurations corresponding to the queues.
+
+    Notes:
+        This is resilient to individual node failures.
+        If a monitor starts emitting an ``error`` payload (e.g. exceeded error threshold),
+        that node is marked as failed and removed from the unified stream,
+        so that the remaining nodes keep updating in the UI.
+    """
+    # Track active (non-failed) indices
+    active = [True] * len(queues)
+
+    # Latest payload per node keyed by base_url
+    latest: Dict[str, dict] = {}
+    try:
+        while True:
+            # If all nodes have failed, stop the unified stream loop.
+            if not any(active):
+                LOGGER.info("All targets in unified stream have failed; stopping multi-node forwarder")
+                return
+
+            # Wait for at least one payload from any active queue.
+            # We gather one payload per active queue in a "round", but we do
+            # not block forever on failed queues because we mark them inactive
+            # as soon as they send an error.
+            for idx, q in enumerate(queues):
+                if not active[idx]:
+                    continue
+
+                payload = await q.get()
+
+                # Handle error payloads from monitors: mark this node as failed
+                # and notify the UI once, then skip it from future
+                # rounds so the rest of the nodes continue streaming.
+                if isinstance(payload, dict) and payload.get("type") == "error":
+                    base_url = targets[idx]["base_url"]
+                    LOGGER.warning("Unified stream: target %s reported error and will be skipped", base_url)
+
+                    # Forward the error to the websocket so the UI can show it.
+                    try:
+                        await websocket.send_json(payload)
+                    except Exception as send_err:  # pragma: no cover - defensive
+                        LOGGER.debug("Failed to send error payload to WS: %s", send_err)
+
+                    # Mark this target as inactive and remove its latest sample
+                    active[idx] = False
+                    latest.pop(base_url, None)
+                    continue
+
+                # Normal metrics payload: remember latest per base_url
+                base_url = targets[idx]["base_url"]
+                latest[base_url] = payload
+
+            # Build merged message from all currently active targets that have
+            # produced at least one metrics payload.
+            merged = {
+                "type": "metrics",
+                "ts": asyncio.get_event_loop().time(),
+                "data": [],
+            }
+
+            for idx, target in enumerate(targets):
+                if not active[idx]:
+                    continue
+                sample = latest.get(target["base_url"])
+                if not sample:
+                    continue
+                merged["data"].extend(sample.get("data", []))
+
+            # If we have no data (e.g. new round before any active node
+            # produced metrics), skip sending to avoid spamming empty payloads.
+            if not merged["data"]:
+                continue
+
+            await websocket.send_json(merged)
+    except asyncio.CancelledError:
+        LOGGER.debug("Unified stream task cancelled")
+
+
 async def websocket_endpoint(websocket: WebSocket) -> None:
     """Websocket endpoint to handle observability data streaming.
 
@@ -32,6 +126,10 @@ async def websocket_endpoint(websocket: WebSocket) -> None:
 
     monitor: Monitor | None = None
     q: asyncio.Queue | None = None
+    monitors: List[Monitor] = []
+    queues: List[asyncio.Queue] = []
+    multi_task: asyncio.Task | None = None
+    forward_task: asyncio.Task | None = None
 
     try:
         while True:
@@ -42,6 +140,15 @@ async def websocket_endpoint(websocket: WebSocket) -> None:
                     await monitor.update_flags(
                         all_services=data.get("all_services", False),
                     )
+                elif monitors:
+                    await asyncio.gather(
+                        *(
+                            mon.update_flags(
+                                all_services=data.get("all_services", False),
+                            )
+                            for mon in monitors
+                        )
+                    )
                 continue
 
             # -------------------------------------------
@@ -50,10 +157,42 @@ async def websocket_endpoint(websocket: WebSocket) -> None:
             if data.get("type") == "select_target":
                 base_url = data["base_url"]
 
-                # stop old monitor
+                # stop old monitor / tasks
+                if forward_task:
+                    LOGGER.info("Stopping previous forwarder task")
+                    forward_task.cancel()
+                    forward_task = None
+
                 if monitor:
+                    LOGGER.info("Stopping previous monitor task")
                     monitor.unsubscribe(q)
                     await monitor.stop()
+                    monitor = None
+                    q = None
+
+                if multi_task:
+                    LOGGER.info("Stopping previous multi-target forwarder task")
+                    multi_task.cancel()
+                    multi_task = None
+
+                LOGGER.info("Unsubscribing from previous monitors") if monitor else None
+                for idx, mon in enumerate(monitors):
+                    mon.unsubscribe(queues[idx])
+                    await mon.stop()
+
+                monitors.clear()
+                queues.clear()
+
+                if base_url == "*":
+                    LOGGER.info("Gathering metrics for all targets in unified stream")
+                    targets = _normalize_targets()
+                    for target in targets:
+                        mon = Monitor(target)
+                        await mon.start()
+                        monitors.append(mon)
+                        queues.append(mon.subscribe())
+                    multi_task = asyncio.create_task(_forward_metrics_multi(websocket, queues, targets))
+                    continue
 
                 if target := settings.targets_by_url.get(base_url):
                     LOGGER.info("Gathering metrics for: %s", target["name"])
@@ -69,14 +208,24 @@ async def websocket_endpoint(websocket: WebSocket) -> None:
                 q = monitor.subscribe()
 
                 # start forwarding metrics
-                asyncio.create_task(_forward_metrics(websocket, q))
+                forward_task = asyncio.create_task(_forward_metrics(websocket, q))
     except WebSocketDisconnect:
         pass
     except Exception as err:
         LOGGER.error("WS error: %s", err)
 
     # cleanup
+    if forward_task:
+        forward_task.cancel()
+
     if monitor:
         if q:
             monitor.unsubscribe(q)
         await monitor.stop()
+
+    if multi_task:
+        multi_task.cancel()
+
+    for idx, mon in enumerate(monitors):
+        mon.unsubscribe(queues[idx])
+        await mon.stop()

pyobservability/version.py

@@ -1 +1 @@
-__version__ = "1.3.0"
+__version__ = "1.4.1"

{pyobservability-1.3.0.dist-info → pyobservability-1.4.1.dist-info}/METADATA

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: PyObservability
-Version: 1.3.0
+Version: 1.4.1
 Summary: Lightweight OS-agnostic observability UI for PyNinja
 Author-email: Vignesh Rao <svignesh1793@gmail.com>
 License: MIT License

pyobservability-1.4.1.dist-info/RECORD

@@ -0,0 +1,16 @@
+pyobservability/__init__.py,sha256=yVBLyTohBiBKp0Otyl04IggPh8mhg3Er25u6eFyxMto,2618
+pyobservability/main.py,sha256=EJ49ENDnKy07jKHQ0IYEVmsyc_4O3uxCHpn1faQD5VM,4534
+pyobservability/monitor.py,sha256=i_Xf_DB-qLOp1b9wryekjwHIM8AnMrGTkuEg7e08bcM,7539
+pyobservability/transport.py,sha256=S-84mgf-9yMj0H7VSAmueW9yosX_1XxdyNJC2EuQHQQ,8493
+pyobservability/version.py,sha256=BqOI5y46o1G1RWC9bF1DPL-YM68lGYPmZt1pn6FZFZs,22
+pyobservability/config/enums.py,sha256=EhvD9kB5EMW3ARxr5KmISmf-rP3D4IKqOIjw6Tb8SB8,294
+pyobservability/config/settings.py,sha256=ylhiT0SARHuzkyon_1otgsO74AfA6aiUKp5uczZQj08,5980
+pyobservability/static/app.js,sha256=l6m8mwEU4z5d2wQF7Fa6tFITW3HX3M5RaLhBJ0jFXrM,43322
+pyobservability/static/styles.css,sha256=DRJ4kw-LDlXMcQXxFd8cEDuDC_ZfwZgARAjn0zDWwRk,8172
+pyobservability/templates/index.html,sha256=Z_r1Gq0QNxEwTL4_2NPQ1cKqLpbQoJC88E5leyjo07s,10786
+pyobservability-1.4.1.dist-info/licenses/LICENSE,sha256=_sOIKJWdD2o1WwwDIwYB2qTP2nlSWqT5Tyg9jr1Xa4w,1070
+pyobservability-1.4.1.dist-info/METADATA,sha256=QUIDftx5D229DYD03NsspRYP2Imp0u_rVVlzW4-UPHo,6537
+pyobservability-1.4.1.dist-info/WHEEL,sha256=_zCd3N1l69ArxyTb8rzEoP9TpbYXkqRFSNOD5OuxnTs,91
+pyobservability-1.4.1.dist-info/entry_points.txt,sha256=DSGIr_VA8Tb3FYa2iNUYpf55eAvuFCAoInNS4ngXaME,57
+pyobservability-1.4.1.dist-info/top_level.txt,sha256=p20T0EmihDYW1uMintRXr7X9bg3XWYKyoSbBHOVC1xI,16
+pyobservability-1.4.1.dist-info/RECORD,,

pyobservability-1.3.0.dist-info/RECORD

@@ -1,16 +0,0 @@
-pyobservability/__init__.py,sha256=yVBLyTohBiBKp0Otyl04IggPh8mhg3Er25u6eFyxMto,2618
-pyobservability/main.py,sha256=6Ozyxi-XVq9ojkrTEjw9oYWJaW49JJZ-ezBNzEM951Y,4503
-pyobservability/monitor.py,sha256=Y38zDJFPDbQqz_2jQcNmJBnRpeobC_SV2uhN-13e9RU,7591
-pyobservability/transport.py,sha256=zHLAodX20bKkPOuacKjzv1Dqj3JbNAB75o1ABwzum0U,2534
-pyobservability/version.py,sha256=F5mW07pSyGrqDNY2Ehr-UpDzpBtN-FsYU0QGZWf6PJE,22
-pyobservability/config/enums.py,sha256=EhvD9kB5EMW3ARxr5KmISmf-rP3D4IKqOIjw6Tb8SB8,294
-pyobservability/config/settings.py,sha256=l1xtD8teYS5ozXWm6JqpyyrcQsu95Syjs02xsd0m6MI,5886
-pyobservability/static/app.js,sha256=ngeSsp8mCkF6XqZpXhwqv-EtNI8NmrMYxNgQtaKB4WE,26675
-pyobservability/static/styles.css,sha256=4-VCDhzv_FnrvUffETTHkNnyGOFDUJU0qz2eLHCz_QI,5569
-pyobservability/templates/index.html,sha256=OvFDydHMquBtFr_2cy3iXP0I-pax6_RKBJinVVEIzQY,7193
-pyobservability-1.3.0.dist-info/licenses/LICENSE,sha256=_sOIKJWdD2o1WwwDIwYB2qTP2nlSWqT5Tyg9jr1Xa4w,1070
-pyobservability-1.3.0.dist-info/METADATA,sha256=FJSF4L10qUjlQMYDKxJmuHrRkWmSLmOConJB5MKufOY,6537
-pyobservability-1.3.0.dist-info/WHEEL,sha256=_zCd3N1l69ArxyTb8rzEoP9TpbYXkqRFSNOD5OuxnTs,91
-pyobservability-1.3.0.dist-info/entry_points.txt,sha256=DSGIr_VA8Tb3FYa2iNUYpf55eAvuFCAoInNS4ngXaME,57
-pyobservability-1.3.0.dist-info/top_level.txt,sha256=p20T0EmihDYW1uMintRXr7X9bg3XWYKyoSbBHOVC1xI,16
-pyobservability-1.3.0.dist-info/RECORD,,