'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { cn } from '../../../lib/utils.js';
import { InteractiveSessionStatus } from '../../../../../../packages/core/src/domain/generated/output.js';
import { Loader2, CheckCircle2, XCircle, AlertCircle } from 'lucide-react';
const STATUS_CONFIG = {
    [InteractiveSessionStatus.booting]: {
        label: 'Booting...',
        icon: _jsx(Loader2, { className: "size-3 animate-spin" }),
        className: 'bg-amber-100 text-amber-800 border-amber-200 dark:bg-amber-900/30 dark:text-amber-300 dark:border-amber-700',
    },
    spawning: {
        label: 'Spawning process',
        icon: _jsx(Loader2, { className: "size-3 animate-spin" }),
        className: 'bg-blue-100 text-blue-800 border-blue-200 dark:bg-blue-900/30 dark:text-blue-300 dark:border-blue-700',
    },
    'loading-context': {
        label: 'Loading context',
        icon: _jsx(Loader2, { className: "size-3 animate-spin" }),
        className: 'bg-indigo-100 text-indigo-800 border-indigo-200 dark:bg-indigo-900/30 dark:text-indigo-300 dark:border-indigo-700',
    },
    [InteractiveSessionStatus.ready]: {
        label: 'Ready',
        icon: _jsx(CheckCircle2, { className: "size-3" }),
        className: 'bg-emerald-100 text-emerald-800 border-emerald-200 dark:bg-emerald-900/30 dark:text-emerald-300 dark:border-emerald-700',
    },
    [InteractiveSessionStatus.stopped]: {
        label: 'Stopped',
        icon: _jsx(XCircle, { className: "size-3" }),
        className: 'bg-zinc-100 text-zinc-700 border-zinc-200 dark:bg-zinc-800 dark:text-zinc-400 dark:border-zinc-600',
    },
    [InteractiveSessionStatus.error]: {
        label: 'Error',
        icon: _jsx(AlertCircle, { className: "size-3" }),
        className: 'bg-red-100 text-red-700 border-red-200 dark:bg-red-900/30 dark:text-red-400 dark:border-red-700',
    },
};
/**
 * Small inline badge showing the current interactive session status.
 * Maps each status to a distinct color, icon, and label.
 * Animated spinner shown for booting/spawning/loading-context states.
 */
export function AgentStatusBadge({ status, className }) {
    const config = STATUS_CONFIG[status] ?? STATUS_CONFIG[InteractiveSessionStatus.booting];
    return (_jsxs("span", { role: "status", "aria-label": `Agent status: ${config.label}`, className: cn('inline-flex items-center gap-1.5 rounded-full border px-2.5 py-0.5 text-xs font-medium', config.className, className), children: [config.icon, config.label] }));
}
