'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from 'react';
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, } from '../../ui/dialog.js';
import { Button } from '../../ui/button.js';
import { Input } from '../../ui/input.js';
import { Label } from '../../ui/label.js';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../../ui/select.js';
import { RelationType } from '../../../../../../packages/core/src/domain/generated/output.js';
import { createWorkItemRelation } from '../../../app/actions/create-work-item-relation.js';
const RELATION_TYPE_OPTIONS = [
    { value: RelationType.Blocking, label: 'Blocking' },
    { value: RelationType.RelatesTo, label: 'Relates to' },
    { value: RelationType.Duplicate, label: 'Duplicate' },
    { value: RelationType.StartsBefore, label: 'Starts before' },
    { value: RelationType.FinishesBefore, label: 'Finishes before' },
];
export function AddRelationDialog({ open, onOpenChange, sourceWorkItemId, onCreated, }) {
    const [relationType, setRelationType] = useState(RelationType.RelatesTo);
    const [targetWorkItemId, setTargetWorkItemId] = useState('');
    const [error, setError] = useState(null);
    const [submitting, setSubmitting] = useState(false);
    const handleSubmit = async () => {
        setError(null);
        if (!targetWorkItemId.trim()) {
            setError('Target work item ID is required');
            return;
        }
        setSubmitting(true);
        try {
            const result = await createWorkItemRelation({
                sourceWorkItemId,
                targetWorkItemId: targetWorkItemId.trim(),
                relationType,
            });
            if (result.error) {
                setError(result.error);
            }
            else if (result.relation) {
                onCreated(result.relation);
                setTargetWorkItemId('');
                setRelationType(RelationType.RelatesTo);
            }
        }
        finally {
            setSubmitting(false);
        }
    };
    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { "data-testid": "add-relation-dialog", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: "Add Relation" }) }), _jsxs("div", { className: "space-y-4 py-2", children: [_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "relation-type", children: "Relation Type" }), _jsxs(Select, { value: relationType, onValueChange: setRelationType, children: [_jsx(SelectTrigger, { "data-testid": "relation-type-select", children: _jsx(SelectValue, { placeholder: "Select type" }) }), _jsx(SelectContent, { children: RELATION_TYPE_OPTIONS.map((opt) => (_jsx(SelectItem, { value: opt.value, children: opt.label }, opt.value))) })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "target-work-item", children: "Target Work Item ID" }), _jsx(Input, { id: "target-work-item", value: targetWorkItemId, onChange: (e) => setTargetWorkItemId(e.target.value), placeholder: "Enter work item ID or identifier", "data-testid": "target-work-item-input" })] }), error ? (_jsx("p", { className: "text-destructive text-xs", "data-testid": "add-relation-error", children: error })) : null] }), _jsxs(DialogFooter, { children: [_jsx(Button, { variant: "outline", onClick: () => onOpenChange(false), disabled: submitting, children: "Cancel" }), _jsx(Button, { onClick: handleSubmit, disabled: !targetWorkItemId.trim() || submitting, "data-testid": "add-relation-submit", children: submitting ? 'Adding...' : 'Add Relation' })] })] }) }));
}
