refactor(site): move Copy SSH and View Workspace from meatball to pill

Move Copy SSH Command and View Workspace out of the ChatTopBar meatball menu into the WorkspacePill popover. The meatball menu now only contains Generate Title and Archive/Delete actions. Remove the WorkspaceActions interface from ChatTopBar entirely. WorkspacePill returns null when there are no apps and no SSH command, letting the ToolBadge fallback handle the simple link case.
coder · DanielleMaywood · Apr 15, 2026 · Apr 13, 2026 · Apr 13, 2026 · Apr 13, 2026
commit 968919956de3991f5aa9a3e37670a36de974c970
diff --git a/site/src/pages/AgentsPage/AgentChatPage.stories.tsx b/site/src/pages/AgentsPage/AgentChatPage.stories.tsx
@@ -640,12 +640,13 @@ export const CompletedWithDiffPanel: Story = {
 		// Verify menu items are rendered.
 		const body = within(document.body);
 		await waitFor(() => {
-			expect(body.getByText("View Workspace")).toBeInTheDocument();
+			expect(body.getByText("Archive Agent")).toBeInTheDocument();
 		});
-		expect(body.getByText("Archive Agent")).toBeInTheDocument();
-		// IDE items moved to the workspace pill dropdown.
+		// Workspace items moved to the workspace pill popover.
 		expect(body.queryByText("Open in Cursor")).not.toBeInTheDocument();
 		expect(body.queryByText("Open in VS Code")).not.toBeInTheDocument();
+		expect(body.queryByText("View Workspace")).not.toBeInTheDocument();
+		expect(body.queryByText("Copy SSH Command")).not.toBeInTheDocument();
 	},
 };
 

diff --git a/site/src/pages/AgentsPage/AgentChatPage.tsx b/site/src/pages/AgentsPage/AgentChatPage.tsx
@@ -1063,22 +1063,11 @@ const AgentChatPage: FC = () => {
 	);
 
 	const parentChat = parentChatQuery.data;
-	const workspaceRoute = workspace
-		? `/@${workspace.owner_name}/${workspace.name}`
-		: null;
-	const canOpenWorkspace = Boolean(workspaceRoute);
 	const sshCommand =
 		workspace && workspaceAgent && sshConfigQuery.data?.hostname_suffix
 			? `ssh ${workspaceAgent.name}.${workspace.name}.${workspace.owner_name}.${sshConfigQuery.data.hostname_suffix}`
 			: undefined;
 
-	const handleViewWorkspace = () => {
-		if (!workspaceRoute) {
-			return;
-		}
-		window.open(workspaceRoute, "_blank");
-	};
-
 	const handleArchiveAgentAction = () => {
 		if (!agentId || isArchived) {
 			return;
@@ -1203,8 +1192,6 @@ const AgentChatPage: FC = () => {
 			diffStatusData={chatQuery.data?.diff_status}
 			gitWatcher={gitWatcher}
 			sshCommand={sshCommand}
-			canOpenWorkspace={canOpenWorkspace}
-			handleViewWorkspace={handleViewWorkspace}
 			handleCommit={handleCommit}
 			handleInterrupt={handleInterrupt}
 			handleDeleteQueuedMessage={handleDeleteQueuedMessage}

diff --git a/site/src/pages/AgentsPage/AgentChatPageView.stories.tsx b/site/src/pages/AgentsPage/AgentChatPageView.stories.tsx
@@ -137,9 +137,7 @@ const StoryAgentChatPageView: FC<StoryProps> = ({ editing, ...overrides }) => {
 			typeof AgentChatPageView
 		>["diffStatusData"],
 		gitWatcher: buildGitWatcher(),
-		canOpenWorkspace: false,
 		sshCommand: undefined as string | undefined,
-		handleViewWorkspace: fn(),
 		handleCommit: fn(),
 		handleInterrupt: fn(),
 		handleDeleteQueuedMessage: fn(),
@@ -366,9 +364,7 @@ export const NoModelOptions: Story = {
 
 /** Top bar has workspace action buttons visible. */
 export const WithWorkspaceActions: Story = {
-	render: () => (
-		<StoryAgentChatPageView canOpenWorkspace sshCommand="ssh coder.workspace" />
-	),
+	render: () => <StoryAgentChatPageView sshCommand="ssh coder.workspace" />,
 };
 
 // ---------------------------------------------------------------------------

diff --git a/site/src/pages/AgentsPage/AgentChatPageView.tsx b/site/src/pages/AgentsPage/AgentChatPageView.tsx
@@ -132,9 +132,7 @@ interface AgentChatPageViewProps {
 	};
 
 	// Workspace action handlers.
-	canOpenWorkspace: boolean;
 	sshCommand: string | undefined;
-	handleViewWorkspace: () => void;
 	handleCommit: (repoRoot: string) => void;
 
 	// Chat action handlers.
@@ -203,9 +201,7 @@ export const AgentChatPageView: FC<AgentChatPageViewProps> = ({
 	prNumber,
 	diffStatusData,
 	gitWatcher,
-	canOpenWorkspace,
 	sshCommand,
-	handleViewWorkspace,
 	handleCommit,
 	handleInterrupt,
 	handleDeleteQueuedMessage,
@@ -351,11 +347,6 @@ export const AgentChatPageView: FC<AgentChatPageViewProps> = ({
 									showSidebarPanel,
 									onToggleSidebar: () => onSetShowSidebarPanel((prev) => !prev),
 								}}
-								workspace={{
-									canOpenWorkspace,
-									onViewWorkspace: handleViewWorkspace,
-									sshCommand,
-								}}
 								onArchiveAgent={handleArchiveAgentAction}
 								onUnarchiveAgent={handleUnarchiveAgentAction}
 								onArchiveAndDeleteWorkspace={
@@ -448,6 +439,7 @@ export const AgentChatPageView: FC<AgentChatPageViewProps> = ({
 								workspace={workspace}
 								workspaceAgent={workspaceAgent}
 								chatId={agentId}
+								sshCommand={sshCommand}
 								attachedWorkspace={attachedWorkspace}
 							/>
 						</div>
@@ -562,11 +554,6 @@ export const AgentChatPageLoadingView: FC<AgentChatPageLoadingViewProps> = ({
 						showSidebarPanel: false,
 						onToggleSidebar: () => {},
 					}}
-					workspace={{
-						canOpenWorkspace: false,
-						onViewWorkspace: () => {},
-						sshCommand: undefined,
-					}}
 					onArchiveAgent={() => {}}
 					onUnarchiveAgent={() => {}}
 					onRegenerateTitle={() => {}}
@@ -637,11 +624,6 @@ export const AgentChatPageNotFoundView: FC<AgentChatPageNotFoundViewProps> = ({
 					showSidebarPanel: false,
 					onToggleSidebar: () => {},
 				}}
-				workspace={{
-					canOpenWorkspace: false,
-					onViewWorkspace: () => {},
-					sshCommand: undefined,
-				}}
 				onArchiveAgent={() => {}}
 				onUnarchiveAgent={() => {}}
 				onRegenerateTitle={() => {}}

diff --git a/site/src/pages/AgentsPage/components/AgentChatInput.tsx b/site/src/pages/AgentsPage/components/AgentChatInput.tsx
@@ -152,6 +152,7 @@ interface AgentChatInputProps {
 	workspace?: TypesGen.Workspace;
 	workspaceAgent?: TypesGen.WorkspaceAgent;
 	chatId?: string;
+	sshCommand?: string;
 	attachedWorkspace?: AttachedWorkspaceInfo;
 }
 
@@ -292,6 +293,7 @@ export const AgentChatInput: FC<AgentChatInputProps> = ({
 	workspace,
 	workspaceAgent,
 	chatId,
+	sshCommand,
 	attachedWorkspace,
 }) => {
 	const [chatFullWidth] = useChatFullWidth();
@@ -937,8 +939,9 @@ export const AgentChatInput: FC<AgentChatInputProps> = ({
 									workspace={workspace}
 									agent={workspaceAgent}
 									chatId={chatId}
+									sshCommand={sshCommand}
 								/>
-							)}
+							)}{" "}
 							{allBadges.map((badge, i) => {
 								const isOverflow = overflowCount > 0 && i >= visibleCount;
 								return (

diff --git a/site/src/pages/AgentsPage/components/ChatPageContent.tsx b/site/src/pages/AgentsPage/components/ChatPageContent.tsx
@@ -187,6 +187,7 @@ interface ChatPageInputProps {
 	workspace?: TypesGen.Workspace;
 	workspaceAgent?: TypesGen.WorkspaceAgent;
 	chatId?: string;
+	sshCommand?: string;
 	attachedWorkspace?: AttachedWorkspaceInfo;
 }
 
@@ -228,6 +229,7 @@ export const ChatPageInput: FC<ChatPageInputProps> = ({
 	workspace,
 	workspaceAgent,
 	chatId,
+	sshCommand,
 	attachedWorkspace,
 }) => {
 	const messagesByID = useChatSelector(store, selectMessagesByID);
@@ -405,6 +407,7 @@ export const ChatPageInput: FC<ChatPageInputProps> = ({
 			workspace={workspace}
 			workspaceAgent={workspaceAgent}
 			chatId={chatId}
+			sshCommand={sshCommand}
 			attachedWorkspace={attachedWorkspace}
 		/>
 	);

diff --git a/site/src/pages/AgentsPage/components/ChatTopBar.stories.tsx b/site/src/pages/AgentsPage/components/ChatTopBar.stories.tsx
@@ -8,11 +8,6 @@ const defaultProps = {
 		showSidebarPanel: false,
 		onToggleSidebar: fn(),
 	},
-	workspace: {
-		canOpenWorkspace: true,
-		onViewWorkspace: fn(),
-		sshCommand: "ssh main.my-workspace.admin.coder",
-	},
 	onArchiveAgent: fn(),
 	onArchiveAndDeleteWorkspace: fn(),
 	onRegenerateTitle: fn(),

diff --git a/site/src/pages/AgentsPage/components/ChatTopBar.tsx b/site/src/pages/AgentsPage/components/ChatTopBar.tsx
@@ -3,9 +3,7 @@ import {
 	ArchiveRestoreIcon,
 	ArrowLeftIcon,
 	ChevronRightIcon,
-	CopyIcon,
 	EllipsisIcon,
-	MonitorIcon,
 	PanelLeftIcon,
 	PanelRightCloseIcon,
 	PanelRightOpenIcon,
@@ -14,7 +12,6 @@ import {
 } from "lucide-react";
 import type { FC } from "react";
 import { Link } from "react-router";
-import { toast } from "sonner";
 import type * as TypesGen from "#/api/typesGenerated";
 import type { ChatDiffStatus } from "#/api/typesGenerated";
 import { Button } from "#/components/Button/Button";
@@ -36,17 +33,10 @@ interface SidebarPanelState {
 	onToggleSidebar: () => void;
 }
 
-interface WorkspaceActions {
-	canOpenWorkspace: boolean;
-	onViewWorkspace: () => void;
-	sshCommand: string | undefined;
-}
-
 type ChatTopBarProps = {
 	chatTitle?: string;
 	parentChat?: TypesGen.Chat;
 	panel: SidebarPanelState;
-	workspace: WorkspaceActions;
 	onArchiveAgent: () => void;
 	onUnarchiveAgent: () => void;
 	onArchiveAndDeleteWorkspace: () => void;
@@ -64,7 +54,6 @@ export const ChatTopBar: FC<ChatTopBarProps> = ({
 	chatTitle,
 	parentChat,
 	panel,
-	workspace,
 	onArchiveAgent,
 	onUnarchiveAgent,
 	onArchiveAndDeleteWorkspace,
@@ -201,30 +190,6 @@ export const ChatTopBar: FC<ChatTopBarProps> = ({
 							align="end"
 							className="[&_[role=menuitem]]:text-[13px]"
 						>
-							<DropdownMenuItem
-								disabled={!workspace.sshCommand}
-								onSelect={async () => {
-									if (!workspace.sshCommand) return;
-									try {
-										await navigator.clipboard.writeText(workspace.sshCommand);
-										toast.success("SSH command copied to clipboard");
-									} catch {
-										toast.error("Failed to copy SSH command");
-									}
-								}}
-							>
-								<CopyIcon className="h-3.5 w-3.5" />
-								Copy SSH Command
-							</DropdownMenuItem>
-							<DropdownMenuSeparator />
-
-							<DropdownMenuItem
-								disabled={!workspace.canOpenWorkspace}
-								onSelect={workspace.onViewWorkspace}
-							>
-								<MonitorIcon className="h-3.5 w-3.5" />
-								View Workspace
-							</DropdownMenuItem>
 							{!isArchived && (
 								<>
 									<DropdownMenuSeparator />

diff --git a/site/src/pages/AgentsPage/components/WorkspacePill.tsx b/site/src/pages/AgentsPage/components/WorkspacePill.tsx
@@ -1,5 +1,6 @@
 import {
 	ChevronDownIcon,
+	CopyIcon,
 	ExternalLinkIcon,
 	LayoutGridIcon,
 	MonitorDotIcon,
@@ -50,14 +51,14 @@ interface WorkspacePillProps {
 	workspace: Workspace;
 	agent: WorkspaceAgent;
 	chatId: string;
-	className?: string;
+	sshCommand?: string;
 }
 
 export const WorkspacePill: FC<WorkspacePillProps> = ({
 	workspace,
 	agent,
 	chatId,
-	className,
+	sshCommand,
 }) => {
 	const [open, setOpen] = useState(false);
 	const route = `/@${workspace.owner_name}/${workspace.name}`;
@@ -81,11 +82,6 @@ export const WorkspacePill: FC<WorkspacePillProps> = ({
 	};
 	const statusIcon = statusIconMap[effectiveType];
 
-	const badgeCls = cn(
-		"inline-flex shrink-0 items-center gap-1 rounded-full bg-surface-secondary px-2 py-0.5 text-xs font-medium text-content-secondary",
-		className,
-	);
-
 	const builtinApps = new Set(agent.display_apps);
 	const hasVSCode = builtinApps.has("vscode");
 	const hasVSCodeInsiders = builtinApps.has("vscode_insiders");
@@ -99,28 +95,13 @@ export const WorkspacePill: FC<WorkspacePillProps> = ({
 	const hasApps =
 		hasVSCode || hasVSCodeInsiders || hasTerminal || externalApps.length > 0;
 
-	if (!hasApps) {
-		return (
-			<Tooltip>
-				<TooltipTrigger asChild>
-					<Link
-						to={route}
-						target="_blank"
-						rel="noreferrer"
-						className={cn(
-							badgeCls,
-							"no-underline transition-colors hover:bg-surface-tertiary hover:text-content-primary",
-						)}
-					>
-						{statusIcon}
-						{workspace.name}
-					</Link>
-				</TooltipTrigger>
-				<TooltipContent>{statusLabel}</TooltipContent>
-			</Tooltip>
-		);
+	if (!hasApps && !sshCommand) {
+		return null;
 	}
 
+	const badgeCls =
+		"inline-flex shrink-0 items-center gap-1 rounded-full bg-surface-secondary px-2 py-0.5 text-xs font-medium text-content-secondary";
+
 	return (
 		<Popover open={open} onOpenChange={setOpen}>
 			<Tooltip>
@@ -183,6 +164,12 @@ export const WorkspacePill: FC<WorkspacePillProps> = ({
 							onDone={() => setOpen(false)}
 						/>
 					)}
+					{sshCommand && (
+						<CopySSHMenuItem
+							sshCommand={sshCommand}
+							onDone={() => setOpen(false)}
+						/>
+					)}
 					<div className="my-1 h-px bg-border-default" />
 					<Link
 						to={route}
@@ -290,3 +277,29 @@ const TerminalMenuItem: FC<{
 		</button>
 	);
 };
+
+const CopySSHMenuItem: FC<{
+	sshCommand: string;
+	onDone: () => void;
+}> = ({ sshCommand, onDone }) => {
+	const handleCopySSH = async () => {
+		try {
+			await navigator.clipboard.writeText(sshCommand);
+			toast.success("SSH command copied to clipboard");
+		} catch {
+			toast.error("Failed to copy SSH command");
+		}
+		onDone();
+	};
+
+	return (
+		<button
+			type="button"
+			className={menuItemCls}
+			onClick={() => void handleCopySSH()}
+		>
+			<CopyIcon className="size-3.5" />
+			Copy SSH Command
+		</button>
+	);
+};