theboardtui 0.1.0

package/dist/components/ProblemForm.js

@@ -0,0 +1,126 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { Box, Text, useInput } from "ink";
+import TextInput from "ink-text-input";
+import { apiGet, apiPost } from "../lib/api.js";
+import { selectionIndicator, heading, muted, dim, primary } from "../lib/theme.js";
+import Layout from "./Layout.js";
+import ErrorDisplay from "./ui/ErrorDisplay.js";
+export default function ProblemForm({ onNavigate, onBack }) {
+    const [step, setStep] = useState("board");
+    const [boards, setBoards] = useState([]);
+    const [selectedBoardIndex, setSelectedBoardIndex] = useState(0);
+    const [title, setTitle] = useState("");
+    const [description, setDescription] = useState("");
+    const [votingType, setVotingType] = useState("standard");
+    const [error, setError] = useState("");
+    const [loading, setLoading] = useState(true);
+    useEffect(() => {
+        loadBoards();
+    }, []);
+    const loadBoards = async () => {
+        try {
+            setLoading(true);
+            const data = await apiGet("/api/boards/list");
+            setBoards(data.boards || []);
+            if (data.boards && data.boards.length === 0) {
+                setError("No boards found. Please create a board first.");
+            }
+        }
+        catch (err) {
+            setError(err.message || "Failed to load boards");
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    const handleSubmit = async () => {
+        if (!title.trim() || !description.trim()) {
+            setError("Title and description are required");
+            return;
+        }
+        if (boards.length === 0 || selectedBoardIndex >= boards.length) {
+            setError("Please select a board");
+            return;
+        }
+        try {
+            setStep("submitting");
+            setError("");
+            const result = await apiPost("/api/problems/create", {
+                title: title.trim(),
+                description: description.trim(),
+                boardId: boards[selectedBoardIndex].id,
+                votingType,
+            });
+            onNavigate("problem-detail", result.id);
+        }
+        catch (err) {
+            setError(err.message || "Failed to create problem");
+            setStep("description");
+        }
+    };
+    useInput((input, key) => {
+        if (key.leftArrow || key.escape || (key.ctrl && input === "c")) {
+            if (step === "board") {
+                onBack();
+            }
+            else if (step === "title") {
+                setStep("board");
+            }
+            else if (step === "description") {
+                setStep("title");
+            }
+            else if (step === "voting") {
+                setStep("description");
+            }
+            return;
+        }
+        if (step === "board") {
+            if (key.upArrow) {
+                setSelectedBoardIndex((prev) => Math.max(0, prev - 1));
+            }
+            else if (key.downArrow) {
+                setSelectedBoardIndex((prev) => Math.min(boards.length - 1, prev + 1));
+            }
+            else if (key.return) {
+                if (boards[selectedBoardIndex]) {
+                    setStep("title");
+                }
+            }
+        }
+        else if (step === "voting") {
+            if (key.upArrow || key.downArrow) {
+                setVotingType((prev) => (prev === "standard" ? "weighted" : "standard"));
+            }
+            else if (key.return) {
+                handleSubmit();
+            }
+        }
+    });
+    if (loading) {
+        return (_jsx(Layout, { title: "Create Problem", children: _jsx(Text, { children: "Loading boards..." }) }));
+    }
+    if (error && boards.length === 0) {
+        return (_jsx(Layout, { title: "Create Problem", children: _jsx(ErrorDisplay, { error: error, maxWidth: Math.min(70, (process.stdout.columns || 80) - 4), showHelpText: true, helpText: "Press \u2190/ESC to go back" }) }));
+    }
+    if (step === "submitting") {
+        return (_jsx(Layout, { title: "Create Problem", children: _jsx(Text, { children: "Creating problem..." }) }));
+    }
+    return (_jsx(Layout, { title: "Create Problem", children: _jsxs(Box, { flexDirection: "column", gap: 1, children: [step === "board" && (_jsxs(_Fragment, { children: [_jsx(Text, { bold: true, children: heading("Select Board") }), boards.map((board, index) => (_jsxs(Text, { children: [selectedBoardIndex === index ? selectionIndicator() : "  ", heading(board.name), board.description && dim(` - ${board.description}`)] }, board.id))), _jsx(Box, { height: 1 }), _jsx(Text, { children: muted("Use ↑↓ to navigate, Enter to select, ←/ESC to go back") })] })), step === "title" && (_jsxs(_Fragment, { children: [_jsx(Text, { bold: true, children: heading("Problem Title") }), _jsx(TextInput, { value: title, onChange: setTitle, onSubmit: () => {
+                                if (title.trim()) {
+                                    setStep("description");
+                                    setError("");
+                                }
+                                else {
+                                    setError("Title is required");
+                                }
+                            }, placeholder: "Enter problem title" }), _jsx(Box, { height: 1 }), _jsx(Text, { children: muted("Press Enter to continue, ←/ESC to go back") })] })), step === "description" && (_jsxs(_Fragment, { children: [_jsx(Text, { bold: true, children: heading("Problem Description") }), _jsx(TextInput, { value: description, onChange: setDescription, onSubmit: () => {
+                                if (description.trim()) {
+                                    setStep("voting");
+                                    setError("");
+                                }
+                                else {
+                                    setError("Description is required");
+                                }
+                            }, placeholder: "Enter problem description" }), _jsx(Box, { height: 1 }), _jsx(Text, { children: muted("Press Enter to continue, ←/ESC to go back") })] })), step === "voting" && (_jsxs(_Fragment, { children: [_jsx(Text, { bold: true, children: heading("Voting Type") }), _jsxs(Text, { children: [votingType === "standard" ? selectionIndicator() : "  ", "Standard (one vote per member)"] }), _jsxs(Text, { children: [votingType === "weighted" ? selectionIndicator() : "  ", "Weighted (votes weighted by reputation)"] }), _jsx(Box, { height: 1 }), _jsx(Text, { bold: true, children: heading("Review") }), _jsxs(Text, { children: ["Board: ", primary(boards[selectedBoardIndex]?.name || "")] }), _jsxs(Text, { children: ["Title: ", primary(title)] }), _jsxs(Text, { children: ["Description: ", primary(description.substring(0, 50)), description.length > 50 ? "..." : ""] }), _jsx(Box, { height: 1 }), _jsx(Text, { children: muted("Use ↑↓ to change voting type, Enter to create, ←/ESC to go back") })] })), error && (_jsxs(_Fragment, { children: [_jsx(Box, { height: 1 }), _jsx(ErrorDisplay, { error: error, maxWidth: Math.min(70, (process.stdout.columns || 80) - 4) })] }))] }) }));
+}

package/dist/components/ProblemsList.js

@@ -0,0 +1,118 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { Box, Text, useInput } from "ink";
+import { apiGet } from "../lib/api.js";
+import { formatStatus, formatDate, truncate, wrapWithIndent } from "../utils/formatters.js";
+import { getItemPrefix, getSecondLinePrefix, heading, muted, dim, primary } from "../lib/theme.js";
+import Layout from "./Layout.js";
+import CompactList from "./CompactList.js";
+import ErrorDisplay from "./ui/ErrorDisplay.js";
+export default function ProblemsList({ onNavigate }) {
+    const [loading, setLoading] = useState(true);
+    const [problems, setProblems] = useState([]);
+    const [selectedIndex, setSelectedIndex] = useState(0);
+    const [currentPage, setCurrentPage] = useState(1);
+    const [pageSize] = useState(10);
+    const [error, setError] = useState("");
+    useEffect(() => {
+        loadProblems();
+        setSelectedIndex(0);
+    }, []);
+    useEffect(() => {
+        setSelectedIndex(0);
+    }, [currentPage]);
+    const loadProblems = async () => {
+        try {
+            setLoading(true);
+            setError("");
+            const data = await apiGet("/api/problems/list");
+            setProblems(data.problems || []);
+        }
+        catch (err) {
+            const errorMessage = err.data?.error || err.message || "Failed to load problems";
+            setError(errorMessage);
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    const hasCreateOption = currentPage === 1;
+    const problemsPerPage = hasCreateOption ? pageSize - 1 : pageSize;
+    const pageStartIndex = hasCreateOption ? 0 : (currentPage - 2) * pageSize + (pageSize - 1);
+    const pageEndIndex = pageStartIndex + problemsPerPage;
+    const pageProblems = problems.slice(pageStartIndex, pageEndIndex);
+    const totalPages = Math.ceil((problems.length + 1) / pageSize);
+    const listItems = [
+        ...(hasCreateOption ? [{ type: "create", data: null, id: "create" }] : []),
+        ...pageProblems.map(p => ({ type: "problem", data: p, id: p.id }))
+    ];
+    const totalPageItems = listItems.length;
+    useInput((input, key) => {
+        if (key.leftArrow || key.escape || (key.ctrl && input === "c")) {
+            onNavigate("quick-actions");
+            return;
+        }
+        if (key.pageUp) {
+            setCurrentPage((prev) => Math.max(1, prev - 1));
+            setSelectedIndex(0);
+            return;
+        }
+        if (key.pageDown) {
+            setCurrentPage((prev) => Math.min(totalPages, prev + 1));
+            setSelectedIndex(0);
+            return;
+        }
+        if (key.upArrow) {
+            setSelectedIndex((prev) => {
+                if (prev === 0 && currentPage > 1) {
+                    const newPage = currentPage - 1;
+                    setCurrentPage(newPage);
+                    const prevPageHasCreate = newPage === 1;
+                    const prevPageItems = prevPageHasCreate ? pageSize - 1 : pageSize - 1;
+                    return prevPageItems;
+                }
+                return Math.max(0, prev - 1);
+            });
+        }
+        else if (key.downArrow) {
+            setSelectedIndex((prev) => {
+                const maxIndex = totalPageItems - 1;
+                const newIndex = Math.min(maxIndex, prev + 1);
+                if (newIndex === maxIndex && currentPage < totalPages) {
+                    setCurrentPage((p) => p + 1);
+                    return 0;
+                }
+                return newIndex;
+            });
+        }
+        else if (key.return) {
+            if (hasCreateOption && selectedIndex === 0) {
+                onNavigate("problem-create");
+            }
+            else {
+                const problemIndex = hasCreateOption
+                    ? pageStartIndex + selectedIndex - 1
+                    : pageStartIndex + selectedIndex;
+                if (problemIndex >= 0 && problemIndex < problems.length) {
+                    onNavigate("problem-detail", problems[problemIndex].id);
+                }
+            }
+        }
+    });
+    if (loading) {
+        return (_jsx(Layout, { title: "Problems", children: _jsx(Text, { children: "Loading problems..." }) }));
+    }
+    if (error) {
+        return (_jsx(Layout, { title: "Problems", children: _jsx(ErrorDisplay, { error: error, maxWidth: Math.min(70, (process.stdout.columns || 80) - 4), showHelpText: true, helpText: "Press ESC to go back" }) }));
+    }
+    if (problems.length === 0) {
+        return (_jsxs(Layout, { title: "Problems", children: [_jsx(Text, { children: "No problems found." }), _jsx(Text, { children: muted("Press ESC to go back") })] }));
+    }
+    return (_jsx(Layout, { title: "Problems", children: _jsx(CompactList, { title: "Problems", items: listItems, selectedIndex: selectedIndex, currentPage: currentPage, totalPages: totalPages, totalItems: problems.length + 1, pageSize: pageSize, viewportSize: 6, getItemId: (item) => item.id, renderItem: (item, index, isSelected) => {
+                if (item.type === "create") {
+                    return (_jsxs(Text, { children: [getItemPrefix(isSelected), primary("Create New Problem")] }));
+                }
+                const problem = item.data;
+                return (_jsxs(Box, { flexDirection: "column", paddingY: 0, children: [_jsxs(Text, { children: [getItemPrefix(isSelected), formatStatus(problem.status), " ", heading(problem.title)] }), wrapWithIndent(truncate(problem.description, 60) + " " + dim(`- ${formatDate(problem.createdAt)}`), 60, getSecondLinePrefix()).map((line, idx) => (_jsx(Text, { children: line }, idx)))] }));
+            }, navigationHint: "\u2191\u2193 navigate | Enter to select | PgUp/PgDn change page | \u2190/ESC back" }) }));
+}

package/dist/components/QuickActions.js

@@ -0,0 +1,173 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { Box, Text, useInput } from "ink";
+import { apiGet } from "../lib/api.js";
+import { formatCredits } from "../utils/formatters.js";
+import { getItemPrefix, primary, muted, dim, divider, secondary } from "../lib/theme.js";
+import ErrorDisplay from "./ui/ErrorDisplay.js";
+import { getDashboardUrl, openInBrowser } from "../lib/browser.js";
+import { getBoardHeader } from "../lib/asciiArt.js";
+export default function QuickActions({ onNavigate, onExit }) {
+    const [loading, setLoading] = useState(true);
+    const [stats, setStats] = useState(null);
+    const [credits, setCredits] = useState(null);
+    const [selectedIndex, setSelectedIndex] = useState(0);
+    const [error, setError] = useState("");
+    const [terminalWidth, setTerminalWidth] = useState(() => process.stdout.columns || 80);
+    useEffect(() => {
+        loadData();
+        setSelectedIndex(0);
+    }, []);
+    useEffect(() => {
+        let resizeTimeout;
+        const handleResize = () => {
+            clearTimeout(resizeTimeout);
+            resizeTimeout = setTimeout(() => {
+                setTerminalWidth(process.stdout.columns || 80);
+            }, 100);
+        };
+        if (process.stdout.isTTY) {
+            process.stdout.on("resize", handleResize);
+            return () => {
+                clearTimeout(resizeTimeout);
+                process.stdout.off("resize", handleResize);
+            };
+        }
+    }, []);
+    const loadData = async () => {
+        try {
+            setLoading(true);
+            setError("");
+            const [statsData, creditsData, problemsData] = await Promise.all([
+                apiGet("/api/dashboard/stats").catch(() => (null)),
+                apiGet("/api/billing/credits").catch(() => ({ credits: null })),
+                apiGet("/api/problems/list").catch(() => ({ problems: [] })),
+            ]);
+            if (statsData) {
+                const stats = {
+                    boardCount: statsData.totalBoards ?? statsData.boards?.length ?? 0,
+                    problemCount: problemsData.problems?.length ?? 0,
+                    recentProblems: statsData.recentProblems || [],
+                    totalBoards: statsData.totalBoards,
+                    totalMembers: statsData.totalMembers,
+                };
+                setStats(stats);
+            }
+            if (creditsData.credits !== null) {
+                setCredits(creditsData.credits);
+            }
+        }
+        catch (err) {
+            setError(err.message || "Failed to load dashboard");
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    const quickActions = [
+        { label: "Create Problem", shortcut: "C", action: "create", view: "problem-create" },
+        { label: "View Problems", shortcut: "P", action: "problems", view: "problems" },
+        { label: "View Boards", shortcut: "B", action: "boards", view: "boards" },
+        { label: "View Members", shortcut: "M", action: "members", view: "members" },
+        { label: "Settings", shortcut: "S", action: "settings", view: "settings" },
+        { label: "Open in Browser", shortcut: "O", action: "browser", view: null },
+        { label: "Exit", shortcut: "E", action: "exit", view: null, isExit: true },
+    ];
+    useInput((input, key) => {
+        if (key.upArrow) {
+            setSelectedIndex((prev) => Math.max(0, prev - 1));
+        }
+        else if (key.downArrow) {
+            const maxIndex = quickActions.length - 1;
+            setSelectedIndex((prev) => Math.min(maxIndex, prev + 1));
+        }
+        else if (key.return) {
+            const action = quickActions[selectedIndex];
+            if (action) {
+                if (action.isExit) {
+                    onExit();
+                    process.exit(0);
+                }
+                else if (action.view === null) {
+                    openInBrowser(getDashboardUrl()).catch(console.error);
+                }
+                else if (action.id) {
+                    onNavigate(action.view, action.id);
+                }
+                else {
+                    onNavigate(action.view);
+                }
+            }
+        }
+        else if (input === "e" || input === "E") {
+            onExit();
+            process.exit(0);
+        }
+        else if (input === "c" || input === "C") {
+            onNavigate("problem-create");
+        }
+        else if (input === "p" || input === "P") {
+            onNavigate("problems");
+        }
+        else if (input === "b" || input === "B") {
+            onNavigate("boards");
+        }
+        else if (input === "m" || input === "M") {
+            onNavigate("members");
+        }
+        else if (input === "s" || input === "S") {
+            onNavigate("settings");
+        }
+        else if (input === "o" || input === "O") {
+            openInBrowser(getDashboardUrl()).catch(console.error);
+        }
+    });
+    const renderHeader = () => {
+        const headerLines = getBoardHeader(terminalWidth);
+        return (_jsx(Box, { flexDirection: "column", paddingX: 1, paddingY: 0, children: headerLines.map((line, index) => {
+                if (line.includes("╔") || line.includes("╚") || (line.includes("║") && !line.includes("█"))) {
+                    return _jsx(Text, { children: secondary(line) }, `${terminalWidth}-${index}`);
+                }
+                else if (line.includes("█")) {
+                    const parts = [];
+                    let currentBlock = "";
+                    let currentBorder = "";
+                    for (let i = 0; i < line.length; i++) {
+                        const char = line[i];
+                        if (char === "█") {
+                            if (currentBorder) {
+                                parts.push(secondary(currentBorder));
+                                currentBorder = "";
+                            }
+                            currentBlock += char;
+                        }
+                        else {
+                            if (currentBlock) {
+                                parts.push(primary(currentBlock));
+                                currentBlock = "";
+                            }
+                            currentBorder += char;
+                        }
+                    }
+                    if (currentBlock)
+                        parts.push(primary(currentBlock));
+                    if (currentBorder)
+                        parts.push(secondary(currentBorder));
+                    return _jsx(Text, { children: parts }, `${terminalWidth}-${index}`);
+                }
+                else {
+                    return _jsx(Text, { children: secondary(line) }, `${terminalWidth}-${index}`);
+                }
+            }) }, `header-${terminalWidth}`));
+    };
+    if (loading) {
+        return (_jsxs(Box, { flexDirection: "column", width: "100%", height: "100%", children: [renderHeader(), _jsx(Box, { paddingX: 1, paddingY: 1, children: _jsx(Text, { children: "Loading..." }) })] }));
+    }
+    if (error) {
+        return (_jsxs(Box, { flexDirection: "column", width: "100%", height: "100%", children: [renderHeader(), _jsx(Box, { flexGrow: 1, paddingX: 1, paddingY: 1, children: _jsx(ErrorDisplay, { error: error, maxWidth: Math.min(70, terminalWidth - 4) }) })] }));
+    }
+    return (_jsxs(Box, { flexDirection: "column", width: "100%", height: "100%", children: [renderHeader(), _jsx(Box, { paddingX: 1, paddingY: 0, children: _jsx(Text, { children: divider(75) }) }), _jsx(Box, { flexGrow: 1, paddingX: 1, paddingY: 1, children: _jsxs(Box, { flexDirection: "column", gap: 0, children: [quickActions.map((action, index) => {
+                            const isSelected = selectedIndex === index;
+                            return (_jsx(Box, { paddingY: 0, children: _jsxs(Text, { children: [getItemPrefix(isSelected), primary(action.label), " ", dim(`(${action.shortcut})`)] }) }, action.action));
+                        }), _jsx(Box, { height: 1 }), _jsxs(Box, { flexDirection: "row", gap: 2, children: [_jsxs(Text, { children: ["Credits: ", credits !== null ? formatCredits(credits) : muted("N/A")] }), _jsxs(Text, { children: ["| Boards: ", primary(String(stats?.boardCount || 0)), " | Problems: ", primary(String(stats?.problemCount || 0))] })] }), _jsx(Box, { height: 1 }), _jsx(Text, { children: muted("↑↓ to navigate, Enter to select, or press shortcut. O to open web app.") })] }) })] }));
+}

package/dist/components/QuickCreate.js

@@ -0,0 +1,159 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { Box, Text, useInput } from "ink";
+import { apiGet, apiPost } from "../lib/api.js";
+import { getItemPrefix, getSecondLinePrefix, heading, muted, dim } from "../lib/theme.js";
+import Input from "./ui/Input.js";
+import Layout from "./Layout.js";
+import CompactList from "./CompactList.js";
+import { truncate, wrapWithIndent } from "../utils/formatters.js";
+import ErrorDisplay from "./ui/ErrorDisplay.js";
+export default function QuickCreate({ onNavigate, onBack }) {
+    const [step, setStep] = useState("board");
+    const [boards, setBoards] = useState([]);
+    const [selectedBoardIndex, setSelectedBoardIndex] = useState(0);
+    const [boardPage, setBoardPage] = useState(1);
+    const [boardPageSize] = useState(10);
+    const [title, setTitle] = useState("");
+    const [description, setDescription] = useState("");
+    const [error, setError] = useState("");
+    const [loading, setLoading] = useState(true);
+    const [createdProblemId, setCreatedProblemId] = useState(null);
+    useEffect(() => {
+        loadBoards();
+    }, []);
+    const loadBoards = async () => {
+        try {
+            setLoading(true);
+            const data = await apiGet("/api/boards/list");
+            setBoards(data.boards || []);
+            if (data.boards && data.boards.length === 0) {
+                setError("No boards found. Please create a board first in the web app.");
+            }
+        }
+        catch (err) {
+            setError(err.message || "Failed to load boards");
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    const handleSubmit = async () => {
+        if (!title.trim() || !description.trim()) {
+            setError("Title and description are required");
+            return;
+        }
+        if (boards.length === 0 || selectedBoardIndex < 0 || selectedBoardIndex >= boards.length) {
+            setError("Please select a board");
+            return;
+        }
+        try {
+            setStep("submitting");
+            setError("");
+            const result = await apiPost("/api/problems/create", {
+                title: title.trim(),
+                description: description.trim(),
+                boardId: boards[selectedBoardIndex].id,
+                votingType: "standard",
+            });
+            setCreatedProblemId(result.id);
+            onNavigate("problem-detail", result.id, true);
+        }
+        catch (err) {
+            setError(err.message || "Failed to create problem");
+            setStep("description");
+        }
+    };
+    useInput((input, key) => {
+        if (key.escape) {
+            onBack();
+            return;
+        }
+        if (step === "board") {
+            const boardsTotalPages = Math.ceil(boards.length / boardPageSize);
+            const pageStartIndex = (boardPage - 1) * boardPageSize;
+            const pageEndIndex = pageStartIndex + boardPageSize;
+            const pageBoards = boards.slice(pageStartIndex, pageEndIndex);
+            const totalPageItems = pageBoards.length;
+            if (key.pageUp) {
+                setBoardPage((prev) => Math.max(1, prev - 1));
+                setSelectedBoardIndex(0);
+            }
+            else if (key.pageDown) {
+                setBoardPage((prev) => Math.min(boardsTotalPages, prev + 1));
+                setSelectedBoardIndex(0);
+            }
+            else if (key.upArrow) {
+                setSelectedBoardIndex((prev) => {
+                    if (prev === 0 && boardPage > 1) {
+                        const newPage = boardPage - 1;
+                        setBoardPage(newPage);
+                        const newPageBoards = boards.slice((newPage - 1) * boardPageSize, newPage * boardPageSize);
+                        return newPageBoards.length - 1;
+                    }
+                    return Math.max(0, prev - 1);
+                });
+            }
+            else if (key.downArrow) {
+                setSelectedBoardIndex((prev) => {
+                    if (prev === totalPageItems - 1 && boardPage < boardsTotalPages) {
+                        setBoardPage((p) => p + 1);
+                        return 0;
+                    }
+                    return Math.min(totalPageItems - 1, prev + 1);
+                });
+            }
+            else if (key.return) {
+                if (pageBoards[selectedBoardIndex]) {
+                    const actualIndex = pageStartIndex + selectedBoardIndex;
+                    setSelectedBoardIndex(actualIndex);
+                    setStep("title");
+                }
+            }
+        }
+        else if (step === "title") {
+            if (key.return && title.trim()) {
+                setStep("description");
+                setError("");
+            }
+        }
+        else if (step === "description") {
+            if (key.return && description.trim()) {
+                handleSubmit();
+            }
+        }
+    });
+    if (loading) {
+        return (_jsx(Layout, { title: "Quick Create", children: _jsx(Text, { children: "Loading boards..." }) }));
+    }
+    if (error && boards.length === 0) {
+        return (_jsx(Layout, { title: "Quick Create", children: _jsx(ErrorDisplay, { error: error, maxWidth: Math.min(70, (process.stdout.columns || 80) - 4), showHelpText: true, helpText: "Press ESC to go back" }) }));
+    }
+    if (step === "submitting") {
+        return (_jsx(Layout, { title: "Quick Create", children: _jsx(Text, { children: "Creating problem..." }) }));
+    }
+    if (step === "board") {
+        const boardsTotalPages = Math.ceil(boards.length / boardPageSize);
+        const pageStartIndex = (boardPage - 1) * boardPageSize;
+        const pageEndIndex = pageStartIndex + boardPageSize;
+        const pageBoards = boards.slice(pageStartIndex, pageEndIndex);
+        return (_jsx(Layout, { title: "Create Problem - Select Board", children: _jsx(CompactList, { title: "Boards", items: pageBoards, selectedIndex: selectedBoardIndex, currentPage: boardPage, totalPages: boardsTotalPages, totalItems: boards.length, pageSize: boardPageSize, viewportSize: 8, getItemId: (board) => board.id, renderItem: (board, index, isSelected) => {
+                    return (_jsxs(Box, { flexDirection: "column", paddingY: 0, children: [_jsxs(Text, { children: [getItemPrefix(isSelected), heading(board.name), " ", dim(`(${board.memberCount || 0} members)`)] }), board.description && (_jsx(_Fragment, { children: wrapWithIndent(truncate(board.description, 60), 60, getSecondLinePrefix()).map((line, idx) => (_jsx(Text, { children: line }, idx))) }))] }));
+                }, navigationHint: "\u2191\u2193 navigate | Enter select | PgUp/PgDn change page | ESC cancel" }) }));
+    }
+    if (step === "title") {
+        return (_jsx(Layout, { title: "Create Problem - Title", children: _jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(Text, { children: dim("Enter problem title:") }), _jsx(Box, { height: 0 }), _jsx(Input, { value: title, onChange: setTitle, onSubmit: () => {
+                            if (title.trim()) {
+                                setStep("description");
+                                setError("");
+                            }
+                            else {
+                                setError("Title is required");
+                            }
+                        }, placeholder: "Problem title", label: "Title", focused: true }), error && (_jsxs(_Fragment, { children: [_jsx(Box, { height: 0 }), _jsx(ErrorDisplay, { error: error, maxWidth: Math.min(70, (process.stdout.columns || 80) - 4) })] })), _jsx(Box, { height: 1 }), _jsx(Text, { children: muted("Enter title and press Enter, ESC to go back") })] }) }));
+    }
+    if (step === "description") {
+        return (_jsx(Layout, { title: "Create Problem - Description", children: _jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(Text, { children: dim("Enter problem description:") }), _jsx(Box, { height: 0 }), _jsx(Input, { value: description, onChange: setDescription, onSubmit: handleSubmit, placeholder: "Problem description", label: "Description", focused: true }), error && (_jsxs(_Fragment, { children: [_jsx(Box, { height: 0 }), _jsx(ErrorDisplay, { error: error, maxWidth: Math.min(70, (process.stdout.columns || 80) - 4) })] })), _jsx(Box, { height: 1 }), _jsx(Text, { children: muted("Enter description and press Enter to create, ESC to go back") })] }) }));
+    }
+    return null;
+}

package/dist/components/ReportViewer.js

@@ -0,0 +1,7 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Box, Text } from "ink";
+import { formatDate, truncate } from "../utils/formatters.js";
+import { primary, muted, approve, warning } from "../lib/theme.js";
+export default function ReportViewer({ report }) {
+    return (_jsxs(Box, { flexDirection: "column", gap: 1, borderStyle: "round", borderColor: "gray", padding: 1, children: [_jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsxs(Text, { bold: true, children: [primary(report.memberName), " - ", muted(formatDate(report.createdAt))] }), _jsx(Text, { children: muted(`Votes: ${primary(String(report.voteCount))}`) })] }), report.research && (_jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(Text, { bold: true, children: primary("Research") }), _jsx(Text, { children: truncate(report.research, 200) })] })), report.analysis && (_jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(Text, { bold: true, children: warning("Analysis") }), _jsx(Text, { children: truncate(report.analysis, 200) })] })), report.solution && (_jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(Text, { bold: true, children: approve("Solution") }), _jsx(Text, { children: truncate(report.solution, 200) })] }))] }));
+}

package/dist/components/Settings.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { Box, Text, useInput } from "ink";
+import { getUser, clearSession } from "../lib/config.js";
+import { formatCredits } from "../utils/formatters.js";
+import { apiGet } from "../lib/api.js";
+import { getItemPrefix, heading, muted, dim, primary } from "../lib/theme.js";
+import Layout from "./Layout.js";
+export default function Settings({ onBack, onLogout }) {
+    const [user, setUser] = useState(getUser());
+    const [credits, setCredits] = useState(null);
+    const [selectedIndex, setSelectedIndex] = useState(0);
+    useEffect(() => {
+        loadCredits();
+    }, []);
+    const loadCredits = async () => {
+        try {
+            const data = await apiGet("/api/billing/credits");
+            setCredits(data.credits);
+        }
+        catch (err) {
+            console.error("Failed to load credits:", err);
+        }
+    };
+    useInput((input, key) => {
+        if (key.leftArrow || key.escape || (key.ctrl && input === "c")) {
+            onBack();
+            return;
+        }
+        if (key.upArrow) {
+            setSelectedIndex((prev) => Math.max(0, prev - 1));
+        }
+        else if (key.downArrow) {
+            setSelectedIndex((prev) => Math.min(1, prev + 1));
+        }
+        else if (key.return) {
+            switch (selectedIndex) {
+                case 0:
+                    loadCredits();
+                    break;
+                case 1:
+                    clearSession();
+                    onLogout();
+                    break;
+            }
+        }
+    });
+    const menuItems = [
+        { label: "Refresh Credits", action: "refresh" },
+        { label: "Logout", action: "logout" },
+    ];
+    return (_jsx(Layout, { title: "Settings", children: _jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(Text, { bold: true, children: heading("User") }), _jsxs(Text, { children: [dim("Email:"), " ", primary(user.email || "N/A")] }), _jsxs(Text, { children: [dim("User ID:"), " ", dim(user.userId || "N/A")] })] }), _jsx(Box, { height: 1 }), _jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(Text, { bold: true, children: heading("Credits") }), _jsx(Text, { children: credits !== null ? formatCredits(credits) : muted("Loading...") })] }), _jsx(Box, { height: 1 }), _jsxs(Box, { flexDirection: "column", gap: 0, children: [_jsx(Text, { bold: true, children: heading("Actions") }), menuItems.map((item, index) => (_jsxs(Text, { children: [getItemPrefix(selectedIndex === index), primary(item.label)] }, item.action)))] }), _jsx(Box, { height: 1 }), _jsx(Text, { children: muted("↑↓ navigate | Enter select | ←/ESC back") })] }) }));
+}