Fix merged layout: right sidebar is a full-height sibling; plan graph renders

The weave had nested the right sidebar inside the transcript column
(below the header), so the phase chip sat above the panel instead of left
of it and the panel was bounded by the scroller area. The column is now
a true sibling of the middle column under flex h-dvh, per the UI stream's
original design; TreePanel's aside gets flex-1 min-h-0 so it shares the
column with the fleet panel instead of overflowing it. The plan-graph
viewport (ResizeObserver-measured) now has real size, so the mermaid
view draws.

Headless-verified at 1280x800: panel spans 0..800 top-to-bottom in both
modes, chip right edge < panel left edge in both modes, graph SVG = 9
boxes + 8 beziers, console clean.
This commit is contained in:
amosblomqvist
2026-09-02 17:09:10 +03:00
parent df8862dfa7
commit 9fac2a0471
2 changed files with 8 additions and 7 deletions
+7 -6
View File
@@ -399,14 +399,15 @@ export function Chat({
</ConversationContent>
<ConversationScrollButton />
</Conversation>
{/* Right sidebar: the live sub-agent fleet (when running) above
the plan tree — the fleet panel renders nothing while idle. */}
<div className="hidden shrink-0 flex-col xl:flex">
<SubAgentsPanel jobs={jobs} />
<TreePanel messages={messages} />
</div>
</div>
</div>
{/* Right sidebar, a full-height sibling of the middle column: the
live sub-agent fleet (when running) above the plan tree — the
fleet panel renders nothing while idle, so the column is all plan. */}
<div className="hidden shrink-0 flex-col xl:flex">
<SubAgentsPanel jobs={jobs} />
<TreePanel messages={messages} />
</div>
</div>
</JobsContext.Provider>
</ChatActionsContext.Provider>
+1 -1
View File
@@ -236,7 +236,7 @@ export function TreePanel({
<aside
data-testid="tree-panel"
className={cn(
"sidebar-motion hidden shrink-0 overflow-hidden border-l border-border/60 bg-card/30 duration-200 xl:flex",
"sidebar-motion hidden min-h-0 flex-1 shrink-0 overflow-hidden border-l border-border/60 bg-card/30 duration-200 xl:flex",
PANEL_WIDTH[mode],
)}
>