Watch
0
0
Fork
You've already forked hyperhive
0

swarm-ui: give every tab the wide body

The shell had two body widths, a 60em readable column and a 90em wide body
that a short list of table routes opted into. Every route now gets the
90em body, and the opt-in route list, its modifier class and its test go
away.
This commit is contained in:
iris 2026-10-15 18:34:59 +02:00
commit 89efda5ea2
4 changed files with 14 additions and 51 deletions

View file

@ -1,21 +1,12 @@
// Which layout a route gets inside the shell: the readable-width cap, the
// wide body, or full-bleed. Kept apart from `Shell.tsx` so it is plain
// functions of a path, with no DOM or CSS behind it, and can be tested.
// Routes that opt out of `.shell-body`'s 60em readable-line-length cap
// — mara screenshotted the issue report's 8-column table getting
// clipped; that width is deliberate for the rest of the UI's cards/
// forms, but too narrow for a wide table. `.shell-body-wide` (Shell.css) is a
// modifier alongside the base class, not a replacement, so every other
// route's layout is untouched. `/agents` joined for the same reason —
// its own table view (plus the list+detail split) hits the same cap.
const WIDE_BODY_ROUTES = new Set(["/issues", "/agents", "/review"]);
// Which routes are full-bleed inside the shell; every other route gets the
// same centred body. Kept apart from `Shell.tsx` so it is a plain function of
// a path, with no DOM or CSS behind it, and can be tested.
// `/agents/:name/terminal` (and a subagent's, under
// `/agents/:name/subagents/:subagent/`) is full-bleed: the terminal fills
// the whole viewport below the header bar, edge to edge (`shell-full` /
// `shell-body-full` in Shell.css). It can't join the `Set` above — it's a
// parameterized path, one literal string can't match every agent name.
// `shell-body-full` in Shell.css). It's a parameterized path, so one literal
// string can't match every agent name.
const FULL_BLEED_ROUTE_PATTERN =
/^\/agents\/[^/]+(\/subagents\/[^/]+)?\/terminal$/;
@ -24,7 +15,3 @@ const FULL_BLEED_ROUTE_PATTERN =
export function isFullBleedRoute(location: string): boolean {
return location === "/" || FULL_BLEED_ROUTE_PATTERN.test(location);
}
export function isWideBodyRoute(location: string): boolean {
return WIDE_BODY_ROUTES.has(location);
}