@aaronbassett/midnight-local-devnet 0.2.1 → 0.3.0

package/README.md

@@ -19,7 +19,7 @@ Start the network:
 npx @aaronbassett/midnight-local-devnet start
 ```
 
-Open the realtime dashboard in a second terminal pane to monitor your devnet:
+Open the dashboard in your browser to monitor your devnet:
 
 ```bash
 npx @aaronbassett/midnight-local-devnet dashboard
@@ -58,48 +58,38 @@ All commands can be run via `npx @aaronbassett/midnight-local-devnet <command>`.
 | `fund <address>` | Fund a Bech32 address with NIGHT tokens | `--amount <n>` Amount in NIGHT (default: 50,000) |
 | `fund-file <path>` | Fund all accounts from an accounts.json file | |
 | `generate-accounts` | Generate random test accounts | `--count <n>`, `--format <mnemonic\|privateKey>`, `--output <path>`, `--fund`, `--register-dust` |
-| `dashboard` | Open realtime terminal dashboard | |
+| `dashboard` | Open browser dashboard | `--port <n>` (default: 31780), `--no-open` Suppress auto-open |
 | `interactive` | Start interactive menu mode | |
 
 Running with no arguments displays help.
 
 ## Dashboard
 
-The `dashboard` command opens a realtime terminal UI that displays the state of all local devnet services. It's designed to run in a side terminal pane while you develop.
+The `dashboard` command starts a local server and opens a browser-based dashboard that displays the state of all local devnet services in real time.
 
 ```bash
 npx @aaronbassett/midnight-local-devnet dashboard
 ```
 
+This starts a server on `http://localhost:31780` and opens your default browser. Press Ctrl+C in the terminal to stop.
+
+Options:
+
+- `--port <n>` -- Use a specific port (default: 31780, auto-increments if in use)
+- `--no-open` -- Start the server without opening the browser
+
 The dashboard shows:
 
 - **Node** -- Block height, average block time, chain, peers, sync status, version
-- **Indexer** -- Indexed block height, lag vs node, readiness
-- **Proof Server** -- Version, proof versions, job processing/pending/capacity
+- **Indexer** -- Ready status, response time
+- **Proof Server** -- Version, proof versions, job processing/pending/capacity gauge
 - **Wallet** -- Master wallet NIGHT (unshielded + shielded) and DUST balances
-- **Logs** -- Combined color-coded log stream from all services, filterable by service, level, or substring search
-- **Response Times** -- Sparkline charts of per-service response times (large terminals only)
+- **Response Times** -- SVG sparkline charts of per-service response times
+- **Logs** -- Combined color-coded log stream from all services, filterable by service, level, or text search
 
-The layout adapts to your terminal width:
+The dashboard connects to the server via WebSocket for live updates. If the connection drops, it auto-reconnects. You can start and stop the network directly from the dashboard using the action buttons.
 
-| Terminal Width | Layout |
-|---|---|
-| < 40 columns | Single column, compact |
-| 40--119 columns | Two-column grid |
-| 120+ columns | Three-column with response time graphs |
-
-Keyboard shortcuts:
-
-| Key | Action |
-|---|---|
-| Tab | Cycle focus between panels |
-| Up/Down | Scroll logs (when focused) |
-| `s` | Cycle log service filter |
-| `l` | Cycle log level filter |
-| `/` | Enter log search mode |
-| `q` | Exit dashboard |
-
-The dashboard starts regardless of whether the network is running. Panels show "Connecting..." and update live when services come up.
+The layout is responsive and adapts to your browser window width.
 
 ## MCP Tool Reference
 

package/dist/cli/commands/dashboard.js

@@ -1,20 +1,59 @@
+import { createServer } from 'node:net';
+async function findOpenPort(start, maxAttempts = 10) {
+    for (let i = 0; i < maxAttempts; i++) {
+        const port = start + i;
+        const available = await new Promise((resolve) => {
+            const server = createServer();
+            server.once('error', () => resolve(false));
+            server.once('listening', () => {
+                server.close(() => resolve(true));
+            });
+            server.listen(port, '127.0.0.1');
+        });
+        if (available)
+            return port;
+    }
+    throw new Error(`No open port found in range ${start}-${start + maxAttempts - 1}`);
+}
 export function registerDashboardCommand(program, manager) {
     program
         .command('dashboard')
-        .description('Open realtime terminal dashboard for the local devnet')
-        .action(async () => {
-        if (!process.stdin.isTTY) {
-            console.error('Error: Dashboard requires an interactive terminal (TTY).');
-            console.error('Run this command directly in a terminal, not through a pipe or script.');
-            process.exit(1);
-        }
-        // Dynamic import to avoid loading React/ink for non-dashboard commands
-        const { render } = await import('ink');
-        const React = await import('react');
-        const { App } = await import('../dashboard/app.js');
-        const { waitUntilExit } = render(React.createElement(App, { manager, config: manager.config }));
-        await waitUntilExit();
-        await manager.shutdown();
+        .description('Open browser dashboard for the local devnet')
+        .option('--port <port>', 'Port to serve dashboard on', '31780')
+        .option('--no-open', 'Do not auto-open the browser')
+        .action(async (opts) => {
+        const { createDashboardApp } = await import('../dashboard/server.js');
+        const { serve } = await import('@hono/node-server');
+        const open = (await import('open')).default;
+        const preferredPort = parseInt(opts.port, 10);
+        const port = await findOpenPort(preferredPort);
+        const { app, setupWebSocket, startPolling, shutdown } = createDashboardApp({
+            config: manager.config,
+            manager,
+            port,
+        });
+        const server = serve({ fetch: app.fetch, port, hostname: '127.0.0.1' }, (info) => {
+            const url = `http://localhost:${info.port}`;
+            console.log(`Dashboard running at ${url}`);
+            console.log('Press Ctrl+C to stop\n');
+            if (opts.open !== false) {
+                open(url).catch(() => {
+                    // Ignore browser open errors
+                });
+            }
+        });
+        const wss = setupWebSocket(server);
+        startPolling();
+        const gracefulShutdown = async () => {
+            console.log('\nShutting down dashboard...');
+            shutdown();
+            wss.close();
+            await new Promise((resolve) => server.close(() => resolve()));
+            await manager.shutdown();
+            process.exit(0);
+        };
+        process.on('SIGINT', gracefulShutdown);
+        process.on('SIGTERM', gracefulShutdown);
     });
 }
 //# sourceMappingURL=dashboard.js.map

package/dist/cli/commands/dashboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"dashboard.js","sourceRoot":"","sources":["../../../src/cli/commands/dashboard.ts"],"names":[],"mappings":"AAGA,MAAM,UAAU,wBAAwB,CAAC,OAAgB,EAAE,OAAuB;IAChF,OAAO;SACJ,OAAO,CAAC,WAAW,CAAC;SACpB,WAAW,CAAC,uDAAuD,CAAC;SACpE,MAAM,CAAC,KAAK,IAAI,EAAE;QACjB,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;YACzB,OAAO,CAAC,KAAK,CAAC,0DAA0D,CAAC,CAAC;YAC1E,OAAO,CAAC,KAAK,CAAC,wEAAwE,CAAC,CAAC;YACxF,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAClB,CAAC;QAED,uEAAuE;QACvE,MAAM,EAAE,MAAM,EAAE,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC;QACvC,MAAM,KAAK,GAAG,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC;QACpC,MAAM,EAAE,GAAG,EAAE,GAAG,MAAM,MAAM,CAAC,qBAAqB,CAAC,CAAC;QAEpD,MAAM,EAAE,aAAa,EAAE,GAAG,MAAM,CAC9B,KAAK,CAAC,aAAa,CAAC,GAAG,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,MAAM,EAAE,CAAC,CAC9D,CAAC;QAEF,MAAM,aAAa,EAAE,CAAC;QACtB,MAAM,OAAO,CAAC,QAAQ,EAAE,CAAC;IAC3B,CAAC,CAAC,CAAC;AACP,CAAC"}
+{"version":3,"file":"dashboard.js","sourceRoot":"","sources":["../../../src/cli/commands/dashboard.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAExC,KAAK,UAAU,YAAY,CAAC,KAAa,EAAE,WAAW,GAAG,EAAE;IACzD,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,WAAW,EAAE,CAAC,EAAE,EAAE,CAAC;QACrC,MAAM,IAAI,GAAG,KAAK,GAAG,CAAC,CAAC;QACvB,MAAM,SAAS,GAAG,MAAM,IAAI,OAAO,CAAU,CAAC,OAAO,EAAE,EAAE;YACvD,MAAM,MAAM,GAAG,YAAY,EAAE,CAAC;YAC9B,MAAM,CAAC,IAAI,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC;YAC3C,MAAM,CAAC,IAAI,CAAC,WAAW,EAAE,GAAG,EAAE;gBAC5B,MAAM,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;YACpC,CAAC,CAAC,CAAC;YACH,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;QACnC,CAAC,CAAC,CAAC;QACH,IAAI,SAAS;YAAE,OAAO,IAAI,CAAC;IAC7B,CAAC;IACD,MAAM,IAAI,KAAK,CAAC,+BAA+B,KAAK,IAAI,KAAK,GAAG,WAAW,GAAG,CAAC,EAAE,CAAC,CAAC;AACrF,CAAC;AAED,MAAM,UAAU,wBAAwB,CAAC,OAAgB,EAAE,OAAuB;IAChF,OAAO;SACJ,OAAO,CAAC,WAAW,CAAC;SACpB,WAAW,CAAC,6CAA6C,CAAC;SAC1D,MAAM,CAAC,eAAe,EAAE,4BAA4B,EAAE,OAAO,CAAC;SAC9D,MAAM,CAAC,WAAW,EAAE,8BAA8B,CAAC;SACnD,MAAM,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE;QACrB,MAAM,EAAE,kBAAkB,EAAE,GAAG,MAAM,MAAM,CAAC,wBAAwB,CAAC,CAAC;QACtE,MAAM,EAAE,KAAK,EAAE,GAAG,MAAM,MAAM,CAAC,mBAAmB,CAAC,CAAC;QACpD,MAAM,IAAI,GAAG,CAAC,MAAM,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC;QAE5C,MAAM,aAAa,GAAG,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QAC9C,MAAM,IAAI,GAAG,MAAM,YAAY,CAAC,aAAa,CAAC,CAAC;QAE/C,MAAM,EAAE,GAAG,EAAE,cAAc,EAAE,YAAY,EAAE,QAAQ,EAAE,GAAG,kBAAkB,CAAC;YACzE,MAAM,EAAE,OAAO,CAAC,MAAM;YACtB,OAAO;YACP,IAAI;SACL,CAAC,CAAC;QAEH,MAAM,MAAM,GAAG,KAAK,CAAC,EAAE,KAAK,EAAE,GAAG,CAAC,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,EAAE,CAAC,IAAI,EAAE,EAAE;YAC/E,MAAM,GAAG,GAAG,oBAAoB,IAAI,CAAC,IAAI,EAAE,CAAC;YAC5C,OAAO,CAAC,GAAG,CAAC,wBAAwB,GAAG,EAAE,CAAC,CAAC;YAC3C,OAAO,CAAC,GAAG,CAAC,wBAAwB,CAAC,CAAC;YAEtC,IAAI,IAAI,CAAC,IAAI,KAAK,KAAK,EAAE,CAAC;gBACxB,IAAI,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,GAAG,EAAE;oBACnB,6BAA6B;gBAC/B,CAAC,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,MAAM,GAAG,GAAG,cAAc,CAAC,MAAa,CAAC,CAAC;QAC1C,YAAY,EAAE,CAAC;QAEf,MAAM,gBAAgB,GAAG,KAAK,IAAI,EAAE;YAClC,OAAO,CAAC,GAAG,CAAC,8BAA8B,CAAC,CAAC;YAC5C,QAAQ,EAAE,CAAC;YACX,GAAG,CAAC,KAAK,EAAE,CAAC;YACZ,MAAM,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,EAAE,CAAE,MAAc,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC;YAC7E,MAAM,OAAO,CAAC,QAAQ,EAAE,CAAC;YACzB,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QAClB,CAAC,CAAC;QAEF,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,gBAAgB,CAAC,CAAC;QACvC,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAC;IAC1C,CAAC,CAAC,CAAC;AACP,CAAC"}

package/dist/cli/dashboard/html.d.ts

@@ -0,0 +1,3 @@
+export declare function generateDashboardHtml({ wsUrl }: {
+    wsUrl: string;
+}): string;