import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useState, useId } from 'react';
import { GitBranch, Loader2 } from 'lucide-react';
import { Modal } from '../ui/Modal';
import { useCreateBranch } from '../../hooks/useBranch';
import { useSession } from '../../hooks/useSessions';
export function BranchModal({ isOpen, onClose, sessionId, message, onBranchCreated, }) {
    const session = useSession(sessionId);
    const createBranch = useCreateBranch(sessionId);
    const [title, setTitle] = useState('');
    const [useCurrentConfig, setUseCurrentConfig] = useState(true);
    const titleId = useId();
    const configId = useId();
    const messagePreview = message.parts?.find((p) => p.type === 'text')?.content || '';
    const parsedPreview = (() => {
        try {
            const parsed = JSON.parse(messagePreview);
            return parsed?.text?.slice(0, 100) || '';
        }
        catch {
            return messagePreview.slice(0, 100);
        }
    })();
    const handleSubmit = async (e) => {
        e.preventDefault();
        try {
            const result = await createBranch.mutateAsync({
                fromMessageId: message.id,
                title: title.trim() || undefined,
                provider: useCurrentConfig ? session?.provider : undefined,
                model: useCurrentConfig ? session?.model : undefined,
                agent: useCurrentConfig ? session?.agent : undefined,
            });
            onClose();
            if (onBranchCreated && result.session) {
                onBranchCreated(result.session.id);
            }
        }
        catch (error) {
            console.error('Failed to create branch:', error);
        }
    };
    return (_jsx(Modal, { isOpen: isOpen, onClose: onClose, title: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(GitBranch, { className: "h-5 w-5 text-primary" }), _jsx("span", { children: "Branch Session" })] }), maxWidth: "md", children: _jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [_jsxs("div", { className: "text-sm text-muted-foreground", children: [_jsx("p", { children: "Creating branch from message:" }), _jsxs("p", { className: "mt-1 p-2 bg-muted/50 rounded text-foreground italic truncate", children: ["\"", parsedPreview, "...\""] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("label", { htmlFor: titleId, className: "block text-sm font-medium text-foreground", children: "Branch Title (optional)" }), _jsx("input", { id: titleId, type: "text", value: title, onChange: (e) => setTitle(e.target.value), placeholder: `Branch of ${session?.title || 'Untitled'}`, className: "w-full px-3 py-2 bg-background border border-border rounded-md text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary/50" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("input", { id: configId, type: "checkbox", checked: useCurrentConfig, onChange: (e) => setUseCurrentConfig(e.target.checked), className: "h-4 w-4 rounded border-border text-primary focus:ring-primary/50" }), _jsx("label", { htmlFor: configId, className: "text-sm text-foreground", children: "Use same provider/model/agent as parent" })] }), session && (_jsx("div", { className: "text-xs text-muted-foreground bg-muted/30 rounded p-2", children: _jsxs("div", { className: "flex gap-4", children: [_jsxs("span", { children: [_jsx("strong", { children: "Provider:" }), " ", session.provider] }), _jsxs("span", { children: [_jsx("strong", { children: "Model:" }), " ", session.model] }), _jsxs("span", { children: [_jsx("strong", { children: "Agent:" }), " ", session.agent] })] }) })), _jsxs("div", { className: "flex justify-end gap-2 pt-2", children: [_jsx("button", { type: "button", onClick: onClose, className: "px-4 py-2 text-sm text-muted-foreground hover:text-foreground transition-colors", children: "Cancel" }), _jsx("button", { type: "submit", disabled: createBranch.isPending, className: "px-4 py-2 text-sm bg-primary text-primary-foreground rounded-md hover:bg-primary/90 disabled:opacity-50 disabled:cursor-not-allowed flex items-center gap-2", children: createBranch.isPending ? (_jsxs(_Fragment, { children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin" }), "Creating..."] })) : (_jsxs(_Fragment, { children: [_jsx(GitBranch, { className: "h-4 w-4" }), "Create Branch"] })) })] }), createBranch.isError && (_jsx("p", { className: "text-sm text-red-500", children: createBranch.error?.message || 'Failed to create branch' }))] }) }));
}
//# sourceMappingURL=BranchModal.js.map