web-agent-bridge 3.2.0 → 3.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (202) hide show
  1. package/LICENSE +72 -72
  2. package/README.ar.md +1286 -1152
  3. package/README.md +1764 -1635
  4. package/bin/agent-runner.js +474 -474
  5. package/bin/cli.js +237 -138
  6. package/bin/wab.js +80 -80
  7. package/examples/bidi-agent.js +119 -119
  8. package/examples/cross-site-agent.js +91 -91
  9. package/examples/mcp-agent.js +94 -94
  10. package/examples/next-app-router/README.md +44 -44
  11. package/examples/puppeteer-agent.js +108 -108
  12. package/examples/saas-dashboard/README.md +55 -55
  13. package/examples/shopify-hydrogen/README.md +74 -74
  14. package/examples/vision-agent.js +171 -171
  15. package/examples/wordpress-elementor/README.md +77 -77
  16. package/package.json +16 -3
  17. package/public/.well-known/agent-tools.json +180 -180
  18. package/public/.well-known/ai-assets.json +59 -59
  19. package/public/.well-known/security.txt +8 -0
  20. package/public/agent-workspace.html +349 -349
  21. package/public/ai.html +198 -198
  22. package/public/api.html +413 -412
  23. package/public/browser.html +486 -486
  24. package/public/commander-dashboard.html +243 -243
  25. package/public/cookies.html +210 -210
  26. package/public/css/agent-workspace.css +1713 -1713
  27. package/public/css/premium.css +317 -317
  28. package/public/css/styles.css +1235 -1235
  29. package/public/dashboard.html +706 -706
  30. package/public/dns.html +507 -0
  31. package/public/docs.html +587 -587
  32. package/public/feed.xml +89 -89
  33. package/public/growth.html +463 -463
  34. package/public/index.html +1070 -982
  35. package/public/integrations.html +556 -0
  36. package/public/js/agent-workspace.js +1740 -1740
  37. package/public/js/auth-nav.js +31 -31
  38. package/public/js/auth-redirect.js +12 -12
  39. package/public/js/cookie-consent.js +56 -56
  40. package/public/js/wab-demo-page.js +721 -721
  41. package/public/js/ws-client.js +74 -74
  42. package/public/llms-full.txt +360 -360
  43. package/public/llms.txt +125 -125
  44. package/public/login.html +85 -85
  45. package/public/mesh-dashboard.html +328 -328
  46. package/public/openapi.json +580 -580
  47. package/public/phone-shield.html +281 -0
  48. package/public/premium-dashboard.html +2489 -2489
  49. package/public/premium.html +793 -793
  50. package/public/privacy.html +297 -297
  51. package/public/register.html +105 -105
  52. package/public/robots.txt +87 -87
  53. package/public/script/wab-consent.d.ts +36 -36
  54. package/public/script/wab-consent.js +104 -104
  55. package/public/script/wab-schema.js +131 -131
  56. package/public/script/wab.d.ts +108 -108
  57. package/public/script/wab.min.js +580 -580
  58. package/public/security.txt +8 -0
  59. package/public/terms.html +256 -256
  60. package/script/ai-agent-bridge.js +1754 -1754
  61. package/sdk/README.md +99 -99
  62. package/sdk/agent-mesh.js +449 -449
  63. package/sdk/commander.js +262 -262
  64. package/sdk/index.d.ts +464 -464
  65. package/sdk/index.js +12 -1
  66. package/sdk/multi-agent.js +318 -318
  67. package/sdk/package.json +1 -1
  68. package/sdk/safety-shield.js +219 -0
  69. package/sdk/schema-discovery.js +83 -83
  70. package/server/adapters/index.js +520 -520
  71. package/server/config/plans.js +367 -367
  72. package/server/config/secrets.js +102 -102
  73. package/server/control-plane/index.js +301 -301
  74. package/server/data-plane/index.js +354 -354
  75. package/server/index.js +531 -427
  76. package/server/llm/index.js +404 -404
  77. package/server/middleware/adminAuth.js +35 -35
  78. package/server/middleware/auth.js +50 -50
  79. package/server/middleware/featureGate.js +88 -88
  80. package/server/middleware/rateLimits.js +100 -100
  81. package/server/middleware/sensitiveAction.js +157 -0
  82. package/server/migrations/001_add_analytics_indexes.sql +7 -7
  83. package/server/migrations/002_premium_features.sql +418 -418
  84. package/server/migrations/003_ads_integer_cents.sql +33 -33
  85. package/server/migrations/004_agent_os.sql +158 -158
  86. package/server/migrations/005_marketplace_metering.sql +126 -126
  87. package/server/models/adapters/index.js +33 -33
  88. package/server/models/adapters/mysql.js +183 -183
  89. package/server/models/adapters/postgresql.js +172 -172
  90. package/server/models/adapters/sqlite.js +7 -7
  91. package/server/models/db.js +681 -681
  92. package/server/observability/failure-analysis.js +337 -337
  93. package/server/observability/index.js +394 -394
  94. package/server/protocol/capabilities.js +223 -223
  95. package/server/protocol/index.js +243 -243
  96. package/server/protocol/schema.js +584 -584
  97. package/server/registry/certification.js +271 -271
  98. package/server/registry/index.js +326 -326
  99. package/server/routes/admin-premium.js +671 -671
  100. package/server/routes/admin.js +261 -261
  101. package/server/routes/ads.js +130 -130
  102. package/server/routes/agent-workspace.js +540 -540
  103. package/server/routes/api.js +150 -150
  104. package/server/routes/auth.js +71 -71
  105. package/server/routes/billing.js +45 -45
  106. package/server/routes/commander.js +316 -316
  107. package/server/routes/demo-showcase.js +332 -332
  108. package/server/routes/demo-store.js +154 -0
  109. package/server/routes/discovery.js +417 -417
  110. package/server/routes/gateway.js +173 -157
  111. package/server/routes/license.js +251 -240
  112. package/server/routes/mesh.js +469 -469
  113. package/server/routes/noscript.js +543 -543
  114. package/server/routes/premium-v2.js +686 -686
  115. package/server/routes/premium.js +724 -724
  116. package/server/routes/runtime.js +2148 -2147
  117. package/server/routes/sovereign.js +465 -385
  118. package/server/routes/universal.js +200 -185
  119. package/server/routes/wab-api.js +850 -501
  120. package/server/runtime/container-worker.js +111 -111
  121. package/server/runtime/container.js +448 -448
  122. package/server/runtime/distributed-worker.js +362 -362
  123. package/server/runtime/event-bus.js +210 -210
  124. package/server/runtime/index.js +253 -253
  125. package/server/runtime/queue.js +599 -599
  126. package/server/runtime/replay.js +666 -666
  127. package/server/runtime/sandbox.js +266 -266
  128. package/server/runtime/scheduler.js +534 -534
  129. package/server/runtime/session-engine.js +293 -293
  130. package/server/runtime/state-manager.js +188 -188
  131. package/server/security/cross-site-redactor.js +196 -0
  132. package/server/security/dry-run.js +180 -0
  133. package/server/security/human-gate-rate-limit.js +147 -0
  134. package/server/security/human-gate-transports.js +178 -0
  135. package/server/security/human-gate.js +281 -0
  136. package/server/security/index.js +368 -368
  137. package/server/security/intent-engine.js +245 -0
  138. package/server/security/reward-guard.js +171 -0
  139. package/server/security/rollback-store.js +239 -0
  140. package/server/security/token-scope.js +404 -0
  141. package/server/security/url-policy.js +139 -0
  142. package/server/services/agent-chat.js +506 -506
  143. package/server/services/agent-learning.js +601 -575
  144. package/server/services/agent-memory.js +625 -625
  145. package/server/services/agent-mesh.js +555 -539
  146. package/server/services/agent-symphony.js +717 -717
  147. package/server/services/agent-tasks.js +1807 -1807
  148. package/server/services/api-key-engine.js +292 -261
  149. package/server/services/cluster.js +894 -894
  150. package/server/services/commander.js +738 -738
  151. package/server/services/edge-compute.js +440 -440
  152. package/server/services/email.js +204 -204
  153. package/server/services/hosted-runtime.js +205 -205
  154. package/server/services/lfd.js +635 -635
  155. package/server/services/local-ai.js +389 -389
  156. package/server/services/marketplace.js +270 -270
  157. package/server/services/metering.js +182 -182
  158. package/server/services/modules/affiliate-intelligence.js +93 -93
  159. package/server/services/modules/agent-firewall.js +90 -90
  160. package/server/services/modules/bounty.js +89 -89
  161. package/server/services/modules/collective-bargaining.js +92 -92
  162. package/server/services/modules/dark-pattern.js +66 -66
  163. package/server/services/modules/gov-intelligence.js +45 -45
  164. package/server/services/modules/neural.js +55 -55
  165. package/server/services/modules/notary.js +49 -49
  166. package/server/services/modules/price-time-machine.js +86 -86
  167. package/server/services/modules/protocol.js +104 -104
  168. package/server/services/negotiation.js +439 -439
  169. package/server/services/plugins.js +771 -771
  170. package/server/services/price-intelligence.js +566 -566
  171. package/server/services/price-shield.js +1137 -1137
  172. package/server/services/reputation.js +465 -465
  173. package/server/services/search-engine.js +357 -357
  174. package/server/services/security.js +513 -513
  175. package/server/services/self-healing.js +843 -843
  176. package/server/services/sovereign-shield.js +542 -0
  177. package/server/services/stripe.js +192 -192
  178. package/server/services/swarm.js +788 -788
  179. package/server/services/universal-scraper.js +662 -661
  180. package/server/services/verification.js +481 -481
  181. package/server/services/vision.js +1163 -1163
  182. package/server/utils/cache.js +125 -125
  183. package/server/utils/migrate.js +81 -81
  184. package/server/utils/safe-fetch.js +228 -0
  185. package/server/utils/secureFields.js +50 -50
  186. package/server/ws.js +161 -161
  187. package/templates/artisan-marketplace.yaml +104 -104
  188. package/templates/book-price-scout.yaml +98 -98
  189. package/templates/electronics-price-tracker.yaml +108 -108
  190. package/templates/flight-deal-hunter.yaml +113 -113
  191. package/templates/freelancer-direct.yaml +116 -116
  192. package/templates/grocery-price-compare.yaml +93 -93
  193. package/templates/hotel-direct-booking.yaml +113 -113
  194. package/templates/local-services.yaml +98 -98
  195. package/templates/olive-oil-tunisia.yaml +88 -88
  196. package/templates/organic-farm-fresh.yaml +101 -101
  197. package/templates/restaurant-direct.yaml +97 -97
  198. package/public/score.html +0 -263
  199. package/server/migrations/006_growth_suite.sql +0 -138
  200. package/server/routes/growth.js +0 -962
  201. package/server/services/fairness-engine.js +0 -409
  202. package/server/services/fairness.js +0 -420
package/public/commander-dashboard.html CHANGED
@@ -1,243 +1,243 @@
1
- <!DOCTYPE html>
2
- <html lang="en" dir="ltr">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Commander Dashboard — Web Agent Bridge</title>
7
- <style>
8
- *{box-sizing:border-box;margin:0;padding:0}
9
- body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#0a0e17;color:#e0e6ed;min-height:100vh}
10
- .header{background:linear-gradient(135deg,#0d1b2a 0%,#1b2838 100%);padding:20px 32px;border-bottom:1px solid #1e3a5f;display:flex;align-items:center;gap:16px}
11
- .header h1{font-size:22px;color:#4fc3f7;font-weight:700}
12
- .header .badge{background:#4fc3f7;color:#0a0e17;padding:3px 10px;border-radius:12px;font-size:11px;font-weight:700}
13
- .tabs{display:flex;background:#0d1117;border-bottom:2px solid #1e3a5f;padding:0 24px;overflow-x:auto}
14
- .tab{padding:12px 20px;cursor:pointer;color:#8b9dc3;font-size:13px;font-weight:600;border-bottom:2px solid transparent;margin-bottom:-2px;white-space:nowrap;transition:all .2s}
15
- .tab:hover{color:#4fc3f7}
16
- .tab.active{color:#4fc3f7;border-bottom-color:#4fc3f7}
17
- .content{padding:24px;max-width:1200px;margin:0 auto}
18
- .panel{display:none}
19
- .panel.active{display:block}
20
- .stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px}
21
- .stat-card{background:#111827;border:1px solid #1e3a5f;border-radius:10px;padding:16px;text-align:center}
22
- .stat-card .value{font-size:28px;font-weight:700;color:#4fc3f7}
23
- .stat-card .label{font-size:12px;color:#6b7f99;margin-top:4px}
24
- table{width:100%;border-collapse:collapse;margin-bottom:16px}
25
- th{background:#111827;color:#4fc3f7;padding:10px 12px;text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.5px}
26
- td{padding:10px 12px;border-bottom:1px solid #1a2332;font-size:13px}
27
- tr:hover td{background:#111827}
28
- .badge-sm{padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600}
29
- .badge-green{background:#064e3b;color:#34d399}
30
- .badge-blue{background:#1e3a5f;color:#60a5fa}
31
- .badge-yellow{background:#78350f;color:#fbbf24}
32
- .badge-red{background:#7f1d1d;color:#f87171}
33
- .badge-purple{background:#4c1d95;color:#a78bfa}
34
- .empty{text-align:center;padding:40px;color:#6b7f99;font-style:italic}
35
- .refresh-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
36
- .refresh-bar span{font-size:12px;color:#6b7f99}
37
- .btn{padding:8px 16px;border:none;border-radius:6px;cursor:pointer;font-size:13px;font-weight:600;transition:all .2s}
38
- .btn-primary{background:#4fc3f7;color:#0a0e17}
39
- .btn-primary:hover{background:#29b6f6}
40
- .btn-sm{padding:4px 10px;font-size:11px}
41
- .progress{height:6px;background:#1a2332;border-radius:3px;overflow:hidden;margin-top:4px}
42
- .progress-bar{height:100%;background:#4fc3f7;border-radius:3px;transition:width .5s}
43
- </style>
44
- </head>
45
- <body>
46
- <div class="header">
47
- <h1>&#9881; Commander Dashboard</h1>
48
- <span class="badge">LIVE</span>
49
- </div>
50
-
51
- <div class="tabs">
52
- <div class="tab active" data-tab="overview">Overview</div>
53
- <div class="tab" data-tab="missions">Missions</div>
54
- <div class="tab" data-tab="agents">Agents</div>
55
- <div class="tab" data-tab="edge">Edge Nodes</div>
56
- <div class="tab" data-tab="localai">Local AI</div>
57
- </div>
58
-
59
- <div class="content">
60
- <!-- OVERVIEW -->
61
- <div id="overview" class="panel active">
62
- <div class="stats-row" id="overview-stats"></div>
63
- <h3 style="margin-bottom:12px;color:#4fc3f7">Active Missions</h3>
64
- <table><thead><tr><th>Mission</th><th>Status</th><th>Progress</th><th>Priority</th><th>Created</th></tr></thead><tbody id="overview-missions"></tbody></table>
65
- </div>
66
-
67
- <!-- MISSIONS -->
68
- <div id="missions" class="panel">
69
- <div class="refresh-bar">
70
- <span>Mission history</span>
71
- <button class="btn btn-primary btn-sm" onclick="refreshMissions()">Refresh</button>
72
- </div>
73
- <table><thead><tr><th>ID</th><th>Title</th><th>Strategy</th><th>Status</th><th>Tasks</th><th>Duration</th><th>Created</th></tr></thead><tbody id="missions-table"></tbody></table>
74
- </div>
75
-
76
- <!-- AGENTS -->
77
- <div id="agents" class="panel">
78
- <div class="refresh-bar">
79
- <span>Commander agent registry</span>
80
- <button class="btn btn-primary btn-sm" onclick="refreshAgents()">Refresh</button>
81
- </div>
82
- <table><thead><tr><th>Type</th><th>Capabilities</th><th>Status</th><th>Tasks Done</th><th>Success Rate</th><th>Avg Duration</th></tr></thead><tbody id="agents-table"></tbody></table>
83
- </div>
84
-
85
- <!-- EDGE NODES -->
86
- <div id="edge" class="panel">
87
- <div class="refresh-bar">
88
- <span>Distributed edge computing network</span>
89
- <button class="btn btn-primary btn-sm" onclick="refreshEdge()">Refresh</button>
90
- </div>
91
- <div class="stats-row" id="edge-stats"></div>
92
- <table><thead><tr><th>Hostname</th><th>Type</th><th>Hardware</th><th>Load</th><th>Tasks</th><th>Status</th><th>Last Seen</th></tr></thead><tbody id="edge-table"></tbody></table>
93
- </div>
94
-
95
- <!-- LOCAL AI -->
96
- <div id="localai" class="panel">
97
- <div class="refresh-bar">
98
- <span>Sovereign local AI models</span>
99
- <button class="btn btn-primary btn-sm" onclick="refreshLocalAI()">Refresh</button>
100
- </div>
101
- <div class="stats-row" id="localai-stats"></div>
102
- <table><thead><tr><th>Model</th><th>Provider</th><th>Capabilities</th><th>Context</th><th>Requests</th><th>Avg Latency</th><th>Status</th></tr></thead><tbody id="localai-table"></tbody></table>
103
- </div>
104
- </div>
105
-
106
- <script>
107
- const API = '/api/commander';
108
- const esc = s => {
109
- const d = document.createElement('div');
110
- d.textContent = String(s ?? '');
111
- return d.innerHTML;
112
- };
113
-
114
- // Tab switching
115
- document.querySelectorAll('.tab').forEach(tab => {
116
- tab.addEventListener('click', () => {
117
- document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));
118
- document.querySelectorAll('.panel').forEach(p => p.classList.remove('active'));
119
- tab.classList.add('active');
120
- document.getElementById(tab.dataset.tab).classList.add('active');
121
- });
122
- });
123
-
124
- function statusBadge(s) {
125
- const map = { online:'green', active:'green', available:'green', running:'blue', assigned:'blue', processing:'blue',
126
- completed:'purple', queued:'yellow', pending:'yellow', planning:'yellow', stale:'red', failed:'red', offline:'red', unavailable:'red' };
127
- return `<span class="badge-sm badge-${map[s]||'blue'}">${esc(s)}</span>`;
128
- }
129
-
130
- // ─── Overview ──────────────────────────────────────────────────
131
- async function refreshOverview() {
132
- try {
133
- const [stats, missions] = await Promise.all([
134
- fetch(`${API}/stats?siteId=default`).then(r=>r.json()),
135
- fetch(`${API}/missions?siteId=default&active=true`).then(r=>r.json())
136
- ]);
137
- const c = stats.commander || {};
138
- const e = stats.edge || {};
139
- const l = stats.localAI || {};
140
- document.getElementById('overview-stats').innerHTML = `
141
- <div class="stat-card"><div class="value">${c.totalMissions||0}</div><div class="label">Total Missions</div></div>
142
- <div class="stat-card"><div class="value">${c.activeMissions||0}</div><div class="label">Active Missions</div></div>
143
- <div class="stat-card"><div class="value">${c.registeredAgents||0}</div><div class="label">Agents</div></div>
144
- <div class="stat-card"><div class="value">${e.onlineNodes||0}</div><div class="label">Edge Nodes</div></div>
145
- <div class="stat-card"><div class="value">${l.availableModels||0}</div><div class="label">Local Models</div></div>
146
- <div class="stat-card"><div class="value">${Math.round((c.successRate||0)*100)}%</div><div class="label">Success Rate</div></div>
147
- `;
148
- const ms = missions.missions || [];
149
- document.getElementById('overview-missions').innerHTML = ms.length === 0
150
- ? '<tr><td colspan="5" class="empty">No active missions</td></tr>'
151
- : ms.map(m => {
152
- const pct = m.total_tasks > 0 ? Math.round((m.completed_tasks/m.total_tasks)*100) : 0;
153
- return `<tr><td>${esc(m.title||m.goal||m.id)}</td><td>${statusBadge(m.status)}</td><td><div class="progress"><div class="progress-bar" style="width:${pct}%"></div></div> ${pct}%</td><td>${esc(m.priority||5)}</td><td>${esc(m.created_at)}</td></tr>`;
154
- }).join('');
155
- } catch(e) { console.error('Overview refresh failed:', e); }
156
- }
157
-
158
- // ─── Missions ──────────────────────────────────────────────────
159
- async function refreshMissions() {
160
- try {
161
- const data = await fetch(`${API}/missions?siteId=default&limit=50`).then(r=>r.json());
162
- const ms = data.missions || [];
163
- document.getElementById('missions-table').innerHTML = ms.length === 0
164
- ? '<tr><td colspan="7" class="empty">No missions yet</td></tr>'
165
- : ms.map(m => `<tr><td style="font-family:monospace;font-size:11px">${esc(m.id?.substring(0,8))}</td><td>${esc(m.title)}</td><td>${statusBadge(m.strategy||'general')}</td><td>${statusBadge(m.status)}</td><td>${m.completed_tasks||0}/${m.total_tasks||0}</td><td>${m.duration_ms ? (m.duration_ms/1000).toFixed(1)+'s' : '-'}</td><td>${esc(m.created_at)}</td></tr>`).join('');
166
- } catch(e) { console.error('Missions refresh failed:', e); }
167
- }
168
-
169
- // ─── Agents ────────────────────────────────────────────────────
170
- async function refreshAgents() {
171
- try {
172
- const data = await fetch(`${API}/agents?siteId=default`).then(r=>r.json());
173
- const agents = data.agents || [];
174
- document.getElementById('agents-table').innerHTML = agents.length === 0
175
- ? '<tr><td colspan="6" class="empty">No agents registered</td></tr>'
176
- : agents.map(a => {
177
- const caps = JSON.parse(a.capabilities || '[]');
178
- return `<tr><td>${esc(a.agent_type)}</td><td>${caps.map(c=>`<span class="badge-sm badge-blue">${esc(c)}</span>`).join(' ')}</td><td>${statusBadge(a.status)}</td><td>${a.tasks_completed||0}</td><td>${Math.round((a.success_rate||0)*100)}%</td><td>${a.avg_duration_ms ? Math.round(a.avg_duration_ms)+'ms' : '-'}</td></tr>`;
179
- }).join('');
180
- } catch(e) { console.error('Agents refresh failed:', e); }
181
- }
182
-
183
- // ─── Edge ──────────────────────────────────────────────────────
184
- async function refreshEdge() {
185
- try {
186
- const [nodesData, statsData] = await Promise.all([
187
- fetch(`${API}/edge/nodes?siteId=default`).then(r=>r.json()),
188
- fetch(`${API}/edge/stats?siteId=default`).then(r=>r.json())
189
- ]);
190
- document.getElementById('edge-stats').innerHTML = `
191
- <div class="stat-card"><div class="value">${statsData.onlineNodes||0}</div><div class="label">Online Nodes</div></div>
192
- <div class="stat-card"><div class="value">${statsData.queuedTasks||0}</div><div class="label">Queued Tasks</div></div>
193
- <div class="stat-card"><div class="value">${statsData.completedTasks||0}</div><div class="label">Completed Tasks</div></div>
194
- <div class="stat-card"><div class="value">${statsData.activeSwarms||0}</div><div class="label">Swarms</div></div>
195
- `;
196
- const nodes = nodesData.nodes || [];
197
- document.getElementById('edge-table').innerHTML = nodes.length === 0
198
- ? '<tr><td colspan="7" class="empty">No edge nodes registered</td></tr>'
199
- : nodes.map(n => {
200
- const hw = typeof n.hardware_profile === 'object' ? n.hardware_profile : JSON.parse(n.hardware_profile || '{}');
201
- const hwStr = [hw.cpuCores ? hw.cpuCores+' cores' : '', hw.ramGB ? hw.ramGB+'GB RAM' : '', hw.gpuName||''].filter(Boolean).join(', ') || '-';
202
- const loadPct = n.capacity > 0 ? Math.round((n.current_load/n.capacity)*100) : 0;
203
- return `<tr><td>${esc(n.hostname)}</td><td>${esc(n.node_type)}</td><td>${esc(hwStr)}</td><td><div class="progress"><div class="progress-bar" style="width:${loadPct}%;background:${loadPct>80?'#f87171':'#4fc3f7'}"></div></div> ${loadPct}%</td><td>${n.tasks_completed||0}</td><td>${statusBadge(n.status)}</td><td>${esc(n.last_heartbeat)}</td></tr>`;
204
- }).join('');
205
- } catch(e) { console.error('Edge refresh failed:', e); }
206
- }
207
-
208
- // ─── Local AI ──────────────────────────────────────────────────
209
- async function refreshLocalAI() {
210
- try {
211
- const [modelsData, statsData] = await Promise.all([
212
- fetch(`${API}/local-ai/models?siteId=default`).then(r=>r.json()),
213
- fetch(`${API}/local-ai/stats?siteId=default`).then(r=>r.json())
214
- ]);
215
- document.getElementById('localai-stats').innerHTML = `
216
- <div class="stat-card"><div class="value">${statsData.availableModels||0}</div><div class="label">Available Models</div></div>
217
- <div class="stat-card"><div class="value">${statsData.totalRequests||0}</div><div class="label">Total Requests</div></div>
218
- <div class="stat-card"><div class="value">${statsData.totalTokens||0}</div><div class="label">Total Tokens</div></div>
219
- <div class="stat-card"><div class="value">${statsData.avgLatency||0}ms</div><div class="label">Avg Latency</div></div>
220
- `;
221
- const models = modelsData.models || [];
222
- document.getElementById('localai-table').innerHTML = models.length === 0
223
- ? '<tr><td colspan="7" class="empty">No local AI models — run discovery to detect</td></tr>'
224
- : models.map(m => {
225
- const caps = (Array.isArray(m.capabilities) ? m.capabilities : JSON.parse(m.capabilities || '["text"]'));
226
- return `<tr><td>${esc(m.model_name)}</td><td>${esc(m.provider)}</td><td>${caps.map(c=>`<span class="badge-sm badge-blue">${esc(c)}</span>`).join(' ')}</td><td>${(m.context_window||4096).toLocaleString()}</td><td>${m.total_requests||0}</td><td>${m.avg_latency_ms ? Math.round(m.avg_latency_ms)+'ms' : '-'}</td><td>${statusBadge(m.status)}</td></tr>`;
227
- }).join('');
228
- } catch(e) { console.error('LocalAI refresh failed:', e); }
229
- }
230
-
231
- // Initial load + auto-refresh
232
- refreshOverview(); refreshMissions(); refreshAgents(); refreshEdge(); refreshLocalAI();
233
- setInterval(() => {
234
- const active = document.querySelector('.tab.active')?.dataset?.tab;
235
- if (active === 'overview') refreshOverview();
236
- else if (active === 'missions') refreshMissions();
237
- else if (active === 'agents') refreshAgents();
238
- else if (active === 'edge') refreshEdge();
239
- else if (active === 'localai') refreshLocalAI();
240
- }, 10000);
241
- </script>
242
- </body>
243
- </html>
1
+ <!DOCTYPE html>
2
+ <html lang="en" dir="ltr">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Commander Dashboard — Web Agent Bridge</title>
7
+ <style>
8
+ *{box-sizing:border-box;margin:0;padding:0}
9
+ body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:#0a0e17;color:#e0e6ed;min-height:100vh}
10
+ .header{background:linear-gradient(135deg,#0d1b2a 0%,#1b2838 100%);padding:20px 32px;border-bottom:1px solid #1e3a5f;display:flex;align-items:center;gap:16px}
11
+ .header h1{font-size:22px;color:#4fc3f7;font-weight:700}
12
+ .header .badge{background:#4fc3f7;color:#0a0e17;padding:3px 10px;border-radius:12px;font-size:11px;font-weight:700}
13
+ .tabs{display:flex;background:#0d1117;border-bottom:2px solid #1e3a5f;padding:0 24px;overflow-x:auto}
14
+ .tab{padding:12px 20px;cursor:pointer;color:#8b9dc3;font-size:13px;font-weight:600;border-bottom:2px solid transparent;margin-bottom:-2px;white-space:nowrap;transition:all .2s}
15
+ .tab:hover{color:#4fc3f7}
16
+ .tab.active{color:#4fc3f7;border-bottom-color:#4fc3f7}
17
+ .content{padding:24px;max-width:1200px;margin:0 auto}
18
+ .panel{display:none}
19
+ .panel.active{display:block}
20
+ .stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px}
21
+ .stat-card{background:#111827;border:1px solid #1e3a5f;border-radius:10px;padding:16px;text-align:center}
22
+ .stat-card .value{font-size:28px;font-weight:700;color:#4fc3f7}
23
+ .stat-card .label{font-size:12px;color:#6b7f99;margin-top:4px}
24
+ table{width:100%;border-collapse:collapse;margin-bottom:16px}
25
+ th{background:#111827;color:#4fc3f7;padding:10px 12px;text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.5px}
26
+ td{padding:10px 12px;border-bottom:1px solid #1a2332;font-size:13px}
27
+ tr:hover td{background:#111827}
28
+ .badge-sm{padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600}
29
+ .badge-green{background:#064e3b;color:#34d399}
30
+ .badge-blue{background:#1e3a5f;color:#60a5fa}
31
+ .badge-yellow{background:#78350f;color:#fbbf24}
32
+ .badge-red{background:#7f1d1d;color:#f87171}
33
+ .badge-purple{background:#4c1d95;color:#a78bfa}
34
+ .empty{text-align:center;padding:40px;color:#6b7f99;font-style:italic}
35
+ .refresh-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
36
+ .refresh-bar span{font-size:12px;color:#6b7f99}
37
+ .btn{padding:8px 16px;border:none;border-radius:6px;cursor:pointer;font-size:13px;font-weight:600;transition:all .2s}
38
+ .btn-primary{background:#4fc3f7;color:#0a0e17}
39
+ .btn-primary:hover{background:#29b6f6}
40
+ .btn-sm{padding:4px 10px;font-size:11px}
41
+ .progress{height:6px;background:#1a2332;border-radius:3px;overflow:hidden;margin-top:4px}
42
+ .progress-bar{height:100%;background:#4fc3f7;border-radius:3px;transition:width .5s}
43
+ </style>
44
+ </head>
45
+ <body>
46
+ <div class="header">
47
+ <h1>&#9881; Commander Dashboard</h1>
48
+ <span class="badge">LIVE</span>
49
+ </div>
50
+
51
+ <div class="tabs">
52
+ <div class="tab active" data-tab="overview">Overview</div>
53
+ <div class="tab" data-tab="missions">Missions</div>
54
+ <div class="tab" data-tab="agents">Agents</div>
55
+ <div class="tab" data-tab="edge">Edge Nodes</div>
56
+ <div class="tab" data-tab="localai">Local AI</div>
57
+ </div>
58
+
59
+ <div class="content">
60
+ <!-- OVERVIEW -->
61
+ <div id="overview" class="panel active">
62
+ <div class="stats-row" id="overview-stats"></div>
63
+ <h3 style="margin-bottom:12px;color:#4fc3f7">Active Missions</h3>
64
+ <table><thead><tr><th>Mission</th><th>Status</th><th>Progress</th><th>Priority</th><th>Created</th></tr></thead><tbody id="overview-missions"></tbody></table>
65
+ </div>
66
+
67
+ <!-- MISSIONS -->
68
+ <div id="missions" class="panel">
69
+ <div class="refresh-bar">
70
+ <span>Mission history</span>
71
+ <button class="btn btn-primary btn-sm" onclick="refreshMissions()">Refresh</button>
72
+ </div>
73
+ <table><thead><tr><th>ID</th><th>Title</th><th>Strategy</th><th>Status</th><th>Tasks</th><th>Duration</th><th>Created</th></tr></thead><tbody id="missions-table"></tbody></table>
74
+ </div>
75
+
76
+ <!-- AGENTS -->
77
+ <div id="agents" class="panel">
78
+ <div class="refresh-bar">
79
+ <span>Commander agent registry</span>
80
+ <button class="btn btn-primary btn-sm" onclick="refreshAgents()">Refresh</button>
81
+ </div>
82
+ <table><thead><tr><th>Type</th><th>Capabilities</th><th>Status</th><th>Tasks Done</th><th>Success Rate</th><th>Avg Duration</th></tr></thead><tbody id="agents-table"></tbody></table>
83
+ </div>
84
+
85
+ <!-- EDGE NODES -->
86
+ <div id="edge" class="panel">
87
+ <div class="refresh-bar">
88
+ <span>Distributed edge computing network</span>
89
+ <button class="btn btn-primary btn-sm" onclick="refreshEdge()">Refresh</button>
90
+ </div>
91
+ <div class="stats-row" id="edge-stats"></div>
92
+ <table><thead><tr><th>Hostname</th><th>Type</th><th>Hardware</th><th>Load</th><th>Tasks</th><th>Status</th><th>Last Seen</th></tr></thead><tbody id="edge-table"></tbody></table>
93
+ </div>
94
+
95
+ <!-- LOCAL AI -->
96
+ <div id="localai" class="panel">
97
+ <div class="refresh-bar">
98
+ <span>Sovereign local AI models</span>
99
+ <button class="btn btn-primary btn-sm" onclick="refreshLocalAI()">Refresh</button>
100
+ </div>
101
+ <div class="stats-row" id="localai-stats"></div>
102
+ <table><thead><tr><th>Model</th><th>Provider</th><th>Capabilities</th><th>Context</th><th>Requests</th><th>Avg Latency</th><th>Status</th></tr></thead><tbody id="localai-table"></tbody></table>
103
+ </div>
104
+ </div>
105
+
106
+ <script>
107
+ const API = '/api/commander';
108
+ const esc = s => {
109
+ const d = document.createElement('div');
110
+ d.textContent = String(s ?? '');
111
+ return d.innerHTML;
112
+ };
113
+
114
+ // Tab switching
115
+ document.querySelectorAll('.tab').forEach(tab => {
116
+ tab.addEventListener('click', () => {
117
+ document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));
118
+ document.querySelectorAll('.panel').forEach(p => p.classList.remove('active'));
119
+ tab.classList.add('active');
120
+ document.getElementById(tab.dataset.tab).classList.add('active');
121
+ });
122
+ });
123
+
124
+ function statusBadge(s) {
125
+ const map = { online:'green', active:'green', available:'green', running:'blue', assigned:'blue', processing:'blue',
126
+ completed:'purple', queued:'yellow', pending:'yellow', planning:'yellow', stale:'red', failed:'red', offline:'red', unavailable:'red' };
127
+ return `<span class="badge-sm badge-${map[s]||'blue'}">${esc(s)}</span>`;
128
+ }
129
+
130
+ // ─── Overview ──────────────────────────────────────────────────
131
+ async function refreshOverview() {
132
+ try {
133
+ const [stats, missions] = await Promise.all([
134
+ fetch(`${API}/stats?siteId=default`).then(r=>r.json()),
135
+ fetch(`${API}/missions?siteId=default&active=true`).then(r=>r.json())
136
+ ]);
137
+ const c = stats.commander || {};
138
+ const e = stats.edge || {};
139
+ const l = stats.localAI || {};
140
+ document.getElementById('overview-stats').innerHTML = `
141
+ <div class="stat-card"><div class="value">${c.totalMissions||0}</div><div class="label">Total Missions</div></div>
142
+ <div class="stat-card"><div class="value">${c.activeMissions||0}</div><div class="label">Active Missions</div></div>
143
+ <div class="stat-card"><div class="value">${c.registeredAgents||0}</div><div class="label">Agents</div></div>
144
+ <div class="stat-card"><div class="value">${e.onlineNodes||0}</div><div class="label">Edge Nodes</div></div>
145
+ <div class="stat-card"><div class="value">${l.availableModels||0}</div><div class="label">Local Models</div></div>
146
+ <div class="stat-card"><div class="value">${Math.round((c.successRate||0)*100)}%</div><div class="label">Success Rate</div></div>
147
+ `;
148
+ const ms = missions.missions || [];
149
+ document.getElementById('overview-missions').innerHTML = ms.length === 0
150
+ ? '<tr><td colspan="5" class="empty">No active missions</td></tr>'
151
+ : ms.map(m => {
152
+ const pct = m.total_tasks > 0 ? Math.round((m.completed_tasks/m.total_tasks)*100) : 0;
153
+ return `<tr><td>${esc(m.title||m.goal||m.id)}</td><td>${statusBadge(m.status)}</td><td><div class="progress"><div class="progress-bar" style="width:${pct}%"></div></div> ${pct}%</td><td>${esc(m.priority||5)}</td><td>${esc(m.created_at)}</td></tr>`;
154
+ }).join('');
155
+ } catch(e) { console.error('Overview refresh failed:', e); }
156
+ }
157
+
158
+ // ─── Missions ──────────────────────────────────────────────────
159
+ async function refreshMissions() {
160
+ try {
161
+ const data = await fetch(`${API}/missions?siteId=default&limit=50`).then(r=>r.json());
162
+ const ms = data.missions || [];
163
+ document.getElementById('missions-table').innerHTML = ms.length === 0
164
+ ? '<tr><td colspan="7" class="empty">No missions yet</td></tr>'
165
+ : ms.map(m => `<tr><td style="font-family:monospace;font-size:11px">${esc(m.id?.substring(0,8))}</td><td>${esc(m.title)}</td><td>${statusBadge(m.strategy||'general')}</td><td>${statusBadge(m.status)}</td><td>${m.completed_tasks||0}/${m.total_tasks||0}</td><td>${m.duration_ms ? (m.duration_ms/1000).toFixed(1)+'s' : '-'}</td><td>${esc(m.created_at)}</td></tr>`).join('');
166
+ } catch(e) { console.error('Missions refresh failed:', e); }
167
+ }
168
+
169
+ // ─── Agents ────────────────────────────────────────────────────
170
+ async function refreshAgents() {
171
+ try {
172
+ const data = await fetch(`${API}/agents?siteId=default`).then(r=>r.json());
173
+ const agents = data.agents || [];
174
+ document.getElementById('agents-table').innerHTML = agents.length === 0
175
+ ? '<tr><td colspan="6" class="empty">No agents registered</td></tr>'
176
+ : agents.map(a => {
177
+ const caps = JSON.parse(a.capabilities || '[]');
178
+ return `<tr><td>${esc(a.agent_type)}</td><td>${caps.map(c=>`<span class="badge-sm badge-blue">${esc(c)}</span>`).join(' ')}</td><td>${statusBadge(a.status)}</td><td>${a.tasks_completed||0}</td><td>${Math.round((a.success_rate||0)*100)}%</td><td>${a.avg_duration_ms ? Math.round(a.avg_duration_ms)+'ms' : '-'}</td></tr>`;
179
+ }).join('');
180
+ } catch(e) { console.error('Agents refresh failed:', e); }
181
+ }
182
+
183
+ // ─── Edge ──────────────────────────────────────────────────────
184
+ async function refreshEdge() {
185
+ try {
186
+ const [nodesData, statsData] = await Promise.all([
187
+ fetch(`${API}/edge/nodes?siteId=default`).then(r=>r.json()),
188
+ fetch(`${API}/edge/stats?siteId=default`).then(r=>r.json())
189
+ ]);
190
+ document.getElementById('edge-stats').innerHTML = `
191
+ <div class="stat-card"><div class="value">${statsData.onlineNodes||0}</div><div class="label">Online Nodes</div></div>
192
+ <div class="stat-card"><div class="value">${statsData.queuedTasks||0}</div><div class="label">Queued Tasks</div></div>
193
+ <div class="stat-card"><div class="value">${statsData.completedTasks||0}</div><div class="label">Completed Tasks</div></div>
194
+ <div class="stat-card"><div class="value">${statsData.activeSwarms||0}</div><div class="label">Swarms</div></div>
195
+ `;
196
+ const nodes = nodesData.nodes || [];
197
+ document.getElementById('edge-table').innerHTML = nodes.length === 0
198
+ ? '<tr><td colspan="7" class="empty">No edge nodes registered</td></tr>'
199
+ : nodes.map(n => {
200
+ const hw = typeof n.hardware_profile === 'object' ? n.hardware_profile : JSON.parse(n.hardware_profile || '{}');
201
+ const hwStr = [hw.cpuCores ? hw.cpuCores+' cores' : '', hw.ramGB ? hw.ramGB+'GB RAM' : '', hw.gpuName||''].filter(Boolean).join(', ') || '-';
202
+ const loadPct = n.capacity > 0 ? Math.round((n.current_load/n.capacity)*100) : 0;
203
+ return `<tr><td>${esc(n.hostname)}</td><td>${esc(n.node_type)}</td><td>${esc(hwStr)}</td><td><div class="progress"><div class="progress-bar" style="width:${loadPct}%;background:${loadPct>80?'#f87171':'#4fc3f7'}"></div></div> ${loadPct}%</td><td>${n.tasks_completed||0}</td><td>${statusBadge(n.status)}</td><td>${esc(n.last_heartbeat)}</td></tr>`;
204
+ }).join('');
205
+ } catch(e) { console.error('Edge refresh failed:', e); }
206
+ }
207
+
208
+ // ─── Local AI ──────────────────────────────────────────────────
209
+ async function refreshLocalAI() {
210
+ try {
211
+ const [modelsData, statsData] = await Promise.all([
212
+ fetch(`${API}/local-ai/models?siteId=default`).then(r=>r.json()),
213
+ fetch(`${API}/local-ai/stats?siteId=default`).then(r=>r.json())
214
+ ]);
215
+ document.getElementById('localai-stats').innerHTML = `
216
+ <div class="stat-card"><div class="value">${statsData.availableModels||0}</div><div class="label">Available Models</div></div>
217
+ <div class="stat-card"><div class="value">${statsData.totalRequests||0}</div><div class="label">Total Requests</div></div>
218
+ <div class="stat-card"><div class="value">${statsData.totalTokens||0}</div><div class="label">Total Tokens</div></div>
219
+ <div class="stat-card"><div class="value">${statsData.avgLatency||0}ms</div><div class="label">Avg Latency</div></div>
220
+ `;
221
+ const models = modelsData.models || [];
222
+ document.getElementById('localai-table').innerHTML = models.length === 0
223
+ ? '<tr><td colspan="7" class="empty">No local AI models — run discovery to detect</td></tr>'
224
+ : models.map(m => {
225
+ const caps = (Array.isArray(m.capabilities) ? m.capabilities : JSON.parse(m.capabilities || '["text"]'));
226
+ return `<tr><td>${esc(m.model_name)}</td><td>${esc(m.provider)}</td><td>${caps.map(c=>`<span class="badge-sm badge-blue">${esc(c)}</span>`).join(' ')}</td><td>${(m.context_window||4096).toLocaleString()}</td><td>${m.total_requests||0}</td><td>${m.avg_latency_ms ? Math.round(m.avg_latency_ms)+'ms' : '-'}</td><td>${statusBadge(m.status)}</td></tr>`;
227
+ }).join('');
228
+ } catch(e) { console.error('LocalAI refresh failed:', e); }
229
+ }
230
+
231
+ // Initial load + auto-refresh
232
+ refreshOverview(); refreshMissions(); refreshAgents(); refreshEdge(); refreshLocalAI();
233
+ setInterval(() => {
234
+ const active = document.querySelector('.tab.active')?.dataset?.tab;
235
+ if (active === 'overview') refreshOverview();
236
+ else if (active === 'missions') refreshMissions();
237
+ else if (active === 'agents') refreshAgents();
238
+ else if (active === 'edge') refreshEdge();
239
+ else if (active === 'localai') refreshLocalAI();
240
+ }, 10000);
241
+ </script>
242
+ </body>
243
+ </html>