feat: add agent delete command and bulk tab close operations

This commit is contained in:
Mohamed Boudra
2026-03-07 12:32:49 +07:00
parent 6b51088f39
commit 1d1c7058f1
21 changed files with 783 additions and 86 deletions
@@ -0,0 +1,82 @@
import { describe, expect, it } from "vitest";
import {
buildBulkCloseConfirmationMessage,
classifyBulkClosableTabs,
} from "@/screens/workspace/workspace-bulk-close";
import type { WorkspaceTabDescriptor } from "@/screens/workspace/workspace-tabs-types";
function makeAgentTab(id: string): WorkspaceTabDescriptor {
return {
key: `agent_${id}`,
tabId: `agent_${id}`,
kind: "agent",
agentId: id,
provider: "codex",
label: `Agent ${id}`,
subtitle: "",
titleState: "ready",
};
}
function makeTerminalTab(id: string): WorkspaceTabDescriptor {
return {
key: `terminal_${id}`,
tabId: `terminal_${id}`,
kind: "terminal",
terminalId: id,
label: `Terminal ${id}`,
subtitle: "",
};
}
function makeFileTab(path: string): WorkspaceTabDescriptor {
return {
key: `file_${path}`,
tabId: `file_${path}`,
kind: "file",
filePath: path,
label: path.split("/").pop() ?? path,
subtitle: path,
};
}
describe("workspace bulk close helpers", () => {
it("classifies agent, terminal, and passive tabs for shared bulk close handling", () => {
const groups = classifyBulkClosableTabs([
makeAgentTab("a1"),
makeTerminalTab("t1"),
makeFileTab("/repo/README.md"),
]);
expect(groups).toEqual({
agentTabs: [{ tabId: "agent_a1", agentId: "a1" }],
terminalTabs: [{ tabId: "terminal_t1", terminalId: "t1" }],
otherTabs: [{ tabId: "file_/repo/README.md" }],
});
});
it("describes mixed destructive bulk close operations in the confirmation copy", () => {
const message = buildBulkCloseConfirmationMessage(
classifyBulkClosableTabs([
makeAgentTab("a1"),
makeAgentTab("a2"),
makeTerminalTab("t1"),
makeFileTab("/repo/README.md"),
])
);
expect(message).toBe(
"This will archive 2 agent(s), close 1 terminal(s), and close 1 tab(s). Any running process in a closed terminal will be stopped immediately."
);
});
it("keeps terminal-only confirmations explicit about stopping running processes", () => {
const message = buildBulkCloseConfirmationMessage(
classifyBulkClosableTabs([makeTerminalTab("t1")])
);
expect(message).toBe(
"This will close 1 terminal(s). Any running process in a closed terminal will be stopped immediately."
);
});
});
@@ -0,0 +1,52 @@
import type { WorkspaceTabDescriptor } from "@/screens/workspace/workspace-tabs-types";
export type BulkClosableTabGroups = {
agentTabs: Array<{ tabId: string; agentId: string }>;
terminalTabs: Array<{ tabId: string; terminalId: string }>;
otherTabs: Array<{ tabId: string }>;
};
export function classifyBulkClosableTabs(tabs: WorkspaceTabDescriptor[]): BulkClosableTabGroups {
const groups: BulkClosableTabGroups = {
agentTabs: [],
terminalTabs: [],
otherTabs: [],
};
for (const tab of tabs) {
if (tab.kind === "agent") {
groups.agentTabs.push({ tabId: tab.tabId, agentId: tab.agentId });
continue;
}
if (tab.kind === "terminal") {
groups.terminalTabs.push({ tabId: tab.tabId, terminalId: tab.terminalId });
continue;
}
groups.otherTabs.push({ tabId: tab.tabId });
}
return groups;
}
export function buildBulkCloseConfirmationMessage(input: BulkClosableTabGroups): string {
const { agentTabs, terminalTabs, otherTabs } = input;
if (agentTabs.length > 0 && terminalTabs.length > 0 && otherTabs.length > 0) {
return `This will archive ${agentTabs.length} agent(s), close ${terminalTabs.length} terminal(s), and close ${otherTabs.length} tab(s). Any running process in a closed terminal will be stopped immediately.`;
}
if (agentTabs.length > 0 && terminalTabs.length > 0) {
return `This will archive ${agentTabs.length} agent(s) and close ${terminalTabs.length} terminal(s). Any running process in a closed terminal will be stopped immediately.`;
}
if (terminalTabs.length > 0 && otherTabs.length > 0) {
return `This will close ${terminalTabs.length} terminal(s) and close ${otherTabs.length} tab(s). Any running process in a closed terminal will be stopped immediately.`;
}
if (agentTabs.length > 0 && otherTabs.length > 0) {
return `This will archive ${agentTabs.length} agent(s) and close ${otherTabs.length} tab(s).`;
}
if (terminalTabs.length > 0) {
return `This will close ${terminalTabs.length} terminal(s). Any running process in a closed terminal will be stopped immediately.`;
}
if (otherTabs.length > 0) {
return `This will close ${otherTabs.length} tab(s).`;
}
return `This will archive ${agentTabs.length} agent(s).`;
}
@@ -39,7 +39,9 @@ type WorkspaceDesktopTabsRowProps = {
onCloseTab: (tabId: string) => Promise<void> | void;
onCopyResumeCommand: (agentId: string) => Promise<void> | void;
onCopyAgentId: (agentId: string) => Promise<void> | void;
onCloseTabsToLeft: (tabId: string) => Promise<void> | void;
onCloseTabsToRight: (tabId: string) => Promise<void> | void;
onCloseOtherTabs: (tabId: string) => Promise<void> | void;
onSelectNewTabOption: (optionId: NewTabOptionId) => void;
newTabAgentOptionId: NewTabOptionId;
newTabTerminalOptionId: NewTabOptionId;
@@ -64,7 +66,9 @@ export function WorkspaceDesktopTabsRow({
onCloseTab,
onCopyResumeCommand,
onCopyAgentId,
onCloseTabsToLeft,
onCloseTabsToRight,
onCloseOtherTabs,
onSelectNewTabOption,
newTabAgentOptionId,
newTabTerminalOptionId,
@@ -129,7 +133,10 @@ export function WorkspaceDesktopTabsRow({
horizontal
scrollEnabled={layout.requiresHorizontalScrollFallback}
testID="workspace-tabs-scroll"
style={styles.tabsScroll}
style={[
styles.tabsScroll,
layout.requiresHorizontalScrollFallback ? styles.tabsScrollOverflow : styles.tabsScrollFitContent,
]}
contentContainerStyle={styles.tabsContent}
showsHorizontalScrollIndicator={false}
>
@@ -161,6 +168,9 @@ export function WorkspaceDesktopTabsRow({
const presentation = deriveWorkspaceTabPresentation({ tab, agent: tabAgent });
const contextMenuTestId = `workspace-tab-context-${tab.key}`;
const isFirstTab = index === 0;
const isLastTab = index === tabs.length - 1;
const isOnlyTab = tabs.length <= 1;
return (
<ContextMenu key={tab.key}>
@@ -290,15 +300,33 @@ export function WorkspaceDesktopTabsRow({
<ContextMenuSeparator />
<ContextMenuItem
testID={`${contextMenuTestId}-close-left`}
disabled={isFirstTab}
onSelect={() => {
void onCloseTabsToLeft(tab.tabId);
}}
>
Close to the left
</ContextMenuItem>
<ContextMenuItem
testID={`${contextMenuTestId}-close-right`}
disabled={tabs.findIndex((t) => t.key === tab.key) === tabs.length - 1}
disabled={isLastTab}
onSelect={() => {
void onCloseTabsToRight(tab.tabId);
}}
>
Close to the right
</ContextMenuItem>
<ContextMenuItem
testID={`${contextMenuTestId}-close-others`}
disabled={isOnlyTab}
onSelect={() => {
void onCloseOtherTabs(tab.tabId);
}}
>
Close other tabs
</ContextMenuItem>
<ContextMenuItem
testID={`${contextMenuTestId}-close`}
onSelect={() => {
@@ -375,9 +403,15 @@ const styles = StyleSheet.create((theme) => ({
alignItems: "center",
},
tabsScroll: {
flex: 1,
minWidth: 0,
},
tabsScrollFitContent: {
flexGrow: 0,
flexShrink: 1,
},
tabsScrollOverflow: {
flex: 1,
},
tabsContent: {
flexDirection: "row",
alignItems: "center",
@@ -83,6 +83,10 @@ import {
import {
deriveWorkspaceTabModel,
} from "@/screens/workspace/workspace-tab-model";
import {
buildBulkCloseConfirmationMessage,
classifyBulkClosableTabs,
} from "@/screens/workspace/workspace-bulk-close";
const TERMINALS_QUERY_STALE_TIME = 5_000;
const NEW_TAB_AGENT_OPTION_ID = "__new_tab_agent__";
@@ -954,46 +958,17 @@ function WorkspaceScreenContent({
[sessionAgents, toast]
);
const handleCloseTabsToRight = useCallback(
async (tabKey: string) => {
const startIndex = tabs.findIndex((tab) => tab.tabId === tabKey);
if (startIndex < 0) {
return;
}
const toClose = tabs.slice(startIndex + 1);
if (toClose.length === 0) {
const handleBulkCloseTabs = useCallback(
async (input: { tabsToClose: WorkspaceTabDescriptor[]; title: string; logLabel: string }) => {
const { tabsToClose, title, logLabel } = input;
if (tabsToClose.length === 0) {
return;
}
const agentTabs: Array<{ tabId: string; agentId: string }> = [];
const terminalTabs: Array<{ tabId: string; terminalId: string }> = [];
const otherTabs: Array<{ tabId: string }> = [];
for (const tab of toClose) {
if (tab.kind === "agent") {
agentTabs.push({ tabId: tab.tabId, agentId: tab.agentId });
} else if (tab.kind === "terminal") {
terminalTabs.push({ tabId: tab.tabId, terminalId: tab.terminalId });
} else {
otherTabs.push({ tabId: tab.tabId });
}
}
const groups = classifyBulkClosableTabs(tabsToClose);
const confirmed = await confirmDialog({
title: "Close tabs to the right?",
message:
agentTabs.length > 0 && terminalTabs.length > 0 && otherTabs.length > 0
? `This will archive ${agentTabs.length} agent(s), close ${terminalTabs.length} terminal(s), and close ${otherTabs.length} tab(s). Any running process in a closed terminal will be stopped immediately.`
: agentTabs.length > 0 && terminalTabs.length > 0
? `This will archive ${agentTabs.length} agent(s) and close ${terminalTabs.length} terminal(s). Any running process in a closed terminal will be stopped immediately.`
: terminalTabs.length > 0 && otherTabs.length > 0
? `This will close ${terminalTabs.length} terminal(s) and close ${otherTabs.length} tab(s). Any running process in a closed terminal will be stopped immediately.`
: agentTabs.length > 0 && otherTabs.length > 0
? `This will archive ${agentTabs.length} agent(s) and close ${otherTabs.length} tab(s).`
: terminalTabs.length > 0
? `This will close ${terminalTabs.length} terminal(s). Any running process in a closed terminal will be stopped immediately.`
: otherTabs.length > 0
? `This will close ${otherTabs.length} tab(s).`
: `This will archive ${agentTabs.length} agent(s).`,
title,
message: buildBulkCloseConfirmationMessage(groups),
confirmLabel: "Close",
cancelLabel: "Cancel",
destructive: true,
@@ -1002,7 +977,7 @@ function WorkspaceScreenContent({
return;
}
for (const { tabId, terminalId } of terminalTabs) {
for (const { tabId, terminalId } of groups.terminalTabs) {
try {
await killTerminalMutation.mutateAsync(terminalId);
queryClient.setQueryData<ListTerminalsPayload>(terminalsQueryKey, (current) => {
@@ -1020,11 +995,11 @@ function WorkspaceScreenContent({
tabId,
});
} catch (error) {
console.warn("[WorkspaceScreen] Failed to close terminal tab to the right", { terminalId, error });
console.warn(`[WorkspaceScreen] Failed to close terminal tab ${logLabel}`, { terminalId, error });
}
}
for (const { tabId, agentId } of agentTabs) {
for (const { tabId, agentId } of groups.agentTabs) {
if (!normalizedServerId) {
continue;
}
@@ -1036,11 +1011,11 @@ function WorkspaceScreenContent({
tabId,
});
} catch (error) {
console.warn("[WorkspaceScreen] Failed to archive agent tab to the right", { agentId, error });
console.warn(`[WorkspaceScreen] Failed to archive agent tab ${logLabel}`, { agentId, error });
}
}
for (const { tabId } of otherTabs) {
for (const { tabId } of groups.otherTabs) {
closeWorkspaceTab({
serverId: normalizedServerId,
workspaceId: normalizedWorkspaceId,
@@ -1048,7 +1023,7 @@ function WorkspaceScreenContent({
});
}
const closedKeys = new Set(toClose.map((tab) => tab.key));
const closedKeys = new Set(tabsToClose.map((tab) => tab.key));
setHoveredTabKey((current) => (current && closedKeys.has(current) ? null : current));
setHoveredCloseTabKey((current) => (current && closedKeys.has(current) ? null : current));
},
@@ -1059,11 +1034,52 @@ function WorkspaceScreenContent({
normalizedServerId,
normalizedWorkspaceId,
queryClient,
tabs,
terminalsQueryKey,
]
);
const handleCloseTabsToLeft = useCallback(
async (tabId: string) => {
const index = tabs.findIndex((tab) => tab.tabId === tabId);
if (index < 0) {
return;
}
await handleBulkCloseTabs({
tabsToClose: tabs.slice(0, index),
title: "Close tabs to the left?",
logLabel: "to the left",
});
},
[handleBulkCloseTabs, tabs]
);
const handleCloseTabsToRight = useCallback(
async (tabId: string) => {
const index = tabs.findIndex((tab) => tab.tabId === tabId);
if (index < 0) {
return;
}
await handleBulkCloseTabs({
tabsToClose: tabs.slice(index + 1),
title: "Close tabs to the right?",
logLabel: "to the right",
});
},
[handleBulkCloseTabs, tabs]
);
const handleCloseOtherTabs = useCallback(
async (tabId: string) => {
const tabsToClose = tabs.filter((tab) => tab.tabId !== tabId);
await handleBulkCloseTabs({
tabsToClose,
title: "Close other tabs?",
logLabel: "from close other tabs",
});
},
[handleBulkCloseTabs, tabs]
);
useEffect(() => {
if (!workspaceTabActionRequest) {
return;
@@ -1444,7 +1460,9 @@ function WorkspaceScreenContent({
onCloseTab={handleCloseTabById}
onCopyResumeCommand={handleCopyResumeCommand}
onCopyAgentId={handleCopyAgentId}
onCloseTabsToLeft={handleCloseTabsToLeft}
onCloseTabsToRight={handleCloseTabsToRight}
onCloseOtherTabs={handleCloseOtherTabs}
onSelectNewTabOption={handleSelectNewTabOption}
newTabAgentOptionId={NEW_TAB_AGENT_OPTION_ID}
newTabTerminalOptionId={NEW_TAB_TERMINAL_OPTION_ID}
@@ -4,6 +4,7 @@ import { Bot, Check, FileText, Pencil, Terminal } from "lucide-react-native";
import { StyleSheet, useUnistyles } from "react-native-unistyles";
import { ClaudeIcon } from "@/components/icons/claude-icon";
import { CodexIcon } from "@/components/icons/codex-icon";
import { SyncedLoader } from "@/components/synced-loader";
import type { Agent } from "@/stores/session-store";
import type { WorkspaceTabDescriptor } from "@/screens/workspace/workspace-tabs-types";
import {
@@ -11,6 +12,7 @@ import {
type SidebarStateBucket,
} from "@/utils/sidebar-agent-state";
import { getStatusDotColor } from "@/utils/status-dot-color";
import { shouldRenderSyncedStatusLoader } from "@/utils/status-loader";
export type WorkspaceTabPresentation = {
key: string;
@@ -69,8 +71,19 @@ export function WorkspaceTabIcon({
bucket: presentation.statusBucket,
showDoneAsInactive: false,
});
const shouldShowLoader = shouldRenderSyncedStatusLoader({
bucket: presentation.statusBucket,
});
if (presentation.kind === "agent") {
if (shouldShowLoader) {
return (
<View style={[styles.agentIconWrapper, { width: size, height: size }]}>
<SyncedLoader size={size - 1} color={theme.colors.palette.amber[500]} />
</View>
);
}
return (
<View style={[styles.agentIconWrapper, { width: size, height: size }]}>
{presentation.provider === "claude" ? (