import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useMemo } from "react";
import { Check, ShieldCheck, X, Zap } from "lucide-react";
import { Button } from "../../../../components/ui/button";
import { Tooltip, TooltipTrigger, TooltipContent, } from "../../../../components/ui/tooltip";
import { Spinner } from "../../../ui/Spinner";
import { cleanToolFunctionName } from "./toolCallApprovalGate";
import { useApprovalActions } from "./useApprovalActions";
const HighRiskBadge = ({ summary }) => {
    const badge = (_jsx("span", { className: "rounded-badge bg-feedback-red-light badge-pad-sm text-2xs text-feedback-red ring-feedback-red inline-flex shrink-0 cursor-default items-center font-medium ring-1 ring-inset", children: "high" }));
    if (!summary)
        return badge;
    return (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: badge }), _jsxs(TooltipContent, { side: "top", className: "max-w-xs", children: [_jsx("div", { className: "font-medium", children: "Risk: HIGH" }), _jsx("div", { className: "mt-0.5 font-normal opacity-90", children: summary })] })] }));
};
const hasDeleteAllowance = (item) => {
    return (item.allowableScope?.operationType === "delete" &&
        !!item.allowableScope.parentItemId &&
        !!item.allowableScope.parentItemPath);
};
/**
 * The primary interaction surface for a supervised approval pause: shown
 * after the (collapsed) activity disclosure, it presents the requested
 * operation(s) and the Approve / Reject decision, plus the Autonomous
 * shortcut and delete-scope allowances. All approval execution lives here
 * (via useApprovalActions); ToolCallDisplay is diagnostics-only.
 */
export function ApprovalCard({ agentId, items, readOnly = false, onSwitchToAutonomous, }) {
    const { busyAction, error, approveAll, rejectAll, switchToAutonomous, approveWithAllowance, } = useApprovalActions({ agentId, readOnly, onSwitchToAutonomous });
    const isPlural = items.length > 1;
    const singleItem = !isPlural ? items[0] : undefined;
    // Collective high badge only when every pending action carries the same
    // single "high" risk (ported from the old batch bar).
    const uniqueRisks = useMemo(() => Array.from(new Set(items.map((item) => item.riskLevel || undefined))), [items]);
    const showHeaderRiskBadge = uniqueRisks.length === 1 && uniqueRisks[0] === "high";
    // Never offer the autonomous shortcut when a delete is awaiting approval.
    const hideAutonomousSwitch = items.some((item) => {
        const base = cleanToolFunctionName(item.functionName).toLowerCase();
        return base === "delete-item" || base === "delete-items";
    });
    const isBusy = busyAction !== null;
    const isApproving = busyAction === "approve";
    const isRejecting = busyAction === "reject";
    const isSwitchingMode = busyAction === "autonomous";
    const allowanceBusyToolCallId = typeof busyAction === "object" && busyAction !== null
        ? busyAction.toolCallId
        : null;
    const readOnlyTitle = readOnly ? "Read-only access" : undefined;
    const countSuffix = isPlural ? ` all (${items.length})` : "";
    if (items.length === 0) {
        return null;
    }
    const renderAllowanceButton = (item) => {
        if (!hasDeleteAllowance(item) || !agentId)
            return null;
        const isCreatingAllowance = allowanceBusyToolCallId === item.toolCallId;
        return (_jsxs(Button, { size: "sm", variant: "outline", disabled: isBusy || readOnly, title: readOnlyTitle, onClick: () => approveWithAllowance(item), className: "text-neutral-grey-100 h-7 gap-1.5 bg-white px-2.5 text-xs", "data-testid": "agent-approval-allowance-button", children: [isCreatingAllowance ? (_jsx(Spinner, { size: "xs" })) : (_jsx(ShieldCheck, { size: 12, strokeWidth: 1 })), _jsxs("span", { className: "max-w-72 truncate", children: ["Approve + allow deletes in ", item.allowableScope.parentItemPath] })] }));
    };
    return (_jsxs("div", { className: "border-neutral-grey-10 mt-1 mb-3 rounded-xl border bg-white px-3 py-2.5", "data-testid": "agent-approval-card", children: [singleItem ? (_jsxs("div", { className: "mb-2.5 flex flex-col gap-1", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("span", { className: "text-neutral-grey-100 text-[13px] leading-4 font-medium", children: cleanToolFunctionName(singleItem.functionName) || "Agent action" }), singleItem.riskLevel === "high" && (_jsx(HighRiskBadge, { summary: singleItem.summary })), _jsx("span", { className: "text-neutral-grey-50 ml-auto shrink-0 text-xs", children: "Awaiting approval" })] }), singleItem.summary && (_jsx("span", { className: "text-neutral-grey-100 text-xs leading-5", children: singleItem.summary }))] })) : (_jsxs("div", { className: "mb-2.5 flex flex-col gap-1.5", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [showHeaderRiskBadge && _jsx(HighRiskBadge, {}), _jsxs("span", { className: "text-neutral-grey-100 text-[13px] leading-4 font-medium", children: [items.length, " actions awaiting approval"] })] }), _jsx("div", { className: "flex flex-col gap-1", children: items.map((item) => (_jsxs("div", { className: "flex flex-wrap items-center gap-2", "data-testid": "agent-approval-card-item", children: [_jsx("span", { className: "text-neutral-grey-100 shrink-0 text-xs font-medium", children: cleanToolFunctionName(item.functionName) || "Agent action" }), !showHeaderRiskBadge && item.riskLevel === "high" && (_jsx(HighRiskBadge, { summary: item.summary })), item.summary && (_jsx("span", { className: "text-neutral-grey-50 min-w-0 flex-1 truncate text-xs", children: item.summary })), renderAllowanceButton(item)] }, item.toolCallId))) })] })), _jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsxs(Button, { size: "sm", "data-testid": "agent-approve-all-button", disabled: isBusy || readOnly, onClick: () => approveAll(items), title: readOnlyTitle, className: "bg-feedback-green hover:bg-feedback-green h-7 gap-1.5 px-2.5 text-xs text-white shadow-xs", children: [isApproving ? (_jsx(Spinner, { size: "xs" })) : (_jsx(Check, { size: 12, strokeWidth: 1 })), "Approve", countSuffix] }), _jsxs(Button, { size: "sm", variant: "outline", "data-testid": "agent-reject-all-button", disabled: isBusy || readOnly, onClick: () => rejectAll(items), title: readOnlyTitle, className: "border-feedback-red text-feedback-red hover:border-feedback-red hover:bg-feedback-red-light hover:text-feedback-red h-7 gap-1.5 bg-white px-2.5 text-xs", children: [isRejecting ? (_jsx(Spinner, { size: "xs" })) : (_jsx(X, { size: 12, strokeWidth: 1 })), "Reject", countSuffix] }), singleItem && renderAllowanceButton(singleItem), !hideAutonomousSwitch && (_jsxs(Button, { size: "sm", variant: "ghost", "data-testid": "agent-approval-autonomous-button", disabled: isBusy || readOnly, onClick: () => switchToAutonomous(items), title: readOnly
                            ? "Read-only access"
                            : "Stop asking for approval and let the agent run autonomously", className: "text-neutral-grey-50 hover:text-neutral-grey-100 ml-auto h-7 gap-1.5 px-2 text-xs", children: [isSwitchingMode ? (_jsx(Spinner, { size: "xs" })) : (_jsx(Zap, { size: 12, strokeWidth: 1 })), isSwitchingMode ? "Switching" : "Autonomous"] }))] }), error && (_jsx("div", { className: "text-feedback-red mt-2 text-xs", "data-testid": "agent-approval-card-error", role: "alert", children: error }))] }));
}
//# sourceMappingURL=ApprovalCard.js.map