Unify workbench chrome controls

Move project, branch, run, update, notification, and account controls into
the title bar using the shared chrome sizing contract. Make Search a normal
Activity navigation item and restore macOS traffic-light alignment.

Author: mehmetozguldev

src/features/git/components/git-branch-manager.tsx

@@ -19,7 +19,7 @@ import {
   CommandTabs,
   useCommandListNavigation,
 } from "@/ui/command";
-import { GitBranchIcon, FolderOpenIcon, NodesIcon } from "@/ui/icons";
+import { ChevronExpandYIcon, GitBranchIcon, FolderOpenIcon, NodesIcon } from "@/ui/icons";
 import { showConfirmDialog } from "@/ui/dialog";
 import { cn } from "@/utils/cn";
 import { getFolderName, getRelativePath } from "@/utils/path-helpers";
@@ -42,6 +42,7 @@ interface GitBranchManagerProps {
   onRepositoryChange?: (repoPath: string | null) => void;
   paletteTarget?: boolean;
   openEventName?: string;
+  triggerMode?: "repository" | "branch";
 }
 
 type GitBranchManagerTab = "branches" | "worktrees" | "repositories";
@@ -130,6 +131,7 @@ const GitBranchManager = ({
   onRepositoryChange,
   paletteTarget = false,
   openEventName = "athas:open-branch-manager",
+  triggerMode = "repository",
 }: GitBranchManagerProps) => {
   const [branches, setBranches] = useState<string[]>([]);
   const [worktrees, setWorktrees] = useState<GitWorktree[]>([]);
@@ -442,6 +444,10 @@ const GitBranchManager = ({
     if (!repoPath || isDropdownOpen) return;
     setActiveTab("branches");
     setIsDropdownOpen(true);
+    if (triggerMode === "branch") {
+      await loadBranches();
+      return;
+    }
     await Promise.all([loadBranches(), loadWorktrees()]);
   };
 
@@ -551,22 +557,37 @@ const GitBranchManager = ({
         onClick={() => void handleOpenDropdown()}
         disabled={isLoading}
         variant="ghost"
+        size={triggerMode === "branch" ? "chrome" : "default"}
         className={cn(
           "w-fit max-w-full min-w-0 shrink justify-start overflow-hidden text-left hover:bg-accent/80",
+          triggerMode === "branch" && "max-w-48",
           isDropdownOpen && "bg-accent/80",
         )}
         title={selectorRepoPath ?? undefined}
-        aria-label={`Switch repository or branch. ${activeRepositoryLabel}, branch ${currentBranch}`}
+        aria-label={
+          triggerMode === "branch"
+            ? `Switch branch. Current branch: ${currentBranch}`
+            : `Switch repository or branch. ${activeRepositoryLabel}, branch ${currentBranch}`
+        }
       >
-        <FolderOpenIcon />
-        <span className="flex min-w-0 flex-1 flex-col items-start overflow-hidden leading-none">
-          <span className="max-w-full truncate font-medium text-foreground ui-text-sm">
-            {activeRepositoryLabel}
-          </span>
-          <span className="max-w-full truncate font-normal text-subtle-foreground ui-text-caption">
-            {currentBranch}
-          </span>
-        </span>
+        {triggerMode === "branch" ? (
+          <>
+            <span className="min-w-0 truncate">{currentBranch}</span>
+            <ChevronExpandYIcon className="text-subtle-foreground" />
+          </>
+        ) : (
+          <>
+            <FolderOpenIcon />
+            <span className="flex min-w-0 flex-1 flex-col items-start overflow-hidden leading-none">
+              <span className="max-w-full truncate font-medium text-foreground ui-text-sm">
+                {activeRepositoryLabel}
+              </span>
+              <span className="max-w-full truncate font-normal text-subtle-foreground ui-text-caption">
+                {currentBranch}
+              </span>
+            </span>
+          </>
+        )}
       </Button>
 
       <GitCommandSurface
@@ -592,7 +613,11 @@ const GitBranchManager = ({
                   availableRepoPaths.length === 1 ? "y" : "ies"
                 }`
         }
-        headerAddon={<CommandTabs items={tabItems} ariaLabel="Git selector sections" />}
+        headerAddon={
+          triggerMode === "repository" ? (
+            <CommandTabs items={tabItems} ariaLabel="Git selector sections" />
+          ) : undefined
+        }
       >
         <CommandList>
           {activeTab === "branches" && !createBranchName && filteredBranches.length === 0 ? (

src/features/layout/components/app-update-control.tsx

@@ -1,16 +1,12 @@
 import { useMemo, useRef, useState } from "react";
 import { useAutoUpdate } from "@/features/settings/hooks/use-auto-update";
+import { Button } from "@/ui/button";
 import { Dropdown } from "@/ui/dropdown";
 import { Spinner } from "@/ui/spinner";
 import { CalendarIcon, ClockIcon, DownloadIcon, FileTextIcon, XCircleIcon } from "@/ui/icons";
-import { SidebarIconButton, SidebarListItem } from "@/ui/sidebar";
 import Tooltip from "@/ui/tooltip";
 
-interface AppUpdateControlProps {
-  expanded: boolean;
-}
-
-export function AppUpdateControl({ expanded }: AppUpdateControlProps) {
+export function AppUpdateControl() {
   const {
     showUpdateIndicator,
     downloading,
@@ -79,13 +75,6 @@ export function AppUpdateControl({ expanded }: AppUpdateControlProps) {
 
   if (!showUpdateIndicator || !updateInfo) return null;
 
-  const updateLabel = downloading
-    ? `${downloadProgress?.percentage ?? 0}%`
-    : installing
-      ? "Installing"
-      : updateError
-        ? "Update failed"
-        : "Update available";
   const updateTooltip = updateError
     ? updateError
     : downloading
@@ -95,49 +84,33 @@ export function AppUpdateControl({ expanded }: AppUpdateControlProps) {
         : `Update available: ${updateInfo.version}`;
 
   return (
-    <div ref={updateMenuRef} className="w-full">
-      {expanded ? (
-        <SidebarListItem
-          leading={
-            updateBusy ? (
-              <Spinner label={downloading ? "Downloading" : "Installing"} compact />
-            ) : (
-              <DownloadIcon />
-            )
-          }
+    <div ref={updateMenuRef}>
+      <Tooltip content={updateTooltip} side="bottom">
+        <Button
+          type="button"
+          variant="ghost"
+          iconOnly
+          size="chrome"
           active={isUpdateMenuOpen}
           disabled={updateBusy}
           onClick={() => setIsUpdateMenuOpen((open) => !open)}
           aria-haspopup="menu"
           aria-expanded={isUpdateMenuOpen}
           aria-label={updateTooltip}
         >
-          {updateLabel}
-        </SidebarListItem>
-      ) : (
-        <Tooltip content={updateTooltip} side="right">
-          <SidebarIconButton
-            active={isUpdateMenuOpen}
-            disabled={updateBusy}
-            onClick={() => setIsUpdateMenuOpen((open) => !open)}
-            aria-haspopup="menu"
-            aria-expanded={isUpdateMenuOpen}
-            aria-label={updateTooltip}
-          >
-            {updateBusy ? (
-              <Spinner label={downloading ? "Downloading" : "Installing"} compact />
-            ) : (
-              <DownloadIcon />
-            )}
-          </SidebarIconButton>
-        </Tooltip>
-      )}
+          {updateBusy ? (
+            <Spinner label={downloading ? "Downloading" : "Installing"} compact />
+          ) : (
+            <DownloadIcon />
+          )}
+        </Button>
+      </Tooltip>
       <Dropdown
         isOpen={isUpdateMenuOpen}
         onClose={() => setIsUpdateMenuOpen(false)}
         anchorRef={updateMenuRef}
-        anchorSide="top"
-        anchorAlign="start"
+        anchorSide="bottom"
+        anchorAlign="end"
         items={updateMenuItems}
         className="min-w-52"
       />

…ts/sidebar/activity-project-switcher.tsx …s/layout/components/project-switcher.tsxsrc/features/layout/components/sidebar/activity-project-switcher.tsx renamed to src/features/layout/components/project-switcher.tsx src/features/layout/components/sidebar/activity-project-switcher.tsx renamed to src/features/layout/components/project-switcher.tsx

@@ -15,28 +15,29 @@ import { findBestProjectIcon } from "@/features/window/utils/project-icons";
 import { Button } from "@/ui/button";
 import {
   DropdownMenu,
+  DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuRadioGroup,
   DropdownMenuRadioItem,
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "@/ui/dropdown";
 import { ChevronExpandYIcon, FolderOpenIcon, ImageIcon, RemoteIcon, XIcon } from "@/ui/icons";
-import { SidebarIconButton, SidebarListItem, SidebarMenuContent } from "@/ui/sidebar";
 import { showConfirmDialog } from "@/ui/dialog";
 import { toast } from "sonner";
-import { getClosedRemoteConnections, getProjectRemoteConnectionId } from "./project-switcher-items";
-import { getProjectNameFromPath, isRemoteProjectPath, ProjectGlyph } from "./project-glyph";
+import {
+  getClosedRemoteConnections,
+  getProjectRemoteConnectionId,
+} from "./sidebar/project-switcher-items";
+import { getProjectNameFromPath, isRemoteProjectPath, ProjectGlyph } from "./sidebar/project-glyph";
 
-export function ActivityProjectSwitcher({
-  expanded,
+export function ProjectSwitcher({
   project,
   projects,
   isSwitchingProject,
   onSelectProject,
   onAddRemote,
 }: {
-  expanded: boolean;
   project?: ProjectTab;
   projects: ProjectTab[];
   isSwitchingProject: boolean;
@@ -83,18 +84,14 @@ export function ActivityProjectSwitcher({
     let cancelled = false;
 
     findBestProjectIcon(projectPath).then((iconFile) => {
-      if (!cancelled) {
-        setDetectedIconPath(iconFile?.path);
-      }
+      if (!cancelled) setDetectedIconPath(iconFile?.path);
     });
 
     return () => {
       cancelled = true;
     };
   }, [displayProject, displayProjectKey, customIcon, isRemote, projectPath]);
 
-  const projectGlyph = <ProjectGlyph projectPath={projectPath} iconPath={displayIconPath} />;
-
   const handleConnectRemote = async (connectionId: string, providedPassword?: string) => {
     const connection = remoteConnections.find((candidate) => candidate.id === connectionId);
     if (!connection || connectingRemoteId === connectionId) return;
@@ -181,23 +178,20 @@ export function ActivityProjectSwitcher({
       >
         <DropdownMenuTrigger
           render={
-            expanded ? (
-              <SidebarListItem
-                leading={projectGlyph}
-                trailing={<ChevronExpandYIcon />}
-                width="content"
-                aria-label="Switch project"
-              >
-                {projectName}
-              </SidebarListItem>
-            ) : (
-              <SidebarIconButton aria-label="Switch project" title={projectName}>
-                {projectGlyph}
-              </SidebarIconButton>
-            )
+            <Button
+              variant="ghost"
+              size="chrome"
+              className="min-w-0 max-w-48 shrink"
+              aria-label={`Switch project. Current project: ${projectName}`}
+              title={projectPath || projectName}
+            >
+              <ProjectGlyph projectPath={projectPath} iconPath={displayIconPath} />
+              <span className="min-w-0 truncate">{projectName}</span>
+              <ChevronExpandYIcon className="text-subtle-foreground" />
+            </Button>
           }
         />
-        <SidebarMenuContent>
+        <DropdownMenuContent side="bottom" align="start">
           {projects.length > 0 || closedRemoteConnections.length > 0 ? (
             <>
               <DropdownMenuRadioGroup
@@ -268,7 +262,7 @@ export function ActivityProjectSwitcher({
             <RemoteIcon />
             Add remote…
           </DropdownMenuItem>
-        </SidebarMenuContent>
+        </DropdownMenuContent>
       </DropdownMenu>
       {iconPickerProject ? (
         <ProjectIconPicker

src/features/layout/components/sidebar/activity-bar-menu.tsx

@@ -25,7 +25,6 @@ interface ActivityBarMenuProps {
   navigationItems: ActivityNavigationItem[];
   hiddenNavigationItemIds: string[];
   coreFeatures: CoreFeaturesState;
-  showProjectSwitcher: boolean;
   showAgentHistory: boolean;
   showTerminals: boolean;
   showProjectDots: boolean;
@@ -37,7 +36,6 @@ interface ActivityBarMenuProps {
   onSearch: () => void;
   onOpenExtensions: () => void;
   onNavigationItemVisibleChange: (itemId: string, visible: boolean) => void;
-  onProjectSwitcherVisibleChange: (visible: boolean) => void;
   onAgentHistoryVisibleChange: (visible: boolean) => void;
   onTerminalsVisibleChange: (visible: boolean) => void;
   onProjectDotsVisibleChange: (visible: boolean) => void;
@@ -48,7 +46,6 @@ export function ActivityBarMenu({
   navigationItems,
   hiddenNavigationItemIds,
   coreFeatures,
-  showProjectSwitcher,
   showAgentHistory,
   showTerminals,
   showProjectDots,
@@ -60,7 +57,6 @@ export function ActivityBarMenu({
   onSearch,
   onOpenExtensions,
   onNavigationItemVisibleChange,
-  onProjectSwitcherVisibleChange,
   onAgentHistoryVisibleChange,
   onTerminalsVisibleChange,
   onProjectDotsVisibleChange,
@@ -106,13 +102,6 @@ export function ActivityBarMenu({
         </ContextMenuSubTrigger>
         <ContextMenuSubContent>
           <ContextMenuGroup>
-            <ContextMenuCheckboxItem
-              checked={showProjectSwitcher}
-              onCheckedChange={onProjectSwitcherVisibleChange}
-            >
-              <FolderIcon />
-              Project Switcher
-            </ContextMenuCheckboxItem>
             {navigationItems.map((item) => (
               <ContextMenuCheckboxItem
                 key={item.id}