From 283b606c0919e03209872b2c1febd8b9cc74b401 Mon Sep 17 00:00:00 2001
From: Harald Eilertsen <haraldei@anduin.net>
Date: Mon, 23 Feb 2026 18:14:04 +0100
Subject: [PATCH] Update system status activity widget periodically

Adds a bit of javascript that requests the performance stats every 5
seconds.

Project......: Performance Profiling
Sponsored-by.: NLnet NGI0 Commons Fund
---
 Zotlabs/Module/Perfstats.php      | 14 +++++---------
 view/tpl/system_status_widget.tpl | 27 +++++++++++++++++++++++----
 2 files changed, 28 insertions(+), 13 deletions(-)

diff --git a/Zotlabs/Module/Perfstats.php b/Zotlabs/Module/Perfstats.php
index 1de1088cc..f5e6b50e5 100644
--- a/Zotlabs/Module/Perfstats.php
+++ b/Zotlabs/Module/Perfstats.php
@@ -25,19 +25,15 @@ class Perfstats extends Controller
 		$stats = [];
 
 		if (function_exists('sys_getloadavg')) {
-			$stats['System load'] = implode(' / ', sys_getloadavg());
+			$stats['loadavg'] = implode(' / ', sys_getloadavg());
 		}
 
-
-		// Get number of queries.
-		// select sum(xact_commit + xact_rollback) from pg_stat_database where datname='db';
-
-		$stats['Queries'] = $this->getNumQueries();
-		$stats['Output queue'] = Queue::get_undelivered();
+		$stats['dbqueries'] = $this->getNumQueries();
+		$stats['outqueue'] = Queue::get_undelivered();
 
 		$qwstats = new QueueWorkerStats();
-		$stats['Queue workers'] = $qwstats->active;
-		$stats['Worker queue size'] = $qwstats->size;
+		$stats['queueworkers'] = $qwstats->active;
+		$stats['workqsz'] = $qwstats->size;
 
 		return $stats;
 	}
diff --git a/view/tpl/system_status_widget.tpl b/view/tpl/system_status_widget.tpl
index 057ec3866..2182c1974 100644
--- a/view/tpl/system_status_widget.tpl
+++ b/view/tpl/system_status_widget.tpl
@@ -1,15 +1,34 @@
 <div class="mb-1 text-uppercase">
-	<a href="{{$url}}"><i class="bi bi-{{$icon}} generic-icons-nav"></i>{{$label}}</a>
+	<a href="{{$url}}"><i class="bi bi-{{$icon|escape}} generic-icons-nav"></i>{{$label|escape}}</a>
 </div>
 <div class="card">
 	<div class="card-body clearfix">
 		<table>
-		{{foreach $items as $title => $item}}
+		{{foreach $items as $id => $item}}
 			<tr>
-				<td><strong>{{$title}}:</strong></td>
-				<td><span>{{$item}}</span></td>
+				<td id="perfstat-{{$id}}-label" class="perfstat-label">{{$id|escape}}:</td>
+				<td id="perfstat-{{$id}}-value" class="perfstat-value">{{$item|escape}}</td>
 			</tr>
 		{{/foreach}}
 		</table>
 	</div>
 </div>
+<script>
+setInterval(() => {
+	fetch('/perfstats', {
+		headers: {
+			"Accept": "application/json",
+		}
+	})
+	.then((response) => response.json())
+	.then((json) => {
+		for (const item in json) {
+			//console.log(`${item}: ${json[item]}`);
+			element = document.getElementById(`perfstat-${item}-value`);
+			if (element) {
+				element.innerText = json[item];
+			}
+		}
+	});
+}, 5000);
+</script>