hyperhive/frontend
Repository files (latest commit first)
Filename Latest commit message Latest commit date
iris cf4fc5ce1c agent: cap icon at 5em, fix overflow menu hidden-state (#411)
Two regressions from #394 that landed once mara deployed:

1. **Icon way too big** — `.agent-icon { height: 100%; aspect-ratio: 1 }`
   sized off the parent's height. With `align-items: stretch` on the
   header and `min-height: 6em`, the `<img>`'s intrinsic dimensions
   fed back into the flex container's height calculation and pushed
   the header (and the icon stretched to fill it) far past 6em — the
   icon ended up dominating the page.

   Switch to explicit `width: 5em; height: 5em` (header content area
   = 6em min-h - 2 × 0.5em padding). `align-self: flex-start` so a
   state-row wrap doesn't drag the icon down with it.

2. **Overflow menu always visible** — `.overflow-menu { display: flex }`
   in author CSS overrode the `[hidden]` UA rule (`[hidden]
   { display: none }` has the same specificity). With nothing hiding
   it, the menu rendered at viewport 0,0 by default (no top/left set
   on the popover until JS opens it), so the operator saw `↑ dashboard
   / ↻ rebuild container / ↻ new claude session` stacked at the
   top-left of every page load.

   Split the rule: `.overflow-menu` keeps the chrome (frosted bg,
   position fixed, z-index, border, padding); `.overflow-menu:not([hidden])`
   carries `display: flex`. Now `[hidden]` wins when set, no menu
   shown until the trigger opens it.

agent.css 22.4kb → 22.5kb.
2026-05-25 02:19:47 +02:00
..
packages agent: cap icon at 5em, fix overflow menu hidden-state (#411) 2026-05-25 02:19:47 +02:00
.gitignore frontend: add npm workspace scaffold under frontend/ 2026-05-23 14:51:01 +02:00
package-lock.json frontend: lock npm dependencies via package-lock.json 2026-05-23 14:51:01 +02:00
package.json frontend: lock npm dependencies via package-lock.json 2026-05-23 14:51:01 +02:00
README.md frontend: add npm workspace scaffold under frontend/ 2026-05-23 14:51:01 +02:00

hyperhive frontend

npm workspaces project for the hyperhive browser-facing assets:

  • packages/shared/ — shared modules used by both surfaces (terminal pane, Catppuccin palette + body typography).
  • packages/dashboard/ — the hive-c0re dashboard SPA.
  • packages/agent/ — the per-container web UI (default agent page, stats, screen).

Build

npm install            # one-off; uses the checked-in package-lock.json
npm run build          # builds every workspace into packages/*/dist/

The Rust binaries serve packages/dashboard/dist/ and packages/agent/dist/ via tower_http::ServeDir at runtime; the build derivation is wired up in nix/modules/frontend.nix. Per-agent additions are layered on top of the default agent dist via the hyperhive.frontend.extraFiles option in agent.nix.

Why npm + esbuild

  • Hermetic: dependencies vendored via the checked-in lockfile; buildNpmPackage in nix uses it as the source-of-truth so the output is reproducible without network access at build time.
  • esbuild: vanilla-JS bundler, no framework runtime overhead. Each workspace's build.mjs is ~30 lines.
  • Single-PR migration: see issue #273 for the design proposal and the four-commit shape (npm scaffold → nix derivations → container plumbing → Rust cutover).