'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/**
 * Cloud-provider selection dropdown used by DeployButton.
 *
 * Purely presentational: takes a `providers` list (fetched via
 * /api/cloud-providers) and renders each with its icon, display name,
 * and state badge. Disabled providers show "Coming soon"; enabled-but-
 * not-connected providers show "Not connected" and trigger the
 * connect-provider modal when clicked; enabled-and-connected providers
 * just emit onSelect for the parent button to run Deploy.
 */
import { Pencil } from 'lucide-react';
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, } from '../../ui/dropdown-menu.js';
import { CLOUD_PROVIDER_ICONS } from './cloud-provider-icons.js';
export function ProviderDropdown({ trigger, providers, selectedProvider, loading = false, loadError = null, onSelectEnabled, onSelectDisconnected, onEditConnection, }) {
    return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: trigger }), _jsxs(DropdownMenuContent, { align: "end", className: "w-80", children: [_jsx(DropdownMenuLabel, { className: "text-xs font-medium tracking-wide uppercase", children: "Deploy to" }), _jsx(DropdownMenuSeparator, {}), loading ? (_jsx("div", { className: "text-muted-foreground px-2 py-1.5 text-xs", children: "Loading providers\u2026" })) : loadError ? (_jsx("div", { className: "text-destructive px-2 py-1.5 text-xs", children: loadError })) : providers.length === 0 ? (_jsx("div", { className: "text-muted-foreground px-2 py-1.5 text-xs", children: "No providers available" })) : null, providers.map((provider) => {
                        const Icon = CLOUD_PROVIDER_ICONS[provider.id];
                        const disabled = !provider.enabled;
                        const badge = !provider.enabled
                            ? 'Coming soon'
                            : provider.connected
                                ? 'Connected'
                                : 'Not connected';
                        const selected = provider.id === selectedProvider;
                        return (_jsxs(DropdownMenuItem, { disabled: disabled, onSelect: () => {
                                if (disabled)
                                    return;
                                if (provider.connected) {
                                    onSelectEnabled(provider.id);
                                }
                                else {
                                    onSelectDisconnected(provider.id);
                                }
                            }, className: `flex items-center gap-2 ${disabled ? 'cursor-not-allowed' : 'cursor-pointer'}`, children: [_jsx(Icon, { className: "size-4 shrink-0" }), _jsx("span", { className: "min-w-0 flex-1 truncate text-sm", children: provider.displayName }), _jsx("span", { className: `shrink-0 text-[10px] whitespace-nowrap uppercase ${disabled
                                        ? 'text-muted-foreground'
                                        : provider.connected
                                            ? 'text-emerald-500'
                                            : 'text-amber-500'}`, children: badge }), selected ? _jsx("span", { className: "ml-1 text-[10px]", children: "\u25CF" }) : null, provider.enabled && provider.connected && onEditConnection ? (_jsx("button", { type: "button", className: "text-muted-foreground hover:text-foreground hover:bg-accent ml-1 inline-flex size-5 cursor-pointer items-center justify-center rounded", "aria-label": `Update ${provider.displayName} token`, title: "Update token", onClick: (e) => {
                                        e.preventDefault();
                                        e.stopPropagation();
                                        onEditConnection(provider.id);
                                    }, onPointerDown: (e) => {
                                        // Stop Radix DropdownMenuItem from selecting/closing on press.
                                        e.preventDefault();
                                        e.stopPropagation();
                                    }, children: _jsx(Pencil, { className: "size-3" }) })) : null] }, provider.id));
                    })] })] }));
}
