Skip to content

Bug: architect pane shrinks to ~1/4 height when N>1 (missing CSS for .architect-pane / .architect-pane-body) #766

Description

@waleedkadous

Symptom

After v3.0.6 (#762 multi-architect dashboard tabs), the left architect pane in the desktop SplitPane collapses to roughly 1/4 of the screen height when there are multiple architect terminals (N>1). The N=1 case is unaffected.

Root cause

PR #762's `App.tsx` introduces two new wrapper divs in the N>1 left-pane render path:

```jsx

{renderPersistentTerminals(...)}
\`\`\`

Neither `.architect-pane` nor `.architect-pane-body` has any CSS — verified with `grep -rn "architect-pane" packages/dashboard/src/`. The grep returns only the two usages in `App.tsx`, no CSS rules. The wrappers collapse to intrinsic block height instead of filling the SplitPane's left pane.

The N=1 path renders `` directly without these wrappers, so layout is unchanged for solo-architect workspaces — which is why this slipped past the DOM-snapshot-identical regression check (N=1 is what the test covered).

Fix shape

Add to `packages/dashboard/src/index.css`:

```css
.architect-pane {
display: flex;
flex-direction: column;
height: 100%;
min-height: 0;
}

.architect-pane-body {
flex: 1;
min-height: 0;
}
```

Plus a Playwright test that renders N>1 and asserts the architect pane fills the SplitPane left side. CLAUDE.md mandates Playwright for UI changes; this one wasn't covered. Add the test as part of this fix so the gap can't reopen.

Suggested protocol

BUGFIX — single small CSS addition + one Playwright test, scoped tight.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions