Repository navigation
R8a: stabilize composer control width, explain the Reasoning tooltip (findings #7, #11) - #179
Merged
Merged
Conversation
…(findings #7, #11) Two composer-control issues from the audit, same component. - Finding #7: .control-value used max-width (a cap, not a fixed size), so switching reasoning levels (or the active model) resized the button itself, visibly shoving the adjacent control sideways. Changed to a fixed width - both the Reasoning and Model controls now stay one stable size regardless of which option is selected; long model ids still ellipsis- truncate, they just no longer resize the button while doing it. - Finding #11: the Reasoning button had no title at all, unlike its Attach and Model neighbours, which both explain their disabled state. Added a conditional title distinguishing "provider doesn't support this" from "a request is in flight" - the same two reasons the button can be disabled for. Live-verified against a running instance: the Reasoning control's rendered width stayed at 238.5625px across all four levels (Off/Low/Medium/High). Co-Authored-By: Claude Opus 5 <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.
Problem
Two issues in the composer's control row from the R8a audit:
.control-valueusedmax-width(a cap, not a fixed size), so switching reasoning levels — or the active model — resized the button itself, visibly shoving the adjacent control sideways.titleat all, unlike its Attach and Model neighbours, which both explain their disabled state. A greyed-out Reasoning chip in API mode looked like just another broken control.Change
.control-valuefrommax-width: 140pxto a fixedwidth: 140px. Both the Reasoning and Model controls now stay one stable size regardless of which option is selected; long model ids still ellipsis-truncate, they just no longer resize the button while doing it.titleto the Reasoning button distinguishing "provider doesn't support this" (Reasoning mode is only available for local Ollama and Llama.cpp providers) from "a request is in flight" (Wait for the current response to finish) — the same two reasons the button can be disabled for.Test plan
npx tsc --noEmitnpx vitest run(full suite)python -m pytest -q(full suite, unaffected)npm run lint/npm run buildNew coverage: three
Composer.test.tsxcases covering the tooltip for both disabled reasons and confirming notitleat all when the control is enabled.Live-verified against a running instance: the Reasoning control's rendered width stayed at exactly 238.5625px across all four levels (Off/Low/Medium/High).