Loading
Fix agentic chat toggle row layout and interaction
What does this MR do and why?
In the agentic chat model selection dropdown (behind the new_model_selection feature flag), this change makes the Agentic chat toggle row clickable, adds a hover state, and rebuilds the layout so it no longer depends on GlToggle's internals, matching other toggle-as-dropdown-item patterns in the codebase (e.g. board view options, work item display settings). The same treatment is applied to the non-agentic "Agentic chat" toggle in chat_model_selector.vue, which shares the pattern.
References
- !256436 (comment 3883923808) (review feedback that this follows up)
Screenshots or screen recordings
| Before | After |
|---|---|
![]() |
![]() |
How to set up and validate locally
- Enable the feature flag in a Rails console:
Feature.enable(:new_model_selection) - Open GitLab Duo agentic chat and open the model selection dropdown.
- Hover the Agentic chat row — the row shows an inset, rounded hover background that stays within the panel (no bleed past the rounded corners or caret arrow).
- Confirm the label sits on the left and the switch on the right, with padding around the row.
- Click anywhere on the row (not just the switch) — the toggle flips.
- Confirm keyboard interaction still works: Tab to the switch and press Enter/Space.
- Switch to non-agentic chat and confirm the "Agentic chat" toggle row behaves the same.
MR acceptance checklist
Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Edited by Austin Regnery

