@higherdev/cli 0.16.0 → 0.17.0

package/README.md

@@ -25,7 +25,7 @@ workspace-map config shapes are migrated automatically when they are read.
 | `hd --help` | Show the HigherDEV banner and usage |
 | `hd status` | Show workspace, ticket, run, and decision status |
 | `hd ticket list` | List tickets |
-| `hd ticket show KEY` | Show one ticket |
+| `hd ticket show KEY [--json]` | Show one ticket (body, acceptance, timeline, messages, PR, runs, decisions) |
 | `hd ticket new [PATH.md]` | Create a ticket from the guided form or a Markdown spec |
 | `hd ticket new --title TITLE [--acceptance TEXT] [options]` | Create a ticket non-interactively |
 | `hd ticket queue KEY` | Queue a complete ticket now |

package/dist/api.js

@@ -58,14 +58,19 @@ export async function queueTicket(key, config = loadConfig()) {
 export async function cancelTicket(key, config = loadConfig()) {
     return request(config, "POST", `/api/w/${config.slug}/tickets/${encodeURIComponent(key)}/cancel`);
 }
-export async function listTicketEvents(key, afterAt, afterId, config = loadConfig()) {
+export async function listTicketRunEvents(key, afterAt, afterId, config = loadConfig()) {
     const query = new URLSearchParams();
     if (afterAt)
         query.set("after_at", afterAt);
     if (afterId)
         query.set("after_id", afterId);
-    const suffix = query.size ? `?${query.toString()}` : "";
-    return request(config, "GET", `/api/w/${config.slug}/tickets/${encodeURIComponent(key)}/events${suffix}`);
+    const suffix = query.size ? `&${query.toString()}` : "";
+    const result = await request(config, "GET", `/api/w/${config.slug}/tickets/${encodeURIComponent(key)}/events?stream=1${suffix}`);
+    const runs = new Map((result.runs ?? []).map((run) => [run.id, run]));
+    return { ...result, events: result.events.map((event) => ({ ...event, run: runs.get(event.run_id) })) };
+}
+export async function listTicketStory(key, config = loadConfig()) {
+    return request(config, "GET", `/api/w/${config.slug}/tickets/${encodeURIComponent(key)}/events`);
 }
 export async function postMessage(fields, config = loadConfig()) {
     return request(config, "POST", `/api/w/${config.slug}/messages`, fields);

package/dist/index.js

@@ -1,13 +1,14 @@
 #!/usr/bin/env node
 import { realpathSync } from "node:fs";
 import { pathToFileURL } from "node:url";
-import { approveEpic, answerDecision, cancelTicket, createEpic, deleteAgent, deleteEpic, getStatus, getWorkspace, listAgents, listEpics, listHostEnv, listMessages, listWorkspaceEnv, listTicketEvents, listTickets, listWorkspaces, postMessage, queueTicket, removeWorkspaceEnv, removeHostEnv, setPaused, setWorkspaceEnv, setHostEnv, showTicket, updateAgent, updateCaps, } from "./api.js";
+import { approveEpic, answerDecision, cancelTicket, createEpic, deleteAgent, deleteEpic, getStatus, getWorkspace, listAgents, listEpics, listHostEnv, listMessages, listWorkspaceEnv, listTicketRunEvents, listTickets, listWorkspaces, postMessage, queueTicket, removeWorkspaceEnv, removeHostEnv, setPaused, setWorkspaceEnv, setHostEnv, showTicket, updateAgent, updateCaps, } from "./api.js";
 import { initHost, parseHostFlags } from "./host.js";
 import { login, parseLoginFlags } from "./login.js";
 import { loadConfig } from "./config.js";
 import { epicProgressRows, readEpicSpec } from "./epics.js";
 import { banner, c, statusChip, table, truncate, usage } from "./out.js";
 import { ticketNew } from "./ticket-commands.js";
+import { ticketViewLines } from "./tui/ticket-view.js";
 import { agentAdd, AGENT_ADD_USAGE } from "./agent-commands.js";
 import { WORKSPACE_USAGE, workspaceGrantRunnerAccess, workspaceNew, workspaceRotateKey, workspaceSet, workspaceUse } from "./workspace-commands.js";
 import { defaultGh, hasWriteRepoPermission, HDX_RUNNER_GH_USER, requireAdminRepo, runnerRepoPermission } from "./workspace-preflight.js";
@@ -54,7 +55,8 @@ function printTickets(tickets) {
     }
     console.log(table(["KEY", "STATUS", "PROVIDER", "TITLE", "WHY"], tickets.map((ticket) => [
         c.bold(ticket.key), statusChip(ticket.status), ticket.provider ?? c.dim("-"),
-        truncate(ticket.title, 48), ticket.stuck_reason ? c.yellow(truncate(ticket.stuck_reason, 40)) : "",
+        truncate(ticket.title, 48), ticket.latest_headline ? c.yellow(truncate(ticket.latest_headline, 40))
+            : ticket.stuck_reason ? c.yellow(truncate(ticket.stuck_reason, 40)) : "",
     ])));
 }
 async function cmdStatus() {
@@ -85,23 +87,31 @@ async function cmdTicket(argv, deps = {}) {
         return;
     }
     if (action === "show") {
-        const key = rest[0];
-        if (!key)
-            fail("usage: hd ticket show KEY");
-        const { ticket } = await showTicket(key);
-        console.log(`${c.bold(ticket.key)}  ${statusChip(ticket.status)}  ${ticket.title}`);
-        if (ticket.stuck_reason)
-            console.log(`stuck: ${ticket.stuck_reason}`);
-        if (ticket.provider)
-            console.log(`provider: ${ticket.provider}`);
-        if (ticket.area)
-            console.log(`area: ${ticket.area}`);
-        if (ticket.pr_url)
-            console.log(`pr: ${ticket.pr_url}`);
-        if (ticket.branch)
-            console.log(`branch: ${ticket.branch}`);
-        if (ticket.body_md)
-            console.log(`\n${ticket.body_md}`);
+        const parsed = flags(rest);
+        const key = parsed.rest[0];
+        if (!key || parsed.rest.length !== 1)
+            fail("usage: hd ticket show KEY [--json]");
+        const data = await showTicket(key.toUpperCase());
+        if (parsed.bools.has("json")) {
+            console.log(JSON.stringify(data));
+            return;
+        }
+        const { ticket, pr, events, runs, messages, decisions } = data;
+        const width = process.stdout.columns && process.stdout.columns > 0 ? process.stdout.columns : 80;
+        for (const line of ticketViewLines({
+            ...ticket,
+            stuck: ticket.stuck_reason,
+            pr,
+            timeline: events,
+            messages,
+            runs: runs.map((run) => ({
+                id: run.id, kind: run.kind, provider: run.provider, status: run.status,
+                summary: run.summary, elapsed_ms: run.elapsed_ms,
+            })),
+            decisions,
+        }, width)) {
+            console.log(line.text);
+        }
         return;
     }
     if (action === "new") {
@@ -182,7 +192,7 @@ async function cmdLogs(argv) {
     let afterId;
     const follow = bools.has("follow");
     async function tick() {
-        const { events } = await listTicketEvents(key, afterAt, afterId);
+        const { events } = await listTicketRunEvents(key, afterAt, afterId);
         let printed = false;
         for (const event of events) {
             if (seen.has(event.id))

package/dist/out.js

@@ -64,7 +64,7 @@ export function usage() {
     return [
         c.bold("Usage"),
         `  ${c.blue("hd status")}                         workspace overview`,
-        `  ${c.blue("hd ticket list | show | new [PATH] | queue | cancel")} ticket operations`,
+        `  ${c.blue("hd ticket list | show KEY [--json] | new [PATH] | queue | cancel")} ticket operations`,
         `  ${c.blue("hd epic new PATH | list | approve | rm")} epic operations`,
         `  ${c.blue("hd plan")}                           use /architect in the TUI`,
         `  ${c.blue("hd workspace ls | use | new | set | rotate-key | grant-runner-access")} workspace operations`,

package/dist/tui/App.js

@@ -13,6 +13,7 @@ import { Cockpit, StreamPanel, boardTicketIds, nextCursor } from "./Dashboard.js
 import { DecisionPanel, decisionRows } from "./Decision.js";
 import { COMMANDS, Help } from "./Help.js";
 import { AgentsPanel, BoardPanel, FeedPanel, InboxPanel, TicketPanel, inboxEntries } from "./Panels.js";
+import { sectionAt, ticketScrollOffset, ticketViewLines, toggleSection } from "./ticket-view.js";
 import { SettingsPanel } from "./Settings.js";
 import { Splash } from "./Splash.js";
 import TextInput from "./TextInput.js";
@@ -22,6 +23,7 @@ import { planLayout, splitPanels } from "./layout.js";
 import { parseLine } from "./parse.js";
 import { configuredSlugs, acknowledgeInbox, approveEpic, cancelTicket, createEpicFromFile, decisionOptions, deleteAgent, deleteEpic, loadLiveEvents, listWorkspaceEnv, loadTicketDetail, pollSnapshot, postAgentMessage, postTicketMessage, queueTicket, resolveDecision, selectDecision, setWorkspacePaused, switchWorkspace, updateAgent, updateProviderCap, updateWorkspace, waitForReply, } from "./data.js";
 import { inputActive, promptPlaceholder, QUEUED_STEP, REPLY_WAIT_MS, settleChatReply } from "./chat-wait.js";
+import { answeredLine, decisionHeaderIndex, decisionIdAt, moveDecisionFocus, nextUnanswered, resolveDecisionAnswer, } from "./decide-nav.js";
 import { EARLIER_PAGE } from "./inbox.js";
 import { editFor, editableKeys, nextValue, seedFor, settingsRows } from "./settings-model.js";
 import { appendLines, runLabels, toStreamLines } from "./stream.js";
@@ -48,14 +50,20 @@ export function App({ initial }) {
     const [busy, setBusy] = useState(false);
     const [notice, setNotice] = useState(null);
     const [ticketKey, setTicketKey] = useState(null);
+    const [ticketOffset, setTicketOffset] = useState(0);
+    const [ticketCollapsed, setTicketCollapsed] = useState([]);
     const [ready, setReady] = useState(false);
     const [stream, setStream] = useState([]);
     const [logsFilter, setLogsFilter] = useState(null);
+    const [rawLogs, setRawLogs] = useState(false);
     const [cursor, setCursor] = useState(null);
     const [started, setStarted] = useState(false);
     const [field, setField] = useState(null);
     const [editing, setEditing] = useState(null);
     const [inboxFocus, setInboxFocus] = useState(0);
+    const [selectedDecisionId, setSelectedDecisionId] = useState(initial.board.decisions[0]?.id ?? null);
+    const [answering, setAnswering] = useState(null);
+    const focusAfterAnswer = useRef(null);
     const [earlierLimit, setEarlierLimit] = useState(EARLIER_PAGE);
     const earlierLimitRef = useRef(EARLIER_PAGE);
     earlierLimitRef.current = earlierLimit;
@@ -94,7 +102,9 @@ export function App({ initial }) {
         if (!loads.current.isCurrent(token))
             return;
         setWorkspace(snapshot.workspace);
-        setBoard(snapshot.board);
+        setBoard((current) => ({ ...snapshot.board, tickets: snapshot.board.tickets.map((ticket) => ({
+                ...ticket, timeline: current.tickets.find((row) => row.id === ticket.id)?.timeline,
+            })) }));
         setFeed(snapshot.feed);
     }, []);
     useEffect(() => {
@@ -119,13 +129,17 @@ export function App({ initial }) {
             if (logsFilter)
                 for (const event of events)
                     if (!eventLabels.has(event.run_id)) {
-                        eventLabels.set(event.run_id, { runId: event.run_id, agent: logsFilter, ticket: logsFilter });
+                        const run = event.run;
+                        eventLabels.set(event.run_id, { runId: event.run_id, agent: run?.agent_name ?? logsFilter,
+                            ticket: logsFilter, kind: run?.kind ?? "run", status: run?.status ?? "running",
+                            attempt: run?.attempt ?? 1, startedAt: run?.started_at ?? event.at,
+                            endedAt: run?.ended_at ?? null, summary: run?.summary ?? null });
                     }
-            setStream((prior) => appendLines(prior, toStreamLines(events, eventLabels)));
+            setStream((prior) => appendLines(prior, toStreamLines(events, eventLabels, rawLogs)));
         })
             .catch(() => { });
-    }, [liveRunIds, board, config, labels, workspace.id, logsFilter]);
-    useEffect(() => setStream([]), [logsFilter]);
+    }, [liveRunIds, board, config, labels, workspace.id, logsFilter, rawLogs]);
+    useEffect(() => setStream([]), [logsFilter, rawLogs]);
     const say = useCallback((speaker, body, steps) => {
         setMessages((prior) => [...prior, { id: nextId(), speaker, body, steps, done: true }]);
     }, []);
@@ -134,7 +148,7 @@ export function App({ initial }) {
     const settingsOrder = useMemo(() => editableKeys(settings), [settings]);
     const browsing = mode === "browse" && draft.length === 0 && cursor !== null;
     const configuring = view === "settings" && !editing;
-    const inbox = useMemo(() => inboxEntries(board, width), [board, width]);
+    const inbox = useMemo(() => inboxEntries(board, width, answering), [board, width, answering]);
     const moveCursor = useCallback((delta) => {
         if (!order.length)
             return false;
@@ -154,11 +168,32 @@ export function App({ initial }) {
         return true;
     }, [settingsOrder]);
     const moveInbox = useCallback((delta) => {
-        setInboxFocus((current) => Math.max(0, Math.min(inbox.length - 1, current + delta)));
-    }, [inbox.length]);
+        setInboxFocus((current) => {
+            const next = moveDecisionFocus(inbox, current, delta);
+            const id = decisionIdAt(inbox, next);
+            if (id)
+                setSelectedDecisionId(id);
+            return next;
+        });
+    }, [inbox]);
     useEffect(() => {
         setInboxFocus((current) => Math.max(0, Math.min(inbox.length - 1, current)));
     }, [inbox.length]);
+    useEffect(() => {
+        if (selectedDecisionId && board.decisions.some((decision) => decision.id === selectedDecisionId))
+            return;
+        setSelectedDecisionId(board.decisions[0]?.id ?? null);
+        setAnswering((current) => (current && board.decisions.some((decision) => decision.id === current) ? current : null));
+    }, [board.decisions, selectedDecisionId]);
+    useEffect(() => {
+        const id = focusAfterAnswer.current;
+        if (!id)
+            return;
+        const header = decisionHeaderIndex(inbox, id);
+        if (header >= 0)
+            setInboxFocus(header);
+        focusAfterAnswer.current = null;
+    }, [inbox]);
     useEffect(() => {
         if (view !== "inbox")
             return;
@@ -175,6 +210,38 @@ export function App({ initial }) {
     const refresh = useCallback(async () => {
         await refreshRef.current?.();
     }, []);
+    const submitDecision = useCallback(async (id, text) => {
+        const decision = board.decisions.find((row) => row.id === id);
+        if (!decision) {
+            setNotice("Nothing is waiting on a decision.");
+            setAnswering(null);
+            return;
+        }
+        const answer = resolveDecisionAnswer(decision, text);
+        if (!answer) {
+            setNotice("Type a number or your answer.");
+            return;
+        }
+        const next = nextUnanswered(board.decisions, decision.id);
+        const line = answeredLine(board.decisions, board.tickets, decision, answer);
+        setBusy(true);
+        try {
+            await resolveDecision(config, decision.id, answer);
+            say("system", line);
+            setAnswering(null);
+            setSelectedDecisionId(next?.id ?? null);
+            focusAfterAnswer.current = next?.id ?? null;
+            if (next)
+                setView("inbox");
+            await refresh();
+        }
+        catch (error) {
+            setNotice(error instanceof Error ? error.message : String(error));
+        }
+        finally {
+            setBusy(false);
+        }
+    }, [board, config, refresh, say]);
     const applyEdit = useCallback(async (key, raw) => {
         const row = settings.find((entry) => entry.key === key);
         if (!row)
@@ -217,6 +284,8 @@ export function App({ initial }) {
             setStream([]);
             setLogsFilter(null);
             acknowledgedMessages.current.clear();
+            setAnswering(null);
+            setSelectedDecisionId(snapshot.board.decisions[0]?.id ?? null);
             setEarlierLimit(EARLIER_PAGE);
             earlierLimitRef.current = EARLIER_PAGE;
             setCursor(null);
@@ -254,6 +323,33 @@ export function App({ initial }) {
             }
         })();
     }, [config]);
+    const openTicket = useCallback(async (key) => {
+        setTicketKey(key);
+        setView("ticket");
+        setTicketOffset(0);
+        setTicketCollapsed([]);
+        setBusy(true);
+        try {
+            const { ticket: detail } = await loadTicketDetail(config, key);
+            setBoard((prior) => ({ ...prior,
+                tickets: prior.tickets.map((ticket) => ticket.id === detail.id ? { ...ticket, ...detail } : ticket) }));
+        }
+        catch (error) {
+            setNotice(error instanceof Error ? error.message : String(error));
+        }
+        finally {
+            setBusy(false);
+        }
+    }, [config]);
+    const visibleStory = ticketKey ? board.tickets.find((ticket) => ticket.key === ticketKey) : null;
+    useEffect(() => {
+        if (view !== "ticket" || !ticketKey || !visibleStory?.latest_headline
+            || visibleStory.timeline?.[0]?.headline === visibleStory.latest_headline)
+            return;
+        void loadTicketDetail(config, ticketKey).then(({ ticket: detail }) => setBoard((prior) => ({ ...prior,
+            tickets: prior.tickets.map((ticket) => ticket.id === detail.id ? { ...ticket, ...detail } : ticket) })))
+            .catch((error) => setNotice(error instanceof Error ? error.message : String(error)));
+    }, [view, ticketKey, visibleStory?.latest_headline, visibleStory?.timeline, config]);
     const run = useCallback(async (raw) => {
         const text = raw.trim();
         if (view === "settings") {
@@ -280,13 +376,39 @@ export function App({ initial }) {
             }
         }
         if (!text) {
+            if (answering) {
+                setNotice("Type a number or your answer.");
+                return;
+            }
+            if (view === "ticket" && ticketKey) {
+                const current = board.tickets.find((row) => row.key === ticketKey);
+                if (current) {
+                    const lines = ticketViewLines(current, Math.max(20, width), ticketCollapsed);
+                    setTicketCollapsed(toggleSection(ticketCollapsed, sectionAt(lines, ticketOffset)));
+                }
+                return;
+            }
+            const focusedId = selectedDecisionId ?? decisionIdAt(inbox, inboxFocus);
+            if (view === "inbox" && focusedId && board.decisions.some((decision) => decision.id === focusedId)) {
+                setSelectedDecisionId(focusedId);
+                setAnswering(focusedId);
+                setView("inbox");
+                return;
+            }
             const selected = board.tickets.find((ticket) => ticket.id === selectedRef.current);
             if (browsing && selected) {
-                setTicketKey(selected.key);
-                setView("ticket");
+                await openTicket(selected.key);
             }
             return;
         }
+        if (answering) {
+            history.current.push(text);
+            historyAt.current = -1;
+            setDraft("");
+            setNotice(null);
+            await submitDecision(answering, text);
+            return;
+        }
         history.current.push(text);
         historyAt.current = -1;
         setDraft("");
@@ -311,8 +433,11 @@ export function App({ initial }) {
                 return;
             case "view":
                 setView(action.view);
-                if (action.view === "inbox")
-                    setInboxFocus(0);
+                if (action.view === "inbox") {
+                    const header = selectedDecisionId ? decisionHeaderIndex(inbox, selectedDecisionId) : 0;
+                    setInboxFocus(header >= 0 ? header : 0);
+                    setAnswering(null);
+                }
                 if (action.view === "board" && order.length) {
                     const next = selectedRef.current && order.includes(selectedRef.current) ? selectedRef.current : order[0];
                     selectedRef.current = next;
@@ -398,22 +523,7 @@ export function App({ initial }) {
                 }
                 return;
             case "ticket":
-                setTicketKey(action.key);
-                setView("ticket");
-                setBusy(true);
-                try {
-                    const { ticket: detail } = await loadTicketDetail(config, action.key);
-                    setBoard((prior) => ({
-                        ...prior,
-                        tickets: prior.tickets.map((ticket) => ticket.id === detail.id ? { ...ticket, ...detail } : ticket),
-                    }));
-                }
-                catch (error) {
-                    setNotice(error instanceof Error ? error.message : String(error));
-                }
-                finally {
-                    setBusy(false);
-                }
+                await openTicket(action.key);
                 return;
             case "epic-new":
                 setBusy(true);
@@ -574,10 +684,11 @@ export function App({ initial }) {
                 return;
             case "logs":
                 setLogsFilter(action.key);
-                say("system", action.key ? `Activity filtered to ${action.key}.` : "Activity filter cleared.");
+                setRawLogs(action.raw);
+                say("system", `${action.raw ? "Raw" : "Narrated"} activity${action.key ? ` filtered to ${action.key}` : " filter cleared"}.`);
                 return;
             case "decide": {
-                const focused = inbox[inboxFocus]?.key.split(":")[0] ?? null;
+                const focused = selectedDecisionId ?? decisionIdAt(inbox, inboxFocus);
                 const decision = selectDecision(board.decisions, action.target, focused);
                 if (!decision) {
                     setNotice(action.target ? `No decision matches ${action.target}.` : "Nothing is waiting on a decision.");
@@ -587,25 +698,16 @@ export function App({ initial }) {
                     setNotice("Skipping decisions is not available through the HDX API. Answer it instead.");
                     return;
                 }
-                const options = decisionOptions(decision);
-                const option = /^\d+$/.test(action.answer) ? options[Number(action.answer) - 1] : undefined;
-                const answer = option ?? action.answer;
-                if (!answer) {
-                    setNotice("Answer it with /decide 1 or /decide <your answer>.");
+                if (!action.answer) {
+                    setSelectedDecisionId(decision.id);
+                    setAnswering(decision.id);
+                    setView("inbox");
+                    const header = decisionHeaderIndex(inbox, decision.id);
+                    if (header >= 0)
+                        setInboxFocus(header);
                     return;
                 }
-                setBusy(true);
-                try {
-                    await resolveDecision(config, decision.id, answer);
-                    say("system", `Answered: ${answer}`);
-                    await refresh();
-                }
-                catch (error) {
-                    setNotice(error instanceof Error ? error.message : String(error));
-                }
-                finally {
-                    setBusy(false);
-                }
+                await submitDecision(decision.id, action.answer);
                 return;
             }
             case "help":
@@ -635,12 +737,16 @@ export function App({ initial }) {
                 return;
         }
     }, [view, settings, applyEdit, board, browsing, mode, say, askAgent, order, settingsOrder, changeWorkspace,
-        config, refresh, suspendTerminal, exit, inbox, inboxFocus]);
+        config, refresh, suspendTerminal, exit, inbox, inboxFocus, openTicket, answering, selectedDecisionId,
+        submitDecision, ticketKey, ticketCollapsed, ticketOffset, width]);
     useInput((input, key) => {
         if (key.ctrl && input === "c")
             exit();
     });
     const decisions = board.decisions;
+    const answeringDecision = answering ? decisions.find((decision) => decision.id === answering) : null;
+    const answeringOptions = answeringDecision ? decisionOptions(answeringDecision) : [];
+    const answeringNumber = answeringDecision ? decisions.findIndex((decision) => decision.id === answering) + 1 : 0;
     const waiting = decisions.length;
     const announced = useRef(0);
     useEffect(() => {
@@ -671,13 +777,21 @@ export function App({ initial }) {
                     if (item.message.panel === "help")
                         return _jsx(Help, { width: width }, item.key);
                     return _jsx(Bubble, { message: item.message, width: width }, item.key);
-                } }), splash ? (_jsx(Splash, { columns: columns, rows: rows, width: width, ready: ready, helpFull: plan.helpFull, animate: plan.fits, onDone: () => setReady(true) })) : null, _jsxs(Box, { flexDirection: "column", width: width, children: [view === "board" && plan.panels > 0 ? _jsx(BoardPanel, { board: board, width: width, rows: plan.panels, cursor: cursor }) : null, view === "agents" && plan.panels > 0 ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(AgentsPanel, { board: board, width: width, rows: agentsView.top }), agentsView.bottom > 0 ? _jsxs(_Fragment, { children: [_jsx(Box, { height: 1 }), _jsx(StreamPanel, { lines: stream, width: width, rows: agentsView.bottom, live: running > 0 })] }) : null] })) : null, view === "feed" && plan.panels > 0 ? _jsx(FeedPanel, { entries: feed, width: width, rows: plan.panels }) : null, view === "settings" && plan.panels > 0 ? _jsx(SettingsPanel, { entries: settings, width: width, rows: plan.panels, title: "Settings", cursor: field, editing: editing }) : null, view === "inbox" && plan.panels > 0 ? _jsx(InboxPanel, { board: board, width: width, rows: plan.panels, focus: inboxFocus }) : null, view === "ticket" && plan.panels > 0 ? ticket
-                        ? _jsx(TicketPanel, { ticket: ticket, width: width, rows: plan.panels })
-                        : _jsxs(Text, { color: UI.warn, children: ["No ticket ", ticketKey, " here."] }) : null, view === "home" && plan.cockpit > 0 ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(Cockpit, { board: board, width: width, rows: plan.cockpit, cursor: cursor }), _jsx(Box, { height: 1 }), _jsx(StreamPanel, { lines: stream, width: width, rows: plan.stream, live: running > 0 })] })) : null, inFlight.map((message) => _jsx(Bubble, { message: message, width: width }, message.id)), _jsx(DecisionPanel, { decisions: decisions, board: board, width: width, rows: plan.decision }), notice ? _jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: UI.warn, children: notice }) }) : null, _jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: UI.text, bold: true, children: workspace.slug }), _jsxs(Text, { color: UI.dim, children: [" ", workspace.repo, " "] }), _jsx(Text, { color: live === "live" ? UI.accent : UI.dim, children: "\u25CF " }), _jsxs(Text, { color: UI.dim, children: [live === "live" ? "5s poll" : live, " "] }), _jsx(Text, { color: UI.dim, children: running ? `${running} running ` : "" }), board.decisions.length ? _jsxs(Text, { color: UI.warn, children: [board.decisions.length, " decisions "] }) : null, workspace.paused ? _jsx(Text, { color: UI.warn, children: "paused " }) : null, logsFilter ? _jsxs(Text, { color: UI.warn, children: ["logs ", logsFilter, " "] }) : null, _jsxs(Text, { color: UI.dim, wrap: "truncate", children: ["\u00B7 ", mode, view === "inbox" ? " ↑↓ scroll" : cursor && selected ? ` ${selected.key} ↑↓ move · enter opens · esc leaves` : ""] })] }), _jsx(Box, { children: _jsx(TextInput, { value: draft, onChange: (next) => {
+                } }), splash ? (_jsx(Splash, { columns: columns, rows: rows, width: width, ready: ready, helpFull: plan.helpFull, animate: plan.fits, onDone: () => setReady(true) })) : null, _jsxs(Box, { flexDirection: "column", width: width, children: [view === "board" && plan.panels > 0 ? _jsx(BoardPanel, { board: board, width: width, rows: plan.panels, cursor: cursor }) : null, view === "agents" && plan.panels > 0 ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(AgentsPanel, { board: board, width: width, rows: agentsView.top }), agentsView.bottom > 0 ? _jsxs(_Fragment, { children: [_jsx(Box, { height: 1 }), _jsx(StreamPanel, { lines: stream, width: width, rows: agentsView.bottom, live: running > 0 })] }) : null] })) : null, view === "feed" && plan.panels > 0 ? _jsx(FeedPanel, { entries: feed, width: width, rows: plan.panels }) : null, view === "settings" && plan.panels > 0 ? _jsx(SettingsPanel, { entries: settings, width: width, rows: plan.panels, title: "Settings", cursor: field, editing: editing }) : null, view === "inbox" && plan.panels > 0 ? _jsx(InboxPanel, { board: board, width: width, rows: plan.panels, focus: inboxFocus, selectedId: selectedDecisionId, answeringId: answering }) : null, view === "ticket" && plan.panels > 0 ? ticket
+                        ? _jsx(TicketPanel, { ticket: ticket, width: width, rows: plan.panels, offset: ticketOffset, collapsed: ticketCollapsed })
+                        : _jsxs(Text, { color: UI.warn, children: ["No ticket ", ticketKey, " here."] }) : null, view === "home" && plan.cockpit > 0 ? (_jsxs(Box, { flexDirection: "column", children: [_jsx(Cockpit, { board: board, width: width, rows: plan.cockpit, cursor: cursor }), _jsx(Box, { height: 1 }), _jsx(StreamPanel, { lines: stream, width: width, rows: plan.stream, live: running > 0 })] })) : null, inFlight.map((message) => _jsx(Bubble, { message: message, width: width }, message.id)), _jsx(DecisionPanel, { decisions: decisions, board: board, width: width, rows: plan.decision, selectedId: selectedDecisionId }), notice ? _jsx(Box, { marginBottom: 1, children: _jsx(Text, { color: UI.warn, children: notice }) }) : null, _jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: UI.text, bold: true, children: workspace.slug }), _jsxs(Text, { color: UI.dim, children: [" ", workspace.repo, " "] }), _jsx(Text, { color: live === "live" ? UI.accent : UI.dim, children: "\u25CF " }), _jsxs(Text, { color: UI.dim, children: [live === "live" ? "5s poll" : live, " "] }), _jsx(Text, { color: UI.dim, children: running ? `${running} running ` : "" }), board.decisions.length ? _jsxs(Text, { color: UI.warn, children: [board.decisions.length, " decisions "] }) : null, workspace.paused ? _jsx(Text, { color: UI.warn, children: "paused " }) : null, logsFilter || rawLogs ? _jsxs(Text, { color: UI.warn, children: ["logs ", rawLogs ? "raw " : "", logsFilter ?? "all", " "] }) : null, _jsxs(Text, { color: UI.dim, wrap: "truncate", children: ["\u00B7 ", mode, answering ? " esc cancels" : view === "ticket" ? " ↑↓ scroll · pgup/pgdn · enter folds" : view === "inbox" ? " ↑↓ decisions · enter answers" : cursor && selected ? ` ${selected.key} ↑↓ move · enter opens · esc leaves` : ""] })] }), _jsx(Box, { children: _jsx(TextInput, { value: draft, onChange: (next) => {
                                 setDraft(next);
                                 if (editingRef.current)
                                     setEditing({ key: editingRef.current.key, draft: next });
-                            }, onSubmit: (value) => void run(value), isActive: inputActive({ busy, pendingChats: inFlight.length }), placeholder: promptPlaceholder({ busy, pendingChats: inFlight.length }), prompt: _jsx(Text, { color: mode === "browse" ? UI.dim : UI.cream, children: mode === "browse" ? "> " : `${mode}> ` }), color: UI.text, onCancel: () => {
+                            }, onSubmit: (value) => void run(value), isActive: inputActive({ busy, pendingChats: inFlight.length }), placeholder: answering
+                                ? (answeringOptions.length ? `1-${answeringOptions.length} or your answer` : "your answer")
+                                : promptPlaceholder({ busy, pendingChats: inFlight.length }), prompt: _jsx(Text, { color: answering || mode !== "browse" ? UI.cream : UI.dim, children: answering ? `answer ${answeringNumber}> ` : mode === "browse" ? "> " : `${mode}> ` }), color: UI.text, onCancel: () => {
+                                if (answering) {
+                                    setAnswering(null);
+                                    setDraft("");
+                                    setNotice(null);
+                                    return;
+                                }
                                 if (editing) {
                                     setEditing(null);
                                     setDraft("");
@@ -692,6 +806,11 @@ export function App({ initial }) {
                                 setCursor(null);
                                 selectedRef.current = null;
                             }, onUp: () => {
+                                if (view === "ticket" && !draft) {
+                                    const count = ticket ? ticketViewLines(ticket, Math.max(20, width), ticketCollapsed).length : 0;
+                                    setTicketOffset((current) => ticketScrollOffset(count, Math.max(1, plan.panels), current - 1));
+                                    return;
+                                }
                                 if (view === "inbox" && !draft) {
                                     moveInbox(-1);
                                     return;
@@ -705,6 +824,11 @@ export function App({ initial }) {
                                 historyAt.current = historyAt.current < 0 ? history.current.length - 1 : Math.max(0, historyAt.current - 1);
                                 setDraft(history.current[historyAt.current] ?? "");
                             }, onDown: () => {
+                                if (view === "ticket" && !draft) {
+                                    const count = ticket ? ticketViewLines(ticket, Math.max(20, width), ticketCollapsed).length : 0;
+                                    setTicketOffset((current) => ticketScrollOffset(count, Math.max(1, plan.panels), current + 1));
+                                    return;
+                                }
                                 if (view === "inbox" && !draft) {
                                     moveInbox(1);
                                     return;
@@ -722,6 +846,16 @@ export function App({ initial }) {
                                     return;
                                 }
                                 setDraft(history.current[historyAt.current] ?? "");
+                            }, onPageUp: () => {
+                                if (view === "ticket" && !draft) {
+                                    const count = ticket ? ticketViewLines(ticket, Math.max(20, width), ticketCollapsed).length : 0;
+                                    setTicketOffset((current) => ticketScrollOffset(count, Math.max(1, plan.panels), current - Math.max(1, plan.panels)));
+                                }
+                            }, onPageDown: () => {
+                                if (view === "ticket" && !draft) {
+                                    const count = ticket ? ticketViewLines(ticket, Math.max(20, width), ticketCollapsed).length : 0;
+                                    setTicketOffset((current) => ticketScrollOffset(count, Math.max(1, plan.panels), current + Math.max(1, plan.panels)));
+                                }
                             } }) })] })] }));
 }
 export { COMMANDS };

package/dist/tui/Dashboard.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Text } from "ink";
 import { BOARD_COLUMNS, epicProgressCaption, epicProgress, statusLabel, statusTone, } from "./data.js";
 import { elapsed, truncate } from "../out/format.js";
@@ -103,7 +103,7 @@ export function BoardColumn({ board, width, rows, cursor, }) {
                 ? [
                     _jsx(Text, { color: UI.dim, children: "No tickets yet." }, "empty"),
                 ]
-                : entries.slice(start, end).map((entry) => entry.kind === "heading" ? (_jsxs(Text, { color: inkColor(statusTone(entry.status)), wrap: "truncate", children: [statusLabel(entry.status), " ", _jsxs(Text, { color: UI.dim, children: ["(", entry.count, ")"] })] }, entry.key)) : (_jsxs(Box, { flexWrap: "nowrap", children: [_jsx(Box, { width: 2, flexShrink: 0, children: _jsx(Text, { color: UI.accent, children: entry.key === cursor ? "›" : " " }) }), _jsx(Box, { width: 8, flexShrink: 0, children: _jsx(Text, { color: UI.text, bold: true, wrap: "truncate", children: entry.ticket.key }) }), _jsx(Text, { color: entry.ticket.stuck ? UI.warn : UI.text, inverse: entry.key === cursor, wrap: "truncate", children: truncate(entry.ticket.title, title - 2) })] }, entry.key)))),
+                : entries.slice(start, end).map((entry) => entry.kind === "heading" ? (_jsxs(Text, { color: inkColor(statusTone(entry.status)), wrap: "truncate", children: [statusLabel(entry.status), " ", _jsxs(Text, { color: UI.dim, children: ["(", entry.count, ")"] })] }, entry.key)) : (_jsxs(Box, { flexWrap: "nowrap", children: [_jsx(Box, { width: 2, flexShrink: 0, children: _jsx(Text, { color: UI.accent, children: entry.key === cursor ? "›" : " " }) }), _jsx(Box, { width: 8, flexShrink: 0, children: _jsx(Text, { color: UI.text, bold: true, wrap: "truncate", children: entry.ticket.key }) }), _jsx(Text, { color: entry.ticket.stuck ? UI.warn : UI.text, inverse: entry.key === cursor, wrap: "truncate", children: truncate(entry.ticket.latest_headline ?? entry.ticket.title, title - 2) })] }, entry.key)))),
         ] }));
 }
 export function AgentsColumn({ board, width, rows, }) {
@@ -127,9 +127,10 @@ export function AgentsColumn({ board, width, rows, }) {
 }
 const KIND_COLOR = {
     error: UI.danger,
+    agent: UI.accent,
     tool: UI.dim,
     status: UI.dim,
-    text: UI.text,
+    raw: UI.dim,
 };
 /**
  * What the agents are doing, as it arrives. The panel is a fixed height on
@@ -146,7 +147,7 @@ export function StreamPanel({ lines, width, rows, live, }) {
                     _jsx(Text, { color: UI.dim, children: live ? "Waiting for the first step." : "Nothing running." }, "empty"),
                 ]
                 : []),
-            ...lines.slice(-budget).map((line) => (_jsxs(Box, { flexWrap: "nowrap", children: [_jsx(Box, { width: name, flexShrink: 0, children: _jsx(Text, { color: UI.dim, wrap: "truncate", children: truncate(line.agent, name - 1) }) }), _jsxs(Text, { color: KIND_COLOR[line.kind], wrap: "truncate", children: [line.kind === "tool" ? "· " : "", truncate(line.title, Math.max(12, width - name - 3))] })] }, line.id))),
+            ...lines.slice(-budget).map((line) => (_jsxs(Box, { flexWrap: "nowrap", children: [_jsx(Box, { width: name, flexShrink: 0, children: _jsx(Text, { color: UI.dim, wrap: "truncate", children: truncate(line.agent, name - 1) }) }), _jsxs(Text, { color: KIND_COLOR[line.kind], wrap: "truncate", children: [line.kind === "tool" ? "· " : "", truncate(line.title, Math.max(12, width - name - 3)), line.count && line.count > 1 ? ` (x${line.count})` : ""] })] }, line.id))),
         ] }));
 }
 /** How many rows the epics strip wants, heading included, or none. */
@@ -154,6 +155,21 @@ export function epicsRows(board, cap = 3) {
     const open = epicProgress(board).filter((row) => row.epic.status !== "done");
     return open.length === 0 ? 0 : Math.min(open.length, cap) + 1;
 }
+export function nowEntries(board) {
+    return board.tickets.filter((ticket) => !["backlog", "merged", "cancelled"].includes(ticket.status))
+        .map((ticket) => ({ key: ticket.key, headline: ticket.latest_headline ?? `${ticket.key}: ${ticket.title}` }));
+}
+function NowStrip({ board, width, rows }) {
+    const entries = nowEntries(board);
+    if (!entries.length || rows < 2)
+        return null;
+    const shown = entries.slice(0, contentRows(rows, entries.length));
+    return _jsx(Panel, { width: width, rows: rows, children: [
+            _jsx(Heading, { text: "Now", note: `${entries.length}` }, "h"),
+            ...shown.map((entry) => _jsx(Text, { color: UI.text, wrap: "truncate", children: entry.headline }, entry.key)),
+            _jsx(More, { count: entries.length - shown.length }, "more"),
+        ] });
+}
 /**
  * Epic progress, above the board it explains. Capped hard: this is the summary
  * line, and the tickets underneath are what you are here to read.
@@ -174,12 +190,13 @@ export function EpicsStrip({ board, width, rows }) {
 export function Cockpit({ board, width, rows, cursor, }) {
     // The epics strip is spent out of the same budget, so adding it shortens the
     // board rather than making the frame taller.
-    const epics = Math.min(epicsRows(board), Math.max(0, rows - 4));
-    const rest = rows - (epics > 0 ? epics + 1 : 0);
+    const now = Math.min(nowEntries(board).length + 1, 4, Math.max(0, rows - 4));
+    const epics = Math.min(epicsRows(board), Math.max(0, rows - now - (now > 0 ? 1 : 0) - 4));
+    const rest = rows - (now > 0 ? now + 1 : 0) - (epics > 0 ? epics + 1 : 0);
     const columns = renderColumns(board, width, rest, cursor);
-    if (epics === 0)
+    if (epics === 0 && now === 0)
         return columns;
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(EpicsStrip, { board: board, width: width, rows: epics }), _jsx(Box, { height: 1 }), columns] }));
+    return (_jsxs(Box, { flexDirection: "column", children: [now > 0 ? _jsxs(_Fragment, { children: [_jsx(NowStrip, { board: board, width: width, rows: now }), _jsx(Box, { height: 1 })] }) : null, epics > 0 ? _jsxs(_Fragment, { children: [_jsx(EpicsStrip, { board: board, width: width, rows: epics }), _jsx(Box, { height: 1 })] }) : null, columns] }));
 }
 function renderColumns(board, width, rows, cursor) {
     const split = splitWidths(width);