wiggum-cli 0.17.0 → 0.17.1

package/dist/repl/command-parser.d.ts

@@ -54,6 +54,11 @@ export declare const REPL_COMMANDS: {
         readonly usage: "/monitor <feature-name>";
         readonly aliases: readonly ["m"];
     };
+    readonly issue: {
+        readonly description: "Browse GitHub issues and start a new spec from one";
+        readonly usage: "/issue [search terms]";
+        readonly aliases: readonly [];
+    };
     readonly agent: {
         readonly description: "Start the autonomous backlog agent";
         readonly usage: "/agent [--dry-run] [--max-items <n>]";

package/dist/repl/command-parser.js

@@ -31,6 +31,11 @@ export const REPL_COMMANDS = {
         usage: '/monitor <feature-name>',
         aliases: ['m'],
     },
+    issue: {
+        description: 'Browse GitHub issues and start a new spec from one',
+        usage: '/issue [search terms]',
+        aliases: [],
+    },
     agent: {
         description: 'Start the autonomous backlog agent',
         usage: '/agent [--dry-run] [--max-items <n>]',

package/dist/tui/app.js

@@ -199,7 +199,8 @@ interviewProps, runProps, agentProps, onComplete, onExit, }) {
             if (!featureName || typeof featureName !== 'string' || !sessionState.provider) {
                 return null; // useEffect will redirect to shell
             }
-            return (_jsx(InterviewScreen, { header: headerElement, featureName: featureName, projectRoot: sessionState.projectRoot, provider: sessionState.provider, model: sessionState.model, scanResult: sessionState.scanResult, specsPath: sessionState.config?.paths.specs, initialReferences: interviewProps?.initialReferences, onComplete: handleInterviewComplete, onCancel: handleInterviewCancel }));
+            return (_jsx(InterviewScreen, { header: headerElement, featureName: featureName, projectRoot: sessionState.projectRoot, provider: sessionState.provider, model: sessionState.model, scanResult: sessionState.scanResult, specsPath: sessionState.config?.paths.specs, initialReferences: screenProps?.initialReferences
+                    ?? interviewProps?.initialReferences, onComplete: handleInterviewComplete, onCancel: handleInterviewCancel }));
         }
         case 'init':
             return (_jsx(InitScreen, { header: headerElement, projectRoot: sessionState.projectRoot, sessionState: sessionState, onComplete: handleInitComplete, onCancel: () => navigate('shell') }));

package/dist/tui/components/IssuePicker.js

@@ -16,14 +16,23 @@ function truncate(text, maxLen) {
         return text;
     return text.slice(0, maxLen - 1) + '\u2026';
 }
+function pad(text, width) {
+    if (text.length >= width)
+        return text.slice(0, width);
+    return text + ' '.repeat(width - text.length);
+}
+// Fixed column widths
+const COL_NUMBER = 6; // " #104 "
+const COL_STATE = 8; // " closed " or "  open  "
+const COL_LABELS = 14; // " enhancement "
+const COL_CHROME = 2; // left + right border
 export function IssuePicker({ issues, repoSlug, onSelect, onCancel, isLoading, error, }) {
     const [selectedIndex, setSelectedIndex] = useState(0);
     const { stdout } = useStdout();
-    const columns = stdout?.columns ?? 80;
+    const termColumns = stdout?.columns ?? 80;
     React.useEffect(() => {
         setSelectedIndex(0);
     }, [issues]);
-    // Handle keyboard input
     useInput((input, key) => {
         if (key.escape) {
             onCancel();
@@ -42,23 +51,23 @@ export function IssuePicker({ issues, repoSlug, onSelect, onCancel, isLoading, e
             return;
         }
     });
-    // Build border strings
     const countSuffix = !isLoading && !error ? ` (${issues.length})` : '';
     const headerLabel = ` GitHub Issues ${box.horizontal} ${repoSlug}${countSuffix} `;
-    const contentWidth = Math.min(Math.max(60, headerLabel.length + 10), columns - 6);
+    const contentWidth = Math.min(Math.max(60, headerLabel.length + 10), termColumns - 6);
     const topBorderFill = contentWidth - headerLabel.length - 1;
     const topBorder = box.topLeft + box.horizontal + headerLabel + box.horizontal.repeat(Math.max(0, topBorderFill)) + box.topRight;
     const bottomBorder = box.bottomLeft + box.horizontal.repeat(contentWidth) + box.bottomRight;
-    // Space budget for title: total width minus number, labels, borders, padding
-    const numberWidth = 6; // " #999 " — enough for 3-digit issues
-    const labelBudget = 24; // space for up to 2 labels
-    const chrome = 4; // borders + padding
-    const titleMaxLen = Math.max(20, contentWidth - numberWidth - labelBudget - chrome);
-    return (_jsxs(Box, { flexDirection: "column", marginLeft: 2, marginTop: 1, children: [_jsx(Text, { dimColor: true, children: topBorder }), isLoading && (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { dimColor: true, children: box.vertical }), _jsx(Text, { children: " " }), _jsx(Spinner, { type: "dots" }), _jsx(Text, { color: colors.yellow, children: " Searching..." }), _jsx(Text, { children: ' '.repeat(Math.max(0, contentWidth - 16)) }), _jsx(Text, { dimColor: true, children: box.vertical })] })), !isLoading && error && (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { dimColor: true, children: box.vertical }), _jsxs(Text, { color: colors.pink, children: [" ", error] }), _jsx(Text, { children: ' '.repeat(Math.max(0, contentWidth - error.length - 1)) }), _jsx(Text, { dimColor: true, children: box.vertical })] })), !isLoading && !error && issues.length === 0 && (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { dimColor: true, children: box.vertical }), _jsx(Text, { dimColor: true, children: " No open issues found" }), _jsx(Text, { children: ' '.repeat(Math.max(0, contentWidth - 21)) }), _jsx(Text, { dimColor: true, children: box.vertical })] })), !isLoading && !error && issues.map((issue, index) => {
+    // Title column gets all remaining space
+    const colTitle = Math.max(20, contentWidth - COL_NUMBER - COL_STATE - COL_LABELS - COL_CHROME);
+    return (_jsxs(Box, { flexDirection: "column", marginLeft: 2, marginTop: 1, children: [_jsx(Text, { dimColor: true, children: topBorder }), isLoading && (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { dimColor: true, children: box.vertical }), _jsx(Text, { children: " " }), _jsx(Spinner, { type: "dots" }), _jsx(Text, { color: colors.yellow, children: " Searching..." }), _jsx(Text, { children: ' '.repeat(Math.max(0, contentWidth - 16)) }), _jsx(Text, { dimColor: true, children: box.vertical })] })), !isLoading && error && (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { dimColor: true, children: box.vertical }), _jsx(Text, { color: colors.pink, children: pad(` ${error}`, contentWidth) }), _jsx(Text, { dimColor: true, children: box.vertical })] })), !isLoading && !error && issues.length === 0 && (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { dimColor: true, children: box.vertical }), _jsx(Text, { dimColor: true, children: pad(' No open issues found', contentWidth) }), _jsx(Text, { dimColor: true, children: box.vertical })] })), !isLoading && !error && issues.map((issue, index) => {
                 const isSelected = index === selectedIndex;
-                const numberText = `#${issue.number}`;
-                const title = truncate(issue.title, titleMaxLen);
-                const labelTags = issue.labels.slice(0, MAX_LABELS).join(' ');
-                return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { dimColor: true, children: box.vertical }), _jsxs(Text, { backgroundColor: isSelected ? colors.yellow : undefined, color: isSelected ? colors.brown : colors.yellow, children: [' ', numberText] }), _jsxs(Text, { backgroundColor: isSelected ? colors.yellow : undefined, color: isSelected ? colors.brown : undefined, children: ['  ', title] }), labelTags && (_jsxs(Text, { backgroundColor: isSelected ? colors.yellow : undefined, color: isSelected ? colors.brown : colors.gray, children: ['  ', labelTags] })), _jsxs(Text, { dimColor: true, children: [' '.repeat(1), box.vertical] })] }, issue.number));
-            }), _jsx(Text, { dimColor: true, children: bottomBorder }), _jsx(Box, { marginLeft: 1, children: _jsxs(Text, { color: colors.gray, children: ['(', '\u2191\u2193 navigate, Enter select, Esc cancel', ')'] }) })] }));
+                const bg = isSelected ? colors.yellow : undefined;
+                const fg = isSelected ? colors.brown : undefined;
+                const numberCell = pad(` #${issue.number}`, COL_NUMBER);
+                const titleCell = pad(` ${truncate(issue.title, colTitle - 1)}`, colTitle);
+                const stateCell = pad(` ${issue.state}`, COL_STATE);
+                const labelText = issue.labels.slice(0, MAX_LABELS).join(' ');
+                const labelCell = pad(` ${truncate(labelText, COL_LABELS - 1)}`, COL_LABELS);
+                return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { dimColor: true, children: box.vertical }), _jsx(Text, { backgroundColor: bg, color: isSelected ? colors.brown : colors.yellow, children: numberCell }), _jsx(Text, { backgroundColor: bg, color: fg, children: titleCell }), _jsx(Text, { backgroundColor: bg, color: isSelected ? colors.brown : issue.state === 'open' ? colors.green : colors.gray, children: stateCell }), _jsx(Text, { backgroundColor: bg, color: isSelected ? colors.brown : colors.gray, children: labelCell }), _jsx(Text, { dimColor: true, children: box.vertical })] }, issue.number));
+            }), _jsx(Text, { dimColor: true, children: bottomBorder }), _jsx(Box, { marginLeft: 1, children: _jsxs(Text, { color: colors.gray, children: ["(", '\u2191\u2193 navigate, Enter select, Esc cancel', ")"] }) })] }));
 }

package/dist/tui/components/StatusLine.d.ts

@@ -15,6 +15,8 @@ export interface StatusLineProps {
     phase?: string;
     /** Path or context info (e.g., working directory or feature name) */
     path?: string;
+    /** Extra trailing segment (e.g., "review: auto") */
+    extra?: string;
 }
 /**
  * StatusLine component
@@ -32,4 +34,4 @@ export interface StatusLineProps {
  * // Renders: Initialize Project │ Analysis (4/5) │ /Users/name/project
  * ```
  */
-export declare function StatusLine({ action, phase, path, }: StatusLineProps): React.ReactElement;
+export declare function StatusLine({ action, phase, path, extra, }: StatusLineProps): React.ReactElement;

package/dist/tui/components/StatusLine.js

@@ -17,11 +17,11 @@ import { theme, colors } from '../theme.js';
  * // Renders: Initialize Project │ Analysis (4/5) │ /Users/name/project
  * ```
  */
-export function StatusLine({ action, phase, path, }) {
+export function StatusLine({ action, phase, path, extra, }) {
     const separator = theme.statusLine.separator;
     // Truncate path if too long (keep last 40 chars)
     const displayPath = path && path.length > 40
         ? '...' + path.slice(-37)
         : path;
-    return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { color: colors.yellow, bold: true, children: action }), phase && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: separator }), _jsx(Text, { children: phase })] })), displayPath && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: separator }), _jsx(Text, { dimColor: true, children: displayPath })] }))] }));
+    return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { color: colors.yellow, bold: true, children: action }), phase && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: separator }), _jsx(Text, { children: phase })] })), displayPath && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: separator }), _jsx(Text, { dimColor: true, children: displayPath })] })), extra && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: separator }), _jsx(Text, { dimColor: true, children: extra })] }))] }));
 }

package/dist/tui/hooks/useAgentOrchestrator.d.ts

@@ -7,6 +7,8 @@
  * Exposes an abort() function for clean shutdown on q/Esc.
  */
 import type { AgentIssueState, AgentLogEntry, ReviewMode } from '../../agent/types.js';
+import { type LoopStatus, type TaskCounts, type ActivityEvent } from '../utils/loop-status.js';
+import { type CommitLogEntry } from '../utils/git-summary.js';
 export type AgentStatus = 'idle' | 'running' | 'complete' | 'error';
 export interface UseAgentOrchestratorOptions {
     projectRoot: string;
@@ -17,12 +19,21 @@ export interface UseAgentOrchestratorOptions {
     reviewMode?: ReviewMode;
     dryRun?: boolean;
 }
+export interface LoopMonitorData {
+    loopStatus: LoopStatus;
+    tasks: TaskCounts;
+    branch: string;
+    recentCommits: CommitLogEntry[];
+    activityEvents: ActivityEvent[];
+    startTime: number;
+}
 export interface UseAgentOrchestratorResult {
     status: AgentStatus;
     activeIssue: AgentIssueState | null;
     queue: AgentIssueState[];
     completed: AgentIssueState[];
     logEntries: AgentLogEntry[];
+    loopMonitor: LoopMonitorData | null;
     error: string | null;
     abort: () => void;
 }

package/dist/tui/hooks/useAgentOrchestrator.js

@@ -10,7 +10,8 @@ import { useState, useEffect, useRef, useCallback } from 'react';
 import { resolveAgentEnv } from '../../agent/resolve-config.js';
 import { createAgentOrchestrator, } from '../../agent/orchestrator.js';
 import { initTracing, flushTracing } from '../../utils/tracing.js';
-import { readCurrentPhase, readLoopStatus, parseLoopLog, parsePhaseChanges, getLoopLogPath, shouldSkipLine, } from '../utils/loop-status.js';
+import { readCurrentPhase, readLoopStatus, parseLoopLog, parsePhaseChanges, parseImplementationPlan, getLoopLogPath, shouldSkipLine, getGitBranch, } from '../utils/loop-status.js';
+import { getRecentCommits } from '../utils/git-summary.js';
 const MAX_LOG_ENTRIES = 500;
 function now() {
     return new Date().toISOString();
@@ -245,6 +246,7 @@ export function useAgentOrchestrator(options) {
     const [queue, setQueue] = useState([]);
     const [completed, setCompleted] = useState([]);
     const [logEntries, setLogEntries] = useState([]);
+    const [loopMonitor, setLoopMonitor] = useState(null);
     const [error, setError] = useState(null);
     const abortRef = useRef(null);
     const startedRef = useRef(false);
@@ -258,24 +260,30 @@ export function useAgentOrchestrator(options) {
             clearInterval(pollingRef.current.interval);
             pollingRef.current = null;
         }
+        setLoopMonitor(null);
     }, []);
     const startLoopPolling = useCallback((featureName) => {
         stopLoopPolling(); // clear any existing polling
+        const startTime = Date.now();
         const state = {
             featureName,
             interval: null,
             lastLogTimestamp: undefined,
             lastPhases: undefined,
         };
-        const poll = () => {
+        // Accumulated activity events across polls
+        const activityEventsAcc = [];
+        const MAX_ACTIVITY = 50;
+        const poll = async () => {
             // Read current phase
-            const phaseLabel = readCurrentPhase(featureName);
-            if (phaseLabel) {
-                setActiveIssue((prev) => prev ? { ...prev, loopPhase: phaseLabel } : prev);
+            const currentPhase = readCurrentPhase(featureName);
+            if (currentPhase) {
+                setActiveIssue((prev) => prev ? { ...prev, loopPhase: currentPhase } : prev);
             }
-            // Read loop status for iteration count
+            // Read loop status for iteration count + token data
+            let loopStatus = null;
             try {
-                const loopStatus = readLoopStatus(featureName);
+                loopStatus = readLoopStatus(featureName);
                 if (loopStatus.iteration > 0) {
                     setActiveIssue((prev) => prev ? { ...prev, loopIterations: loopStatus.iteration } : prev);
                 }
@@ -283,11 +291,26 @@ export function useAgentOrchestrator(options) {
             catch {
                 // Invalid feature name or file not ready — skip
             }
+            // Read task progress
+            let tasks = { tasksDone: 0, tasksPending: 0, e2eDone: 0, e2ePending: 0, planExists: false };
+            try {
+                tasks = await parseImplementationPlan(options.projectRoot, featureName, '.ralph/specs');
+            }
+            catch {
+                // Plan not yet available
+            }
+            // Git info
+            const branch = getGitBranch(options.projectRoot);
+            const recentCommits = getRecentCommits(options.projectRoot, 3);
             // Parse loop log for new events
             const logPath = getLoopLogPath(featureName);
             const logEvents = parseLoopLog(logPath, state.lastLogTimestamp);
             if (logEvents.length > 0) {
                 state.lastLogTimestamp = logEvents[logEvents.length - 1].timestamp + 1;
+                activityEventsAcc.push(...logEvents);
+                if (activityEventsAcc.length > MAX_ACTIVITY) {
+                    activityEventsAcc.splice(0, activityEventsAcc.length - MAX_ACTIVITY);
+                }
                 setLogEntries((prev) => {
                     let next = prev;
                     for (const evt of logEvents) {
@@ -302,6 +325,10 @@ export function useAgentOrchestrator(options) {
                 state.lastPhases = phaseResult.currentPhases;
             }
             if (phaseResult.events.length > 0) {
+                activityEventsAcc.push(...phaseResult.events);
+                if (activityEventsAcc.length > MAX_ACTIVITY) {
+                    activityEventsAcc.splice(0, activityEventsAcc.length - MAX_ACTIVITY);
+                }
                 setLogEntries((prev) => {
                     let next = prev;
                     for (const evt of phaseResult.events) {
@@ -310,12 +337,23 @@ export function useAgentOrchestrator(options) {
                     return next;
                 });
             }
+            // Update loop monitor data
+            if (loopStatus) {
+                setLoopMonitor({
+                    loopStatus,
+                    tasks,
+                    branch,
+                    recentCommits,
+                    activityEvents: [...activityEventsAcc],
+                    startTime,
+                });
+            }
         };
         state.interval = setInterval(poll, 3000);
         pollingRef.current = state;
         // Run first poll immediately
         poll();
-    }, [stopLoopPolling]);
+    }, [stopLoopPolling, options.projectRoot]);
     const abort = useCallback(() => {
         abortRef.current?.abort();
         stopLoopPolling();
@@ -449,5 +487,5 @@ export function useAgentOrchestrator(options) {
             stopLoopPolling();
         };
     }, []); // eslint-disable-line react-hooks/exhaustive-deps -- options are stable from parent
-    return { status, activeIssue, queue, completed, logEntries, error, abort };
+    return { status, activeIssue, queue, completed, logEntries, loopMonitor, error, abort };
 }

package/dist/tui/screens/AgentScreen.d.ts

@@ -1,9 +1,12 @@
 /**
  * AgentScreen - TUI dashboard for the autonomous agent mode
  *
- * Displays issue processing status and an agent log.
+ * Displays issue processing status, a loop monitor, and an agent log.
  * Two-column layout on wide terminals (>=65 cols), single-column on narrow.
  *
+ * When a loop is running, the right panel splits: loop monitor (top) + log (bottom).
+ * When no loop is running, the right panel shows only the agent log.
+ *
  * Wired to the orchestrator via useAgentOrchestrator hook, which
  * interprets tool calls into structured React state. Console is patched
  * on mount to prevent Ink rendering corruption.

package/dist/tui/screens/AgentScreen.js

@@ -2,9 +2,12 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * AgentScreen - TUI dashboard for the autonomous agent mode
  *
- * Displays issue processing status and an agent log.
+ * Displays issue processing status, a loop monitor, and an agent log.
  * Two-column layout on wide terminals (>=65 cols), single-column on narrow.
  *
+ * When a loop is running, the right panel splits: loop monitor (top) + log (bottom).
+ * When no loop is running, the right panel shows only the agent log.
+ *
  * Wired to the orchestrator via useAgentOrchestrator hook, which
  * interprets tool calls into structured React state. Console is patched
  * on mount to prevent Ink rendering corruption.
@@ -14,8 +17,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useCallback, useState, useRef } from 'react';
 import { Box, Text, useInput, useStdout } from 'ink';
 import { AppShell } from '../components/AppShell.js';
-import { colors, phase } from '../theme.js';
+import { ActivityFeed } from '../components/ActivityFeed.js';
+import { colors, phase, theme } from '../theme.js';
 import { useAgentOrchestrator } from '../hooks/useAgentOrchestrator.js';
+import { formatNumber } from '../utils/loop-status.js';
 const NARROW_BREAKPOINT = 65;
 const SECTION_CHAR = '\u2500'; // ─
 function phaseLabel(p, activeIssue) {
@@ -57,12 +62,12 @@ function footerPhase(status, activeIssue, completedCount, cancelling) {
     if (status === 'idle')
         return 'Waiting';
     if (status === 'complete')
-        return `Done — ${completedCount} issue${completedCount === 1 ? '' : 's'} processed`;
+        return `Done \u2014 ${completedCount} issue${completedCount === 1 ? '' : 's'} processed`;
     if (status === 'error')
         return 'Error';
     if (!activeIssue)
         return 'Starting...';
-    const loopDetail = activeIssue.loopPhase ? ` · ${activeIssue.loopPhase}` : '';
+    const loopDetail = activeIssue.loopPhase ? ` \u00b7 ${activeIssue.loopPhase}` : '';
     const iter = activeIssue.loopIterations != null ? ` (iter ${activeIssue.loopIterations})` : '';
     return `#${activeIssue.issueNumber}${loopDetail}${iter}`;
 }
@@ -77,16 +82,49 @@ function SectionSeparator({ width }) {
  * Issues panel content — shared between wide and narrow layouts
  */
 function IssuesPanel({ activeIssue, queue, completed, panelWidth, }) {
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, color: colors.yellow, children: "Active Issue" }), activeIssue ? (_jsxs(Box, { flexDirection: "column", marginLeft: 1, children: [_jsxs(Text, { children: [_jsxs(Text, { color: colors.blue, children: ["#", activeIssue.issueNumber] }), _jsxs(Text, { children: [" ", activeIssue.title] })] }), _jsxs(Text, { dimColor: true, children: [phase.active, " ", phaseLabel(activeIssue.phase, activeIssue), activeIssue.loopIterations != null ? ` (iter ${activeIssue.loopIterations})` : ''] })] })) : (_jsx(Box, { marginLeft: 1, children: _jsx(Text, { dimColor: true, children: "No active issue" }) })), _jsx(SectionSeparator, { width: panelWidth }), _jsxs(Text, { bold: true, color: colors.yellow, children: ["Queue", _jsxs(Text, { dimColor: true, children: [" (", queue.length, ")"] })] }), queue.length === 0 ? (_jsx(Box, { marginLeft: 1, children: _jsx(Text, { dimColor: true, children: "Empty" }) })) : (queue.slice(0, 5).map((issue) => (_jsx(Box, { marginLeft: 1, children: _jsxs(Text, { children: [_jsxs(Text, { dimColor: true, children: ["#", issue.issueNumber] }), _jsxs(Text, { children: [" ", issue.title] })] }) }, issue.issueNumber)))), queue.length > 5 && (_jsx(Box, { marginLeft: 1, children: _jsxs(Text, { dimColor: true, children: ["...and ", queue.length - 5, " more"] }) })), _jsx(SectionSeparator, { width: panelWidth }), _jsxs(Text, { bold: true, color: colors.yellow, children: ["Completed", _jsxs(Text, { dimColor: true, children: [" (", completed.length, ")"] })] }), completed.length === 0 ? (_jsx(Box, { marginLeft: 1, children: _jsx(Text, { dimColor: true, children: "None yet" }) })) : (completed.slice(-5).map((issue) => (_jsxs(Box, { marginLeft: 1, children: [_jsxs(Text, { children: [_jsx(Text, { color: issue.error ? colors.pink : colors.green, children: issue.error ? phase.error : phase.complete }), _jsxs(Text, { dimColor: true, children: [" #", issue.issueNumber] }), _jsxs(Text, { children: [" ", issue.title] })] }), issue.prUrl && (_jsxs(Text, { dimColor: true, children: ["  \u2514 PR: ", issue.prUrl] }))] }, issue.issueNumber))))] }));
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, color: colors.yellow, children: "Active Issue" }), activeIssue ? (_jsxs(Box, { flexDirection: "column", marginLeft: 1, children: [_jsxs(Text, { children: [_jsxs(Text, { color: colors.blue, children: ["#", activeIssue.issueNumber] }), _jsxs(Text, { children: [" ", activeIssue.title] })] }), _jsxs(Text, { dimColor: true, children: [phase.active, " ", phaseLabel(activeIssue.phase, activeIssue), activeIssue.loopIterations != null ? ` (iter ${activeIssue.loopIterations})` : ''] })] })) : (_jsx(Box, { marginLeft: 1, children: _jsx(Text, { dimColor: true, children: "No active issue" }) })), _jsx(SectionSeparator, { width: panelWidth }), _jsxs(Text, { bold: true, color: colors.yellow, children: ["Queue", _jsxs(Text, { dimColor: true, children: [" (", queue.length, ")"] })] }), queue.length === 0 ? (_jsx(Box, { marginLeft: 1, children: _jsx(Text, { dimColor: true, children: "Empty" }) })) : (queue.slice(0, 5).map((issue) => (_jsx(Box, { marginLeft: 1, children: _jsxs(Text, { children: [_jsxs(Text, { dimColor: true, children: ["#", issue.issueNumber] }), _jsxs(Text, { children: [" ", issue.title] })] }) }, issue.issueNumber)))), queue.length > 5 && (_jsx(Box, { marginLeft: 1, children: _jsxs(Text, { dimColor: true, children: ["...and ", queue.length - 5, " more"] }) })), _jsx(SectionSeparator, { width: panelWidth }), _jsxs(Text, { bold: true, color: colors.yellow, children: ["Completed", _jsxs(Text, { dimColor: true, children: [" (", completed.length, ")"] })] }), completed.length === 0 ? (_jsx(Box, { marginLeft: 1, children: _jsx(Text, { dimColor: true, children: "None yet" }) })) : (completed.slice(-5).map((issue) => (_jsxs(Box, { marginLeft: 1, children: [_jsxs(Text, { children: [_jsx(Text, { color: issue.error ? colors.pink : colors.green, children: issue.error ? phase.error : phase.complete }), _jsxs(Text, { dimColor: true, children: [" #", issue.issueNumber] }), _jsxs(Text, { children: [" ", issue.title] })] }), issue.prUrl && (_jsxs(Text, { dimColor: true, children: ["  \\u2514 PR: ", issue.prUrl] }))] }, issue.issueNumber))))] }));
 }
 /**
- * Log panel content — shared between wide and narrow layouts
+ * Log panel content — shared between wide and narrow layouts.
+ * tailSize controls how many entries to show (shrinks when monitor is visible).
  */
-const LOG_TAIL_SIZE = 20;
-function LogPanel({ logEntries }) {
-    const visible = logEntries.slice(-LOG_TAIL_SIZE);
+function LogPanel({ logEntries, tailSize = 20 }) {
+    const visible = logEntries.slice(-tailSize);
     return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, color: colors.yellow, children: "Agent Log" }), visible.length === 0 ? (_jsx(Text, { dimColor: true, children: "Waiting for agent activity..." })) : (visible.map((entry, index) => (_jsx(Box, { children: _jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: entry.timestamp.slice(11, 19) }), _jsx(Text, { children: " " }), _jsx(Text, { color: logLevelColor(entry.level), children: entry.message })] }) }, `${entry.timestamp}-${index}`))))] }));
 }
+/**
+ * ProgressBar — inline progress indicator
+ */
+function ProgressBar({ percent, width = 18 }) {
+    const safePercent = Math.max(0, Math.min(100, percent));
+    const filled = Math.round((safePercent / 100) * width);
+    const empty = Math.max(0, width - filled);
+    return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { color: colors.green, children: '\u2588'.repeat(filled) }), _jsx(Text, { dimColor: true, children: '\u2591'.repeat(empty) })] }));
+}
+function formatDuration(start) {
+    const seconds = Math.max(0, Math.floor((Date.now() - start) / 1000));
+    const mins = Math.floor(seconds / 60);
+    const secs = seconds % 60;
+    return `${mins}:${String(secs).padStart(2, '0')}`;
+}
+const PROGRESS_LABEL_WIDTH = 17;
+const padLabel = (label) => label.padEnd(PROGRESS_LABEL_WIDTH);
+/**
+ * Loop Monitor panel — shows progress, commits, and activity for the active loop
+ */
+function LoopMonitorPanel({ monitor, featureName, panelWidth, }) {
+    const { loopStatus, tasks, branch, recentCommits, activityEvents, startTime } = monitor;
+    const totalTokens = loopStatus.tokensInput + loopStatus.tokensOutput + loopStatus.cacheCreate + loopStatus.cacheRead;
+    const totalTasks = tasks.tasksDone + tasks.tasksPending;
+    const totalE2e = tasks.e2eDone + tasks.e2ePending;
+    const totalAll = totalTasks + totalE2e;
+    const doneAll = tasks.tasksDone + tasks.e2eDone;
+    const percentTasks = totalTasks > 0 ? Math.round((tasks.tasksDone / totalTasks) * 100) : 0;
+    const percentE2e = totalE2e > 0 ? Math.round((tasks.e2eDone / totalE2e) * 100) : 0;
+    const percentAll = totalAll > 0 ? Math.round((doneAll / totalAll) * 100) : 0;
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { bold: true, color: colors.yellow, children: ["Loop Monitor ", _jsxs(Text, { dimColor: true, children: ["\\u2014 ", featureName] })] }), _jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { children: "Phase: " }), _jsx(Text, { color: colors.yellow, children: loopStatus.phase }), _jsx(Text, { dimColor: true, children: theme.statusLine.separator }), _jsx(Text, { children: "Iter: " }), _jsx(Text, { color: colors.green, children: loopStatus.iteration }), _jsxs(Text, { dimColor: true, children: ["/", loopStatus.maxIterations || '-'] }), _jsx(Text, { dimColor: true, children: theme.statusLine.separator }), _jsx(Text, { children: "Branch: " }), _jsx(Text, { color: colors.blue, children: branch })] }), totalTokens > 0 && (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { children: "Tokens: " }), _jsx(Text, { color: colors.pink, children: formatNumber(totalTokens) }), _jsxs(Text, { dimColor: true, children: [" (in:", formatNumber(loopStatus.tokensInput), " out:", formatNumber(loopStatus.tokensOutput), " cache:", formatNumber(loopStatus.cacheRead), ")"] }), _jsx(Text, { dimColor: true, children: theme.statusLine.separator }), _jsxs(Text, { dimColor: true, children: ["Elapsed: ", formatDuration(startTime)] })] })), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(Box, { flexDirection: "row", alignItems: "center", gap: 1, children: [_jsx(Text, { bold: true, children: padLabel('Implementation:') }), _jsx(ProgressBar, { percent: percentTasks }), _jsxs(Text, { children: [String(percentTasks).padStart(3), "%"] }), _jsxs(Text, { color: colors.green, children: ['\u2713', " ", tasks.tasksDone] }), _jsxs(Text, { color: colors.yellow, children: ['\u25cb', " ", tasks.tasksPending] })] }), totalE2e > 0 && (_jsxs(Box, { flexDirection: "row", alignItems: "center", gap: 1, children: [_jsx(Text, { bold: true, children: padLabel('E2E Tests:') }), _jsx(ProgressBar, { percent: percentE2e }), _jsxs(Text, { children: [String(percentE2e).padStart(3), "%"] }), _jsxs(Text, { color: colors.green, children: ['\u2713', " ", tasks.e2eDone] }), _jsxs(Text, { color: colors.yellow, children: ['\u25cb', " ", tasks.e2ePending] })] })), _jsxs(Box, { flexDirection: "row", alignItems: "center", gap: 1, children: [_jsx(Text, { bold: true, children: padLabel('Overall:') }), _jsx(ProgressBar, { percent: percentAll }), _jsxs(Text, { children: [String(percentAll).padStart(3), "%"] }), _jsxs(Text, { color: colors.green, children: ['\u2713', " ", doneAll] }), _jsxs(Text, { color: colors.yellow, children: ['\u25cb', " ", totalAll - doneAll] })] })] }), recentCommits.length > 0 && (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { bold: true, children: "Recent Commits" }), recentCommits.map((c) => (_jsx(Box, { flexDirection: "row", children: _jsxs(Text, { dimColor: true, children: ["  ", c.hash, " ", c.title] }) }, c.hash)))] })), activityEvents.length > 0 && (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { bold: true, children: "Activity" }), _jsx(ActivityFeed, { events: activityEvents, maxEvents: 6 })] }))] }));
+}
+const REVIEW_MODES = ['manual', 'auto', 'merge'];
 export function AgentScreen({ header, projectRoot, agentOptions, onExit, }) {
     const { stdout } = useStdout();
     const columns = stdout?.columns ?? 80;
@@ -107,7 +145,7 @@ export function AgentScreen({ header, projectRoot, agentOptions, onExit, }) {
             restore?.();
         };
     }, []);
-    const { status, activeIssue, queue, completed, logEntries, error, abort } = useAgentOrchestrator({
+    const { status, activeIssue, queue, completed, logEntries, loopMonitor, error, abort } = useAgentOrchestrator({
         projectRoot,
         modelOverride: agentOptions?.modelOverride,
         maxItems: agentOptions?.maxItems,
@@ -118,6 +156,7 @@ export function AgentScreen({ header, projectRoot, agentOptions, onExit, }) {
     });
     // Track whether the user requested cancellation
     const [cancelling, setCancelling] = useState(false);
+    const [reviewMode, setReviewMode] = useState(agentOptions?.reviewMode ?? 'manual');
     const onExitRef = useRef(onExit);
     onExitRef.current = onExit;
     // When cancelling and the orchestrator finishes, exit
@@ -127,6 +166,7 @@ export function AgentScreen({ header, projectRoot, agentOptions, onExit, }) {
         }
     }, [cancelling, status]);
     const isWorking = status === 'running' || cancelling;
+    const hasLoopMonitor = loopMonitor !== null && activeIssue?.phase === 'running_loop';
     useInput(useCallback((input, key) => {
         if (input === 'q' || key.escape) {
             if (status === 'running') {
@@ -138,22 +178,32 @@ export function AgentScreen({ header, projectRoot, agentOptions, onExit, }) {
                 // Already done — exit immediately
                 onExitRef.current?.();
             }
+            return;
+        }
+        // Shift+R cycles review mode (manual → auto → merge)
+        if (input === 'R') {
+            setReviewMode((prev) => {
+                const idx = REVIEW_MODES.indexOf(prev);
+                return REVIEW_MODES[(idx + 1) % REVIEW_MODES.length];
+            });
         }
     }, [abort, status]));
-    const tips = cancelling ? 'Cancelling...' : 'q exit │ Esc back';
+    const tips = cancelling
+        ? 'Cancelling...'
+        : 'q exit \u2502 Esc back \u2502 Shift+R review mode';
+    const footerStatus = {
+        action: 'Agent',
+        phase: footerPhase(status, activeIssue, completed.length, cancelling),
+        extra: `review: ${reviewMode}`,
+    };
     if (isNarrow) {
         const panelWidth = Math.max(20, columns - 4);
-        return (_jsx(AppShell, { header: header, tips: tips, isWorking: isWorking, workingStatus: workingLabel(activeIssue), footerStatus: {
-                action: 'Agent',
-                phase: footerPhase(status, activeIssue, completed.length, cancelling),
-            }, children: _jsxs(Box, { flexDirection: "column", gap: 1, children: [_jsx(Box, { flexDirection: "column", borderStyle: "round", borderColor: colors.brown, paddingX: 1, children: _jsx(IssuesPanel, { activeIssue: activeIssue, queue: queue, completed: completed, panelWidth: panelWidth }) }), _jsx(Box, { flexDirection: "column", borderStyle: "round", borderColor: colors.brown, paddingX: 1, children: _jsx(LogPanel, { logEntries: logEntries }) })] }) }));
+        return (_jsx(AppShell, { header: header, tips: tips, isWorking: isWorking, workingStatus: workingLabel(activeIssue), footerStatus: footerStatus, children: _jsxs(Box, { flexDirection: "column", gap: 1, children: [_jsx(Box, { flexDirection: "column", borderStyle: "round", borderColor: colors.brown, paddingX: 1, children: _jsx(IssuesPanel, { activeIssue: activeIssue, queue: queue, completed: completed, panelWidth: panelWidth }) }), hasLoopMonitor && (_jsx(Box, { flexDirection: "column", borderStyle: "round", borderColor: colors.brown, paddingX: 1, children: _jsx(LoopMonitorPanel, { monitor: loopMonitor, featureName: activeIssue.loopFeatureName ?? `issue-${activeIssue.issueNumber}`, panelWidth: panelWidth }) })), _jsx(Box, { flexDirection: "column", borderStyle: "round", borderColor: colors.brown, paddingX: 1, children: _jsx(LogPanel, { logEntries: logEntries, tailSize: hasLoopMonitor ? 8 : 20 }) })] }) }));
     }
     // Wide layout: two-column
     const leftWidth = Math.max(30, Math.floor(columns * 0.4));
     const rightWidth = Math.max(30, columns - leftWidth - 3);
     const leftInnerWidth = leftWidth - 4; // border (2) + paddingX (2)
-    return (_jsx(AppShell, { header: header, tips: tips, isWorking: isWorking, workingStatus: workingLabel(activeIssue), footerStatus: {
-            action: 'Agent',
-            phase: footerPhase(status, activeIssue, completed.length, cancelling),
-        }, children: _jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Box, { flexDirection: "column", width: leftWidth, borderStyle: "round", borderColor: colors.brown, paddingX: 1, children: _jsx(IssuesPanel, { activeIssue: activeIssue, queue: queue, completed: completed, panelWidth: leftInnerWidth }) }), _jsx(Box, { flexDirection: "column", width: rightWidth, borderStyle: "round", borderColor: colors.brown, paddingX: 1, children: _jsx(LogPanel, { logEntries: logEntries }) })] }) }));
+    const rightInnerWidth = rightWidth - 4;
+    return (_jsx(AppShell, { header: header, tips: tips, isWorking: isWorking, workingStatus: workingLabel(activeIssue), footerStatus: footerStatus, children: _jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Box, { flexDirection: "column", width: leftWidth, borderStyle: "round", borderColor: colors.brown, paddingX: 1, children: _jsx(IssuesPanel, { activeIssue: activeIssue, queue: queue, completed: completed, panelWidth: leftInnerWidth }) }), _jsxs(Box, { flexDirection: "column", width: rightWidth, children: [hasLoopMonitor && (_jsx(Box, { flexDirection: "column", borderStyle: "round", borderColor: colors.brown, paddingX: 1, marginBottom: 1, children: _jsx(LoopMonitorPanel, { monitor: loopMonitor, featureName: activeIssue.loopFeatureName ?? `issue-${activeIssue.issueNumber}`, panelWidth: rightInnerWidth }) })), _jsx(Box, { flexDirection: "column", borderStyle: "round", borderColor: colors.brown, paddingX: 1, children: _jsx(LogPanel, { logEntries: logEntries, tailSize: hasLoopMonitor ? 8 : 20 }) })] })] }) }));
 }

package/dist/tui/screens/MainShell.js

@@ -7,9 +7,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * Wrapped in AppShell for consistent layout.
  */
 import { useState, useCallback, useEffect, useMemo } from 'react';
-import { Box, Text, useInput, useApp } from 'ink';
+import { Box, Text, useInput, useApp, useStdout } from 'ink';
 import { MessageList } from '../components/MessageList.js';
 import { ChatInput } from '../components/ChatInput.js';
+import { IssuePicker } from '../components/IssuePicker.js';
 import { ActionOutput } from '../components/ActionOutput.js';
 import { AppShell } from '../components/AppShell.js';
 import { colors, theme, phase } from '../theme.js';
@@ -18,7 +19,18 @@ import { logger } from '../../utils/logger.js';
 import { parseInput, resolveCommandAlias, formatHelpText, } from '../../repl/command-parser.js';
 import { readLoopStatus } from '../utils/loop-status.js';
 import { useSync } from '../hooks/useSync.js';
+import { isGhInstalled, detectGitHubRemote, listRepoIssues, } from '../../utils/github.js';
+import { clearScreen } from '../utils/clear-screen.js';
 import path from 'node:path';
+function slugifyIssueTitle(title, maxWords = 4) {
+    return title
+        .toLowerCase()
+        .replace(/[^a-z0-9\s-]/g, '')
+        .trim()
+        .split(/\s+/)
+        .slice(0, maxWords)
+        .join('-') || 'untitled';
+}
 /**
  * Generate a unique ID for messages
  */
@@ -33,6 +45,7 @@ function generateId() {
  */
 export function MainShell({ header, sessionState, onNavigate, backgroundRuns, initialMessage, initialFiles, }) {
     const { exit } = useApp();
+    const { stdout } = useStdout();
     const [messages, setMessages] = useState(() => {
         const initial = [];
         if (initialMessage) {
@@ -48,6 +61,12 @@ export function MainShell({ header, sessionState, onNavigate, backgroundRuns, in
     const [contextAge, setContextAge] = useState(null);
     // Sync hook
     const { status: syncStatus, error: syncError, sync } = useSync();
+    // Issue picker state
+    const [issuePickerVisible, setIssuePickerVisible] = useState(false);
+    const [issuePickerIssues, setIssuePickerIssues] = useState([]);
+    const [issuePickerLoading, setIssuePickerLoading] = useState(false);
+    const [issuePickerError, setIssuePickerError] = useState();
+    const [issuePickerRepo, setIssuePickerRepo] = useState(null);
     const addSystemMessage = useCallback((content) => {
         const message = {
             id: generateId(),
@@ -203,6 +222,60 @@ export function MainShell({ header, sessionState, onNavigate, backgroundRuns, in
         }
         onNavigate('agent', { dryRun, maxItems, reviewMode });
     }, [sessionState.initialized, addSystemMessage, onNavigate]);
+    const handleIssueCommand = useCallback(async (searchQuery) => {
+        if (!sessionState.initialized) {
+            addSystemMessage('Project not initialized. Run /init first.');
+            return;
+        }
+        setIssuePickerVisible(true);
+        setIssuePickerLoading(true);
+        setIssuePickerError(undefined);
+        try {
+            const ghAvailable = await isGhInstalled();
+            if (!ghAvailable) {
+                setIssuePickerError('Install GitHub CLI (gh) for issue browsing');
+                setIssuePickerLoading(false);
+                return;
+            }
+            let repo = issuePickerRepo;
+            if (!repo) {
+                repo = await detectGitHubRemote(sessionState.projectRoot);
+                if (!repo) {
+                    setIssuePickerError('No GitHub remote detected in this project');
+                    setIssuePickerLoading(false);
+                    return;
+                }
+                setIssuePickerRepo(repo);
+            }
+            const result = await listRepoIssues(repo.owner, repo.repo, searchQuery);
+            if (result.error) {
+                setIssuePickerError(result.error);
+            }
+            setIssuePickerIssues(result.issues);
+        }
+        catch (err) {
+            setIssuePickerError(err instanceof Error ? err.message : String(err));
+        }
+        finally {
+            setIssuePickerLoading(false);
+        }
+    }, [sessionState.initialized, sessionState.projectRoot, issuePickerRepo, addSystemMessage]);
+    const handleIssueSelect = useCallback((issue) => {
+        clearScreen(stdout);
+        setIssuePickerVisible(false);
+        setIssuePickerIssues([]);
+        const featureName = slugifyIssueTitle(issue.title);
+        onNavigate('interview', {
+            featureName,
+            initialReferences: [`issue:${issue.number}`],
+        });
+    }, [stdout, onNavigate]);
+    const handleIssueCancel = useCallback(() => {
+        clearScreen(stdout);
+        setIssuePickerVisible(false);
+        setIssuePickerIssues([]);
+        setIssuePickerError(undefined);
+    }, [stdout]);
     const handleConfig = useCallback((args) => {
         if (args.length === 0) {
             addSystemMessage('Config management - not yet implemented in TUI mode. Use CLI: wiggum config');
@@ -252,6 +325,9 @@ export function MainShell({ header, sessionState, onNavigate, backgroundRuns, in
             case 'monitor':
                 handleMonitor(args);
                 break;
+            case 'issue':
+                handleIssueCommand(args.join(' ') || undefined);
+                break;
             case 'agent':
                 handleAgent(args);
                 break;
@@ -264,7 +340,7 @@ export function MainShell({ header, sessionState, onNavigate, backgroundRuns, in
             default:
                 addSystemMessage(`Unknown command: ${commandName}`);
         }
-    }, [handleHelp, handleInit, handleSync, handleNew, handleRun, handleMonitor, handleAgent, handleConfig, handleExit, addSystemMessage]);
+    }, [handleHelp, handleInit, handleSync, handleNew, handleRun, handleMonitor, handleIssueCommand, handleAgent, handleConfig, handleExit, addSystemMessage]);
     const handleNaturalLanguage = useCallback((_text) => {
         addSystemMessage('Tip: Use /help to see available commands, or /new <feature> to create a spec.');
     }, [addSystemMessage]);
@@ -299,10 +375,10 @@ export function MainShell({ header, sessionState, onNavigate, backgroundRuns, in
     });
     // Build tips text
     const tips = sessionState.initialized
-        ? 'Tip: /new <feature> to create spec, /help for commands'
+        ? 'Tip: /new <feature> or /issue to browse issues, /help for commands'
         : 'Tip: /init to set up, /help for commands';
     const specSuggestions = useMemo(() => sessionState.specNames?.map((name) => ({ name, description: '' })), [sessionState.specNames]);
-    const inputElement = (_jsx(ChatInput, { onSubmit: handleSubmit, disabled: false, placeholder: "Enter command or type /help...", onCommand: (cmd) => handleSubmit(`/${cmd}`), specSuggestions: specSuggestions }));
+    const inputElement = (_jsxs(Box, { flexDirection: "column", children: [_jsx(ChatInput, { onSubmit: handleSubmit, disabled: issuePickerVisible, placeholder: "Enter command or type /help...", onCommand: (cmd) => handleSubmit(`/${cmd}`), specSuggestions: specSuggestions }), issuePickerVisible && (_jsx(IssuePicker, { issues: issuePickerIssues, repoSlug: issuePickerRepo ? `${issuePickerRepo.owner}/${issuePickerRepo.repo}` : '...', onSelect: handleIssueSelect, onCancel: handleIssueCancel, isLoading: issuePickerLoading, error: issuePickerError }))] }));
     return (_jsxs(AppShell, { header: header, tips: tips, isWorking: syncStatus === 'running', workingStatus: syncStatus === 'running' ? 'Syncing project context\u2026' : undefined, input: inputElement, footerStatus: {
             action: projectLabel || 'Main Shell',
             phase: sessionState.provider ? `${sessionState.provider}/${sessionState.model}` : 'No provider',

package/dist/tui/screens/RunScreen.js

@@ -25,13 +25,14 @@ import { ActivityFeed } from '../components/ActivityFeed.js';
 import { colors, theme } from '../theme.js';
 import { readLoopStatus, parseImplementationPlan, getGitBranch, formatNumber, getLoopLogPath, parseLoopLog, parsePhaseChanges, } from '../utils/loop-status.js';
 import { buildEnhancedRunSummary } from '../utils/build-run-summary.js';
-import { getCurrentCommitHash } from '../utils/git-summary.js';
+import { getCurrentCommitHash, getRecentCommits } from '../utils/git-summary.js';
 import { writeRunSummaryFile } from '../../utils/summary-file.js';
 import { loadConfigWithDefaults } from '../../utils/config.js';
 import { logger } from '../../utils/logger.js';
 import { readActionRequest, writeActionReply, cleanupActionFiles } from '../utils/action-inbox.js';
 const POLL_INTERVAL_MS = 2500;
 const ERROR_TAIL_LINES = 12;
+const RUN_REVIEW_MODES = ['manual', 'auto', 'merge'];
 function findFeatureLoopScript(projectRoot, scriptsDir) {
     const localScript = join(projectRoot, scriptsDir, 'feature-loop.sh');
     if (existsSync(localScript)) {
@@ -112,6 +113,9 @@ export function RunScreen({ header, featureName, projectRoot, sessionState, moni
     const [activityEvents, setActivityEvents] = useState([]);
     const [latestCommit, setLatestCommit] = useState(null);
     const [baselineCommit, setBaselineCommit] = useState(null);
+    const [recentCommits, setRecentCommits] = useState([]);
+    const [reviewMode, setReviewMode] = useState(reviewModeProp ?? 'manual');
+    const [loopModel, setLoopModel] = useState(null);
     const childRef = useRef(null);
     const stopRequestedRef = useRef(false);
     const isMountedRef = useRef(true);
@@ -170,6 +174,14 @@ export function RunScreen({ header, featureName, projectRoot, sessionState, moni
             else {
                 onCancel();
             }
+            return;
+        }
+        // Shift+R cycles review mode (manual → auto → merge)
+        if (input === 'R') {
+            setReviewMode((prev) => {
+                const idx = RUN_REVIEW_MODES.indexOf(prev);
+                return RUN_REVIEW_MODES[(idx + 1) % RUN_REVIEW_MODES.length];
+            });
         }
     });
     const refreshStatus = useCallback(async () => {
@@ -184,10 +196,12 @@ export function RunScreen({ header, featureName, projectRoot, sessionState, moni
         if (!isMountedRef.current)
             return;
         setBranch(getGitBranch(projectRoot));
-        // Update latest commit hash
+        // Update latest commit hash and recent commits
         const head = getCurrentCommitHash(projectRoot);
-        if (head && isMountedRef.current)
+        if (head && isMountedRef.current) {
             setLatestCommit(head);
+            setRecentCommits(getRecentCommits(projectRoot, 3));
+        }
         // Collect new activity events from log and phase changes
         const logPath = getLoopLogPath(featureName);
         const allLogEvents = parseLoopLog(logPath);
@@ -336,6 +350,10 @@ export function RunScreen({ header, featureName, projectRoot, sessionState, moni
                 try {
                     const config = sessionState.config ?? await loadConfigWithDefaults(projectRoot);
                     specsDirRef.current = config.paths.specs;
+                    if (!cancelled) {
+                        setLoopModel(config.loop.defaultModel);
+                        setReviewMode((prev) => reviewModeProp ?? config.loop.reviewMode ?? prev);
+                    }
                 }
                 catch (err) {
                     const reason = err instanceof Error ? err.message : String(err);
@@ -378,6 +396,7 @@ export function RunScreen({ header, featureName, projectRoot, sessionState, moni
                 configRootRef.current = config.paths.root;
                 maxIterationsRef.current = config.loop.maxIterations;
                 maxE2eAttemptsRef.current = config.loop.maxE2eAttempts;
+                setLoopModel(config.loop.defaultModel);
                 const specFile = findSpecFile(projectRoot, featureName, config.paths.specs);
                 if (!specFile) {
                     setError(`Spec file not found for "${featureName}". Run /new ${featureName} first.`);
@@ -390,9 +409,10 @@ export function RunScreen({ header, featureName, projectRoot, sessionState, moni
                     setIsStarting(false);
                     return;
                 }
-                const reviewMode = reviewModeProp ?? config.loop.reviewMode ?? 'manual';
-                if (reviewMode !== 'manual' && reviewMode !== 'auto' && reviewMode !== 'merge') {
-                    setError(`Invalid reviewMode '${reviewMode}'. Allowed values are 'manual', 'auto', or 'merge'.`);
+                const effectiveReviewMode = reviewModeProp ?? config.loop.reviewMode ?? 'manual';
+                setReviewMode(effectiveReviewMode);
+                if (effectiveReviewMode !== 'manual' && effectiveReviewMode !== 'auto' && effectiveReviewMode !== 'merge') {
+                    setError(`Invalid reviewMode '${effectiveReviewMode}'. Allowed values are 'manual', 'auto', or 'merge'.`);
                     setIsStarting(false);
                     return;
                 }
@@ -409,7 +429,7 @@ export function RunScreen({ header, featureName, projectRoot, sessionState, moni
                         String(config.loop.maxIterations),
                         String(config.loop.maxE2eAttempts),
                         '--review-mode',
-                        reviewMode,
+                        effectiveReviewMode,
                     ];
                     const child = spawn('bash', [scriptPath, ...args], {
                         cwd: dirname(scriptPath),
@@ -548,8 +568,11 @@ export function RunScreen({ header, featureName, projectRoot, sessionState, moni
         : actionRequest
             ? 'Select an option, Esc for default'
             : monitorOnly
-                ? 'Ctrl+C stop, Esc back'
-                : 'Ctrl+C stop, Esc background';
+                ? 'Ctrl+C stop, Esc back, Shift+R review mode'
+                : 'Ctrl+C stop, Esc background, Shift+R review mode';
+    // Progress bar label padding — align all labels to the longest one
+    const PROGRESS_LABEL_WIDTH = 17; // "Implementation: " padded
+    const padLabel = (label) => label.padEnd(PROGRESS_LABEL_WIDTH);
     // Action select handler — awaits write before clearing prompt
     const handleActionSelect = useCallback(async (choiceId) => {
         if (!actionRequest)
@@ -590,7 +613,8 @@ export function RunScreen({ header, featureName, projectRoot, sessionState, moni
             action: 'Run Loop',
             phase: phaseLine,
             path: featureName,
-        }, children: completionSummary ? (_jsx(RunCompletionSummary, { summary: completionSummary })) : (!error && (_jsxs(_Fragment, { children: [_jsxs(Box, { marginTop: 1, flexDirection: "row", children: [_jsx(Text, { children: "Phase: " }), _jsx(Text, { color: colors.yellow, children: phaseLine }), _jsx(Text, { dimColor: true, children: theme.statusLine.separator }), _jsx(Text, { children: "Iter: " }), _jsx(Text, { color: colors.green, children: status.iteration }), _jsxs(Text, { dimColor: true, children: ["/", status.maxIterations || maxIterationsRef.current || '-'] }), _jsx(Text, { dimColor: true, children: theme.statusLine.separator }), _jsx(Text, { children: "Branch: " }), _jsx(Text, { color: colors.blue, children: branch })] }), _jsxs(Box, { marginTop: 1, flexDirection: "row", children: [_jsx(Text, { children: "Tokens: " }), _jsx(Text, { color: colors.pink, children: formatNumber(totalTokens) }), _jsxs(Text, { dimColor: true, children: [" (in:", formatNumber(status.tokensInput), " out:", formatNumber(status.tokensOutput), " cache:", formatNumber(status.cacheRead), ")"] }), _jsx(Text, { dimColor: true, children: theme.statusLine.separator }), _jsxs(Text, { dimColor: true, children: ["Elapsed: ", formatDuration(startTimeRef.current)] })] }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(Box, { flexDirection: "row", alignItems: "center", gap: 1, children: [_jsx(Text, { bold: true, children: "Implementation:" }), _jsx(ProgressBar, { percent: percentTasks }), _jsxs(Text, { children: [percentTasks, "%"] }), _jsxs(Text, { color: colors.green, children: ['\u2713', " ", tasks.tasksDone] }), _jsxs(Text, { color: colors.yellow, children: ['\u25cb', " ", tasks.tasksPending] })] }), totalE2e > 0 && (_jsxs(Box, { flexDirection: "row", alignItems: "center", gap: 1, children: [_jsx(Text, { bold: true, children: "E2E Tests:" }), _jsx(ProgressBar, { percent: percentE2e }), _jsxs(Text, { children: [percentE2e, "%"] }), _jsxs(Text, { color: colors.green, children: ['\u2713', " ", tasks.e2eDone] }), _jsxs(Text, { color: colors.yellow, children: ['\u25cb', " ", tasks.e2ePending] })] })), _jsxs(Box, { flexDirection: "row", alignItems: "center", gap: 1, marginTop: 1, children: [_jsx(Text, { bold: true, children: "Overall:" }), _jsx(ProgressBar, { percent: percentAll }), _jsxs(Text, { children: [percentAll, "%"] }), _jsxs(Text, { color: colors.green, children: ['\u2713', " ", doneAll] }), _jsxs(Text, { color: colors.yellow, children: ['\u25cb', " ", totalAll - doneAll] })] })] }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { bold: true, children: "Activity" }), _jsx(ActivityFeed, { events: activityEvents, latestCommit: baselineCommit && latestCommit && baselineCommit !== latestCommit
+            extra: `review: ${reviewMode}`,
+        }, children: completionSummary ? (_jsx(RunCompletionSummary, { summary: completionSummary })) : (!error && (_jsxs(_Fragment, { children: [_jsxs(Box, { marginTop: 1, flexDirection: "row", children: [_jsx(Text, { children: "Phase: " }), _jsx(Text, { color: colors.yellow, children: phaseLine }), _jsx(Text, { dimColor: true, children: theme.statusLine.separator }), _jsx(Text, { children: "Iter: " }), _jsx(Text, { color: colors.green, children: status.iteration }), _jsxs(Text, { dimColor: true, children: ["/", status.maxIterations || maxIterationsRef.current || '-'] }), _jsx(Text, { dimColor: true, children: theme.statusLine.separator }), _jsx(Text, { children: "Branch: " }), _jsx(Text, { color: colors.blue, children: branch }), loopModel && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: theme.statusLine.separator }), _jsx(Text, { children: "Model: " }), _jsx(Text, { color: colors.blue, children: loopModel })] }))] }), _jsxs(Box, { marginTop: 1, flexDirection: "row", children: [_jsx(Text, { children: "Tokens: " }), _jsx(Text, { color: colors.pink, children: formatNumber(totalTokens) }), _jsxs(Text, { dimColor: true, children: [" (in:", formatNumber(status.tokensInput), " out:", formatNumber(status.tokensOutput), " cache:", formatNumber(status.cacheRead), ")"] }), _jsx(Text, { dimColor: true, children: theme.statusLine.separator }), _jsxs(Text, { dimColor: true, children: ["Elapsed: ", formatDuration(startTimeRef.current)] })] }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(Box, { flexDirection: "row", alignItems: "center", gap: 1, children: [_jsx(Text, { bold: true, children: padLabel('Implementation:') }), _jsx(ProgressBar, { percent: percentTasks }), _jsxs(Text, { children: [String(percentTasks).padStart(3), "%"] }), _jsxs(Text, { color: colors.green, children: ['\u2713', " ", tasks.tasksDone] }), _jsxs(Text, { color: colors.yellow, children: ['\u25cb', " ", tasks.tasksPending] })] }), totalE2e > 0 && (_jsxs(Box, { flexDirection: "row", alignItems: "center", gap: 1, children: [_jsx(Text, { bold: true, children: padLabel('E2E Tests:') }), _jsx(ProgressBar, { percent: percentE2e }), _jsxs(Text, { children: [String(percentE2e).padStart(3), "%"] }), _jsxs(Text, { color: colors.green, children: ['\u2713', " ", tasks.e2eDone] }), _jsxs(Text, { color: colors.yellow, children: ['\u25cb', " ", tasks.e2ePending] })] })), _jsxs(Box, { flexDirection: "row", alignItems: "center", gap: 1, marginTop: 1, children: [_jsx(Text, { bold: true, children: padLabel('Overall:') }), _jsx(ProgressBar, { percent: percentAll }), _jsxs(Text, { children: [String(percentAll).padStart(3), "%"] }), _jsxs(Text, { color: colors.green, children: ['\u2713', " ", doneAll] }), _jsxs(Text, { color: colors.yellow, children: ['\u25cb', " ", totalAll - doneAll] })] })] }), recentCommits.length > 0 && (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { bold: true, children: "Recent Commits" }), recentCommits.map((c) => (_jsx(Box, { flexDirection: "row", children: _jsxs(Text, { dimColor: true, children: ["  ", c.hash, " ", c.title] }) }, c.hash)))] })), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { bold: true, children: "Activity" }), _jsx(ActivityFeed, { events: activityEvents, latestCommit: baselineCommit && latestCommit && baselineCommit !== latestCommit
                                 ? `${baselineCommit} \u2192 ${latestCommit}`
                                 : latestCommit || undefined })] })] }))) }));
 }

package/dist/tui/utils/git-summary.d.ts

@@ -34,4 +34,5 @@ export declare function getDiffStats(projectRoot: string, fromHash: string, toHa
  * @param toHash - Ending commit hash (inclusive)
  * @returns Array of commit entries, or null if not available
  */
+export declare function getRecentCommits(projectRoot: string, count?: number): CommitLogEntry[];
 export declare function getCommitList(projectRoot: string, fromHash: string, toHash: string): CommitLogEntry[] | null;

package/dist/tui/utils/git-summary.js

@@ -69,6 +69,22 @@ export function getDiffStats(projectRoot, fromHash, toHash) {
  * @param toHash - Ending commit hash (inclusive)
  * @returns Array of commit entries, or null if not available
  */
+export function getRecentCommits(projectRoot, count = 3) {
+    try {
+        const output = execFileSync('git', ['log', '--oneline', `-${count}`], { cwd: projectRoot, encoding: 'utf-8', timeout: 10_000 }).trim();
+        if (!output)
+            return [];
+        return output.split('\n').map((line) => {
+            const spaceIdx = line.indexOf(' ');
+            if (spaceIdx === -1)
+                return { hash: line, title: '' };
+            return { hash: line.substring(0, spaceIdx), title: line.substring(spaceIdx + 1) };
+        });
+    }
+    catch {
+        return [];
+    }
+}
 export function getCommitList(projectRoot, fromHash, toHash) {
     try {
         const output = execFileSync('git', ['log', '--oneline', `${fromHash}..${toHash}`], {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wiggum-cli",
-  "version": "0.17.0",
+  "version": "0.17.1",
   "description": "AI-powered feature development loop CLI",
   "type": "module",
   "main": "dist/index.js",