From 0bb63ae2a015fcafdbb916d66f34b48abccad9eb Mon Sep 17 00:00:00 2001
From: Taylor Ho <taylorkmho@gmail.com>
Date: Wed, 20 May 2026 08:23:05 -0700
Subject: [PATCH] Move Add agent button to sit immediately left of settings
 gear

Reorder header action buttons so the Quick Add Agent popover trigger
(+ icon) is positioned directly before the manage channel button,
making it more discoverable next to the channel settings.

Also fix pre-existing lint: add role=menu to popover container and
format QuickAddAgentPopover.tsx per biome rules.
---
 .../channels/ui/ChannelMembersBar.tsx         | 38 +++++++++----------
 .../channels/ui/QuickAddAgentPopover.tsx      |  7 +++-
 2 files changed, 25 insertions(+), 20 deletions(-)

diff --git a/desktop/src/features/channels/ui/ChannelMembersBar.tsx b/desktop/src/features/channels/ui/ChannelMembersBar.tsx
index 8017924c31..d29465fa06 100644
--- a/desktop/src/features/channels/ui/ChannelMembersBar.tsx
+++ b/desktop/src/features/channels/ui/ChannelMembersBar.tsx
@@ -89,25 +89,6 @@ export function ChannelMembersBar({
   return (
     <React.Fragment>
       <div className="flex items-center gap-1">
-        <QuickAddAgentPopover
-          channelId={channel.id}
-          open={isQuickAddOpen}
-          onOpenChange={setIsQuickAddOpen}
-          onMoreOptions={() => setIsAddBotOpen(true)}
-        >
-          <Button
-            aria-label="Add agent"
-            className="h-7 w-7 rounded-full"
-            data-testid="channel-add-bot-trigger"
-            disabled={!canAddAgents}
-            size="icon"
-            type="button"
-            variant="outline"
-          >
-            <Plus className="h-3 w-3" />
-          </Button>
-        </QuickAddAgentPopover>
-
         <HuddleIndicator
           className="h-7 w-7"
           channelId={channel.id}
@@ -138,6 +119,25 @@ export function ChannelMembersBar({
           </span>
         </Button>
 
+        <QuickAddAgentPopover
+          channelId={channel.id}
+          open={isQuickAddOpen}
+          onOpenChange={setIsQuickAddOpen}
+          onMoreOptions={() => setIsAddBotOpen(true)}
+        >
+          <Button
+            aria-label="Add agent"
+            className="h-7 w-7 rounded-full"
+            data-testid="channel-add-bot-trigger"
+            disabled={!canAddAgents}
+            size="icon"
+            type="button"
+            variant="outline"
+          >
+            <Plus className="h-3 w-3" />
+          </Button>
+        </QuickAddAgentPopover>
+
         <Button
           aria-label="Manage channel"
           className="h-7 w-7 rounded-full"
diff --git a/desktop/src/features/channels/ui/QuickAddAgentPopover.tsx b/desktop/src/features/channels/ui/QuickAddAgentPopover.tsx
index b3ffbe4a7b..7baca150aa 100644
--- a/desktop/src/features/channels/ui/QuickAddAgentPopover.tsx
+++ b/desktop/src/features/channels/ui/QuickAddAgentPopover.tsx
@@ -304,6 +304,7 @@ export function QuickAddAgentPopover({
       <PopoverContent align="end" className="w-72 p-0" sideOffset={6}>
         <div
           className="flex max-h-80 flex-col"
+          role="menu"
           onKeyDown={(e) => {
             const container = e.currentTarget;
             const buttons = Array.from(
@@ -344,7 +345,11 @@ export function QuickAddAgentPopover({
                 No agents available.
               </div>
             ) : (
-              <div aria-label="Available agents" className="py-1" role="listbox">
+              <div
+                aria-label="Available agents"
+                className="py-1"
+                role="listbox"
+              >
                 {items.map((item) => {
                   const itemKey = getItemKey(item);
                   const isInChannel = item.kind === "running-in-channel";