"use client";
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import * as React from "react";
import { Check, ChevronsUpDown, Loader2, Plus, X } from "lucide-react";
import { useEditContext } from "../client/editContext";
import { getCreateAndSwitchToNewVersionCommand } from "../commands/createVersionCommand";
import { getDeleteVersionCommand } from "../commands/deleteVersionCommand";
import { cn } from "../../lib/utils";
import { Button } from "../../components/ui/button";
import { Command, CommandEmpty, CommandGroup, CommandItem, CommandList, } from "../../components/ui/command";
import { Popover, PopoverContent, PopoverTrigger, } from "../../components/ui/popover";
export function VersionSelector({ itemDescriptor, actualVersion, onVersionSelected, readOnly, versions, isLoading, }) {
    const [open, setOpen] = React.useState(false);
    const editContext = useEditContext();
    if (itemDescriptor == null)
        return;
    const showSpinner = !!isLoading;
    const getVersionLabel = () => {
        if (editContext?.isMobile) {
            if (versions.length === 0)
                return "None";
            if (itemDescriptor.version === 0) {
                return actualVersion ? `V(${actualVersion})` : "None";
            }
            return `V(${itemDescriptor.version})`;
        }
        if (versions.length === 0)
            return "No versions";
        if (itemDescriptor.version === 0)
            return ("Latest version" + (actualVersion ? " (" + actualVersion + ")" : ""));
        return "Version (" + itemDescriptor.version + ")";
    };
    const selectVersion = async (version) => {
        onVersionSelected(version);
        setOpen(false);
    };
    const handleCreateVersion = async () => {
        await editContext?.executeCommand({
            command: getCreateAndSwitchToNewVersionCommand({}),
            event: new Event("click"),
        });
        setOpen(false);
        onVersionSelected(0);
    };
    const handleDeleteVersion = async () => {
        await editContext?.executeCommand({
            command: getDeleteVersionCommand({}),
            event: new Event("click"),
        });
        setOpen(false);
        onVersionSelected(0);
    };
    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { variant: "select", role: "combobox", "aria-expanded": open, "data-testid": "version-selector", "data-version": itemDescriptor?.version || actualVersion, children: [_jsxs("div", { className: "flex items-center gap-2", children: [showSpinner && (_jsx(Loader2, { className: "h-4 w-4 animate-spin", "data-testid": "version-selector-spinner", strokeWidth: 1 })), getVersionLabel()] }), _jsx(ChevronsUpDown, { className: "h-4 w-4 shrink-0 opacity-50 hidden md:block", strokeWidth: 1 })] }) }), _jsx(PopoverContent, { className: "w-64 p-0", align: "start", children: _jsxs(Command, { children: [_jsxs(CommandList, { className: "max-h-[30vh]", "data-testid": "version-selector-list", children: [_jsx(CommandEmpty, { children: "No versions available" }), _jsxs(CommandGroup, { children: [versions.length > 0 && (_jsxs(CommandItem, { value: "latest", onSelect: () => selectVersion(0), className: cn("flex items-center gap-2 px-2 py-2 text-xs", 
                                            // Remove background when selected (auto-focused) but not hovered
                                            "data-[selected=true]:bg-transparent", 
                                            // Force hover styles to override selected state
                                            "[&:hover]:!bg-accent [&:hover]:!text-accent-foreground"), children: [_jsx("span", { className: "flex-1", children: "Latest" }), _jsx(Check, { className: cn("h-4 w-4", itemDescriptor.version === 0
                                                        ? "opacity-100"
                                                        : "opacity-0"), strokeWidth: 1 })] }, "latest")), versions.map((x) => (_jsxs(CommandItem, { value: x.version.toString(), onSelect: () => selectVersion(x.version), className: cn("flex items-center gap-2 px-2 py-2 text-xs", 
                                            // Remove background when selected (auto-focused) but not hovered
                                            "data-[selected=true]:bg-transparent", 
                                            // Force hover styles to override selected state
                                            "[&:hover]:!bg-accent [&:hover]:!text-accent-foreground"), children: [_jsxs("span", { className: "flex-1", children: ["Version ", x.version] }), _jsx(Check, { className: cn("h-4 w-4", itemDescriptor.version === x.version
                                                        ? "opacity-100"
                                                        : "opacity-0"), strokeWidth: 1 })] }, x.version)))] })] }), !readOnly && (_jsxs(_Fragment, { children: [_jsx("div", { className: "border-t border-gray-200" }), _jsxs("div", { className: "p-1", children: [_jsxs(CommandItem, { onSelect: handleCreateVersion, className: cn("flex items-center gap-2 px-2 py-2 text-xs", 
                                            // Remove background when selected (auto-focused) but not hovered
                                            "data-[selected=true]:bg-transparent", 
                                            // Force hover styles to override selected state
                                            "[&:hover]:!bg-accent [&:hover]:!text-accent-foreground"), "data-testid": "version-selector-add-version", children: [_jsx(Plus, { className: "h-4 w-4", strokeWidth: 1 }), _jsx("span", { children: "Add Version" })] }), _jsxs(CommandItem, { onSelect: handleDeleteVersion, disabled: versions.length === 0, className: cn("flex items-center gap-2 px-2 py-2 text-xs", 
                                            // Remove background when selected (auto-focused) but not hovered
                                            "data-[selected=true]:bg-transparent", 
                                            // Force hover styles to override selected state
                                            "[&:hover]:!bg-accent [&:hover]:!text-accent-foreground", versions.length === 0
                                                ? "cursor-not-allowed opacity-50"
                                                : "text-red-600 hover:text-red-700"), "data-testid": "version-selector-delete-version", children: [_jsx(X, { className: "h-4 w-4", strokeWidth: 1 }), _jsx("span", { children: "Delete Version" })] })] })] }))] }) })] }));
}
//# sourceMappingURL=VersionSelector.js.map