hyperhive/docs/web-ui.md
iris 07b62612b0 docs: restructure into topic subdirectories, collapse duplicated index
Per mara's go-ahead on hyperhive#3902 ("getting started is good, but
terminal rendering does not go in there i think"):

Moved 21 top-level docs/*.md files into 7 new topic subdirectories
(existing web-ui/, turn-loop/, swarm/, tools/, crates/ untouched):
  getting-started/  setup.md
  agent-lifecycle/  agent-hierarchy.md, approvals.md, persistence.md
  trust-boundary/   boundary.md, security.md
  integrations/     forge.md, matrix.md, github.md, knowledge.md
  networking/       gateway.md, network.md, snapshot-store.md
  scheduler/        jobq.md, coordinator.md, ci.md, observability.md
  process/          conventions.md, gotchas.md, pr-review-gate.md
  web-ui/           terminal-rendering.md (moved into the EXISTING dir,
                    per mara's correction to the original getting-started
                    guess -- it's UI implementation detail, not onboarding)

The physical layout now matches docs/README.md's own topical headers,
which already amounted to this taxonomy -- see the scoping comment on
the issue for the two findings that motivated this (a genuine
duplication between CLAUDE.md's old "Reading paths" list and
docs/README.md's grouped one, since drifted out of sync with each
other; and the flat layout not matching the grouping we already had).

Fixed every cross-reference this moved across the whole repo (~120
files: docs/ internal links at every depth, Rust doc comments, nix
module option docs, crate READMEs) -- verified two ways: a grep sweep
confirming zero remaining references to any old path, and a script
that resolves every markdown link in docs/**/*.md + CLAUDE.md +
README.md against the filesystem and reports anything that doesn't
exist (zero broken links).

Collapsed CLAUDE.md's "Reading paths" section (the duplicate) down to
a pointer at docs/README.md, now the single index. Rewrote
docs/README.md itself to use the new subdirectory paths and added the
one doc it was missing that CLAUDE.md's old copy had (pr-review-gate.md).

Classified all 22 docs/*.md files first via a haiku subagent (mara's
suggestion) on two axes -- proposed grouping and operator-vs-
implementation focus -- before finalizing the taxonomy; spot-checked
the report and found internal inconsistencies (its classification
table disagreed with its own summary section for a few files), so this
taxonomy is my original proposal + the one correction mara gave
directly, not a blind application of the subagent's table. The
operator-focus data it gathered is still useful for a follow-up
content pass (docs skewing 'mixed' rather than pure operator-facing),
not addressed in this PR -- structure only.

nix fmt clean, both pre-push lints clean.
2026-09-02 01:55:37 +02:00

3 KiB

Web UI

Two web surfaces share the same skeleton: the dashboard (port 7000) and the per-agent UIs (each container's port is a deterministic hash in :8100-8999 — see gotchas.md#web-ui-ports-collide-on-hash for the mechanics and the collision caveat). Both are SPAs — GET / returns a static shell, /api/state returns JSON, JS renders. No full-page reloads.

This doc has been split for readability. Pick the section you need — or, if you're the operator looking for how to actually use the dashboard rather than how it's built, start at web-ui/README.md instead.

  • Shape (shared by both) — shared SPA skeleton, SSE multiplexing, terminal pane, listener bind, per-agent relative paths, data-async form pattern, side panel, atomic repaint.
  • Dashboard layout — tab contents (SW4RM, Y3R C4LL, P3RM1SS10NS, SCH3DUL3S) + standalone pages (C0R3 /core.html, BU1LDS /builds.html, L0GS /logs.html, CR3D3NTIALS /credentials.html), container row, topology tree, selection bar, approval card, browser notifications, dashboard endpoints + event channel.
  • Per-agent page — header, main terminal, composer, side panel + inbox, live view, slash commands, per-agent endpoints, stats page.
  • CSS theme variables — the Catppuccin Mocha custom properties declared once in base.css and the rule that per-page stylesheets reference (never redeclare) them.
  • swarm-ui design guide — visual language, motion, theming, error-UX, and component-first principles for the swarm-level Preact app specifically (not this doc's dashboard/agent UIs). /components on a running swarm-ui is the companion living demo of every primitive it references.

Reading paths

  • "How does the dashboard SPA stay live without polling?"web-ui/shape.md (SSE multiplexing, Worker-death self-heal, atomic repaint).
  • "What does a container row contain?"web-ui/dashboard.md (Container row, Topology tree, Selection bar).
  • "What endpoints does the dashboard expose?"web-ui/dashboard.md (Dashboard endpoints, Dashboard event channel).
  • "How does the per-agent terminal render tool calls?"terminal-rendering.md (full row taxonomy + dispatch walkthrough); for a high-level summary see web-ui/agent.md (Per-stream rendering).
  • "What slash commands does the agent accept?"web-ui/agent.md (Terminal-embedded prompt).
  • "What are the per-agent HTTP endpoints?"web-ui/agent.md (Per-agent endpoints).
  • "Which CSS variable do I use / where are colours defined?"web-ui/css-vars.md (Palette, single-source base.css rule).