[codex] fix composer footer compact layout

[shivamhwp]

What changed

• removed the composer footer's measurement-based overflow heuristic and switched back to breakpoint-driven compacting
• made the left-side footer controls yield space via horizontal scrolling so they cannot push the right action cluster out of bounds
• kept the plan follow-up Implement button width stable across the compact transition to remove the remaining layout shift
• added browser regressions for both wide-desktop fit states and the plan follow-up resize path

Why

The previous fix still allowed a dead zone where the footer could overflow near the compact breakpoint. The follow-up measurement-based heuristic also made the layout too sensitive to scroll width and introduced false compacting. The more reliable fix is to make the footer layout itself resilient: the leading controls can shrink and scroll, while the primary actions stay pinned.

UI changes

before

after

Screen.Recording.2026-04-11.at.1.40.19.AM.1.mp4

Impact

• prevents the composer action buttons from overflowing during plan follow-up states
• preserves the expanded desktop layout when the footer still fits
• removes the Implement button width jump when compact mode activates

Validation

• bun fmt
• bun run --cwd apps/web test src/components/composerFooterLayout.test.ts
• bun run --cwd apps/web test:browser src/components/ChatView.browser.tsx --testNamePattern "wide desktop follow-up layout|keeps plan follow-up footer actions fused and aligned after a real resize"
• bun lint
• bun typecheck

Notes

bun lint still reports one pre-existing warning in apps/web/src/environments/runtime/catalog.test.ts about resolveRegistryRead function scoping.

---

Note

Medium Risk
UI layout logic for the chat composer footer is reworked and could cause regressions at edge viewport widths or in wide-action states (plan follow-up, pending input). Changes are localized to client layout/behavior and covered by added browser tests.

Overview
Chat composer footer compaction is reverted to pure breakpoint logic. The measurement-based overflow heuristic is removed (and associated helpers/tests deleted), so compact/primary-action modes now depend only on container width and hasWideActions.

Footer layout is made more resilient under tight widths. The left control cluster always uses horizontal scrolling so it yields space without pushing the right action buttons out of bounds, and the plan follow-up Implement button padding is fixed to keep its width stable across compact transitions.

Regression coverage is expanded. Browser tests now validate wide-desktop plan follow-up stays expanded when it fits, compacts when it overflows, and that Implement width/alignment remain stable after a real resize (with snapshot helpers extended to vary model/plan text).

^{Reviewed by Cursor Bugbot for commit 0292198. Bugbot is set up for automated code reviews on this repo. Configure here.}

Note

Fix composer footer compact layout to use width-based breakpoints only

• Removes DOM measurement logic (measureComposerFooterOverflowPx, resolveComposerFooterContentWidth, shouldForceCompactComposerFooterForFit) from composerFooterLayout.ts and ChatComposer.tsx, replacing it with pure width-based heuristics.
• The leading section in the composer footer now always uses overflow-x-auto instead of switching between overflow modes based on compact state.
• Fixes the Implement button in ComposerPrimaryActions.tsx to always use px-4 padding, giving it a consistent width across compact and non-compact modes.
• Behavioral Change: compact state now depends solely on container width breakpoints and hasWideActions, not on measured content overflow.

^{Macroscope summarized 0292198.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 7f5ca824-7fce-42b9-bfd3-e93e3cad6661

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[macroscopeapp]

Approvability

Verdict: Approved

Straightforward UI bug fix that simplifies composer footer layout logic by removing complex DOM measurement in favor of heuristic-based approach. Net deletion of code with new test coverage added, self-contained to the composer component.

^{You can customize Macroscope's approvability policy. Learn more.}