dashboard: serve the dashboard at /, fold kept state in as a tab, add a pages menu
Drop the H0M3 tile hub and the core page. The dashboard is now the index; kept state is its fifth tab. A pages menu in the chrome links flow, stats, API docs and the swarm UI. The swarm apex URL comes from services.hyperhive.swarm.domain via HIVE_SWARM_PUBLIC_URL and the new swarm_public_url field of the state snapshot.
This commit is contained in:
parent
265f8a47cc
commit
0622736b30
35 changed files with 661 additions and 986 deletions
|
|
@ -10,24 +10,25 @@ what you actually do here.
|
|||
|
||||
## Where things are
|
||||
|
||||
Everything starts at the **H0M3 hub**, served at `/` — a grid of tiles
|
||||
linking to every surface (Dashboard, Flow, Logs, Stats,
|
||||
Settings, Core). Every page links back to H0M3, so you're
|
||||
never more than one step from the hub.
|
||||
Everything starts at the **dashboard**, served at `/`. A pages menu
|
||||
(the `☰` button at the left of the tab strip) links to the other
|
||||
surfaces — Flow, Stats, the API docs and the swarm UI — and each of
|
||||
those pages links back to the dashboard.
|
||||
|
||||
The **dashboard** itself (`/dashboard.html`) is where you'll spend most
|
||||
of your time. It's a single page with four tabs:
|
||||
The dashboard is where you'll spend most of your time. It's a single
|
||||
page with five tabs:
|
||||
|
||||
- **4G3NTS** — every agent, live. This is the default tab and the one
|
||||
you'll check most.
|
||||
- **R3BU1LD QU3U3**, **M3T4 1NPUTS** and **BUILD L0GS** — the build
|
||||
lifecycle: the rebuild queue with a live log of whatever is building,
|
||||
the meta flake inputs you can bump, and the build log history.
|
||||
- **K3PT ST4T3** — kept state from agents with no container
|
||||
(tombstones), with a purge button per entry.
|
||||
|
||||
Everything else lives on its own page instead, all reachable from the
|
||||
H0M3 hub: **Flow** (`/flow.html`, the raw live message stream across
|
||||
the whole swarm), **Stats** (`/stats.html`, swarm-wide usage stats), and
|
||||
**Core** (`/core.html`, tombstones and container resource use).
|
||||
Two things live on their own page instead, reached from the pages
|
||||
menu: **Flow** (`/flow.html`, the raw live message stream across the
|
||||
whole swarm) and **Stats** (`/stats.html`, swarm-wide usage stats).
|
||||
|
||||
Each agent also has its own page — a full terminal view of that
|
||||
agent's session, reachable by selecting its name anywhere in the
|
||||
|
|
|
|||
|
|
@ -71,7 +71,7 @@ at a given viewport width. Two columns:
|
|||
- **Inbox / todos pills** (`📬 inbox · N` / `📋 todos · N`): hidden
|
||||
when empty; selecting it opens the matching flyout in the side panel.
|
||||
- **Links badge** (`🔗`): opens a popover listing `↑ dashboard`
|
||||
(back-link to the host dashboard, `${dashboardBase}dashboard.html`)
|
||||
(back-link to the host dashboard, `${dashboardBase}`)
|
||||
followed by this agent's `agent_links()`-sourced navigation (stats,
|
||||
screen when VNC is enabled, forge profile + config-repo mirror when
|
||||
the agent has a forge account, any `services.hyperhive.agent.dashboardLinks`
|
||||
|
|
|
|||
|
|
@ -8,29 +8,32 @@ surfaces — the agent roster, agent creation, linking external forge and
|
|||
matrix accounts, the controller's job graph — are on the
|
||||
[swarm UI](../swarm/ui.md).
|
||||
|
||||
hive-c0re serves the dashboard at `/dashboard.html` (with the home page at `/`).
|
||||
hive-c0re serves the dashboard at `/`.
|
||||
It has a fixed chrome header at the top and a `<main>` that shows exactly
|
||||
one tab pane at a time. The URL hash (`#agents`, `#rebuild`, `#meta`,
|
||||
`#buildlogs`, `#permissions`) drives which pane is
|
||||
active; hash changes don't reload the page. FL0W and the other
|
||||
standalone pages are reachable from the H0M3 hub at `/`, not
|
||||
from the dashboard tab strip.
|
||||
`#buildlogs`, `#kept`) drives which pane is
|
||||
active; hash changes don't reload the page. FL0W and ST4TS
|
||||
are standalone pages reached from the pages menu, not from the
|
||||
dashboard tab strip.
|
||||
|
||||
**Chrome header** (fixed, overlays the active tab pane):
|
||||
- **← home back-link**: top-left of the chrome, links to the H0M3 hub
|
||||
at `/`. Every surface links back to the hub rather than to each other.
|
||||
- **Pages menu**: a `☰` button at the left of the chrome (`links-menu.js`)
|
||||
opening a popover with links to **flow** (`/flow.html`), **stats**
|
||||
(`/stats.html`), **api docs** (`/api/docs/`) and **swarm** (the swarm
|
||||
UI at the swarm apex domain, opened in a new tab). The swarm entry
|
||||
comes from `state.swarm_public_url`, which hive-c0re reads from
|
||||
`HIVE_SWARM_PUBLIC_URL` (set from `services.hyperhive.swarm.domain`);
|
||||
with no domain set there is no swarm entry. The standalone pages link back to `/`.
|
||||
- **Tab strip**: `◆ 4G3NTS ◆`, `◆ R3BU1LD QU3U3 ◆`, `◆ M3T4 1NPUTS ◆`,
|
||||
`◆ BUILD L0GS ◆`. In-page tabs only —
|
||||
the SYST3M panels live on the
|
||||
standalone **C0R3** page (`/core.html`), and FL0W / ST4TS
|
||||
live on their own pages too, all reachable from the
|
||||
H0M3 hub (not the tab strip). Count pills on 4G3NTS
|
||||
(stale containers) and R3BU1LD QU3U3 (rebuilds in flight).
|
||||
`◆ BUILD L0GS ◆`, `◆ K3PT ST4T3 ◆`. In-page tabs only — FL0W / ST4TS
|
||||
live on their own pages, reached from the pages menu. Count pills on
|
||||
4G3NTS (stale containers), R3BU1LD QU3U3 (rebuilds in flight) and
|
||||
K3PT ST4T3 (kept-state entries).
|
||||
- **Banner-thin** (`░▒▓█▓▒░ HYPERHIVE / HIVE-C0RE / WE ARE THE WIRED ░▒▓█▓▒░`)
|
||||
— sits below the tab strip.
|
||||
- **Server-warnings banner** — a generic, sticky top-of-page strip shown
|
||||
on **every** page (dashboard + every stand-alone page — FL0W,
|
||||
H0M3, C0R3, ST4TS), injected at the top
|
||||
on **every** page (the dashboard + the stand-alone FL0W
|
||||
and ST4TS pages), injected at the top
|
||||
of `<body>` by `renderServerWarnings` in `common.js`. Driven by
|
||||
`state.server_warnings` — a list of `{ kind, level, message }` — and
|
||||
coloured by `level` (`warn` amber / `crit` red). hive-c0re owns the
|
||||
|
|
@ -52,7 +55,7 @@ from the dashboard tab strip.
|
|||
to `<swarm> / <hive> // h1ve-c0re` once `hive_name` / `swarm_name`
|
||||
arrive in the state snapshot.
|
||||
|
||||
The FL0W page uses a slim header (a `← home` back-link + the page
|
||||
The FL0W page uses a slim header (a `← dashboard` back-link + the page
|
||||
title) rather than the dashboard tab strip — it's a standalone surface,
|
||||
not a tab pane.
|
||||
|
||||
|
|
@ -70,15 +73,12 @@ conflicting agent.
|
|||
`↻ UPD4TE 4LL` button appears above the containers list when any
|
||||
agent is stale.
|
||||
|
||||
## C0R3 page (`/core.html`)
|
||||
## K3PT ST4T3 tab
|
||||
|
||||
Passive / rare-interaction state, reached from the **Core** tile on the
|
||||
H0M3 hub (served at
|
||||
`/core.html`), with minimal chrome: a `← home` back-link and a single pane,
|
||||
**K3PT ST4T3**. The page is its own esbuild bundle (`core.js`) that
|
||||
cold-loads `/api/state` and subscribes to `/api/dashboard/stream` for
|
||||
`tombstones_changed`. (Rebuild queue and meta inputs are dashboard
|
||||
tabs — see below.)
|
||||
Passive / rare-interaction state. `kept.js` renders it from the
|
||||
`/api/state` snapshot and keeps it live from the `tombstones_changed`
|
||||
stream event. (Rebuild queue and meta inputs are dashboard tabs too —
|
||||
see below.)
|
||||
|
||||
Per-container CPU, memory and disk load isn't shown in the hive UI. The
|
||||
same figures go out as OTEL metrics and appear in Grafana (see
|
||||
|
|
@ -220,8 +220,8 @@ entry with that id pre-expanded.
|
|||
|
||||
Hive-wide turn statistics, aggregated across every agent's
|
||||
`hyperhive-turn-stats.sqlite` for the selected window. Not a dashboard
|
||||
tab — a standalone page reached from the **Stats** tile on the H0M3
|
||||
hub, same minimal chrome as `/flow.html`. Distinct from
|
||||
tab — a standalone page reached from the dashboard's pages menu,
|
||||
same minimal chrome as `/flow.html`. Distinct from
|
||||
each agent's own `/stats` page (which carries the per-agent trend
|
||||
charts): ST4TS is the swarm-level rollup.
|
||||
|
||||
|
|
@ -261,9 +261,9 @@ prices. Models not covered fall back to hive-c0re's built-in estimate.
|
|||
## FL0W page (`/flow.html`)
|
||||
|
||||
A dedicated full-page terminal (not a tab pane — a separate HTML
|
||||
page). Slim chrome: a `← home` back-link to the H0M3 hub, the FL0W
|
||||
page). Slim chrome: a `← dashboard` back-link, the FL0W
|
||||
title, and the agent-filter select (see below). No dashboard tab
|
||||
strip — FL0W is a standalone surface reached from the hub.
|
||||
strip — FL0W is a standalone surface reached from the pages menu.
|
||||
|
||||
**MESS4GE FL0W** — live broker tail wrapped in a `.terminal-wrap`.
|
||||
Cold load backfills the last ~200 messages from `/api/dashboard/history`;
|
||||
|
|
@ -294,17 +294,6 @@ Tab/Enter to confirm; `@*` broadcasts). `POST /api/op-send` drops
|
|||
`{from:"operator", to, body}` into the broker; the resulting SSE frame
|
||||
re-renders the terminal row. The operator addresses the root agent as `@root`.
|
||||
|
||||
## H0M3 page (`/`)
|
||||
|
||||
The H0M3 hub is the primary landing page (served at `/` by default). A
|
||||
responsive grid of link tiles — Dashboard, Flow, Stats,
|
||||
Core, API — each pointing to their respective
|
||||
surfaces, all unconditionally shown (no gating). The page is a pure
|
||||
portal with no tab-bar or SSE subscriptions. Typography + colours inherit
|
||||
from the shared theme (Catppuccin Mocha via `common.css` + `theme.css`).
|
||||
`home.js` fills the swarm/hive identity line at the top. All dashboard
|
||||
sub-pages include a `← Home` back-link for navigation.
|
||||
|
||||
## Container row
|
||||
|
||||
A full-height **square agent icon** (5em, capped) on the left. The
|
||||
|
|
@ -579,7 +568,7 @@ selected) before the bar appears.
|
|||
## Dashboard endpoints
|
||||
|
||||
Also browsable interactively at `/api/docs` (a Swagger UI, linked from
|
||||
the H0M3 hub's **API** tile), with the raw spec at `/api/openapi.json`.
|
||||
the pages menu's **api docs** entry), with the raw spec at `/api/openapi.json`.
|
||||
It's a growing supplement, not yet a full replacement for the list
|
||||
below — some endpoints aren't in it yet.
|
||||
|
||||
|
|
@ -703,7 +692,7 @@ payload):
|
|||
batch (`reminder_scheduler`).
|
||||
- `tombstones_changed` (seq, tombstones: `Vec<TombstoneView>`) —
|
||||
full snapshot of destroyed-but-state-kept agents. Emitted on
|
||||
destroy, purge, and revive. C0R3 K3PT ST4T3 tab subscribes.
|
||||
destroy, purge, and revive. The K3PT ST4T3 tab subscribes.
|
||||
- `meta_inputs_changed` (seq, inputs: `Vec<MetaInput>`) — full
|
||||
snapshot of `meta/flake.lock` inputs. The M3T4 1NPUTS tab
|
||||
subscribes; same shape as `GET /api/meta-inputs`.
|
||||
|
|
|
|||
|
|
@ -19,11 +19,9 @@ repeated here.
|
|||
visual noise — the base16 palette has multiple accent slots
|
||||
(`--purple`, `--cyan`, `--pink`, …); use more than one where it adds
|
||||
distinction, not decoration for its own sake.
|
||||
- **Whimsy** — small, delightful touches are welcome (the per-hive
|
||||
dashboard's home-page matrix-rain background, `packages/dashboard/src/
|
||||
home.js`, is the reference example — currently in the dashboard
|
||||
package, not swarm-ui itself, but the pattern it sets applies here
|
||||
too). Whimsy still has to clear the accessibility bar below (motion,
|
||||
- **Whimsy** — small, delightful touches are welcome (the matrix-rain
|
||||
background, `src/shell/MatrixRain.tsx`, is the reference example).
|
||||
Whimsy still has to clear the accessibility bar below (motion,
|
||||
in particular). swarm-ui's own reference example: `Panel`'s optional
|
||||
`icon` prop (`src/ui/panel/Panel.tsx`), a small emoji glyph in a
|
||||
panel's header, chosen per panel with no default — grew out of a
|
||||
|
|
@ -49,12 +47,10 @@ home.js`, is the reference example — currently in the dashboard
|
|||
|
||||
**General rule, not case-by-case: every non-essential CSS animation
|
||||
gates on `prefers-reduced-motion` and pauses when its tab/section is
|
||||
hidden.** The dashboard's matrix-rain background (`packages/dashboard/
|
||||
src/home.js`/`.css`) is the existing reference implementation of this
|
||||
pattern — genuinely does both today, confirmed by reading it — even
|
||||
though it lives in the dashboard package rather than swarm-ui; every
|
||||
future swarm-ui animation follows the same pattern, not just whimsy
|
||||
pieces.
|
||||
hidden.** The matrix-rain background (`src/shell/MatrixRain.tsx`) is the
|
||||
existing reference implementation of this pattern — it does both today,
|
||||
confirmed by reading it; every future swarm-ui animation follows the
|
||||
same pattern, not just whimsy pieces.
|
||||
|
||||
<!-- vale write-good.Passive = YES -->
|
||||
|
||||
|
|
|
|||
|
|
@ -19,8 +19,8 @@
|
|||
from `@hive/shared` (was `hive-fr0nt`); the dashboard ships one
|
||||
CSS bundle per page (`colors.css` + `theme.css` + `common.css`,
|
||||
loaded by every page, plus a page-specific bundle —
|
||||
`dashboard.css` / `flow.css` / `home.css` /
|
||||
`stats.css` / `core.css`);
|
||||
`dashboard.css` / `flow.css` /
|
||||
`stats.css`);
|
||||
`common.css` inlines `@hive/shared`'s
|
||||
`base.css` + `terminal.css` + `tabs.css` + `chrome.css` +
|
||||
`pill.css` via esbuild's `@import` resolution.
|
||||
|
|
|
|||
Loading…
Reference in a new issue