Skip to content

Harness dashboard

A standalone, view-only VitePress site that renders the Tempo agent harness — skills, rules, agents, glossary, backlog model, learnings — straight from .claude/ and docs/, so it can't drift from the real thing. The built dist/ is a self-contained static bundle you can zip and share; it opens in a browser with no server.

It is fully isolated from the main Tempo app: its own package.json and npm install, not part of the repo's pnpm workspace, its own CSS/JS.

Develop / build

bash
cd harness-dashboard
npm install
npm run dev      # local preview at http://localhost:5173 (regenerates first)
npm run build    # regenerate → drift-check → static build  → dist/ (the export)
npm run bundle   # zip dist/ → harness-dashboard.zip  (to share)
npm run preview  # serve the built dist/ locally
npm test         # generator + drift-check unit tests

file:// note: base is relative, so the pre-rendered pages open straight from the dist/ folder. If client-side navigation misbehaves over file://, serve it instead (npm run preview, or npx serve dist) — the content is identical.

The reference pages under skills/, rules/, agents/, learnings/, plus glossary.md and backlog-model.md, are generated from .claude/ + docs/ and gitignored — regenerated on every build, and a drift check fails the build if a referenced skill no longer exists. CI (.github/workflows/harness-dashboard.yml) runs the whole chain (npm ci → test → generate → drift → build) on any change to harness-dashboard/, .claude/, or docs/.

Slices

  • Slice 1 (this): the reference catalog — skills/rules/agents/glossary/backlog/learnings, dark-mode default, drift check, export.
  • Slice 2: the workflows layer (clickable skill-pipelines), per-skill "problem it solves", verb-taxonomy page.
  • Slice 3: a custom dark theme + deeper narrative guide articles.