import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Button, Command, CommandGroup, CommandItem, CommandList, Popover, PopoverContent, PopoverTrigger, useToast } from "@vertesia/ui/core";
import { useUserSession } from "@vertesia/ui/session";
import { Bot, ClipboardList, CopyIcon, DownloadCloudIcon, ExternalLink, MoreVertical, XIcon } from "lucide-react";
import { PayloadBuilderProvider, usePayloadBuilder } from "../../PayloadBuilder";
import { getConversationUrl } from "./utils";
export default function Header({ title, onClose, isModal, run, viewMode, onViewModeChange, showPlanPanel, hasPlan = false, onTogglePlanPanel, onDownload, onCopyRunId, resetWorkflow }) {
    return (_jsx(PayloadBuilderProvider, { children: _jsxs("div", { className: "flex flex-wrap items-end justify-between py-1.5 px-2 border-b shadow-sm flex-shrink-0", children: [_jsxs("div", { className: "flex flex-wrap items-center space-x-2", children: [_jsxs("div", { className: "flex items-center space-x-1", children: [_jsx(Bot, { className: "size-5 text-muted" }), _jsx("span", { className: "font-medium", children: title })] }), _jsxs("span", { className: "text-xs text-muted ml-1", children: ["(Run ID: ", run.runId.substring(0, 8), "...)"] })] }), _jsxs("div", { className: "flex justify-end items-center space-x-2 ml-auto", children: [_jsxs("div", { className: "flex items-center space-x-1 bg-muted rounded p-0.5", children: [_jsx(Button, { variant: viewMode === "stacked" ? "outline" : "ghost", size: "xs", className: "rounded-l-md", onClick: () => onViewModeChange("stacked"), children: "Details" }), _jsx(Button, { variant: viewMode === "sliding" ? "outline" : "ghost", size: "xs", className: "rounded-l-md", onClick: () => onViewModeChange("sliding"), children: "Most Important" })] }), _jsxs("div", { className: "relative", children: [hasPlan && !showPlanPanel && (_jsx("span", { className: "absolute -top-1 -right-1 w-2.5 h-2.5 bg-primary rounded-full border border-border z-10" })), _jsxs(Button, { size: "sm", variant: showPlanPanel ? "primary" : "secondary", onClick: onTogglePlanPanel, className: `transition-all duration-200 rounded-md`, title: "Toggle plan panel", children: [_jsx(ClipboardList, { className: "size-4 mr-1.5" }), _jsx("span", { className: "font-medium text-xs", children: showPlanPanel ? "Hide Plan" : "Show Plan" })] })] }), _jsx(MoreDropdown, { run: run, isModal: isModal, onClose: onClose, onDownload: onDownload, onCopyRunId: onCopyRunId, resetWorkflow: resetWorkflow }), onClose && !isModal && (_jsx(Button, { size: "xs", variant: "ghost", onClick: onClose, children: _jsx(XIcon, { className: "size-4" }) }))] })] }) }));
}
function MoreDropdown({ run, isModal, onClose, onDownload, onCopyRunId, resetWorkflow }) {
    const toast = useToast();
    const { client } = useUserSession();
    const builder = usePayloadBuilder();
    const cancelWorkflow = async (run) => {
        try {
            await client.store.workflows.terminate(run.workflowId, run.runId, "cancel");
            toast({
                status: "success",
                title: "Workflow cancelled",
                duration: 2000,
            });
            builder.reset();
            resetWorkflow?.();
            return true;
        }
        catch (error) {
            toast({
                status: "error",
                title: "Failed to cancel workflow",
                duration: 2000,
            });
            return false;
        }
    };
    const openUrl = (url) => {
        window.open(url, "_blank");
        return url;
    };
    return (_jsxs(Popover, { hover: true, children: [_jsx(PopoverTrigger, { children: _jsx(Button, { size: "xs", variant: "ghost", title: "More actions", children: _jsx(MoreVertical, { className: "size-4" }) }) }), _jsx(PopoverContent, { className: "w-48", align: "end", children: _jsx("div", { className: "rounded-md shadow-lg z-50", children: _jsx("div", { className: "py-1 min-w-36", children: _jsx(Command, { children: _jsx(CommandList, { children: _jsxs(CommandGroup, { children: [_jsx("div", { className: "flex items-center px-3 py-1.5 text-xs text-gray-700 dark:text-gray-300", children: _jsx("span", { className: "text-muted", children: "Actions" }) }), isModal && (_jsxs(CommandItem, { className: "text-xs", onSelect: () => openUrl(`/store/agent-runner?agentId=${run.runId}__${run.workflowId}`), children: [_jsx(ExternalLink, { className: "size-3.5 mr-2 text-muted" }), " Open in new tab"] })), _jsxs(CommandItem, { className: "text-xs", onSelect: () => {
                                                if (onCopyRunId) {
                                                    onCopyRunId();
                                                }
                                                else {
                                                    navigator.clipboard.writeText(run.runId);
                                                    toast({
                                                        status: "success",
                                                        title: "Run ID copied",
                                                        duration: 2000,
                                                    });
                                                }
                                            }, children: [_jsx(CopyIcon, { className: "size-3.5 mr-2 text-muted" }), " Copy Run ID"] }), _jsxs(CommandItem, { className: "text-xs", onSelect: () => {
                                                if (onDownload) {
                                                    onDownload();
                                                }
                                                else {
                                                    getConversationUrl(client, run.runId).then((r) => window.open(r, "_blank"));
                                                }
                                            }, children: [_jsx(DownloadCloudIcon, { className: "size-3.5 mr-2 text-muted" }), " Download Conversation"] }), onClose && isModal && (_jsxs(CommandItem, { className: "text-xs", onSelect: onClose, children: [_jsx(XIcon, { className: "size-3.5 mr-2 text-muted" }), " Close"] })), _jsxs(CommandItem, { className: "text-xs text-destructive", onSelect: () => {
                                                cancelWorkflow(run);
                                            }, children: [_jsx(XIcon, { className: "size-3.5 mr-2 text-destructive" }), " Cancel Workflow"] })] }) }) }) }) }) })] }));
}
//# sourceMappingURL=Header.js.map