fix(chat): blocks in the chat column hug their content instead of filling it - #953
Open
spashii wants to merge 1 commit into
Open
fix(chat): blocks in the chat column hug their content instead of filling it#953spashii wants to merge 1 commit into
spashii wants to merge 1 commit into
Conversation
…ling it Three blocks in the chat column carried `w-full` alongside the `md:max-w-[80%]` ceiling, so they stretched to 80% of the column no matter how little they held. Two visible consequences: the run indicator's Cancel button was flung to the far column edge by a `space-between` that had 80% of empty row to spread across, sitting nowhere near the headline it cancels; and a short suggestion card trailed its border well past where its text ended. `ChatMessage` never had `w-full` and has always looked right, which is the tell. The max-width is meant as a ceiling, not a width. So drop `w-full` at the three sites that added it and let the boxes size to their content. That also retires the `tight` prop's reason for existing as a hugging escape hatch on `SuggestionCardFrame`: hugging is now the default everywhere, and `tight` keeps only what is still its own decision, a narrower 36rem ceiling and tighter padding. The run indicator's Group goes to `justify="flex-start"` with a `md` gap, so Cancel sits beside the headline. With the row hugging there is no longer any free space for `space-between` to distribute anyway. Catalogs re-extracted: line refs only, no copy changed. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Sameer, on the run indicator: "this cancel should be closer to working to the answer,,, this width problem pls solve it generally!"
The general problem
Three blocks in the chat column carried
w-fullnext to themd:max-w-[80%]ceiling, so they stretched to 80% of the column regardless of how little they held.ChatMessage.tsxnever hadw-full, and message bubbles have always looked right. That is the tell: the max-width is a ceiling, not a width. The other three sites treated it as both.Two symptoms he has now reported separately, same root cause:
justify="space-between"across a row that was 80% empty, so Cancel sat nowhere near the headline it cancels.The fix
Drop
w-fullat the three sites that added it. The boxes size to their content and the max-width does what it says.AgenticChatPanel.tsxAgenticChatPanel.tsxSuggestionCardFrame.tsxTwo consequences worth naming:
The
tightprop loses its main job. It was added as a one-off hugging escape hatch for the drafted-insight card, its doc comment reading "Hug the content instead of filling the column." Hugging is now the default, sotightkeeps only what is still genuinely its own decision: a narrower 36rem ceiling and tighter padding. The now-redundantmd:w-fitgoes.space-betweenbecomes pointless on the indicator, since a hugging row has no free space to distribute. It goes tojustify="flex-start"with amdgap, which is what actually puts Cancel beside the headline.Checks
tsc --noEmitcleanbiome lint --diagnostic-level=errorcleanAgenticChatPanel.test.tsxandProjectUpdateSuggestionCard.test.tsx#:source references only, no message text changed, and a second extract reproduces it byte for byte.No typography touched: no new font sizes, weights, colours or italics.
Not covered
No test asserts layout width, because these are CSS classes and jsdom computes no layout. Worth an eye on the rendered result before merge.
Branched from
25fdb6f7(the releasedv2.1.0commit). Does not touch production behaviour:ENABLE_AGENTIC_CHATis on everywhere, so this ships whenever it merges.🤖 Generated with Claude Code