What port does the dashboard use by default?

It defaults to port 3000 unless you specify --port N.

What happens if the port is already in use?

The dashboard will fail to start; choose a different port with --port and try again.

How does the dashboard receive live updates?

It watches the .planning/ directory and uses server-sent events (SSE) to update in real time.

dashboard

npx machina-cli add skill SienkLogic/plan-build-run/dashboard --openclaw

Files (1)

SKILL.md

1.6 KB

STOP — DO NOT READ THIS FILE. You are already reading it. This prompt was injected into your context by Claude Code's plugin system. Begin executing immediately.

Step 0 — Immediate Output

Before ANY tool calls, display this banner:

╔══════════════════════════════════════════════════════════════╗
║  PLAN-BUILD-RUN ► DASHBOARD                                  ║
╚══════════════════════════════════════════════════════════════╝

Then proceed to Step 1.

Behavior

Parse arguments: Extract --port N from the user's input. Default to 3000.
Check dependencies: Check if ../../dashboard/node_modules/ exists. If not, run:
```
npm install --prefix ../../dashboard
```
Launch dashboard: Run in background via Bash:
```
node ../../dashboard/bin/cli.js --dir <cwd> --port <port> &
```
Use & to background the process so it doesn't block the session.

Output to user:

Dashboard running at http://localhost:<port>
Open this URL in your browser to view your project's planning state.

Notes

If the port is already in use, the dashboard will fail to start — suggest the user try a different port with --port.
The dashboard watches .planning/ for live updates via SSE.

Source

git clone https://github.com/SienkLogic/plan-build-run/blob/main/plugins/codex-pbr/skills/dashboard/SKILL.mdView on GitHub

Overview

Launch the PBR web dashboard for the active project to visualize planning state in real time. The skill checks dependencies, starts the dashboard in the background, and exposes a local URL (default port 3000) for viewing live updates via SSE.

How This Skill Works

Parses the port argument (default 3000), checks for ../../dashboard/node_modules and installs if missing, then launches node ../../dashboard/bin/cli.js --dir <cwd> --port <port> in the background. It then reports Dashboard running at http://localhost:<port> and guides the user to open it in a browser.

When to Use It

You want to view the current project's planning state in real time via a web dashboard.
You need to access the dashboard on a specific port (for example to avoid conflicts or for sharing in a team environment).
Dependencies are not yet installed for the dashboard and need automatic installation.
You are sharing a live dashboard URL with teammates to review progress.
You want to verify that the dashboard reflects updates in the .planning/ directory using SSE.

Quick Start

Step 1: Ensure you are in the project root and dependencies exist (or let the tool install them).
Step 2: Run the dashboard with an optional --port, e.g. --port 3000.
Step 3: Open http://localhost:<port> in your browser to view the dashboard.

Best Practices

Run from the project root to ensure --dir <cwd> resolves correctly.
Let the tool install missing dependencies automatically instead of manual npm install.
Choose an unused port (use --port if the default 3000 is taken).
Background the process with & so it doesn't block your session.
Verify the URL (http://localhost:<port>) and watch .planning updates via SSE.

Example Use Cases

A developer starts the dashboard for the current project and shares the URL with the team.
A demo environment launches the dashboard on port 3100 for a planning review.
After adding .planning changes, the SSE stream updates the dashboard in real time.
If port 3000 is occupied, the user restarts the dashboard on port 4000.
A CI workflow boots the dashboard to showcase planning state during a sprint review.

Frequently Asked Questions

Add this skill to your agents