6597f8b9d1
Co-authored-by: nova28 <17953305+nova28@users.noreply.github.com> Co-authored-by: Carlos Florencio <carlosmflorencio@gmail.com>
593 lines
20 KiB
TypeScript
593 lines
20 KiB
TypeScript
"use client";
|
|
|
|
import { memo, useCallback, useEffect, useMemo, useState } from "react";
|
|
import {
|
|
IconStack2,
|
|
IconPlus,
|
|
IconStar,
|
|
IconPlayerPlayFilled,
|
|
IconTrash,
|
|
} from "@tabler/icons-react";
|
|
import { Button } from "@kandev/ui/button";
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuSeparator,
|
|
DropdownMenuTrigger,
|
|
} from "@kandev/ui/dropdown-menu";
|
|
import { Badge } from "@kandev/ui/badge";
|
|
import { Tooltip, TooltipContent, TooltipTrigger } from "@kandev/ui/tooltip";
|
|
import { TaskCreateDialog } from "../task-create-dialog";
|
|
import { useAppStore, useAppStoreApi } from "@/components/state-provider";
|
|
|
|
import { useTaskSessions } from "@/hooks/use-task-sessions";
|
|
import { performLayoutSwitch } from "@/lib/state/dockview-store";
|
|
import type { ForegroundActivity, TaskSession, TaskSessionState } from "@/lib/types/http";
|
|
import { getSessionStateIcon } from "@/lib/ui/state-icons";
|
|
import { getWebSocketClient } from "@/lib/ws/connection";
|
|
import { deleteTask } from "@/lib/api/domains/kanban-api";
|
|
import { resolveSessionDeletionTarget } from "@/lib/session/session-deletion";
|
|
import { useSessionPendingInput, type PendingInput } from "@/hooks/use-task-pending-input";
|
|
import { buildAgentLabelsById, resolveAgentLabelFor, sortSessions } from "./session-sort";
|
|
import { resolveComposerWorkspaceId } from "./chat/composer-workspace";
|
|
import { useTranslation } from "react-i18next";
|
|
import { t } from "@/lib/i18n";
|
|
|
|
type SessionStatus = "running" | "waiting_input" | "complete" | "failed" | "cancelled";
|
|
|
|
// Format duration from start time
|
|
function formatDuration(startedAt: string, isRunning: boolean, now: number): string {
|
|
const start = new Date(startedAt).getTime();
|
|
const diff = Math.floor(((isRunning ? now : start) - start) / 1000);
|
|
|
|
const hours = Math.floor(diff / 3600);
|
|
const minutes = Math.floor((diff % 3600) / 60);
|
|
const seconds = diff % 60;
|
|
|
|
if (hours > 0) {
|
|
return `${hours}h ${minutes}m`;
|
|
}
|
|
if (minutes > 0) {
|
|
return `${minutes}m ${seconds}s`;
|
|
}
|
|
return `${seconds}s`;
|
|
}
|
|
|
|
/** Catalog keys, not copy — the map is module scope, so the value must stay a
|
|
* key and resolve at call time (`sessionStatusTooltip`). */
|
|
const STATUS_LABEL_KEYS: Record<SessionStatus, string> = {
|
|
running: "task:sessionStatusRunning",
|
|
complete: "task:sessionStatusComplete",
|
|
waiting_input: "task:sessionStatusWaitingForInput",
|
|
failed: "task:sessionStatusFailed",
|
|
cancelled: "task:sessionStatusCancelled",
|
|
};
|
|
|
|
// The session-icon tooltip reflects the message-derived "needs me" reading
|
|
// A pending permission or clarification prompt
|
|
// names itself even when the coarse status is still "running" mid-turn. Stale
|
|
// pending data cannot replace a starting or terminal lifecycle label.
|
|
export function sessionStatusTooltip(
|
|
state: TaskSessionState,
|
|
pending: PendingInput,
|
|
foregroundActivity?: ForegroundActivity | null,
|
|
parkedOnBackgroundWork = false,
|
|
): string {
|
|
const canRequestInput = state === "RUNNING" || state === "WAITING_FOR_INPUT";
|
|
if (canRequestInput && pending.permission) return t("task:sessionStatusPermissionRequested");
|
|
if (canRequestInput && pending.clarification) return t("task:sessionStatusWaitingForInput");
|
|
if (canRequestInput && foregroundActivity === "background")
|
|
return t("task:sessionStatusBackgroundRunning");
|
|
// Parked-on-background-work (AC-51/52): the tooltip must match the icon
|
|
// (getSessionStateIcon reads SESSION_BACKGROUND_ICON for the same signal).
|
|
if (canRequestInput && parkedOnBackgroundWork) return t("task:sessionStatusBackgroundRunning");
|
|
return t(STATUS_LABEL_KEYS[mapSessionStatus(state)]);
|
|
}
|
|
|
|
function mapSessionStatus(state: TaskSessionState): SessionStatus {
|
|
switch (state) {
|
|
case "RUNNING":
|
|
case "STARTING":
|
|
return "running";
|
|
case "WAITING_FOR_INPUT":
|
|
return "waiting_input";
|
|
case "COMPLETED":
|
|
return "complete";
|
|
case "FAILED":
|
|
return "failed";
|
|
case "CANCELLED":
|
|
return "cancelled";
|
|
default:
|
|
return "running";
|
|
}
|
|
}
|
|
|
|
type SessionsDropdownProps = {
|
|
taskId: string | null;
|
|
activeSessionId?: string | null;
|
|
taskTitle?: string;
|
|
primarySessionId?: string | null;
|
|
onSetPrimary?: (sessionId: string) => void;
|
|
};
|
|
|
|
function useRunningSessionsClock(sessions: TaskSession[]) {
|
|
const [currentTime, setCurrentTime] = useState(() => Date.now());
|
|
useEffect(() => {
|
|
const hasRunningSessions = sessions.some(
|
|
(session: TaskSession) => session.state === "RUNNING" || session.state === "STARTING",
|
|
);
|
|
if (!hasRunningSessions) return;
|
|
const interval = setInterval(() => {
|
|
setCurrentTime(Date.now());
|
|
}, 1000);
|
|
return () => clearInterval(interval);
|
|
}, [sessions]);
|
|
return currentTime;
|
|
}
|
|
|
|
function useSessionSelectionHandlers(taskId: string | null) {
|
|
const setActiveSession = useAppStore((state) => state.setActiveSession);
|
|
const appStore = useAppStoreApi();
|
|
const handleSelectSession = useCallback(
|
|
(sessionId: string, close: () => void) => {
|
|
if (!taskId) return;
|
|
const state = appStore.getState();
|
|
const oldSessionId = state.tasks.activeSessionId;
|
|
const oldEnvId = oldSessionId ? (state.environmentIdBySessionId[oldSessionId] ?? null) : null;
|
|
const newEnvId = state.environmentIdBySessionId[sessionId] ?? null;
|
|
const sessionIds = (state.taskSessionsByTask.itemsByTaskId[taskId] ?? []).map(
|
|
(session) => session.id,
|
|
);
|
|
setActiveSession(taskId, sessionId);
|
|
if (newEnvId) performLayoutSwitch(oldEnvId, newEnvId, sessionId, sessionIds);
|
|
close();
|
|
},
|
|
[appStore, setActiveSession, taskId],
|
|
);
|
|
return { handleSelectSession };
|
|
}
|
|
|
|
export function useSessionLifecycleActions(
|
|
taskId: string | null,
|
|
loadSessions: (force?: boolean) => void,
|
|
) {
|
|
const removeQuickChatSession = useAppStore((state) => state.removeQuickChatSession);
|
|
const appStore = useAppStoreApi();
|
|
const handleResumeSession = useCallback(
|
|
async (sessionId: string) => {
|
|
if (!taskId) return;
|
|
const client = getWebSocketClient();
|
|
if (!client) return;
|
|
try {
|
|
await client.request(
|
|
"session.launch",
|
|
{ task_id: taskId, intent: "resume", session_id: sessionId },
|
|
30000,
|
|
);
|
|
loadSessions(true);
|
|
} catch (error) {
|
|
console.error("Failed to resume session:", error);
|
|
}
|
|
},
|
|
[taskId, loadSessions],
|
|
);
|
|
|
|
const handleDeleteSession = useCallback(
|
|
async (sessionId: string) => {
|
|
if (!taskId) return;
|
|
try {
|
|
const deletionTarget = resolveSessionDeletionTarget(
|
|
sessionId,
|
|
taskId,
|
|
appStore.getState().quickChat.sessions,
|
|
);
|
|
if (deletionTarget.kind === "quick-chat-task") {
|
|
await deleteTask(deletionTarget.taskId);
|
|
} else {
|
|
const client = getWebSocketClient();
|
|
if (!client) return;
|
|
await client.request("session.delete", { session_id: deletionTarget.sessionId }, 15000);
|
|
}
|
|
removeQuickChatSession(sessionId);
|
|
loadSessions(true);
|
|
} catch (error) {
|
|
console.error("Failed to delete session:", error);
|
|
}
|
|
},
|
|
[appStore, loadSessions, removeQuickChatSession, taskId],
|
|
);
|
|
|
|
const handleSetPrimary = useCallback(
|
|
async (sessionId: string) => {
|
|
const client = getWebSocketClient();
|
|
if (!client) return;
|
|
try {
|
|
await client.request("session.set_primary", { session_id: sessionId }, 15000);
|
|
loadSessions(true);
|
|
} catch (error) {
|
|
console.error("Failed to set primary session:", error);
|
|
}
|
|
},
|
|
[loadSessions],
|
|
);
|
|
|
|
return { handleResumeSession, handleDeleteSession, handleSetPrimary };
|
|
}
|
|
|
|
function useSessionsDropdownState(taskId: string | null) {
|
|
const agentProfiles = useAppStore((state) => state.agentProfiles.items);
|
|
const { sessions, loadSessions } = useTaskSessions(taskId);
|
|
const currentTime = useRunningSessionsClock(sessions);
|
|
|
|
const agentLabelsById = useMemo(() => buildAgentLabelsById(agentProfiles), [agentProfiles]);
|
|
const sortedSessions = useMemo(() => sortSessions(taskId ? sessions : []), [sessions, taskId]);
|
|
const resolveAgentLabel = useCallback(
|
|
(s: TaskSession) => resolveAgentLabelFor(s, agentLabelsById),
|
|
[agentLabelsById],
|
|
);
|
|
return { sortedSessions, currentTime, loadSessions, resolveAgentLabel };
|
|
}
|
|
|
|
export const SessionsDropdown = memo(function SessionsDropdown({
|
|
taskId,
|
|
activeSessionId = null,
|
|
taskTitle = "",
|
|
primarySessionId: primarySessionIdProp = null,
|
|
onSetPrimary,
|
|
}: SessionsDropdownProps) {
|
|
const [showNewSessionDialog, setShowNewSessionDialog] = useState(false);
|
|
const [open, setOpen] = useState(false);
|
|
const storePrimarySessionId = useAppStore((state) => {
|
|
const activeTaskId = state.tasks.activeTaskId;
|
|
if (!activeTaskId) return null;
|
|
const task = state.kanban.tasks.find((t: { id: string }) => t.id === activeTaskId);
|
|
return task?.primarySessionId ?? null;
|
|
});
|
|
const primarySessionId = primarySessionIdProp ?? storePrimarySessionId;
|
|
const taskWorkspaceId = useAppStore((state) =>
|
|
resolveComposerWorkspaceId({
|
|
sessionId: null,
|
|
taskId,
|
|
quickChatSessions: state.quickChat.sessions,
|
|
activeWorkflowId: state.kanban.workflowId,
|
|
activeTasks: state.kanban.tasks,
|
|
snapshots: Object.values(state.kanbanMulti.snapshots),
|
|
workflows: state.workflows.items,
|
|
}),
|
|
);
|
|
const { sortedSessions, currentTime, loadSessions, resolveAgentLabel } =
|
|
useSessionsDropdownState(taskId);
|
|
const { handleSelectSession } = useSessionSelectionHandlers(taskId);
|
|
const { handleResumeSession, handleDeleteSession, handleSetPrimary } = useSessionLifecycleActions(
|
|
taskId,
|
|
loadSessions,
|
|
);
|
|
|
|
const handleOpenChange = useCallback(
|
|
(nextOpen: boolean) => {
|
|
setOpen(nextOpen);
|
|
if (!nextOpen || !taskId) return;
|
|
loadSessions(true);
|
|
},
|
|
[loadSessions, taskId],
|
|
);
|
|
|
|
return (
|
|
<>
|
|
<DropdownMenu open={open} onOpenChange={handleOpenChange}>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
data-testid="sessions-dropdown-trigger"
|
|
className="h-7 cursor-pointer gap-1.5 px-2 hover:bg-muted/40 [@media(pointer:coarse)]:min-h-11 [@media(pointer:coarse)]:min-w-11"
|
|
>
|
|
<IconStack2 className="h-4 w-4 text-muted-foreground" />
|
|
<Badge variant="secondary" className="h-5 px-1.5 text-xs font-normal">
|
|
{sortedSessions.length}
|
|
</Badge>
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<SessionDropdownContent
|
|
sortedSessions={sortedSessions}
|
|
activeSessionId={activeSessionId}
|
|
primarySessionId={primarySessionId}
|
|
currentTime={currentTime}
|
|
resolveAgentLabel={resolveAgentLabel}
|
|
onSelectSession={(sessionId) => handleSelectSession(sessionId, () => setOpen(false))}
|
|
onSetPrimary={onSetPrimary ?? handleSetPrimary}
|
|
onNewSession={() => setShowNewSessionDialog(true)}
|
|
onResumeSession={handleResumeSession}
|
|
onDeleteSession={handleDeleteSession}
|
|
/>
|
|
</DropdownMenu>
|
|
<TaskCreateDialog
|
|
open={showNewSessionDialog}
|
|
onOpenChange={setShowNewSessionDialog}
|
|
mode="session"
|
|
workspaceId={taskWorkspaceId}
|
|
workflowId={null}
|
|
defaultStepId={null}
|
|
steps={[]}
|
|
taskId={taskId}
|
|
initialValues={{ title: taskTitle, description: "" }}
|
|
/>
|
|
</>
|
|
);
|
|
});
|
|
|
|
type SessionLifecycleCallbacks = {
|
|
onResumeSession: (sessionId: string) => void;
|
|
onDeleteSession: (sessionId: string) => void;
|
|
};
|
|
|
|
/** Dropdown content with header and session list */
|
|
function SessionDropdownContent({
|
|
sortedSessions,
|
|
activeSessionId,
|
|
primarySessionId,
|
|
currentTime,
|
|
resolveAgentLabel,
|
|
onSelectSession,
|
|
onSetPrimary,
|
|
onNewSession,
|
|
|
|
onResumeSession,
|
|
onDeleteSession,
|
|
}: {
|
|
sortedSessions: TaskSession[];
|
|
activeSessionId: string | null;
|
|
primarySessionId: string | null;
|
|
currentTime: number;
|
|
resolveAgentLabel: (session: TaskSession) => string;
|
|
onSelectSession: (sessionId: string) => void;
|
|
onSetPrimary?: (sessionId: string) => void;
|
|
onNewSession: () => void;
|
|
} & SessionLifecycleCallbacks) {
|
|
const { t } = useTranslation();
|
|
return (
|
|
<DropdownMenuContent align="end" className="w-auto min-w-[240px] max-w-[420px]">
|
|
<div className="flex items-center justify-between px-2 py-0">
|
|
<span className="text-xs font-medium text-muted-foreground">{t("common:agents")}</span>
|
|
<button
|
|
type="button"
|
|
onClick={onNewSession}
|
|
className="flex items-center gap-1 rounded-md border border-border/60 px-2 py-1 text-xs text-muted-foreground hover:text-foreground hover:border-border transition-colors cursor-pointer"
|
|
>
|
|
<IconPlus className="h-3.5 w-3.5" />
|
|
{t("task:new")}
|
|
</button>
|
|
</div>
|
|
<DropdownMenuSeparator />
|
|
<SessionDropdownList
|
|
sessions={sortedSessions}
|
|
activeSessionId={activeSessionId}
|
|
primarySessionId={primarySessionId}
|
|
currentTime={currentTime}
|
|
resolveAgentLabel={resolveAgentLabel}
|
|
onSelectSession={onSelectSession}
|
|
onSetPrimary={onSetPrimary}
|
|
onResumeSession={onResumeSession}
|
|
onDeleteSession={onDeleteSession}
|
|
/>
|
|
</DropdownMenuContent>
|
|
);
|
|
}
|
|
|
|
/** Session list inside the dropdown */
|
|
function SessionDropdownList({
|
|
sessions,
|
|
activeSessionId,
|
|
primarySessionId,
|
|
currentTime,
|
|
resolveAgentLabel,
|
|
onSelectSession,
|
|
onSetPrimary,
|
|
onResumeSession,
|
|
onDeleteSession,
|
|
}: {
|
|
sessions: TaskSession[];
|
|
activeSessionId: string | null;
|
|
primarySessionId: string | null;
|
|
currentTime: number;
|
|
resolveAgentLabel: (session: TaskSession) => string;
|
|
onSelectSession: (sessionId: string) => void;
|
|
onSetPrimary?: (sessionId: string) => void;
|
|
} & SessionLifecycleCallbacks) {
|
|
const { t } = useTranslation();
|
|
if (sessions.length === 0) {
|
|
return (
|
|
<div className="max-h-[300px] overflow-y-auto">
|
|
<div className="px-2 py-6 text-center text-sm text-muted-foreground">
|
|
{t("task:noAgentsYet")}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
return (
|
|
<div className="max-h-[300px] overflow-y-auto">
|
|
<div className="space-y-0.5">
|
|
{sessions.map((session, index) => (
|
|
<SessionRow
|
|
key={session.id}
|
|
session={session}
|
|
number={sessions.length - index}
|
|
isActive={activeSessionId === session.id}
|
|
isPrimary={session.id === primarySessionId}
|
|
currentTime={currentTime}
|
|
agentLabel={resolveAgentLabel(session)}
|
|
onSelect={onSelectSession}
|
|
onSetPrimary={onSetPrimary}
|
|
onResume={onResumeSession}
|
|
onDelete={onDeleteSession}
|
|
/>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function isSessionStoppable(state: TaskSessionState): boolean {
|
|
return state === "RUNNING" || state === "STARTING" || state === "WAITING_FOR_INPUT";
|
|
}
|
|
|
|
function isSessionResumable(state: TaskSessionState): boolean {
|
|
return state === "COMPLETED" || state === "FAILED" || state === "CANCELLED";
|
|
}
|
|
|
|
function isSessionDeletable(state: TaskSessionState): boolean {
|
|
return state !== "RUNNING" && state !== "STARTING";
|
|
}
|
|
|
|
/** Individual session row in the dropdown */
|
|
function SessionRow({
|
|
session,
|
|
number,
|
|
isActive,
|
|
isPrimary,
|
|
currentTime,
|
|
agentLabel,
|
|
onSelect,
|
|
onSetPrimary,
|
|
onResume,
|
|
onDelete,
|
|
}: {
|
|
session: TaskSession;
|
|
number: number;
|
|
isActive: boolean;
|
|
isPrimary: boolean;
|
|
currentTime: number;
|
|
agentLabel: string;
|
|
onSelect: (sessionId: string) => void;
|
|
onSetPrimary?: (sessionId: string) => void;
|
|
onResume: (sessionId: string) => void;
|
|
onDelete: (sessionId: string) => void;
|
|
}) {
|
|
const status = mapSessionStatus(session.state);
|
|
const pending = useSessionPendingInput(session.id);
|
|
const duration = formatDuration(session.started_at, status === "running", currentTime);
|
|
const showDuration = duration !== "0s";
|
|
|
|
return (
|
|
<div
|
|
onClick={() => onSelect(session.id)}
|
|
data-testid={`session-row-${session.id}`}
|
|
className={`w-full flex items-center gap-3 px-2 py-1.5 hover:bg-muted/50 rounded-sm cursor-pointer transition-colors ${isActive ? "bg-muted/50" : ""}`}
|
|
>
|
|
<span className="text-xs font-medium text-muted-foreground w-8 shrink-0">#{number}</span>
|
|
<span className="text-xs text-foreground flex-1 text-left flex items-center gap-1.5">
|
|
{agentLabel}
|
|
{isPrimary && <IconStar className="h-3.5 w-3.5 text-amber-500 fill-amber-500" />}
|
|
</span>
|
|
{showDuration && (
|
|
<span className="text-xs text-muted-foreground w-16 text-right shrink-0">{duration}</span>
|
|
)}
|
|
<SessionRowActions
|
|
session={session}
|
|
isPrimary={isPrimary}
|
|
onSetPrimary={onSetPrimary}
|
|
onResume={onResume}
|
|
onDelete={onDelete}
|
|
/>
|
|
<div className="w-5 shrink-0 flex items-center justify-center">
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<div>
|
|
{getSessionStateIcon(session.state, "h-3.5 w-3.5", {
|
|
foregroundActivity: session.foreground_activity,
|
|
hasPendingClarification: pending.clarification,
|
|
hasPendingPermission: pending.permission,
|
|
parkedOnBackgroundWork: session.parked_on_background_work,
|
|
})}
|
|
</div>
|
|
</TooltipTrigger>
|
|
<TooltipContent side="left">
|
|
{sessionStatusTooltip(
|
|
session.state,
|
|
pending,
|
|
session.foreground_activity,
|
|
session.parked_on_background_work,
|
|
)}
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
/** Inline action buttons for a session row */
|
|
function SessionRowActions({
|
|
session,
|
|
isPrimary,
|
|
onSetPrimary,
|
|
onResume,
|
|
onDelete,
|
|
}: {
|
|
session: TaskSession;
|
|
isPrimary: boolean;
|
|
onSetPrimary?: (sessionId: string) => void;
|
|
onResume: (sessionId: string) => void;
|
|
onDelete: (sessionId: string) => void;
|
|
}) {
|
|
const { t } = useTranslation();
|
|
const resumeAction = (e: React.MouseEvent) => {
|
|
e.stopPropagation();
|
|
onResume(session.id);
|
|
};
|
|
const deleteAction = (e: React.MouseEvent) => {
|
|
e.stopPropagation();
|
|
onDelete(session.id);
|
|
};
|
|
const primaryAction = (e: React.MouseEvent) => {
|
|
e.stopPropagation();
|
|
onSetPrimary?.(session.id);
|
|
};
|
|
|
|
return (
|
|
<div className="flex items-center gap-0.5 shrink-0">
|
|
{!isPrimary && onSetPrimary && isSessionStoppable(session.state) && (
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<button
|
|
type="button"
|
|
onClick={primaryAction}
|
|
className="w-5 h-5 flex items-center justify-center text-muted-foreground hover:text-amber-500 transition-colors cursor-pointer"
|
|
>
|
|
<IconStar className="h-3.5 w-3.5" />
|
|
</button>
|
|
</TooltipTrigger>
|
|
<TooltipContent side="left">{t("task:setAsPrimary")}</TooltipContent>
|
|
</Tooltip>
|
|
)}
|
|
{isSessionResumable(session.state) && (
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<button
|
|
type="button"
|
|
onClick={resumeAction}
|
|
className="w-5 h-5 flex items-center justify-center text-muted-foreground hover:text-green-500 transition-colors cursor-pointer"
|
|
>
|
|
<IconPlayerPlayFilled className="h-3 w-3" />
|
|
</button>
|
|
</TooltipTrigger>
|
|
<TooltipContent side="left">{t("task:resumeAgent")}</TooltipContent>
|
|
</Tooltip>
|
|
)}
|
|
{isSessionDeletable(session.state) && (
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<button
|
|
type="button"
|
|
onClick={deleteAction}
|
|
className="w-5 h-5 flex items-center justify-center text-muted-foreground hover:text-destructive transition-colors cursor-pointer"
|
|
>
|
|
<IconTrash className="h-3 w-3" />
|
|
</button>
|
|
</TooltipTrigger>
|
|
<TooltipContent side="left">{t("task:deleteAgent")}</TooltipContent>
|
|
</Tooltip>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|