@m64/nats-agent-dashboard 0.1.0 → 0.1.1
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.
- package/README.md +17 -23
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -9,8 +9,6 @@ Supported runtimes (auto-detected from `$SRV.PING` + metadata):
|
|
|
9
9
|
- **`claude-channel`** — Claude Code MCP bridge (`agents.ccc.{owner}.{session}`)
|
|
10
10
|
- **`nats-channel` / OpenClaw** — OpenClaw plugin agents (`agents.oc.[{org}.]{name}`)
|
|
11
11
|
|
|
12
|
-
The visual design language and architectural patterns are copied from the **REMEMBRA** web UI to keep this dashboard consistent with the rest of the product family.
|
|
13
|
-
|
|
14
12
|
## Features
|
|
15
13
|
|
|
16
14
|
- **Live agent grid** — periodic `$SRV.PING` discovery, grouped by runtime, color-coded badges, status dots, automatic removal when agents disappear from the bus.
|
|
@@ -27,36 +25,34 @@ The visual design language and architectural patterns are copied from the **REME
|
|
|
27
25
|
- [`@nats-io/services`](https://www.npmjs.com/package/@nats-io/services) v3 — `Svcm` discovery client
|
|
28
26
|
- [marked](https://www.npmjs.com/package/marked) + [DOMPurify](https://www.npmjs.com/package/dompurify) + [highlight.js](https://www.npmjs.com/package/highlight.js) — markdown rendering for streaming responses
|
|
29
27
|
|
|
30
|
-
No router, no Pinia, no backend, no REST, no SSE. State is plain `reactive()` modules
|
|
28
|
+
No router, no Pinia, no backend, no REST, no SSE. State is plain `reactive()` modules.
|
|
31
29
|
|
|
32
30
|
## Distribution
|
|
33
31
|
|
|
34
|
-
The dashboard ships in three forms. All three are built from the same source and show the same UI
|
|
32
|
+
The dashboard ships in three forms. All three are built from the same source and show the same UI.
|
|
35
33
|
|
|
36
|
-
### 1. Single HTML file
|
|
34
|
+
### 1. Single HTML file
|
|
37
35
|
|
|
38
|
-
`npm run build` produces exactly one file: `dist/index.html` (~450 KB, ~140 KB gzipped). Everything — Vue, the stores, the markdown renderer, the NATS client, the CSS — is inlined. You can:
|
|
36
|
+
`npm run build` produces exactly one file: `dist/index.html` (~450 KB, ~140 KB gzipped). Everything — Vue, the stores, the markdown renderer, the NATS client, the CSS — is inlined. No external resources. You can:
|
|
39
37
|
|
|
40
|
-
-
|
|
41
|
-
-
|
|
42
|
-
-
|
|
38
|
+
- open it directly from the filesystem (`file://`)
|
|
39
|
+
- host it on any static web server (GitHub Pages, S3, Netlify, nginx, plain object storage)
|
|
40
|
+
- distribute it as a single file attachment
|
|
43
41
|
|
|
44
|
-
Out of the box it connects to
|
|
42
|
+
Out of the box it connects to `wss://demo.nats.io:8443` — the public Synadia demo server — so opening the HTML file requires zero local setup. Change the URL via the Settings cog (the value is persisted in `localStorage`), or pre-seed it via the query string:
|
|
45
43
|
|
|
46
44
|
```
|
|
47
|
-
file:///
|
|
48
|
-
https://
|
|
45
|
+
file:///path/to/index.html?nats=ws://localhost:8080
|
|
46
|
+
https://your-host.example.com/dashboard.html?nats=wss://nats.example.com:443
|
|
49
47
|
```
|
|
50
48
|
|
|
51
|
-
No install, no Node, no npm, no setup. **For a demo, this is the one to share.**
|
|
52
|
-
|
|
53
49
|
### 2. `npx` launcher
|
|
54
50
|
|
|
55
51
|
```bash
|
|
56
52
|
npx @m64/nats-agent-dashboard
|
|
57
53
|
```
|
|
58
54
|
|
|
59
|
-
Downloads the package (~
|
|
55
|
+
Downloads the package (~160 KB, no runtime dependencies besides Node built-ins), spawns a small HTTP server on `http://localhost:5173` that serves the bundled single HTML file, and opens your default browser. Connects to `wss://demo.nats.io:8443` by default, same as the single HTML file.
|
|
60
56
|
|
|
61
57
|
Flags:
|
|
62
58
|
|
|
@@ -67,12 +63,13 @@ npx @m64/nats-agent-dashboard --no-open # don't open bro
|
|
|
67
63
|
npx @m64/nats-agent-dashboard --help
|
|
68
64
|
```
|
|
69
65
|
|
|
70
|
-
### 3. Local
|
|
66
|
+
### 3. Local development
|
|
71
67
|
|
|
72
|
-
|
|
68
|
+
To work on the dashboard itself, with Vite's dev server, HMR and source maps:
|
|
73
69
|
|
|
74
70
|
```bash
|
|
75
|
-
git clone
|
|
71
|
+
git clone https://github.com/M64GitHub/nats-agent-dashboard.git
|
|
72
|
+
cd nats-agent-dashboard
|
|
76
73
|
npm install
|
|
77
74
|
npm run dev # Vite dev server at http://localhost:5173
|
|
78
75
|
```
|
|
@@ -158,9 +155,7 @@ State is split into plain `reactive()` modules in `src/stores/`:
|
|
|
158
155
|
| `fanoutState.js` | Fan-out form + parallel run state |
|
|
159
156
|
| `appState.js` | Selected agent + UI flags |
|
|
160
157
|
|
|
161
|
-
The `useNatsRequest.js` composable wraps the streaming reply pattern: create an inbox, subscribe, publish with `reply: inbox`, accumulate chunks, treat empty payload as end-of-stream sentinel. This pattern
|
|
162
|
-
|
|
163
|
-
The visual design tokens, base CSS, markdown styles and `useMarkdown` composable are copied verbatim from `/home/m64/space/ai/remembra/web/src/` so the dashboard looks like it belongs in the same product family.
|
|
158
|
+
The `useNatsRequest.js` composable wraps the streaming reply pattern: create an inbox, subscribe, publish with `reply: inbox`, accumulate chunks, and treat an empty payload as the end-of-stream sentinel. This pattern matches every sibling channel server (`nats-channel`, `nats-pi-channel`, `nats-pi-bridge`, `nats-claude-channel`).
|
|
164
159
|
|
|
165
160
|
## Build from source
|
|
166
161
|
|
|
@@ -182,7 +177,6 @@ Every third-party package bundled into `dist/index.html` has its copyright notic
|
|
|
182
177
|
- Session export viewer (the pi-bridge doesn't auto-export yet — revisit when it does)
|
|
183
178
|
- Multi-user awareness, theming, mobile layout, A2A protocol UI
|
|
184
179
|
|
|
185
|
-
|
|
186
180
|
## License
|
|
187
181
|
|
|
188
|
-
|
|
182
|
+
Apache-2.0. See [`LICENSE`](./LICENSE) for the full text and `dist/THIRD-PARTY-LICENSES.txt` for the copyright notices of all bundled dependencies.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@m64/nats-agent-dashboard",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Static Vue 3 dashboard for the NATS AI agent network — discover, prompt and manage agents across pi-channel, pi-exec, claude-channel and OpenClaw runtimes from a single screen, with no backend. Ships as a single HTML file or via npx.",
|
|
6
6
|
"license": "Apache-2.0",
|