[shivamhwp]

Note

🤖 Claude Fable 5.2 on behalf of Shivam

On a phone-width composer, a notice with buttons (for example "Codex signed out" with Open terminal and Refresh) wrapped its buttons to a second line with the dismiss button after them. The dismiss button sat away from the title it closes, and a long title dropped below its icon with two identical ⓘ buttons.

Below 480px of card width a notice now follows ComposerRequestCard, the approval card's layout:

• a header row: the icon, the title (wrapping instead of truncating), the "+N" count of stacked notices and the dismiss button, like the card header's counter and dismiss;
• a footer row: the notice's buttons, right-aligned with the card's gap-2, ending under the dismiss button.

The description and its ⓘ stay hidden at that width, as they were. The icon, the title's first line and the dismiss button share one centre line.

At 480px and wider, the one-line status row is unchanged. The desktop screenshot below is pixel-identical at base and head.

Stacks on maria/redesign/2-composer-timeline.

The dev server with an empty T3 home, in headless Chromium at a phone size. Before (layer 2 at 5604040):

After (eba67df):

Every notice shape, from the real ComposerBannerStack rendered alone in headless Chromium at a 390px viewport: two buttons with dismiss, dismiss only, one button, no actions, a long title, and a stack with two more notices. Before:

After:

Measured centres of the icon, the title's first glyph and the dismiss icon are within 1px of each other in every shape, at 340, 366, 520 and 728px and at the phone viewport.

vp run check:changed at eba67df: format, lint, knip, graphql, typecheck (41 packages) and the React compiler check passed. In the full test run, two SecretSourceInput.browser.test.tsx cases timed out under load. They passed when rerun alone, as did ComposerBannerStack.browser.test.tsx. No test added: this is a layout fix, and the captures above are its proof.

Not shown: a physical phone, and right-to-left layouts (the change uses logical start and end properties only).

Claude Fable 5.2, Claude Code via T3 Code.

🤖 Generated with Claude Code

[macroscopeapp]

Approvability

Verdict: Approved at eba67df

Macroscope's review found this PR approvable — Composer notices place action buttons below wrapping titles in narrow layouts and include the title in description popovers. The changes are presentation-only, with existing action and dismissal behavior unchanged.

^{You can add or adjust custom eligibility rules. Learn more.}

[maria-rcks]

Note

Written by gpt-6.1-sol on behalf of Maria

Verified in a real dev environment

verified exact head e96c85f5f5ac69bd2b8d3229e353a02391d690e8 on this linux vm using the real dev web client, repository Playwright, and /usr/bin/google-chrome. no source changes were needed. the head has 32 successful CI checks, with none pending or failing.

started github/main (bba1c13d87) first in a separate worktree after vp i. created a project pointing at its real git checkout and completed a Codex gpt-6.1-sol turn through the composer. changed CODEX_HOME through provider settings to a fresh empty directory to produce a real signed-out notice. main uses the older alert and places Refresh at the trailing edge:

because this PR stacks on the composer redesign, also ran its unchanged parent df3c346b2c to isolate this diff. reused the same app-created thread and provider state. at a 390px viewport, its title starts at x=46 and its wrapped actions start at x=137:

stopped each server before starting the next. installed the exact PR head and ran it with an explicit isolated home. with matching data and viewport, both the title and wrapped actions now start at x=46; dismiss remains at the trailing edge:

also exercised the real notice controls: Refresh sent the provider-refresh WebSocket request and completed a fresh Codex probe; Open terminal opened a working shell; dismiss removed the notice. /clear added a second notice, +1 opened it, and Keep the current session removed it. inspected the one-line desktop layout at 1440px and the narrow layout in both light and dark themes.

short runtime transcript:

client websocket: refreshProviders request observed
refresh complete: real Codex probe still reports signed out
terminal: printf 'notice-terminal-ok\n' -> notice-terminal-ok
/clear -> +1 -> fresh-session notice -> Keep the current session -> removed
Dismiss Codex provider error -> notice removed

restored the configured Codex home and completed fresh gpt-6.1-sol turns through the PR's composer. the requested response streamed to the client and the turn completed:

inspected the captures and checked playback and seeking of the uploaded recording. no mocks or demo data were used.

Not verified

native iOS/Android clients, the Electron shell, macOS/Windows, right-to-left layouts, and remote/relay/tunnel connections were not exercised on this linux vm. the narrow capture is the real web client at phone width. providers other than Codex were not exercised. no new automated checks were run for this verification-only pass.

Dismissing prior approval to re-evaluate 93ae428

Dismissing prior approval to re-evaluate e6eccf3

Dismissing prior approval to re-evaluate a0eab15

Dismissing prior approval to re-evaluate 877fe8f

Dismissing prior approval to re-evaluate eba67df