Feat v0.6.0 cluster registry (#36)

Co-authored-by: Jeffrey Smith <jasafpro@gmail.com>
Co-committed-by: Jeffrey Smith <jasafpro@gmail.com>

packages/cluster-dashboard/js/main.js

@@ -0,0 +1,124 @@
+/**
+ * Cluster Dashboard — admin surface showing registered cluster nodes.
+ *
+ * Polls GET /api/v1/admin/cluster every 10s. Renders one card per node
+ * with runtime stats from the JSONB stats column. New keys added to
+ * stats are rendered automatically — no code change required.
+ */
+(function () {
+    'use strict';
+
+    var mount = document.getElementById('extension-mount');
+    if (!mount) return;
+
+    var REFRESH_MS = 10000;
+    var timer = null;
+
+    mount.innerHTML =
+        '<div class="cluster-dashboard">' +
+            '<div class="cluster-header">' +
+                '<h1>Cluster</h1>' +
+                '<span class="cluster-status" id="clusterStatus">loading...</span>' +
+            '</div>' +
+            '<div class="cluster-grid" id="clusterGrid"></div>' +
+        '</div>';
+
+    load();
+    timer = setInterval(load, REFRESH_MS);
+
+    // Cleanup on navigation (SPA)
+    window.addEventListener('beforeunload', function () {
+        if (timer) clearInterval(timer);
+    });
+
+    function load() {
+        var api = (window.sw && window.sw.api) || (typeof API !== 'undefined' && API);
+        if (!api) return;
+        var get = api._get || api.get;
+        if (!get) return;
+        get.call(api, '/api/v1/admin/cluster').then(render).catch(function () {
+            // 404 = SQLite (no cluster route registered), or other fetch error
+            render({ data: [] });
+        });
+    }
+
+    function render(resp) {
+        var nodes = (resp && resp.data) || [];
+        var status = document.getElementById('clusterStatus');
+        var grid = document.getElementById('clusterGrid');
+
+        status.textContent = nodes.length + ' node' + (nodes.length !== 1 ? 's' : '') + ' registered';
+
+        if (nodes.length === 0) {
+            grid.innerHTML = '<p class="cluster-empty">No nodes registered. The cluster registry requires PostgreSQL — SQLite runs single-node only.</p>';
+            return;
+        }
+
+        grid.innerHTML = nodes.map(nodeCard).join('');
+    }
+
+    function nodeCard(node) {
+        var stats = {};
+        try { stats = typeof node.stats === 'string' ? JSON.parse(node.stats) : (node.stats || {}); } catch (e) { /* ignore */ }
+
+        var uptimeSec = stats.uptime_sec || 0;
+        var uptime = formatDuration(uptimeSec);
+        var heap = formatBytes(stats.heap_alloc || 0);
+        var gcPause = ((stats.gc_pause_ns || 0) / 1e6).toFixed(1) + ' ms';
+        var wsClients = stats.ws_clients != null ? stats.ws_clients : '-';
+        var goroutines = stats.goroutines != null ? stats.goroutines : '-';
+        var gcCycles = stats.gc_cycles != null ? stats.gc_cycles : '-';
+        var heartbeatAge = timeSince(node.heartbeat);
+
+        return (
+            '<div class="cluster-card">' +
+                '<div class="card-header">' +
+                    '<span class="node-id">' + esc(node.node_id) + '</span>' +
+                    '<span class="heartbeat-badge" title="Last heartbeat">' + heartbeatAge + '</span>' +
+                '</div>' +
+                (node.endpoint ? '<div class="node-endpoint">' + esc(node.endpoint) + '</div>' : '') +
+                '<div class="card-stats">' +
+                    stat('Uptime', uptime) +
+                    stat('WS Clients', wsClients) +
+                    stat('Goroutines', goroutines) +
+                    stat('Heap', heap) +
+                    stat('GC Pause', gcPause) +
+                    stat('GC Cycles', gcCycles) +
+                '</div>' +
+            '</div>'
+        );
+    }
+
+    function stat(label, value) {
+        return '<div class="stat"><span class="stat-label">' + label + '</span><span class="stat-value">' + value + '</span></div>';
+    }
+
+    function formatBytes(b) {
+        if (b < 1024) return b + ' B';
+        if (b < 1024 * 1024) return (b / 1024).toFixed(1) + ' KB';
+        return (b / (1024 * 1024)).toFixed(1) + ' MB';
+    }
+
+    function formatDuration(sec) {
+        if (sec < 60) return Math.floor(sec) + 's';
+        if (sec < 3600) return Math.floor(sec / 60) + 'm ' + Math.floor(sec % 60) + 's';
+        var h = Math.floor(sec / 3600);
+        var m = Math.floor((sec % 3600) / 60);
+        return h + 'h ' + m + 'm';
+    }
+
+    function timeSince(iso) {
+        if (!iso) return '-';
+        var ms = Date.now() - new Date(iso).getTime();
+        if (ms < 0) ms = 0;
+        var sec = Math.floor(ms / 1000);
+        if (sec < 60) return sec + 's ago';
+        return Math.floor(sec / 60) + 'm ago';
+    }
+
+    function esc(s) {
+        var d = document.createElement('div');
+        d.appendChild(document.createTextNode(s || ''));
+        return d.innerHTML;
+    }
+})();