fix(web): keep composer controls visible when they fit

[maria-rcks]

Composer reasoning and permission controls disappeared at fixed width thresholds even when they had room. Measure the controls against the space left beside the send/stop actions, retaining the existing overflow menu when they do not fit.

Validation: web typecheck, targeted lint, and 39 existing composer layout/measurement tests passed on Blacksmith. Browser rendering is unverified; Maria waived screenshots and browser verification after the preview host was unavailable.

Model: gpt-6-astra. Harness: Codex.

Summary by CodeRabbit

• Bug Fixes

  • Improved chat composer footer behavior across different widths.
  • Controls now automatically fit available space more reliably, including after fonts finish loading.
  • Resting controls, traits, and mode options are hidden or shown consistently when the composer is compact.

• UI Improvements

  • Refined spacing and layout transitions for a more consistent composer experience.

[macroscopeapp]

All clear

^{Posted via Macroscope — UI Consistency}

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository: pingdotgg/t3code/.coderabbit.yaml

Review profile: CHILL

Plan: Advanced

Run ID: 57ad0ca1-4a73-430a-bcbd-932ff22a9306

📥 Commits

Reviewing files that changed from the base of the PR and between 803f94e and 67a1237.

📒 Files selected for processing (1)

• apps/web/src/components/chat/ChatComposer.tsx

Included review availability: Your plan provides up to 10 included reviews per hour; 7 remain after this review.

---

📝 Walkthrough

Walkthrough

The composer replaces fixed-width compactness breakpoints with natural-width measurement. It observes control and form size changes, re-measures after font loading, and applies compact visibility and inertness to resting controls.

Changes

Composer compactness

Layer / File(s)	Summary
Responsive compactness measurement apps/web/src/components/chat/ChatComposer.tsx	The footer derives primary-action compactness from shouldUseCompactComposerPrimaryActions. It derives footer compactness by comparing natural control width with available content width. Resize observation and font-loading updates trigger re-measurement.
Compact control rendering apps/web/src/components/chat/ChatComposer.tsx	Resting trait and mode blocks apply compact hidden state. Resting blocks always use wrapper elements with hidden and inert handling. Footer gap classes no longer depend on compact state. Unused imports and animation hook usage were removed.

Priority: ⬇️ Low

Estimated code review effort: 3 (Moderate) | ~20 minutes

Change: Bug fix

Suggested reviewers: t3dotgg

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely describes the main change: keeping composer controls visible when available space permits.
Description check	✅ Passed	The description explains the problem, the solution, validation results, and the unverified browser-rendering status. It does not use the template headings or include the checklist, but it contains the…
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 1…
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create a new PR

---

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

[macroscopeapp]

Approvability

Verdict: Approved at 67a1237

Macroscope's review found this PR approvable — This is a self-contained composer UI bug fix that replaces fixed thresholds with measured available space, preserving the existing overflow fallback when controls do not fit. Its runtime impact is limited to responsive control visibility, layout, and transitions within the web composer.

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

[maria-rcks]

Superseded by the shared row work; closing from speed mode.