[fix] Polish the agent playground config panel and model picker - #6060
Open
ashrafchowdury wants to merge 4 commits into
Open
[fix] Polish the agent playground config panel and model picker#6060ashrafchowdury wants to merge 4 commits into
ashrafchowdury wants to merge 4 commits into
Conversation
The config pane drew a custom overlay thumb on top of its content; drop it and rely on the shared ag-scroll-no-bar class instead. That class now also sets -ms-overflow-style, and the panels that only zeroed ::-webkit-scrollbar (Firefox still painted one) use it too.
The Instructions section header carried a permanently disabled "+" whose only message was that multiple files are coming soon.
The picker was pinned to a 560px panel regardless of the pane it opened from. It now spans the trigger with a 460px floor, and its provider column is 200px so the model names get the rest.
The selected chip sat on a full colorFill step; hold it at 90% so it reads a touch softer on the canvas in both themes.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Repository YAML (base), Organization UI (inherited) Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (6)
💤 Files with no reviewable changes (2)
📝 WalkthroughSummary by CodeRabbit
WalkthroughThe changes remove the overlay scrollbar component, standardize hidden scrollbar styling, adjust active session tag contrast, remove an unused instruction-file control, and resize the model picker. ChangesUI cleanup
Estimated code review effort: 2 (Simple) | ~10 minutes Merge Risk: ⚪ Minimal · up to This change updates localized playground presentation and sizing behavior; no actionable merge-blocking risk remains beyond normal checks and review. Possibly related PRs
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
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. Comment |
Contributor
Railway Preview Environment
|
dosubot
Bot
added
size:L
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
1 participant
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.
Context
Four small things read wrong in the agent playground's config pane. The pane drew its own floating scrollbar on top of the content. The Instructions header carried a "+" that could never be clicked. The model picker opened at a fixed 560px no matter how wide the pane was, so in a narrow pane the model names ellipsized. The selected session tab sat a shade heavier than the rest of the chip row.
Changes
Scrollbars. The config pane rendered a custom
OverlayScrollbar(a thumb absolutely positioned over the scroller). It is gone, and so is the component, since the pane was its only caller. The pane already hides its native bar through the sharedag-scroll-no-barclass, which now also sets-ms-overflow-style: none. Four panels that hid the bar with[&::-webkit-scrollbar]:w-0alone, so Firefox still painted one, use the shared class instead. Coverage is now::-webkit-scrollbarfor Chrome and Safari,scrollbar-widthfor Firefox and Chromium 121+, and-ms-overflow-stylefor legacy Edge.Instructions header. The permanently disabled "+" and its "Multiple instruction files coming soon" tooltip are removed. The header keeps its title, file count, and chevron.
Model picker. It was pinned to a fixed panel regardless of the pane it opened from.
Before:
After:
The panel now spans its trigger, with a 460px floor so it never collapses below two readable columns. The
- 0.5remcancelsPopoverContent's own padding, so the panel lands flush with the select instead of overhanging it by 8px. The model list is sized aspanel - connectionColumn, which puts the freed width into the model names: 200px of provider column, 260px of names. This is per call site, so the completion playground's picker and the chat composer's/modelpanel keep their 560px geometry.Session tab. The selected chip moves from a full
colorFillstep tocolor-mix(in srgb, var(--ag-colorFill) 90%, transparent), which is 10% less fill. Alpha goes from 0.15 to 0.135 in light, and from 0.18 to 0.162 in dark. Mixing toward transparent rather than toward white keeps the intent right in both themes: the chip moves 10% closer to whatever surface it sits on.Tests / notes
prettier --checkandtsc --noEmitpass for the touched projects (@agenta/entity-uiandweb/oss).What to QA
/modelpanel in the chat composer. Both keep their previous width and column split.