"use client";
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from "react";
import { ApprovalAction, ToolCallStatus, } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
import { cn } from "@stigmer/theme";
import { ToolCallDetail, formatDuration } from "./ToolCallDetail";
import { SubAgentSection } from "./SubAgentSection";
import { FilePathLink } from "./FilePathLink";
import { resolveToolCategory, extractPrimaryArg, } from "./tool-categories";
import { useSandboxNormalize } from "./SandboxContext";
/**
 * Renders a single tool call as a row in the tool call group.
 *
 * Two rendering modes:
 *
 * - **Non-expandable** (completed/skipped Read): a static `<div>` row
 *   with a clickable {@link FilePathLink}. No chevron, no expansion.
 *   The clickable path IS the complete information.
 * - **Expandable** (all other tools): a `<button>` row that toggles a
 *   {@link ToolCallDetail} or {@link SubAgentSection} detail panel.
 *
 * Shows category-aware labels (e.g., "Shell", "Read", "Edit") with
 * the primary argument as a subtitle, a category-specific icon, and
 * an inline approval decision badge when applicable.
 *
 * @example
 * ```tsx
 * <ToolCallItem toolCall={tc} />
 * <ToolCallItem toolCall={tc} subAgentExecution={sub} />
 * ```
 */
export function ToolCallItem({ toolCall, subAgentExecution, defaultExpanded = false, className, }) {
    const [expanded, setExpanded] = useState(defaultExpanded);
    const status = mapToolCallStatus(toolCall);
    const StatusIcon = STATUS_ICON[status];
    const duration = formatDuration(toolCall.startedAt, toolCall.completedAt);
    const isSubAgent = subAgentExecution != null;
    const categoryInfo = resolveToolCategory(toolCall.name, toolCall.mcpServerSlug);
    const CategoryIcon = CATEGORY_ICON[categoryInfo.category];
    const primaryArg = extractPrimaryArg(toolCall);
    const displayLabel = isSubAgent
        ? subAgentExecution.subject || subAgentExecution.name || categoryInfo.label
        : categoryInfo.label;
    const normalize = useSandboxNormalize();
    const approvalBadge = getApprovalBadge(toolCall);
    // Completed/skipped Read items are non-expandable — the clickable
    // path in the row is the complete information. Failed reads remain
    // expandable to show the error.
    const isNonExpandableRead = !isSubAgent &&
        categoryInfo.category === "read" &&
        (toolCall.status === ToolCallStatus.TOOL_CALL_COMPLETED ||
            toolCall.status === ToolCallStatus.TOOL_CALL_SKIPPED);
    const trailingContent = (_jsxs(_Fragment, { children: [approvalBadge && (_jsx("span", { className: cn("shrink-0 rounded px-1 py-0.5 text-[10px] font-medium leading-none", approvalBadge.colorClass), children: approvalBadge.label })), toolCall.mcpServerSlug && (_jsx("span", { className: "shrink-0 rounded bg-muted px-1 py-0.5 font-mono text-muted-foreground", children: toolCall.mcpServerSlug })), _jsx("span", { className: cn("shrink-0", STATUS_COLOR[status]), "aria-hidden": "true", children: _jsx(StatusIcon, {}) }), duration && (_jsx("span", { className: "shrink-0 tabular-nums text-muted-foreground", children: duration }))] }));
    if (isNonExpandableRead) {
        return (_jsx("div", { className: cn("border-b border-border-muted last:border-b-0", className), children: _jsxs("div", { className: "flex w-full items-center gap-2 px-2.5 py-1.5 text-xs", children: [_jsx("span", { className: "shrink-0 text-muted-foreground", "aria-hidden": "true", children: _jsx(CategoryIcon, {}) }), _jsxs("span", { className: "min-w-0 flex-1 flex items-center gap-1.5 overflow-hidden", children: [_jsx("span", { className: "shrink-0 font-medium text-foreground", children: displayLabel }), primaryArg && (_jsx(FilePathLink, { path: primaryArg, className: "min-w-0 text-xs" }))] }), trailingContent] }) }));
    }
    const displaySubtitle = isSubAgent
        ? null
        : categoryInfo.category === "shell" && primaryArg
            ? normalize(primaryArg)
            : primaryArg;
    return (_jsxs("div", { className: cn("border-b border-border-muted last:border-b-0", className), children: [_jsxs("button", { type: "button", "aria-expanded": expanded, onClick: () => setExpanded((v) => !v), className: cn("flex w-full items-center gap-2 px-2.5 py-1.5 text-left text-xs transition-colors", "hover:bg-muted-subtle", expanded && "bg-muted-faint"), children: [_jsx("span", { className: "shrink-0 text-muted-foreground", "aria-hidden": "true", children: _jsx(CategoryIcon, {}) }), _jsxs("span", { className: "min-w-0 flex-1 flex items-baseline gap-1.5 overflow-hidden", children: [_jsx("span", { className: "shrink-0 font-medium text-foreground", children: displayLabel }), displaySubtitle && (_jsx("span", { className: "min-w-0 truncate text-muted-foreground font-mono", children: displaySubtitle }))] }), trailingContent, _jsx(ChevronIcon, { expanded: expanded })] }), expanded && (_jsx("div", { className: "px-2.5 pb-2.5 pt-1", children: isSubAgent ? (_jsx(SubAgentSection, { subAgentExecution: subAgentExecution, collapsible: false })) : (_jsx(ToolCallDetail, { toolCall: toolCall })) }))] }));
}
function getApprovalBadge(toolCall) {
    if (!toolCall.requiresApproval)
        return null;
    switch (toolCall.approvalAction) {
        case ApprovalAction.APPROVE:
            return { label: "Approved", colorClass: "bg-success/15 text-success" };
        case ApprovalAction.SKIP:
            return { label: "Skipped", colorClass: "bg-muted text-muted-foreground" };
        case ApprovalAction.REJECT:
            return { label: "Rejected", colorClass: "bg-destructive/15 text-destructive" };
        default:
            return null;
    }
}
function mapToolCallStatus(toolCall) {
    switch (toolCall.status) {
        case ToolCallStatus.TOOL_CALL_RUNNING:
            return "running";
        case ToolCallStatus.TOOL_CALL_WAITING_APPROVAL:
            if (toolCall.approvalAction === ApprovalAction.APPROVE ||
                toolCall.approvalAction === ApprovalAction.SKIP ||
                toolCall.approvalAction === ApprovalAction.REJECT) {
                return "completed";
            }
            return "waiting";
        case ToolCallStatus.TOOL_CALL_FAILED:
            return "failed";
        case ToolCallStatus.TOOL_CALL_COMPLETED:
        case ToolCallStatus.TOOL_CALL_SKIPPED:
            return "completed";
        default:
            return "pending";
    }
}
const STATUS_COLOR = {
    running: "text-foreground",
    waiting: "text-warning",
    failed: "text-destructive",
    completed: "text-success",
    pending: "text-muted-foreground",
};
// ---------------------------------------------------------------------------
// Category-specific icons (inline SVG, SDK pattern)
// ---------------------------------------------------------------------------
export const CATEGORY_ICON = {
    shell: TerminalIcon,
    read: FileIcon,
    write: FilePenIcon,
    edit: FilePenIcon,
    delete: TrashIcon,
    search: SearchIcon,
    list: FolderIcon,
    think: BrainIcon,
    "sub-agent": BotIcon,
    mcp: McpPlugIcon,
    unknown: WrenchIcon,
};
function TerminalIcon() {
    return (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("rect", { x: "1", y: "1.5", width: "10", height: "9", rx: "1.5" }), _jsx("path", { d: "M3 4.5L5 6.5L3 8.5" }), _jsx("path", { d: "M6.5 8.5H9" })] }));
}
function FileIcon() {
    return (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M7 1H3C2.45 1 2 1.45 2 2V10C2 10.55 2.45 11 3 11H9C9.55 11 10 10.55 10 10V4L7 1Z" }), _jsx("path", { d: "M7 1V4H10" })] }));
}
function FilePenIcon() {
    return (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M7 1H3C2.45 1 2 1.45 2 2V10C2 10.55 2.45 11 3 11H9C9.55 11 10 10.55 10 10V4L7 1Z" }), _jsx("path", { d: "M7 1V4H10" }), _jsx("path", { d: "M5 7L8 7" }), _jsx("path", { d: "M5 9L7 9" })] }));
}
function TrashIcon() {
    return (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M2 3H10" }), _jsx("path", { d: "M3 3V10C3 10.55 3.45 11 4 11H8C8.55 11 9 10.55 9 10V3" }), _jsx("path", { d: "M4.5 1H7.5" })] }));
}
function SearchIcon() {
    return (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("circle", { cx: "5.5", cy: "5.5", r: "3.5" }), _jsx("path", { d: "M8 8L10.5 10.5" })] }));
}
function FolderIcon() {
    return (_jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M1.5 3V9.5C1.5 10.05 1.95 10.5 2.5 10.5H9.5C10.05 10.5 10.5 10.05 10.5 9.5V4.5C10.5 3.95 10.05 3.5 9.5 3.5H6L5 2H2.5C1.95 2 1.5 2.45 1.5 3Z" }) }));
}
function BrainIcon() {
    return (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M6 2C4.9 2 4 2.9 4 4C3.17 4 2.5 4.67 2.5 5.5C2.5 6.33 3 6.87 3 6.87C2.5 7.37 2.5 8.13 3 8.63C3.5 9.13 4.3 9.13 4.8 8.63L6 7.5" }), _jsx("path", { d: "M6 2C7.1 2 8 2.9 8 4C8.83 4 9.5 4.67 9.5 5.5C9.5 6.33 9 6.87 9 6.87C9.5 7.37 9.5 8.13 9 8.63C8.5 9.13 7.7 9.13 7.2 8.63L6 7.5" }), _jsx("path", { d: "M6 7.5V11" })] }));
}
function BotIcon() {
    return (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("rect", { x: "2", y: "4", width: "8", height: "6", rx: "1.5" }), _jsx("circle", { cx: "4.5", cy: "7", r: "0.75", fill: "currentColor", stroke: "none" }), _jsx("circle", { cx: "7.5", cy: "7", r: "0.75", fill: "currentColor", stroke: "none" }), _jsx("path", { d: "M6 1V4" }), _jsx("circle", { cx: "6", cy: "1", r: "0.75" })] }));
}
function WrenchIcon() {
    return (_jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("path", { d: "M8.5 2C7.67 2 7 2.67 7 3.5C7 3.78 7.08 4.04 7.22 4.26L3.74 7.74C3.52 7.6 3.27 7.5 3 7.5C2.17 7.5 1.5 8.17 1.5 9C1.5 9.83 2.17 10.5 3 10.5C3.83 10.5 4.5 9.83 4.5 9C4.5 8.73 4.4 8.48 4.26 8.26L7.74 4.78C7.96 4.92 8.22 5 8.5 5C9.33 5 10 4.33 10 3.5C10 3.22 9.92 2.96 9.78 2.74L8.5 4L7.5 3L8.76 1.72C8.54 1.58 8.28 1.5 8 1.5" }) }));
}
function McpPlugIcon() {
    return (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M4 1.5V4" }), _jsx("path", { d: "M8 1.5V4" }), _jsx("path", { d: "M2.5 4H9.5V6.5C9.5 8.43 7.93 10 6 10C4.07 10 2.5 8.43 2.5 6.5V4Z" }), _jsx("path", { d: "M6 10V11" })] }));
}
// ---------------------------------------------------------------------------
// Status icons
// ---------------------------------------------------------------------------
const STATUS_ICON = {
    running: SpinnerIcon,
    waiting: ClockIcon,
    failed: XCircleIcon,
    completed: CheckCircleIcon,
    pending: DotIcon,
};
function SpinnerIcon() {
    return (_jsx("svg", { width: "10", height: "10", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.5", className: "animate-spin", children: _jsx("path", { d: "M6 1.5A4.5 4.5 0 1 1 1.5 6", strokeLinecap: "round" }) }));
}
function ClockIcon() {
    return (_jsxs("svg", { width: "10", height: "10", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("circle", { cx: "6", cy: "6", r: "4.5" }), _jsx("path", { d: "M6 3.5V6L7.5 7.5" })] }));
}
function CheckCircleIcon() {
    return (_jsxs("svg", { width: "10", height: "10", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("circle", { cx: "6", cy: "6", r: "4.5" }), _jsx("path", { d: "M4 6L5.5 7.5L8 4.5" })] }));
}
function XCircleIcon() {
    return (_jsxs("svg", { width: "10", height: "10", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("circle", { cx: "6", cy: "6", r: "4.5" }), _jsx("path", { d: "M4.5 4.5L7.5 7.5M7.5 4.5L4.5 7.5" })] }));
}
function DotIcon() {
    return (_jsx("svg", { width: "8", height: "8", viewBox: "0 0 8 8", fill: "currentColor", children: _jsx("circle", { cx: "4", cy: "4", r: "2.5" }) }));
}
function ChevronIcon({ expanded }) {
    return (_jsx("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", className: cn("shrink-0 text-muted-foreground transition-transform duration-150", expanded && "rotate-90"), "aria-hidden": "true", children: _jsx("path", { d: "M3.5 2L6.5 5L3.5 8" }) }));
}
//# sourceMappingURL=ToolCallItem.js.map