fix(desktop): match dropdown trigger color to run button state#3009
Conversation
The combo dropdown chevron on the WorkspaceRunButton stayed a static color while the main button changed between idle, running (emerald), and unconfigured (muted) states. Apply the same conditional color classes to the dropdown trigger so both halves look consistent.
|
Caution Review failedThe pull request is closed. ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughThe dropdown trigger button in WorkspaceRunButton now applies conditional styling based on Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Poem
✨ 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 |
🧹 Preview Cleanup CompleteThe following preview resources have been cleaned up:
Thank you for your contribution! 🎉 |
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
There was a problem hiding this comment.
1 issue found across 1 file
Prompt for AI agents (unresolved issues)
Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.
<file name="apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/TopBar/components/WorkspaceRunButton/WorkspaceRunButton.tsx">
<violation number="1" location="apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/TopBar/components/WorkspaceRunButton/WorkspaceRunButton.tsx:146">
P3: In the running state, hover will still apply `hover:text-foreground` from the base classes, so the chevron text turns default on hover instead of staying emerald. Add a running-state hover text override to keep the colors consistent with the left button.</violation>
</file>
Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.
| "active:scale-[0.98]", | ||
| isPending && "opacity-50 pointer-events-none", | ||
| isRunning | ||
| ? "text-emerald-300 border-emerald-500/25 bg-emerald-500/10 hover:bg-emerald-500/20" |
There was a problem hiding this comment.
P3: In the running state, hover will still apply hover:text-foreground from the base classes, so the chevron text turns default on hover instead of staying emerald. Add a running-state hover text override to keep the colors consistent with the left button.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At apps/desktop/src/renderer/routes/_authenticated/_dashboard/components/TopBar/components/WorkspaceRunButton/WorkspaceRunButton.tsx, line 146:
<comment>In the running state, hover will still apply `hover:text-foreground` from the base classes, so the chevron text turns default on hover instead of staying emerald. Add a running-state hover text override to keep the colors consistent with the left button.</comment>
<file context>
@@ -142,6 +142,10 @@ export const WorkspaceRunButton = memo(function WorkspaceRunButton({
"active:scale-[0.98]",
isPending && "opacity-50 pointer-events-none",
+ isRunning
+ ? "text-emerald-300 border-emerald-500/25 bg-emerald-500/10 hover:bg-emerald-500/20"
+ : !hasRunCommand &&
+ "text-muted-foreground/80 border-border/40 bg-secondary/40",
</file context>
| ? "text-emerald-300 border-emerald-500/25 bg-emerald-500/10 hover:bg-emerald-500/20" | |
| ? "text-emerald-300 border-emerald-500/25 bg-emerald-500/10 hover:bg-emerald-500/20 hover:text-emerald-300" |
fix(desktop): match dropdown trigger color to run button state (superset-sh#3009)
1 participant
Summary
Why / Context
The main Run button changes color based on state — emerald when running, muted when unconfigured — but the adjacent dropdown chevron always stayed the default
bg-secondary/50 text-muted-foreground. This made the split button look visually disconnected, especially in the running state where the left half was green and the right half was grey.Manual QA Checklist
Run Button States
text-emerald-300,bg-emerald-500/10)text-muted-foreground/80,bg-secondary/40)bg-emerald-500/20Testing
bun run typecheckSummary by cubic
Align the WorkspaceRunButton dropdown trigger with the main Run button so both halves share state-based styling. Running uses emerald, idle stays secondary, unconfigured is muted; pending opacity and running hover are respected.
Written for commit 4718564. Summary will update on new commits.
Summary by CodeRabbit