Web UI

@aip-tech/braid-plugin-ui is a small web dashboard for braid — live process status, Stop/Restart buttons, and live log tailing per process — served straight off the control server every start already runs. It's a separate, optional package: nothing about it is required to use braid, and it's the first real plugin built against the plugin API.

Install

npm install --save-dev @aip-tech/braid-plugin-ui

List it in your config's plugins array:

export default defineConfig({
	processes: [ /* ... */ ],
	plugins: ["@aip-tech/braid-plugin-ui"],
});

Opening it

braid start prints a line with a URL to open right in its own terminal (this needs @aip-tech/braid >=0.3.1 - on an older version, check .braid/daemon.log instead): 

[plugin:ui] dashboard ready - open http://127.0.0.1:54213/?token=... in your browser

Open that URL once. The control server's usual bearer-token check can't work for a plain browser navigation (there's no way to send a custom header), so this URL authenticates with a one-time ?token= instead: the first request sets a session cookie and redirects to the plain http://127.0.0.1:<port>/, so the token doesn't linger in your address bar or history. Every page load and button click after that authenticates via the cookie automatically.

The token (and the cookie) are per-run — if the daemon restarts, check the log again for a fresh URL.

Options

plugins: [["@aip-tech/braid-plugin-ui", { path: "/dashboard/" }]],
  • path — URL prefix the dashboard is served under. Default "/".

What it shows

Every configured process's name, pid, running/stopped status, CPU (percent of one core) and memory (RSS), and start time, polling every 2 seconds — the same data braid status prints. CPU/memory need @aip-tech/braid >=0.5.0; on an older version those two columns just show as empty. Stop and Restart buttons per process, backed by the same braid stop <name>/restart <name> routes the CLI itself uses. A top bar shows the host project's installed @aip-tech/braid version.

Click a process's name for its own page: a toolbar with the same Stop/Restart actions, two small rolling charts of its recent CPU and memory usage (a browser-side history, so they start empty on page load and fill in over the next minute), and its log output streaming live underneath, off the same /api/logs endpoint braid logs --follow uses. It starts with the last 300 lines, renders the same ANSI colors your terminal would, and keeps the connection open, reconnecting on its own if it drops.

A "Load older lines" button loads further back into that process's retained history (the current log file plus one rotation backup, see Logs), via the paginated /api/logs/history route - one page per click, nothing loads automatically on open or on scroll. The log view is virtualized, so a long-lived session or a deep scroll-back doesn't grow the page's DOM without bound.

Compatibility

Requires @aip-tech/braid >=0.4.0 (the version that added the paginated /api/logs/history route and logs.timestamps this plugin's log view depends on) — declared as a peerDependency, so your package manager will flag an older one.

Source lives at packages/ui-plugin in the main braid repo.