@agenticmail/enterprise 0.5.324 → 0.5.326

package/src/dashboard/pages/cluster.js

@@ -1,5 +1,325 @@
-import { h, useState, useEffect, Fragment, useApp, engineCall } from '../components/utils.js';
+import { h, useState, useEffect, useRef, Fragment, useApp, engineCall, apiCall } from '../components/utils.js';
 import { I } from '../components/icons.js';
+import { HelpButton } from '../components/settings-help.js';
+import { KnowledgeLink } from '../components/knowledge-link.js';
+
+function AddNodeModal({ onClose, onAdded, toast }) {
+  var [tab, setTab] = useState('manual'); // manual | ssh | script
+  var [form, setForm] = useState({ nodeId: '', name: '', host: '', port: 3101, sshHost: '', sshUser: 'root', sshKey: '', agentIds: '' });
+  var [testing, setTesting] = useState(false);
+  var [testResult, setTestResult] = useState(null);
+  var [saving, setSaving] = useState(false);
+  var [scriptGenerated, setScriptGenerated] = useState('');
+
+  var set = function(k, v) { setForm(function(f) { var n = Object.assign({}, f); n[k] = v; return n; }); };
+
+  var testConnection = function() {
+    if (!form.host) { toast('Host is required', 'error'); return; }
+    setTesting(true); setTestResult(null);
+    engineCall('/cluster/test-connection', {
+      method: 'POST',
+      body: JSON.stringify({ host: form.host, port: form.port || 3101 }),
+    }).then(function(d) { setTestResult(d); setTesting(false); })
+      .catch(function(e) { setTestResult({ success: false, error: e.message }); setTesting(false); });
+  };
+
+  var saveManual = function() {
+    if (!form.host) { toast('Host IP/hostname is required', 'error'); return; }
+    var nodeId = form.nodeId || form.host.replace(/[^a-zA-Z0-9-]/g, '-');
+    setSaving(true);
+    engineCall('/cluster/register', {
+      method: 'POST',
+      body: JSON.stringify({
+        nodeId: nodeId,
+        name: form.name || nodeId,
+        host: form.host,
+        port: parseInt(form.port) || 3101,
+      }),
+    }).then(function(d) { toast('Node added successfully', 'success'); onAdded(); onClose(); })
+      .catch(function(e) { toast(e.message, 'error'); setSaving(false); });
+  };
+
+  var deploySsh = function() {
+    if (!form.sshHost) { toast('SSH host is required', 'error'); return; }
+    setSaving(true);
+    engineCall('/cluster/deploy-via-ssh', {
+      method: 'POST',
+      body: JSON.stringify({
+        host: form.sshHost,
+        user: form.sshUser || 'root',
+        privateKey: form.sshKey || undefined,
+        agentIds: form.agentIds ? form.agentIds.split(',').map(function(s) { return s.trim(); }) : [],
+        port: parseInt(form.port) || 3101,
+        name: form.name || form.sshHost,
+      }),
+    }).then(function(d) { toast('Deployment started: ' + (d.message || 'check progress'), 'success'); onAdded(); onClose(); })
+      .catch(function(e) { toast(e.message, 'error'); setSaving(false); });
+  };
+
+  var generateScript = function() {
+    apiCall('/settings').then(function(settings) {
+      var dashUrl = settings?.domainStatus?.url || (typeof location !== 'undefined' ? location.origin : 'https://your-dashboard.agenticmail.io');
+      var dbUrl = '<YOUR_DATABASE_URL>';
+      var nodeId = form.nodeId || form.name?.toLowerCase().replace(/[^a-z0-9-]/g, '-') || 'worker-1';
+      var script = '#!/bin/bash\n' +
+        '# AgenticMail Worker Node Setup Script\n' +
+        '# Generated for: ' + (form.name || nodeId) + '\n' +
+        '# Run this on the target machine\n\n' +
+        'set -e\n\n' +
+        '# 1. Install Node.js (if not installed)\n' +
+        'if ! command -v node &> /dev/null; then\n' +
+        '  echo "Installing Node.js..."\n' +
+        '  curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -\n' +
+        '  sudo apt-get install -y nodejs || brew install node\n' +
+        'fi\n\n' +
+        '# 2. Install AgenticMail Enterprise\n' +
+        'npm install -g @agenticmail/enterprise\n\n' +
+        '# 3. Create environment file\n' +
+        'mkdir -p ~/.agenticmail\n' +
+        'cat > ~/.agenticmail/worker.env << \'ENV\'\n' +
+        'ENTERPRISE_URL=' + dashUrl + '\n' +
+        'WORKER_NODE_ID=' + nodeId + '\n' +
+        'WORKER_NAME="' + (form.name || nodeId) + '"\n' +
+        'DATABASE_URL=' + dbUrl + '\n' +
+        'PORT=' + (form.port || 3101) + '\n' +
+        'LOG_LEVEL=warn\n' +
+        'ENV\n\n' +
+        '# 4. Install PM2 for process management\n' +
+        'npm install -g pm2\n\n' +
+        '# 5. Start agent (replace <AGENT_ID> with actual ID)\n' +
+        '# pm2 start "agenticmail-enterprise agent --id <AGENT_ID>" --name agent-1 --env-path ~/.agenticmail/worker.env\n\n' +
+        'echo ""\n' +
+        'echo "Worker node setup complete!"\n' +
+        'echo "Edit ~/.agenticmail/worker.env to set DATABASE_URL"\n' +
+        'echo "Then start agents with: pm2 start \\"agenticmail-enterprise agent --id <AGENT_ID>\\""\n';
+      setScriptGenerated(script);
+    }).catch(function() {
+      toast('Failed to generate script', 'error');
+    });
+  };
+
+  var S = { padding: '8px 12px', borderRadius: 6, border: '1px solid var(--border)', background: 'var(--bg-primary)', color: 'var(--text-primary)', width: '100%', fontSize: 13 };
+
+  return h('div', { className: 'modal-overlay', onClick: function(e) { if (e.target.className === 'modal-overlay') onClose(); } },
+    h('div', { className: 'modal', style: { maxWidth: 640 } },
+      h('div', { className: 'modal-header' },
+        h('h3', null, 'Add Worker Node'),
+        h('button', { className: 'btn btn-ghost btn-sm', onClick: onClose }, 'X')
+      ),
+      h('div', { className: 'modal-body' },
+        // Tabs
+        h('div', { style: { display: 'flex', gap: 0, marginBottom: 20, borderBottom: '1px solid var(--border)' } },
+          ['manual', 'ssh', 'script'].map(function(t) {
+            var labels = { manual: 'Manual Registration', ssh: 'Deploy via SSH', script: 'Setup Script' };
+            return h('button', {
+              key: t,
+              style: { padding: '8px 16px', border: 'none', background: 'none', cursor: 'pointer', fontSize: 13, fontWeight: tab === t ? 600 : 400,
+                color: tab === t ? 'var(--accent-text)' : 'var(--text-muted)', borderBottom: tab === t ? '2px solid var(--accent)' : '2px solid transparent' },
+              onClick: function() { setTab(t); }
+            }, labels[t]);
+          })
+        ),
+
+        tab === 'manual' && h(Fragment, null,
+          h('p', { style: { fontSize: 13, color: 'var(--text-muted)', marginBottom: 16 } },
+            'Register an existing machine that\'s already running AgenticMail. The node will appear in the cluster and start reporting status.'
+          ),
+          h('div', { style: { display: 'grid', gap: 12 } },
+            h('div', null,
+              h('label', { style: { fontSize: 12, fontWeight: 600, display: 'block', marginBottom: 4 } }, 'Node Name'),
+              h('input', { style: S, value: form.name, placeholder: 'e.g., Office Mac Mini', onChange: function(e) { set('name', e.target.value); } })
+            ),
+            h('div', { style: { display: 'grid', gridTemplateColumns: '1fr 120px', gap: 8 } },
+              h('div', null,
+                h('label', { style: { fontSize: 12, fontWeight: 600, display: 'block', marginBottom: 4 } }, 'Host IP / Hostname *'),
+                h('input', { style: S, value: form.host, placeholder: '192.168.1.50 or worker.example.com', onChange: function(e) { set('host', e.target.value); } })
+              ),
+              h('div', null,
+                h('label', { style: { fontSize: 12, fontWeight: 600, display: 'block', marginBottom: 4 } }, 'Port'),
+                h('input', { style: S, type: 'number', value: form.port, onChange: function(e) { set('port', e.target.value); } })
+              )
+            ),
+            h('div', null,
+              h('label', { style: { fontSize: 12, fontWeight: 600, display: 'block', marginBottom: 4 } }, 'Node ID'),
+              h('input', { style: S, value: form.nodeId, placeholder: 'Auto-generated from hostname', onChange: function(e) { set('nodeId', e.target.value); } })
+            ),
+            // Test connection button
+            h('div', { style: { display: 'flex', gap: 8, alignItems: 'center' } },
+              h('button', { className: 'btn btn-secondary btn-sm', onClick: testConnection, disabled: testing || !form.host }, testing ? 'Testing...' : 'Test Connection'),
+              testResult && h('span', { style: { fontSize: 12, color: testResult.success ? 'var(--accent-green)' : 'var(--accent-red)' } },
+                testResult.success ? 'Connected! ' + (testResult.version || '') : 'Failed: ' + (testResult.error || 'unreachable')
+              )
+            ),
+          ),
+          h('div', { style: { display: 'flex', justifyContent: 'flex-end', gap: 8, marginTop: 20 } },
+            h('button', { className: 'btn btn-secondary', onClick: onClose }, 'Cancel'),
+            h('button', { className: 'btn btn-primary', onClick: saveManual, disabled: saving }, saving ? 'Adding...' : 'Add Node')
+          )
+        ),
+
+        tab === 'ssh' && h(Fragment, null,
+          h('p', { style: { fontSize: 13, color: 'var(--text-muted)', marginBottom: 16 } },
+            'Automatically install AgenticMail and configure a worker node on a remote machine via SSH. The dashboard will SSH in, install dependencies, and start the agent process.'
+          ),
+          h('div', { style: { display: 'grid', gap: 12 } },
+            h('div', null,
+              h('label', { style: { fontSize: 12, fontWeight: 600, display: 'block', marginBottom: 4 } }, 'Node Name'),
+              h('input', { style: S, value: form.name, placeholder: 'e.g., AWS Instance 1', onChange: function(e) { set('name', e.target.value); } })
+            ),
+            h('div', { style: { display: 'grid', gridTemplateColumns: '1fr 120px', gap: 8 } },
+              h('div', null,
+                h('label', { style: { fontSize: 12, fontWeight: 600, display: 'block', marginBottom: 4 } }, 'SSH Host *'),
+                h('input', { style: S, value: form.sshHost, placeholder: '1.2.3.4 or server.example.com', onChange: function(e) { set('sshHost', e.target.value); } })
+              ),
+              h('div', null,
+                h('label', { style: { fontSize: 12, fontWeight: 600, display: 'block', marginBottom: 4 } }, 'SSH User'),
+                h('input', { style: S, value: form.sshUser, onChange: function(e) { set('sshUser', e.target.value); } })
+              )
+            ),
+            h('div', null,
+              h('label', { style: { fontSize: 12, fontWeight: 600, display: 'block', marginBottom: 4 } }, 'SSH Private Key (paste or leave blank for default ~/.ssh/id_rsa)'),
+              h('textarea', { style: Object.assign({}, S, { height: 80, fontFamily: 'monospace', fontSize: 11 }), value: form.sshKey, placeholder: '-----BEGIN OPENSSH PRIVATE KEY-----\n...', onChange: function(e) { set('sshKey', e.target.value); } })
+            ),
+            h('div', null,
+              h('label', { style: { fontSize: 12, fontWeight: 600, display: 'block', marginBottom: 4 } }, 'Agent IDs to deploy (comma-separated, or leave blank)'),
+              h('input', { style: S, value: form.agentIds, placeholder: 'agent-uuid-1, agent-uuid-2', onChange: function(e) { set('agentIds', e.target.value); } })
+            ),
+          ),
+          h('div', { style: { display: 'flex', justifyContent: 'flex-end', gap: 8, marginTop: 20 } },
+            h('button', { className: 'btn btn-secondary', onClick: onClose }, 'Cancel'),
+            h('button', { className: 'btn btn-primary', onClick: deploySsh, disabled: saving || !form.sshHost }, saving ? 'Deploying...' : 'Deploy Worker')
+          )
+        ),
+
+        tab === 'script' && h(Fragment, null,
+          h('p', { style: { fontSize: 13, color: 'var(--text-muted)', marginBottom: 16 } },
+            'Generate a setup script to run on the target machine. Copy the script, SSH into the machine, and paste it.'
+          ),
+          h('div', { style: { display: 'grid', gap: 12 } },
+            h('div', { style: { display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 8 } },
+              h('div', null,
+                h('label', { style: { fontSize: 12, fontWeight: 600, display: 'block', marginBottom: 4 } }, 'Node Name'),
+                h('input', { style: S, value: form.name, placeholder: 'my-worker', onChange: function(e) { set('name', e.target.value); } })
+              ),
+              h('div', null,
+                h('label', { style: { fontSize: 12, fontWeight: 600, display: 'block', marginBottom: 4 } }, 'Port'),
+                h('input', { style: S, type: 'number', value: form.port, onChange: function(e) { set('port', e.target.value); } })
+              )
+            ),
+            h('button', { className: 'btn btn-primary btn-sm', onClick: generateScript }, 'Generate Setup Script'),
+            scriptGenerated && h(Fragment, null,
+              h('div', { style: { position: 'relative' } },
+                h('pre', { style: { background: 'var(--bg-primary)', border: '1px solid var(--border)', borderRadius: 8, padding: 12, fontSize: 11, maxHeight: 300, overflow: 'auto', whiteSpace: 'pre-wrap' } }, scriptGenerated),
+                h('button', { className: 'btn btn-secondary btn-sm', style: { position: 'absolute', top: 8, right: 8 },
+                  onClick: function() { navigator.clipboard.writeText(scriptGenerated); toast('Script copied to clipboard', 'success'); }
+                }, 'Copy')
+              )
+            )
+          ),
+          h('div', { style: { display: 'flex', justifyContent: 'flex-end', gap: 8, marginTop: 20 } },
+            h('button', { className: 'btn btn-secondary', onClick: onClose }, 'Close')
+          )
+        )
+      )
+    )
+  );
+}
+
+function NodeDetailModal({ node, onClose, onRefresh, toast }) {
+  var [pinging, setPinging] = useState(false);
+  var [pingResult, setPingResult] = useState(null);
+  var [agents, setAgents] = useState([]);
+
+  useEffect(function() {
+    // Fetch agent details for this node
+    if (node.agents && node.agents.length > 0) {
+      engineCall('/agents').then(function(d) {
+        var all = d.agents || d || [];
+        setAgents(all.filter(function(a) { return node.agents.indexOf(a.id) >= 0; }));
+      }).catch(function() {});
+    }
+  }, [node.nodeId]);
+
+  var pingNode = function() {
+    setPinging(true); setPingResult(null);
+    engineCall('/cluster/test-connection', {
+      method: 'POST',
+      body: JSON.stringify({ host: node.host, port: node.port }),
+    }).then(function(d) { setPingResult(d); setPinging(false); })
+      .catch(function(e) { setPingResult({ success: false, error: e.message }); setPinging(false); });
+  };
+
+  var restartNode = function() {
+    if (!confirm('Restart all agents on ' + node.name + '?')) return;
+    engineCall('/cluster/nodes/' + node.nodeId + '/restart', { method: 'POST' })
+      .then(function() { toast('Restart signal sent', 'success'); })
+      .catch(function(e) { toast(e.message, 'error'); });
+  };
+
+  var statusColor = { online: 'var(--accent-green)', degraded: 'var(--accent-orange)', offline: 'var(--text-muted)' }[node.status] || 'var(--text-muted)';
+  var uptime = node.onlineSince ? Math.floor((Date.now() - new Date(node.registeredAt).getTime()) / 86400000) + ' days' : '-';
+
+  return h('div', { className: 'modal-overlay', onClick: function(e) { if (e.target.className === 'modal-overlay') onClose(); } },
+    h('div', { className: 'modal', style: { maxWidth: 600 } },
+      h('div', { className: 'modal-header' },
+        h('div', { style: { display: 'flex', alignItems: 'center', gap: 8 } },
+          h('span', { style: { width: 10, height: 10, borderRadius: '50%', background: statusColor, display: 'inline-block' } }),
+          h('h3', { style: { margin: 0 } }, node.name || node.nodeId)
+        ),
+        h('button', { className: 'btn btn-ghost btn-sm', onClick: onClose }, 'X')
+      ),
+      h('div', { className: 'modal-body' },
+        // Info grid
+        h('div', { style: { display: 'grid', gridTemplateColumns: '1fr 1fr 1fr', gap: 16, marginBottom: 20 } },
+          h('div', null, h('div', { style: { fontSize: 11, color: 'var(--text-muted)' } }, 'Platform'), h('div', { style: { fontWeight: 600 } }, node.platform + '/' + node.arch)),
+          h('div', null, h('div', { style: { fontSize: 11, color: 'var(--text-muted)' } }, 'CPUs'), h('div', { style: { fontWeight: 600 } }, node.cpuCount)),
+          h('div', null, h('div', { style: { fontSize: 11, color: 'var(--text-muted)' } }, 'Memory'), h('div', { style: { fontWeight: 600 } }, node.memoryMb >= 1024 ? (node.memoryMb / 1024).toFixed(1) + ' GB' : node.memoryMb + ' MB')),
+          h('div', null, h('div', { style: { fontSize: 11, color: 'var(--text-muted)' } }, 'Address'), h('div', { style: { fontWeight: 600, fontFamily: 'monospace', fontSize: 12 } }, node.host + ':' + node.port)),
+          h('div', null, h('div', { style: { fontSize: 11, color: 'var(--text-muted)' } }, 'Version'), h('div', { style: { fontWeight: 600 } }, 'v' + (node.version || '?'))),
+          h('div', null, h('div', { style: { fontSize: 11, color: 'var(--text-muted)' } }, 'Registered'), h('div', { style: { fontWeight: 600 } }, node.registeredAt ? new Date(node.registeredAt).toLocaleDateString() : '-')),
+        ),
+
+        // Capabilities
+        node.capabilities && node.capabilities.length > 0 && h('div', { style: { marginBottom: 16 } },
+          h('div', { style: { fontSize: 12, fontWeight: 600, marginBottom: 6 } }, 'Capabilities'),
+          h('div', { style: { display: 'flex', gap: 4, flexWrap: 'wrap' } },
+            node.capabilities.map(function(c) { return h('span', { key: c, className: 'badge badge-neutral' }, c); })
+          )
+        ),
+
+        // Agents on this node
+        h('div', { style: { marginBottom: 16 } },
+          h('div', { style: { fontSize: 12, fontWeight: 600, marginBottom: 6 } }, 'Agents (' + (node.agents ? node.agents.length : 0) + ')'),
+          node.agents && node.agents.length > 0
+            ? h('div', { style: { display: 'grid', gap: 6 } },
+                agents.length > 0
+                  ? agents.map(function(a) {
+                      return h('div', { key: a.id, style: { display: 'flex', alignItems: 'center', gap: 8, padding: '6px 10px', background: 'var(--bg-secondary)', borderRadius: 6 } },
+                        h('span', { style: { fontWeight: 600, fontSize: 13 } }, a.name || a.id),
+                        h('span', { style: { fontSize: 11, color: 'var(--text-muted)', fontFamily: 'monospace' } }, a.email || ''),
+                        h('span', { className: 'badge badge-neutral', style: { marginLeft: 'auto' } }, a.role || 'agent')
+                      );
+                    })
+                  : node.agents.map(function(id) {
+                      return h('div', { key: id, style: { padding: '6px 10px', background: 'var(--bg-secondary)', borderRadius: 6, fontFamily: 'monospace', fontSize: 12 } }, id);
+                    })
+              )
+            : h('div', { style: { fontSize: 13, color: 'var(--text-muted)', fontStyle: 'italic' } }, 'No agents running on this node')
+        ),
+
+        // Actions
+        h('div', { style: { display: 'flex', gap: 8, paddingTop: 12, borderTop: '1px solid var(--border)' } },
+          h('button', { className: 'btn btn-secondary btn-sm', onClick: pingNode, disabled: pinging }, pinging ? 'Pinging...' : 'Ping Node'),
+          pingResult && h('span', { style: { fontSize: 12, color: pingResult.success ? 'var(--accent-green)' : 'var(--accent-red)', alignSelf: 'center' } },
+            pingResult.success ? 'Reachable (' + (pingResult.latencyMs || '?') + 'ms)' : 'Unreachable: ' + (pingResult.error || '')
+          ),
+          h('div', { style: { flex: 1 } }),
+          h('button', { className: 'btn btn-secondary btn-sm', onClick: restartNode }, 'Restart Agents'),
+        )
+      )
+    )
+  );
+}
 
 export function ClusterPage() {
   var app = useApp();
@@ -7,6 +327,8 @@ export function ClusterPage() {
   var [nodes, setNodes] = useState([]);
   var [stats, setStats] = useState(null);
   var [loading, setLoading] = useState(true);
+  var [addingNode, setAddingNode] = useState(false);
+  var [selectedNode, setSelectedNode] = useState(null);
 
   var load = function() {
     engineCall('/cluster/nodes').then(function(d) {
@@ -28,31 +350,30 @@ export function ClusterPage() {
           setNodes(function(prev) {
             var idx = prev.findIndex(function(n) { return n.nodeId === d.nodeId; });
             var next = prev.slice();
-            if (idx >= 0) {
-              if (d.event === 'offline') { next[idx] = Object.assign({}, next[idx], { status: 'offline' }); }
-              else { next[idx] = d; }
-            } else if (d.event === 'register' || d.event === 'snapshot') {
-              next.push(d);
-            }
+            if (d.event === 'offline' && idx >= 0) { next[idx] = Object.assign({}, next[idx], { status: 'offline', agents: [] }); }
+            else if (idx >= 0) { next[idx] = d; }
+            else if (d.event === 'register' || d.event === 'snapshot') { next.push(d); }
             return next;
           });
+          // Refresh stats
+          engineCall('/cluster/nodes').then(function(dd) { setStats(dd.stats || null); }).catch(function() {});
         }
       } catch(e) {}
     };
     return function() { es.close(); };
   }, []);
 
-  var removeNode = function(nodeId) {
-    if (!confirm('Remove worker node "' + nodeId + '"? Agents on it will become unreachable.')) return;
+  var removeNode = function(e, nodeId) {
+    e.stopPropagation();
+    if (!confirm('Remove worker node "' + nodeId + '"? This only removes it from the dashboard — agents on it will keep running but stop reporting.')) return;
     engineCall('/cluster/nodes/' + nodeId, { method: 'DELETE' }).then(function() {
       toast('Node removed', 'success');
       load();
     }).catch(function(e) { toast(e.message, 'error'); });
   };
 
-  var statusColor = function(s) {
-    return { online: 'success', degraded: 'warning', offline: 'neutral' }[s] || 'neutral';
-  };
+  var statusColor = function(s) { return { online: 'success', degraded: 'warning', offline: 'neutral' }[s] || 'neutral'; };
+  var statusDot = function(s) { return { online: 'var(--accent-green)', degraded: 'var(--accent-orange)', offline: 'var(--text-muted)' }[s] || 'var(--text-muted)'; };
 
   var formatBytes = function(mb) {
     if (mb >= 1024) return (mb / 1024).toFixed(1) + ' GB';
@@ -71,107 +392,117 @@ export function ClusterPage() {
   if (loading) return h('div', { style: { padding: 40, textAlign: 'center', color: 'var(--text-muted)' } }, 'Loading cluster...');
 
   return h(Fragment, null,
+    addingNode && h(AddNodeModal, { onClose: function() { setAddingNode(false); }, onAdded: load, toast: toast }),
+    selectedNode && h(NodeDetailModal, { node: selectedNode, onClose: function() { setSelectedNode(null); }, onRefresh: load, toast: toast }),
+
     h('div', { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 20 } },
       h('div', null,
-        h('h1', { style: { fontSize: 20, fontWeight: 700 } }, 'Cluster'),
-        h('p', { style: { color: 'var(--text-muted)', fontSize: 13 } }, 'Manage worker nodes running agents across multiple machines')
+        h('h1', { style: { fontSize: 20, fontWeight: 700, display: 'flex', alignItems: 'center', gap: 8 } }, 'Cluster', h(KnowledgeLink, { page: 'cluster' }),
+          h(HelpButton, { label: 'Cluster' },
+            h('p', null, 'Manage worker nodes running agents across multiple machines. Scale horizontally by adding machines — each one runs agents that report back to this dashboard.'),
+            h('p', { style: { marginTop: 8 } }, h('strong', null, '3 ways to add a worker:'),
+              h('ul', { style: { paddingLeft: 16, marginTop: 4 } },
+                h('li', null, h('strong', null, 'Manual'), ' — Register an existing machine by IP/hostname'),
+                h('li', null, h('strong', null, 'SSH Deploy'), ' — Auto-install on a remote machine via SSH'),
+                h('li', null, h('strong', null, 'Setup Script'), ' — Generate a script to run on the target machine')
+              )
+            )
+          )
+        ),
+        h('p', { style: { color: 'var(--text-muted)', fontSize: 13 } }, 'Scale your AI workforce across multiple machines')
       ),
-      h('button', { className: 'btn btn-secondary btn-sm', onClick: load }, I.refresh(), ' Refresh')
+      h('div', { style: { display: 'flex', gap: 8 } },
+        h('button', { className: 'btn btn-secondary btn-sm', onClick: load }, I.refresh(), ' Refresh'),
+        h('button', { className: 'btn btn-primary', onClick: function() { setAddingNode(true); } }, I.plus(), ' Add Worker Node')
+      )
     ),
 
     // Stats cards
-    stats && h('div', { style: { display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(160px, 1fr))', gap: 12, marginBottom: 20 } },
-      h('div', { className: 'card' }, h('div', { className: 'card-body', style: { padding: 16 } },
-        h('div', { style: { fontSize: 24, fontWeight: 700 } }, stats.totalNodes),
+    stats && h('div', { style: { display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(150px, 1fr))', gap: 12, marginBottom: 20 } },
+      h('div', { className: 'card' }, h('div', { className: 'card-body', style: { padding: 16, textAlign: 'center' } },
+        h('div', { style: { fontSize: 28, fontWeight: 700 } }, stats.totalNodes),
         h('div', { style: { fontSize: 12, color: 'var(--text-muted)' } }, 'Total Nodes')
       )),
-      h('div', { className: 'card' }, h('div', { className: 'card-body', style: { padding: 16 } },
-        h('div', { style: { fontSize: 24, fontWeight: 700, color: 'var(--accent-green)' } }, stats.onlineNodes),
+      h('div', { className: 'card' }, h('div', { className: 'card-body', style: { padding: 16, textAlign: 'center' } },
+        h('div', { style: { fontSize: 28, fontWeight: 700, color: 'var(--accent-green)' } }, stats.onlineNodes),
         h('div', { style: { fontSize: 12, color: 'var(--text-muted)' } }, 'Online')
       )),
-      h('div', { className: 'card' }, h('div', { className: 'card-body', style: { padding: 16 } },
-        h('div', { style: { fontSize: 24, fontWeight: 700 } }, stats.totalAgents),
+      h('div', { className: 'card' }, h('div', { className: 'card-body', style: { padding: 16, textAlign: 'center' } },
+        h('div', { style: { fontSize: 28, fontWeight: 700 } }, stats.totalAgents),
         h('div', { style: { fontSize: 12, color: 'var(--text-muted)' } }, 'Running Agents')
       )),
-      h('div', { className: 'card' }, h('div', { className: 'card-body', style: { padding: 16 } },
-        h('div', { style: { fontSize: 24, fontWeight: 700 } }, stats.totalCpus),
+      h('div', { className: 'card' }, h('div', { className: 'card-body', style: { padding: 16, textAlign: 'center' } },
+        h('div', { style: { fontSize: 28, fontWeight: 700 } }, stats.totalCpus),
         h('div', { style: { fontSize: 12, color: 'var(--text-muted)' } }, 'Total CPUs')
       )),
-      h('div', { className: 'card' }, h('div', { className: 'card-body', style: { padding: 16 } },
-        h('div', { style: { fontSize: 24, fontWeight: 700 } }, formatBytes(stats.totalMemoryMb)),
+      h('div', { className: 'card' }, h('div', { className: 'card-body', style: { padding: 16, textAlign: 'center' } },
+        h('div', { style: { fontSize: 28, fontWeight: 700 } }, formatBytes(stats.totalMemoryMb)),
         h('div', { style: { fontSize: 12, color: 'var(--text-muted)' } }, 'Total Memory')
       ))
     ),
 
     // Nodes
     nodes.length === 0
-      ? h('div', { className: 'card' }, h('div', { className: 'card-body' },
+      ? h('div', { className: 'card' }, h('div', { className: 'card-body', style: { padding: 40 } },
           h('div', { className: 'empty-state' },
             I.server(),
             h('h3', null, 'No worker nodes'),
-            h('p', null, 'Worker nodes auto-register when you deploy agents to remote machines.'),
-            h('div', { style: { marginTop: 16, padding: 16, background: 'var(--bg-secondary)', borderRadius: 8, textAlign: 'left', maxWidth: 500, margin: '16px auto' } },
-              h('div', { style: { fontWeight: 600, marginBottom: 8 } }, 'How to add a worker node:'),
-              h('ol', { style: { paddingLeft: 20, fontSize: 13, color: 'var(--text-muted)', lineHeight: 1.8 } },
-                h('li', null, 'Install on the remote machine: ', h('code', null, 'npm i -g @agenticmail/enterprise')),
-                h('li', null, 'Set environment variables:'),
-                h('pre', { style: { background: 'var(--bg-primary)', padding: 8, borderRadius: 4, fontSize: 11, overflow: 'auto', margin: '4px 0' } },
-                  'ENTERPRISE_URL=https://your-dashboard.agenticmail.io\nWORKER_NODE_ID=mac-mini-2\nWORKER_NAME="Office Mac Mini"\nDATABASE_URL=postgres://...'
-                ),
-                h('li', null, 'Start agent: ', h('code', null, 'agenticmail-enterprise agent --id <agent-id>')),
-                h('li', null, 'The node will auto-register and appear here')
-              )
-            )
+            h('p', null, 'Your agents currently run on this machine. Add worker nodes to distribute agents across multiple machines for horizontal scaling.'),
+            h('button', { className: 'btn btn-primary', style: { marginTop: 12 }, onClick: function() { setAddingNode(true); } }, I.plus(), ' Add Your First Worker Node')
           )
         ))
       : h('div', { style: { display: 'grid', gap: 12 } },
           nodes.map(function(node) {
-            return h('div', { key: node.nodeId, className: 'card' },
+            return h('div', { key: node.nodeId, className: 'card', style: { cursor: 'pointer', transition: 'border-color 0.2s' },
+              onClick: function() { setSelectedNode(node); },
+              onMouseEnter: function(e) { e.currentTarget.style.borderColor = 'var(--accent)'; },
+              onMouseLeave: function(e) { e.currentTarget.style.borderColor = ''; }
+            },
               h('div', { className: 'card-body', style: { padding: 16 } },
                 h('div', { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' } },
-                  h('div', null,
-                    h('div', { style: { display: 'flex', alignItems: 'center', gap: 8 } },
-                      h('span', { style: { fontSize: 16, fontWeight: 700 } }, node.name || node.nodeId),
-                      h('span', { className: 'badge badge-' + statusColor(node.status), style: { textTransform: 'capitalize' } }, node.status)
-                    ),
-                    h('div', { style: { fontSize: 12, color: 'var(--text-muted)', marginTop: 4 } },
-                      node.host + ':' + node.port, ' | ',
-                      node.platform + '/' + node.arch, ' | ',
-                      'v' + node.version
+                  h('div', { style: { display: 'flex', alignItems: 'center', gap: 10 } },
+                    // Status dot
+                    h('span', { style: { width: 12, height: 12, borderRadius: '50%', background: statusDot(node.status), flexShrink: 0, boxShadow: node.status === 'online' ? '0 0 6px ' + statusDot(node.status) : 'none' } }),
+                    h('div', null,
+                      h('div', { style: { fontSize: 15, fontWeight: 700 } }, node.name || node.nodeId),
+                      h('div', { style: { fontSize: 12, color: 'var(--text-muted)', fontFamily: 'monospace' } }, node.host + ':' + node.port)
                     )
                   ),
-                  h('button', { className: 'btn btn-ghost btn-sm', onClick: function() { removeNode(node.nodeId); }, title: 'Remove' },
-                    I.trash()
+                  h('div', { style: { display: 'flex', alignItems: 'center', gap: 8 } },
+                    h('span', { className: 'badge badge-' + statusColor(node.status), style: { textTransform: 'capitalize' } }, node.status),
+                    h('button', { className: 'btn btn-ghost btn-sm', onClick: function(e) { removeNode(e, node.nodeId); }, title: 'Remove node' }, I.trash())
                   )
                 ),
-                // Resources
-                h('div', { style: { display: 'flex', gap: 20, marginTop: 12 } },
+                // Metrics row
+                h('div', { style: { display: 'flex', gap: 24, marginTop: 12, paddingTop: 12, borderTop: '1px solid var(--border)' } },
+                  h('div', null,
+                    h('div', { style: { fontSize: 10, color: 'var(--text-muted)', textTransform: 'uppercase', letterSpacing: 0.5 } }, 'Platform'),
+                    h('div', { style: { fontWeight: 600, fontSize: 13 } }, node.platform + '/' + node.arch)
+                  ),
                   h('div', null,
-                    h('div', { style: { fontSize: 11, color: 'var(--text-muted)' } }, 'CPUs'),
-                    h('div', { style: { fontWeight: 600 } }, node.cpuCount)
+                    h('div', { style: { fontSize: 10, color: 'var(--text-muted)', textTransform: 'uppercase', letterSpacing: 0.5 } }, 'CPUs'),
+                    h('div', { style: { fontWeight: 600, fontSize: 13 } }, node.cpuCount || '-')
                   ),
                   h('div', null,
-                    h('div', { style: { fontSize: 11, color: 'var(--text-muted)' } }, 'Memory'),
-                    h('div', { style: { fontWeight: 600 } }, formatBytes(node.memoryMb))
+                    h('div', { style: { fontSize: 10, color: 'var(--text-muted)', textTransform: 'uppercase', letterSpacing: 0.5 } }, 'Memory'),
+                    h('div', { style: { fontWeight: 600, fontSize: 13 } }, formatBytes(node.memoryMb))
                   ),
                   h('div', null,
-                    h('div', { style: { fontSize: 11, color: 'var(--text-muted)' } }, 'Agents'),
-                    h('div', { style: { fontWeight: 600 } }, node.agents ? node.agents.length : 0)
+                    h('div', { style: { fontSize: 10, color: 'var(--text-muted)', textTransform: 'uppercase', letterSpacing: 0.5 } }, 'Agents'),
+                    h('div', { style: { fontWeight: 600, fontSize: 13 } }, node.agents ? node.agents.length : 0)
                   ),
                   h('div', null,
-                    h('div', { style: { fontSize: 11, color: 'var(--text-muted)' } }, 'Last Heartbeat'),
-                    h('div', { style: { fontWeight: 600, color: node.status === 'online' ? 'var(--accent-green)' : 'var(--text-muted)' } }, timeSince(node.lastHeartbeat))
+                    h('div', { style: { fontSize: 10, color: 'var(--text-muted)', textTransform: 'uppercase', letterSpacing: 0.5 } }, 'Version'),
+                    h('div', { style: { fontWeight: 600, fontSize: 13 } }, 'v' + (node.version || '?'))
+                  ),
+                  h('div', null,
+                    h('div', { style: { fontSize: 10, color: 'var(--text-muted)', textTransform: 'uppercase', letterSpacing: 0.5 } }, 'Last Seen'),
+                    h('div', { style: { fontWeight: 600, fontSize: 13, color: node.status === 'online' ? 'var(--accent-green)' : 'var(--text-muted)' } }, timeSince(node.lastHeartbeat))
                   )
                 ),
                 // Capabilities
                 node.capabilities && node.capabilities.length > 0 && h('div', { style: { display: 'flex', gap: 4, marginTop: 8 } },
-                  node.capabilities.map(function(c) {
-                    return h('span', { key: c, className: 'badge badge-neutral', style: { fontSize: 10 } }, c);
-                  })
-                ),
-                // Agent list
-                node.agents && node.agents.length > 0 && h('div', { style: { marginTop: 8, fontSize: 12, color: 'var(--text-muted)' } },
-                  'Running: ', node.agents.join(', ')
+                  node.capabilities.map(function(c) { return h('span', { key: c, className: 'badge badge-neutral', style: { fontSize: 10 } }, c); })
                 )
               )
             );

package/src/database-access/connection-manager.ts

@@ -17,7 +17,7 @@ import type {
   ConnectionPoolStats,
   DatabasePermission,
 } from './types.js';
-import { sanitizeQuery, classifyQuery, sanitizeForLogging, type SanitizeResult } from './query-sanitizer.js';
+import { sanitizeQuery, sanitizeForLogging, type SanitizeResult } from './query-sanitizer.js';
 import crypto from 'crypto';
 
 // ─── Driver Interfaces ───────────────────────────────────────────────────────
@@ -124,7 +124,7 @@ export class DatabaseConnectionManager {
     return Array.isArray(result) ? result : (result?.rows || []);
   }
 
-  private async dbGet(sql: string, params?: any[]): Promise<any> {
+  private async _dbGet(sql: string, params?: any[]): Promise<any> {
     if (!this.engineDb) return null;
     if (this.engineDb.get) return this.engineDb.get(sql, params);
     const rows = await this.dbAll(sql, params);
@@ -477,7 +477,7 @@ export class DatabaseConnectionManager {
     const finalSql = sanitizeResult.sanitizedQuery || query.sql;
 
     // 4. Check concurrent query limit
-    const maxConcurrent = access.queryLimits?.maxConcurrentQueries ?? config.queryLimits?.maxConcurrentQueries ?? 5;
+    const _maxConcurrent = access.queryLimits?.maxConcurrentQueries ?? config.queryLimits?.maxConcurrentQueries ?? 5;
     // (In production, track active queries per connection — simplified here)
 
     // 5. Execute with timeout
@@ -717,7 +717,7 @@ export class DatabaseConnectionManager {
   private async logAudit(
     query: DatabaseQuery,
     config: DatabaseConnectionConfig,
-    access: AgentDatabaseAccess,
+    _access: AgentDatabaseAccess,
     operation: string,
     rowsAffected: number,
     success: boolean,
@@ -875,7 +875,7 @@ export class DatabaseConnectionManager {
   /**
    * Parse a connection string to extract host/port/database/username when fields are missing.
    */
-  private parseConnectionString(connStr: string, type: string): { host?: string; port?: number; database?: string; username?: string } {
+  private parseConnectionString(connStr: string, _type: string): { host?: string; port?: number; database?: string; username?: string } {
     try {
       // Handle postgres://, mysql://, mongodb://, redis://, libsql:// etc
       const cleaned = connStr.replace(/^(postgres|postgresql|mysql|mongodb\+srv|mongodb|redis|rediss|libsql)/, 'http');
@@ -1149,7 +1149,7 @@ export class DatabaseConnectionManager {
         let username = config.username;
         if (connStr) {
           try {
-            const parsed = self.parseConnectionString(connStr, 'redis');
+            const _parsed = self.parseConnectionString(connStr, 'redis');
             if (!password) {
               // redis://user:pass@host:port or redis://:pass@host:port
               const url = new URL(connStr.replace(/^redis(s?)/, 'http'));

package/src/database-access/routes.ts

@@ -7,7 +7,6 @@
 
 import { Hono } from 'hono';
 import type { DatabaseConnectionManager } from './connection-manager.js';
-import type { DatabasePermission } from './types.js';
 
 async function notifyAgentReload(agentId: string) {
   try {

package/src/db/dynamodb.ts

@@ -33,7 +33,7 @@ const TABLE = 'agenticmail_enterprise';
 // GSI1: GSI1PK/GSI1SK for secondary lookups (email, name, etc.)
 
 function pk(type: string) { return `${type}`; }
-function sk(id: string) { return id; }
+function _sk(id: string) { return id; }
 
 export class DynamoAdapter extends DatabaseAdapter {
   readonly type = 'dynamodb' as const;