import React, { useState } from 'react';
import { Box, Text, useApp, useInput, Spacer } from 'ink';
export function BoardUI({ boardTitle, sections, onEdit, onOpen }) {
    const { exit } = useApp();
    const [selectedSection, setSelectedSection] = useState(0);
    useInput((input, key) => {
        if (key.escape || input === 'q') {
            exit();
        }
        if (key.leftArrow) {
            setSelectedSection(prev => Math.max(0, prev - 1));
        }
        if (key.rightArrow) {
            setSelectedSection(prev => Math.min(sections.length - 1, prev + 1));
        }
        if (input === 'e' && onEdit) {
            onEdit();
            exit();
        }
        if (input === 'o' && onOpen) {
            onOpen();
            exit();
        }
    });
    const getPriorityColor = (priority) => {
        switch (priority) {
            case 'high': return 'red';
            case 'medium': return 'yellow';
            case 'low': return 'green';
            default: return 'gray';
        }
    };
    return (React.createElement(Box, { flexDirection: "column", padding: 1 },
        React.createElement(Box, { marginBottom: 1 },
            React.createElement(Text, { color: "cyan", bold: true },
                "\uD83D\uDCCB ",
                boardTitle),
            React.createElement(Spacer, null),
            React.createElement(Text, { dimColor: true }, "\u2190 \u2192 Navigate | e: Edit | o: Open in Obsidian | q: Quit")),
        React.createElement(Box, null, sections.map((section, index) => (React.createElement(Box, { key: section.title, flexDirection: "column", width: "25%", marginRight: 1, borderStyle: selectedSection === index ? 'double' : 'single', borderColor: selectedSection === index ? 'cyan' : 'gray', padding: 1 },
            React.createElement(Box, { marginBottom: 1 },
                React.createElement(Text, { bold: true, color: selectedSection === index ? 'cyan' : 'white' },
                    section.icon,
                    " ",
                    section.title)),
            section.tickets.length === 0 ? (React.createElement(Text, { dimColor: true, italic: true }, "No tickets")) : (section.tickets.map(ticket => (React.createElement(Box, { key: ticket.id, marginBottom: 1 },
                React.createElement(Text, null,
                    ticket.completed ? '✅' : '☐',
                    " ",
                    ticket.id),
                React.createElement(Box, { marginLeft: 2 },
                    React.createElement(Text, { wrap: "truncate" }, ticket.title)),
                (ticket.priority || ticket.queue || ticket.assignee) && (React.createElement(Box, { marginLeft: 2 },
                    ticket.priority && (React.createElement(Text, { color: getPriorityColor(ticket.priority) },
                        "#",
                        ticket.priority,
                        ' ')),
                    ticket.queue && (React.createElement(Text, { color: "blue" },
                        "+",
                        ticket.queue,
                        ' ')),
                    ticket.assignee && (React.createElement(Text, { color: "magenta" },
                        "@",
                        ticket.assignee)))))))),
            React.createElement(Box, { marginTop: 1 },
                React.createElement(Text, { dimColor: true },
                    section.tickets.length,
                    " ticket",
                    section.tickets.length !== 1 ? 's' : '')))))),
        React.createElement(Box, { marginTop: 1 },
            React.createElement(Text, { dimColor: true },
                "Total: ",
                sections.reduce((sum, s) => sum + s.tickets.length, 0),
                " tickets"),
            React.createElement(Text, { dimColor: true }, " | "),
            React.createElement(Text, { color: "green" },
                "Done: ",
                sections.find(s => s.title === 'Done')?.tickets.length || 0),
            React.createElement(Text, { dimColor: true }, " | "),
            React.createElement(Text, { color: "yellow" },
                "Active: ",
                sections
                    .filter(s => ['In Progress', 'In Review', 'Blocked'].includes(s.title))
                    .reduce((sum, s) => sum + s.tickets.length, 0)))));
}
//# sourceMappingURL=BoardUI.js.map