nodedex 0.1.0

package/tui-dist/review.js

@@ -0,0 +1,193 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// review.tsx — the Review pane (TUI-V2 §2.3): the queue with ACTIONS.
+// The TUI's ONLY write surface, and every write is confirm-gated: the action
+// shows exactly what will change and asks y/N (flag-don't-auto-act as UI).
+//
+// Three queues, one list:
+//   ⚑ dup flags (unreviewed pipeline_flags)  → actions: merge A / merge B / keep
+//   ⚑ routed-to-you questions                → read-only here (the agent answers
+//     from conversation context; the TUI can't know the owner)
+//   ⚑ thin / needs-review blocks             → read-only until the server grows
+//     a demote endpoint (demote logic lives server-side; not duplicated here)
+import { useCallback, useEffect, useRef, useState } from "react";
+import { Box, Text, useInput } from "ink";
+import { Panel } from "./components.js";
+import { theme, glyph, typeColorOf, typeGlyphOf, trunc } from "./theme.js";
+import { useTermSize } from "./hooks.js";
+import { fetchUnreviewedFlags, fetchFlagDetail, postFlagReview, } from "./api.js";
+function valueOf(snap) {
+    if (!snap)
+        return "";
+    try {
+        const u = JSON.parse(snap.content)?.unique ?? {};
+        const first = Object.values(u).find((v) => typeof v === "string" && v.trim());
+        return first ?? "";
+    }
+    catch {
+        return "";
+    }
+}
+export function ReviewTab({ dash, isActive, onCapture, }) {
+    const { columns, rows } = useTermSize();
+    const [flags, setFlags] = useState(null);
+    const [idx, setIdx] = useState(0);
+    const [detail, setDetail] = useState(null);
+    const [confirm, setConfirm] = useState(null);
+    const [notice, setNotice] = useState("");
+    const seq = useRef(0);
+    const reload = useCallback(() => {
+        void fetchUnreviewedFlags().then(setFlags);
+    }, []);
+    useEffect(reload, [reload]);
+    const items = [
+        ...(flags ?? []).map((f) => ({ kind: "dup", flag: f })),
+        ...dash.agentFlags.map((f) => ({ kind: "routed", id: f.id, question: f.question, reason: f.routed_reason })),
+        ...dash.reviewQueue.map((b) => ({ kind: "thin", id: b.id, label: b.label, type: b.type, essence: b.essence, reason: b.review_reason })),
+    ];
+    const sel = items[Math.min(idx, Math.max(0, items.length - 1))];
+    // dup detail (both blocks embedded) follows the highlight
+    useEffect(() => {
+        if (!sel || sel.kind !== "dup") {
+            setDetail(null);
+            return;
+        }
+        const s = ++seq.current;
+        fetchFlagDetail(sel.flag.id).then((d) => {
+            if (s === seq.current)
+                setDetail(d ? { a: d.block_a, b: d.block_b } : null);
+        });
+    }, [sel?.kind === "dup" ? sel.flag.id : null]);
+    // a pending confirm owns the keyboard (y/N must not leak to the shell)
+    useEffect(() => { onCapture(confirm !== null); }, [confirm, onCapture]);
+    const askMerge = (winner) => {
+        if (!sel || sel.kind !== "dup" || !detail)
+            return;
+        const win = winner === "a" ? detail.a : detail.b;
+        const lose = winner === "a" ? detail.b : detail.a;
+        if (!win || !lose) {
+            setNotice("single-block flag — nothing to merge");
+            return;
+        }
+        setConfirm({
+            lines: [
+                `MERGE — keep:    ${trunc(win.label, columns - 30)}`,
+                `        archive: ${trunc(lose.label, columns - 30)} (+ wire superseded_by)`,
+                `        flag ${sel.flag.id} marked merge`,
+            ],
+            run: async () => {
+                const r = await postFlagReview(sel.flag.id, {
+                    verdict: "merge",
+                    reason: "operator confirmed duplicate in TUI review pane",
+                    execute: true,
+                    winning_block_id: win.id,
+                });
+                setNotice(r?.ok ? `merged — ${lose.label} archived` : `failed: ${r?.error ?? "no response"}`);
+                reload();
+            },
+        });
+    };
+    const askKeep = () => {
+        if (!sel || sel.kind !== "dup")
+            return;
+        setConfirm({
+            lines: [
+                `KEEP BOTH — flag ${sel.flag.id} marked leave; no blocks change`,
+            ],
+            run: async () => {
+                const r = await postFlagReview(sel.flag.id, {
+                    verdict: "leave",
+                    reason: "operator judged not-a-duplicate in TUI review pane",
+                });
+                setNotice(r?.ok ? "kept both — flag closed" : `failed: ${r?.error ?? "no response"}`);
+                reload();
+            },
+        });
+    };
+    useInput((input, key) => {
+        if (confirm) {
+            if (input === "y" || input === "Y") {
+                const c = confirm;
+                setConfirm(null);
+                setNotice("applying…");
+                void c.run();
+            }
+            else if (input === "n" || input === "N" || key.escape || key.return) {
+                setConfirm(null);
+                setNotice("cancelled");
+            }
+            return;
+        }
+        const last = Math.max(0, items.length - 1);
+        if (input === "j" || key.downArrow) {
+            setIdx((i) => Math.min(i + 1, last));
+            setNotice("");
+            return;
+        }
+        if (input === "k" || key.upArrow) {
+            setIdx((i) => Math.max(0, i - 1));
+            setNotice("");
+            return;
+        }
+        if (input === "g") {
+            setIdx(0);
+            return;
+        }
+        if (input === "G") {
+            setIdx(last);
+            return;
+        }
+        if (input === "m") {
+            askMerge("a");
+            return;
+        }
+        if (input === "b") {
+            askMerge("b");
+            return;
+        }
+        if (input === "K") {
+            askKeep();
+            return;
+        }
+    }, { isActive });
+    const listH = Math.max(5, Math.floor((rows - (rows < 30 ? 12 : 20)) / 2));
+    const off = Math.max(0, Math.min(idx - Math.floor(listH / 2), Math.max(0, items.length - listH)));
+    const rowOf = (it, i) => {
+        const isSel = off + i === idx;
+        const mark = isSel ? "▸" : " ";
+        let tag = "";
+        let text = "";
+        if (it.kind === "dup") {
+            tag = it.flag.flag_type;
+            // show WHAT the blocks are (type_concept), not raw IDs. The detector already
+            // carries the labels in criteria; strip the shared project prefix for room.
+            const c = it.flag.criteria;
+            const shortLbl = (lbl, id) => (lbl ? lbl.replace(/^[^_]+_/, "") : "") || id || "—";
+            text = `${shortLbl(c?.label_a, it.flag.block_id_a)} ≈ ${shortLbl(c?.label_b, it.flag.block_id_b)}`;
+        }
+        else if (it.kind === "routed") {
+            tag = "routed-to-you";
+            text = it.question;
+        }
+        else {
+            tag = it.reason || "needs_review";
+            text = it.essence || it.label;
+        }
+        return (_jsxs(Box, { children: [_jsx(Text, { color: isSel ? theme.accent : theme.accent, children: `${glyph.flag} ` }), _jsx(Text, { color: theme.label, children: `${trunc(tag, 16).padEnd(17)}` }), _jsx(Text, { bold: isSel, color: isSel ? theme.accent : undefined, wrap: "truncate-end", children: `${mark}${trunc(text, columns - 32)}` })] }, `${it.kind}-${i}`));
+    };
+    // detail panel for the selection
+    let detailBody = _jsx(Text, { color: theme.dim, children: "nothing selected" });
+    if (sel?.kind === "dup") {
+        detailBody = !detail ? (_jsx(Text, { color: theme.dim, children: "loading\u2026" })) : (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { children: [_jsx(Text, { color: theme.label, children: "A: " }), _jsx(Text, { children: trunc(detail.a?.label ?? "(gone)", columns - 20) })] }), _jsx(Text, { color: theme.dim, children: `   "${trunc(valueOf(detail.a) || detail.a?.essence || "", columns - 20)}"` }), _jsxs(Text, { children: [_jsx(Text, { color: theme.label, children: "B: " }), _jsx(Text, { children: trunc(detail.b?.label ?? "(none)", columns - 20) })] }), _jsx(Text, { color: theme.dim, children: `   "${trunc(valueOf(detail.b) || detail.b?.essence || "", columns - 20)}"` }), sel.flag.review_reason ? (_jsx(Text, { color: theme.dim, children: `   detector says: ${trunc(sel.flag.review_reason, columns - 24)}` })) : null, _jsx(Box, { marginTop: 1, children: _jsxs(Text, { children: [_jsx(Text, { color: theme.accent, children: "[m]" }), _jsx(Text, { color: theme.dim, children: "erge keep A   " }), _jsx(Text, { color: theme.accent, children: "[b]" }), _jsx(Text, { color: theme.dim, children: " merge keep B   " }), _jsx(Text, { color: theme.accent, children: "[K]" }), _jsx(Text, { color: theme.dim, children: "eep both" })] }) })] }));
+    }
+    else if (sel?.kind === "routed") {
+        detailBody = (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { wrap: "wrap", children: sel.question }), sel.reason ? _jsx(Text, { color: theme.dim, children: `reason: ${trunc(sel.reason, columns - 16)}` }) : null, _jsx(Text, { color: theme.dim, children: "answered by the agent from conversation context \u2014 not actionable here" })] }));
+    }
+    else if (sel?.kind === "thin") {
+        detailBody = (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { children: [_jsx(Text, { color: typeColorOf(sel.type), children: `${typeGlyphOf(sel.type)} ${sel.type}  ` }), _jsx(Text, { wrap: "truncate-end", children: trunc(sel.label, columns - 24) })] }), _jsx(Text, { wrap: "wrap", children: sel.essence }), sel.reason ? _jsx(Text, { color: theme.dim, children: `flagged: ${trunc(sel.reason, columns - 16)}` }) : null, _jsx(Text, { color: theme.dim, children: "read-only \u2014 block actions (accept-demote) need a server endpoint first" })] }));
+    }
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Panel, { title: `review queue (${items.length})${items.length > listH ? ` ${idx + 1}/${items.length}` : ""}`, hot: items.length > 0, minHeight: listH + 2, children: flags === null ? (_jsx(Text, { color: theme.dim, children: "loading\u2026" })) : items.length === 0 ? (_jsx(Text, { color: theme.ok, children: `${glyph.okMark} queue empty — nothing needs review` })) : (items.slice(off, off + listH).map(rowOf)) }), _jsx(Panel, { title: "selected", minHeight: 7, children: detailBody }), confirm ? (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: theme.warn, paddingX: 1, children: [confirm.lines.map((l, i) => (_jsx(Text, { color: theme.warn, children: l }, i))), _jsxs(Text, { children: [_jsx(Text, { color: theme.warn, children: "confirm: " }), _jsx(Text, { color: theme.accent, children: "y" }), _jsx(Text, { color: theme.dim, children: "/N" })] })] })) : (_jsx(Text, { color: theme.dim, children: notice
+                    ? ` ${notice}`
+                    : sel?.kind === "dup"
+                        ? " [j/k] queue  [m/b] merge keep A/B  [K] keep both  — every write asks y/N first"
+                        : " [j/k] queue  — read-only: the pipeline manages these, no operator merge/keep" }))] }));
+}