'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useState, useCallback } from 'react';
import { Plus, Trash2, ArrowRightLeft, Play, CheckCircle2, Clock } from 'lucide-react';
import { cn } from '../../../lib/utils.js';
import { Button } from '../../ui/button.js';
import { Badge } from '../../ui/badge.js';
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, } from '../../ui/dialog.js';
import { Input } from '../../ui/input.js';
import { Label } from '../../ui/label.js';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../../ui/select.js';
import { createCycle, updateCycle, deleteCycle, transferCycleItems, } from '../../../app/actions/manage-cycles.js';
const STATUS_ICON = {
    Upcoming: Clock,
    Active: Play,
    Completed: CheckCircle2,
};
const STATUS_VARIANT = {
    Active: 'default',
    Upcoming: 'secondary',
    Completed: 'outline',
};
export function CyclePanel({ projectId, cycles, onCyclesChange, className }) {
    const [showCreateDialog, setShowCreateDialog] = useState(false);
    const [showTransferDialog, setShowTransferDialog] = useState(false);
    const [transferSourceId, setTransferSourceId] = useState(null);
    const [transferTargetId, setTransferTargetId] = useState('');
    const [newCycleName, setNewCycleName] = useState('');
    const [newCycleStartDate, setNewCycleStartDate] = useState('');
    const [newCycleEndDate, setNewCycleEndDate] = useState('');
    const [loading, setLoading] = useState(false);
    const handleCreate = useCallback(async () => {
        if (!newCycleName.trim())
            return;
        setLoading(true);
        const result = await createCycle({
            projectId,
            name: newCycleName.trim(),
            startDate: newCycleStartDate || undefined,
            endDate: newCycleEndDate || undefined,
        });
        setLoading(false);
        if (result.cycle) {
            onCyclesChange?.([...cycles, result.cycle]);
            setShowCreateDialog(false);
            setNewCycleName('');
            setNewCycleStartDate('');
            setNewCycleEndDate('');
        }
    }, [newCycleName, newCycleStartDate, newCycleEndDate, projectId, cycles, onCyclesChange]);
    const handleStatusChange = useCallback(async (cycleId, status) => {
        const result = await updateCycle(cycleId, { status });
        if (result.cycle) {
            onCyclesChange?.(cycles.map((c) => (c.id === cycleId ? result.cycle : c)));
        }
    }, [cycles, onCyclesChange]);
    const handleDelete = useCallback(async (cycleId) => {
        const result = await deleteCycle(cycleId);
        if (!result.error) {
            onCyclesChange?.(cycles.filter((c) => c.id !== cycleId));
        }
    }, [cycles, onCyclesChange]);
    const handleTransfer = useCallback(async () => {
        if (!transferSourceId)
            return;
        setLoading(true);
        await transferCycleItems(transferSourceId, transferTargetId || undefined);
        setLoading(false);
        setShowTransferDialog(false);
        setTransferSourceId(null);
        setTransferTargetId('');
    }, [transferSourceId, transferTargetId]);
    const openTransferDialog = useCallback((cycleId) => {
        setTransferSourceId(cycleId);
        setShowTransferDialog(true);
    }, []);
    return (_jsxs("div", { "data-testid": "cycle-panel", className: cn('space-y-3', className), children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h3", { className: "text-xs font-medium", children: "Cycles" }), _jsxs(Button, { variant: "outline", size: "sm", className: "h-6 text-[10px]", onClick: () => setShowCreateDialog(true), "data-testid": "create-cycle-btn", children: [_jsx(Plus, { className: "mr-1 h-3 w-3" }), "New Cycle"] })] }), cycles.length === 0 ? (_jsx("div", { className: "text-muted-foreground py-8 text-center text-xs", children: "No cycles yet. Create a cycle to organize sprints." })) : (_jsx("div", { className: "space-y-2", children: cycles.map((cycle) => {
                    const StatusIcon = STATUS_ICON[cycle.status] ?? Clock;
                    return (_jsxs("div", { "data-testid": `cycle-${cycle.id}`, className: "flex items-center justify-between rounded-lg border p-3", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(StatusIcon, { className: "text-muted-foreground h-3.5 w-3.5" }), _jsx("span", { className: "text-xs font-medium", children: cycle.name }), _jsx(Badge, { variant: STATUS_VARIANT[cycle.status] ?? 'outline', className: "text-[10px]", children: cycle.status }), cycle.startDate && cycle.endDate ? (_jsxs("span", { className: "text-muted-foreground text-[10px]", children: [new Date(cycle.startDate).toLocaleDateString(), " \u2013", ' ', new Date(cycle.endDate).toLocaleDateString()] })) : null] }), _jsxs("div", { className: "flex items-center gap-1", children: [cycle.status !== 'Active' && (_jsxs(Button, { variant: "ghost", size: "sm", className: "h-6 px-2 text-[10px]", onClick: () => handleStatusChange(cycle.id, 'Active'), children: [_jsx(Play, { className: "mr-1 h-3 w-3" }), "Start"] })), cycle.status === 'Active' && (_jsxs(Button, { variant: "ghost", size: "sm", className: "h-6 px-2 text-[10px]", onClick: () => handleStatusChange(cycle.id, 'Completed'), children: [_jsx(CheckCircle2, { className: "mr-1 h-3 w-3" }), "Complete"] })), _jsx(Button, { variant: "ghost", size: "sm", className: "h-6 px-2 text-[10px]", onClick: () => openTransferDialog(cycle.id), children: _jsx(ArrowRightLeft, { className: "h-3 w-3" }) }), _jsx(Button, { variant: "ghost", size: "sm", className: "text-destructive h-6 px-2 text-[10px]", onClick: () => handleDelete(cycle.id), children: _jsx(Trash2, { className: "h-3 w-3" }) })] })] }, cycle.id));
                }) })), _jsx(Dialog, { open: showCreateDialog, onOpenChange: setShowCreateDialog, children: _jsxs(DialogContent, { className: "max-w-sm", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { className: "text-sm", children: "Create Cycle" }) }), _jsxs("div", { className: "space-y-3", children: [_jsxs("div", { children: [_jsx(Label, { className: "text-xs", children: "Name" }), _jsx(Input, { value: newCycleName, onChange: (e) => setNewCycleName(e.target.value), placeholder: "Sprint 1", className: "h-8 text-xs" })] }), _jsxs("div", { className: "grid grid-cols-2 gap-2", children: [_jsxs("div", { children: [_jsx(Label, { className: "text-xs", children: "Start Date" }), _jsx(Input, { type: "date", value: newCycleStartDate, onChange: (e) => setNewCycleStartDate(e.target.value), className: "h-8 text-xs" })] }), _jsxs("div", { children: [_jsx(Label, { className: "text-xs", children: "End Date" }), _jsx(Input, { type: "date", value: newCycleEndDate, onChange: (e) => setNewCycleEndDate(e.target.value), className: "h-8 text-xs" })] })] })] }), _jsx(DialogFooter, { children: _jsx(Button, { size: "sm", className: "h-7 text-xs", onClick: handleCreate, disabled: loading, children: "Create" }) })] }) }), _jsx(Dialog, { open: showTransferDialog, onOpenChange: setShowTransferDialog, children: _jsxs(DialogContent, { className: "max-w-sm", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { className: "text-sm", children: "Transfer Incomplete Items" }) }), _jsxs("div", { className: "space-y-3", children: [_jsx("p", { className: "text-muted-foreground text-xs", children: "Move incomplete items to another cycle, or remove them to backlog." }), _jsxs("div", { children: [_jsx(Label, { className: "text-xs", children: "Target Cycle (optional)" }), _jsxs(Select, { value: transferTargetId, onValueChange: setTransferTargetId, children: [_jsx(SelectTrigger, { className: "h-8 text-xs", children: _jsx(SelectValue, { placeholder: "Backlog (no target)" }) }), _jsx(SelectContent, { children: cycles
                                                        .filter((c) => c.id !== transferSourceId)
                                                        .map((c) => (_jsx(SelectItem, { value: c.id, className: "text-xs", children: c.name }, c.id))) })] })] })] }), _jsx(DialogFooter, { children: _jsx(Button, { size: "sm", className: "h-7 text-xs", onClick: handleTransfer, disabled: loading, children: "Transfer" }) })] }) })] }));
}
