[fix/feat:ui] Move menu checks to the right

[sandersonstabo]

What changed

Selected menu items can hide the default left radio indicator and render their checkmark on the right instead.

Why

Humans are used to selected state being on the right side

UI changes

Before:

After:

Checklist

• This PR is small and focused
• I explained what changed and why
• I included before/after screenshots for any UI changes
• I included a video for animation/interaction changes

Testing

vp check apps/web/src/components/ui/menu.tsx apps/web/src/components/chat/TraitsPicker.tsx apps/web/src/components/chat/ChatComposer.tsx

Note

Move menu check indicators to the right in chat composer and traits picker

• Replaces the default built-in radio/selection indicators in the runtime mode selector (ChatComposer.tsx) and traits picker (TraitsPicker.tsx) with an explicit right-aligned CheckIcon that shows conditionally based on the selected value.
• Adds a hideIndicator prop to MenuRadioItem in menu.tsx, which suppresses the built-in indicator and adjusts layout so content spans the full width.

^{Macroscope summarized 4bbdcf7.}

---

Note

Low Risk
Pure presentation changes to menu/select items; selection behavior and state wiring are unchanged.

Overview
Selection menus in the chat composer and traits picker now show the active choice with a right-aligned CheckIcon instead of the default left radio/check column.

MenuRadioItem gains an optional hideIndicator prop that drops the built-in left indicator and uses full-width row padding so callers can render their own trailing check. TraitsPicker applies this to effort/select and On/Off boolean groups. The runtime mode dropdown in ChatComposer uses the same pattern on SelectItem (hideIndicator plus a check that stays visible only for the current mode).

^{Reviewed by Cursor Bugbot for commit 4bbdcf7. Bugbot is set up for automated code reviews on this repo. Configure here.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 8638d264-46a7-46e8-bb1c-c593fb834db9

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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

[macroscopeapp]

Approvability

Verdict: Approved

Purely visual change that moves checkmark indicators from the left to right side of menu items. No runtime behavior changes - only presentation/styling adjustments to UI components.

^{You can customize Macroscope's approvability policy. Learn more.}

[cursor]

Cursor Bugbot has reviewed your changes using high effort and found 2 potential issues.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

Want fixes drafted automatically? Bugbot Autofix can create code changes for findings. A team admin can enable Autofix in the Cursor dashboard.

^{Reviewed by Cursor Bugbot for commit 4bbdcf7. Configure here.}

[cursor]

Label truncation may not apply

Low Severity

MenuRadioItem wraps children in a grid cell without min-w-0, unlike SelectItem. The new traits rows use truncate with a right-side check inside that cell, so long option labels can expand or overflow instead of ellipsizing when the menu width is constrained.

Additional Locations (1)

• apps/web/src/components/chat/TraitsPicker.tsx#L319-L327

 

^{Reviewed by Cursor Bugbot for commit 4bbdcf7. Configure here.}

[cursor]

Muted runtime mode checkmark

Low Severity

The new right-side CheckIcon sits inside SelectItem’s ItemText, which forces SVGs without a text-* class to text-muted-foreground. The old left indicator sat outside ItemText and kept normal foreground contrast, so the selected-state check now matches decorative icons instead of a selection affordance.

 

^{Reviewed by Cursor Bugbot for commit 4bbdcf7. Configure here.}

[shivamhwp]

gpt-5.6-sol on behalf of shivamhwp.

Thank you for taking the time to submit this. We are closing this PR because #3234 has already landed the menu-check update on main. It changes the same three files and covers the behavior proposed here, so there is no remaining work for this branch to contribute.

We appreciate the contribution.