From acde79dae79b5ba009eea88442fe396397152a97 Mon Sep 17 00:00:00 2001 From: Danilo Leal <67129314+danilo-leal@users.noreply.github.com> Date: Mon, 8 Sep 2025 18:39:49 -0300 Subject: [PATCH] agent: Improve popover trigger styles (#37800) This PR mostly adds some style treatment to popover button triggers in the agent panel, either making them better aligned with their trigger or adjusting the color to better clarify which button is triggering the currently opened menu. Moving forward, I think the selected styles at least should probably be tackled at the component level, whether that's a context menu or a popover, so we don't have to ever do this manually (and running the risk of forgetting to do it). Release Notes: - N/A --- crates/agent_ui/src/acp/model_selector_popover.rs | 14 +++++++++++--- crates/agent_ui/src/agent_panel.rs | 2 +- crates/agent_ui/src/profile_selector.rs | 11 ++++++++--- 3 files changed, 20 insertions(+), 7 deletions(-) diff --git a/crates/agent_ui/src/acp/model_selector_popover.rs b/crates/agent_ui/src/acp/model_selector_popover.rs index e8e0d4be7f9dd06f2a7b98761dc2b6287f968ba4..fa771c695ecf8175859d145b8d08d2cf3447a77a 100644 --- a/crates/agent_ui/src/acp/model_selector_popover.rs +++ b/crates/agent_ui/src/acp/model_selector_popover.rs @@ -5,7 +5,8 @@ use agent_client_protocol as acp; use gpui::{Entity, FocusHandle}; use picker::popover_menu::PickerPopoverMenu; use ui::{ - ButtonLike, Context, IntoElement, PopoverMenuHandle, SharedString, Tooltip, Window, prelude::*, + ButtonLike, Context, IntoElement, PopoverMenuHandle, SharedString, TintColor, Tooltip, Window, + prelude::*, }; use zed_actions::agent::ToggleModelSelector; @@ -58,15 +59,22 @@ impl Render for AcpModelSelectorPopover { let focus_handle = self.focus_handle.clone(); + let color = if self.menu_handle.is_deployed() { + Color::Accent + } else { + Color::Muted + }; + PickerPopoverMenu::new( self.selector.clone(), ButtonLike::new("active-model") .when_some(model_icon, |this, icon| { - this.child(Icon::new(icon).color(Color::Muted).size(IconSize::XSmall)) + this.child(Icon::new(icon).color(color).size(IconSize::XSmall)) }) + .selected_style(ButtonStyle::Tinted(TintColor::Accent)) .child( Label::new(model_name) - .color(Color::Muted) + .color(color) .size(LabelSize::Small) .ml_0p5(), ) diff --git a/crates/agent_ui/src/agent_panel.rs b/crates/agent_ui/src/agent_panel.rs index ad42b0001d60fb84cd879aeed85de35c6364eea5..e1ac67f1c8ba48ea60eee4be50ffedd14c3cf9c3 100644 --- a/crates/agent_ui/src/agent_panel.rs +++ b/crates/agent_ui/src/agent_panel.rs @@ -2538,7 +2538,7 @@ impl AgentPanel { } }, ) - .anchor(Corner::TopLeft) + .anchor(Corner::TopRight) .with_handle(self.new_thread_menu_handle.clone()) .menu({ let workspace = self.workspace.clone(); diff --git a/crates/agent_ui/src/profile_selector.rs b/crates/agent_ui/src/profile_selector.rs index f0f53b96b24c1d4f97fe94ecf155ebb7b73c6fa9..6ae4a73598a8e0e48509dda7a9bdd5e4fa2ea0ff 100644 --- a/crates/agent_ui/src/profile_selector.rs +++ b/crates/agent_ui/src/profile_selector.rs @@ -6,8 +6,8 @@ use gpui::{Action, Entity, FocusHandle, Subscription, prelude::*}; use settings::{Settings as _, SettingsStore, update_settings_file}; use std::sync::Arc; use ui::{ - ContextMenu, ContextMenuEntry, DocumentationSide, PopoverMenu, PopoverMenuHandle, Tooltip, - prelude::*, + ContextMenu, ContextMenuEntry, DocumentationSide, PopoverMenu, PopoverMenuHandle, TintColor, + Tooltip, prelude::*, }; /// Trait for types that can provide and manage agent profiles @@ -170,7 +170,8 @@ impl Render for ProfileSelector { .icon(IconName::ChevronDown) .icon_size(IconSize::XSmall) .icon_position(IconPosition::End) - .icon_color(Color::Muted); + .icon_color(Color::Muted) + .selected_style(ButtonStyle::Tinted(TintColor::Accent)); PopoverMenu::new("profile-selector") .trigger_with_tooltip(trigger_button, { @@ -195,6 +196,10 @@ impl Render for ProfileSelector { .menu(move |window, cx| { Some(this.update(cx, |this, cx| this.build_context_menu(window, cx))) }) + .offset(gpui::Point { + x: px(0.0), + y: px(-2.0), + }) .into_any_element() } else { Button::new("tools-not-supported-button", "Tools Unsupported")