@iseoane/agent-depot 0.6.13 → 0.6.15

package/dist/src/tui/sources-view.js

@@ -1,15 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Box, Text, useWindowSize } from "ink";
+import { Box, useWindowSize } from "ink";
+import { Text } from "./safe-text.js";
 import path from "node:path";
-import { useCallback, useEffect, useReducer, useRef, useState } from "react";
+import { useCallback, useEffect, useReducer, useRef, useState, useSyncExternalStore } from "react";
 import { initialMode, modeReducer } from "./sources-mode.js";
 import { rowStyle, theme } from "./theme.js";
 import { computeWindow, pageStep, useListHeight } from "./window.js";
-import { useKeys } from "./keys.js";
+import { isYes, useKeys } from "./keys.js";
 import { groupRecipeRows, useSourcesRecipes } from "./sources-recipes.js";
-import { BorderPanel, DecisionPrompt, FieldLine, PreviewLines, Working } from "./panel-parts.js";
-import { previewViewport } from "./preview-window.js";
+import { BorderPanel, PagedPreview, Working } from "./panel-parts.js";
+import { usePreviewGeometry } from "./preview-window.js";
 import { movePreviewCursor } from "./mode-keys.js";
+import { animationEnabled, formatElapsed } from "./working-model.js";
 /** Footer keys for the selected row; App seeds the footer before the view reports a selection. */
 export function sourceRowHints(row) {
     if (row === undefined)
@@ -29,7 +31,7 @@ async function refreshEach(operations, targets) {
     let failed = false;
     for (const source of targets) {
         try {
-            lines.push(`Refreshed Git Source: ${(await operations.refreshSource(source.id)).id}`);
+            lines.push(`Refreshed Git Source: ${(await operations.refreshSource(source.id, { force: true })).id}`);
         }
         catch (error) {
             failed = true;
@@ -41,19 +43,67 @@ async function refreshEach(operations, targets) {
 function errorText(error) {
     return error instanceof Error ? error.message : String(error);
 }
+const NO_REFRESHES = new Map();
+const NO_SUBSCRIPTION = () => () => undefined;
+/** Re-renders on every session change and, when animation is on, every second so elapsed times move. */
+function useRefreshStates(session) {
+    const states = useSyncExternalStore(session?.subscribe ?? NO_SUBSCRIPTION, session?.snapshot ?? (() => NO_REFRESHES));
+    const [, setTick] = useState(0);
+    useEffect(() => {
+        if (session === undefined || !animationEnabled())
+            return undefined;
+        const timer = setInterval(() => setTick((value) => value + 1), 1000);
+        // A redraw timer alone must never keep the process alive.
+        timer.unref();
+        return () => clearInterval(timer);
+    }, [session]);
+    return states;
+}
+/** The mark is text first; color only supports it. */
+function RefreshMark({ state, now }) {
+    switch (state?.status) {
+        case undefined:
+        case "not-refreshed":
+            return _jsx(Text, { color: theme.muted, children: "\u00B7 not refreshed" });
+        case "refreshing":
+            return _jsxs(Text, { color: theme.warning, children: ["\u2026 refreshing ", formatElapsed(now - (state.startedAt ?? now))] });
+        case "refreshed":
+            return _jsx(Text, { color: theme.success, children: "\u2713 refreshed" });
+        case "failed":
+            return _jsx(Text, { color: theme.error, children: "\u2717 refresh failed" });
+    }
+}
 function refreshPreviewLines(sources) {
     return sources.map(source => `Source: refresh Git Source ${source.id} from ${source.url}`);
 }
-function refreshViewport(mode, rows, columns) {
-    return previewViewport(refreshPreviewLines(mode.sources), mode.cursor, rows, columns, {
+function refreshChrome(count) {
+    return {
         title: "Refresh Git Sources",
-        questions: ["Scroll to end; n cancels.", "Refresh these Sources? y/n"],
-        footerRows: 2,
-    });
+        action: `Refresh ${count} ${count === 1 ? "Source" : "Sources"}`,
+        consequence: "Refresh these Sources? y/n",
+    };
+}
+function removeSourcePreviewLines(source) {
+    return [`Source: remove Git Source ${source.id} from ${source.url}`];
 }
-export function SourcesView({ operations, onCapturingChange, onOpenCatalog, listHeight, environment, onHintsChange }) {
-    const { columns, rows: terminalRows } = useWindowSize();
-    const height = useListHeight(listHeight, 9);
+const REMOVE_SOURCE_CHROME = {
+    title: "Remove Git Source",
+    action: "Remove Git Source",
+    consequence: "Remove this Source? y/n",
+};
+/** The lines and chrome of the open confirmation preview, shared by key handling and rendering. */
+function confirmPreview(mode) {
+    return mode.action === "refresh"
+        ? { lines: refreshPreviewLines(mode.sources), chrome: refreshChrome(mode.sources.length) }
+        : { lines: removeSourcePreviewLines(mode.source), chrome: REMOVE_SOURCE_CHROME };
+}
+export function SourcesView({ operations, onCapturingChange, onOpenCatalog, listHeight, environment, onHintsChange, refreshSession }) {
+    const refreshStates = useRefreshStates(refreshSession);
+    const { rows: terminalRows } = useWindowSize();
+    const previewGeometry = usePreviewGeometry();
+    // With a refresh session, one more row is kept for the selected Source's refresh error; below 24 rows
+    // the list is already at its minimum, so that line is left out rather than pushing the footer away.
+    const height = useListHeight(listHeight, refreshSession === undefined ? 9 : 10);
     const [state, setState] = useState(() => ({ status: "loading", startedAt: Date.now() }));
     // The highlight follows the source id; the index is only the fallback once that source is gone.
     // Selection and marks are mirrored in refs updated first, so keys delivered in one burst act on the latest state.
@@ -126,8 +176,6 @@ export function SourcesView({ operations, onCapturingChange, onOpenCatalog, list
             const row = rows[resolveIndex(rows, selectionRef.current)];
             return row?.kind === "app" ? row.group.primary.entry.file : undefined;
         },
-        terminalRows: terminalRows || 24,
-        terminalColumns: columns || 80,
     });
     const rows = [
         ...sources.map((source) => ({ id: source.id, kind: "skills", source })),
@@ -136,8 +184,8 @@ export function SourcesView({ operations, onCapturingChange, onOpenCatalog, list
     rowsRef.current = rows;
     const selected = resolveIndex(rows, selection);
     const selectedRow = rows[selected];
-    const hints = mode.kind === "confirm" && mode.action === "refresh"
-        ? "↑↓/Pg page · y refresh · n cancel"
+    const hints = mode.kind === "confirm"
+        ? `↑↓/Pg page · y ${mode.action} · n cancel`
         : sourceRowHints(selectedRow);
     useEffect(() => { onHintsChange?.(hints); }, [hints, onHintsChange]);
     const select = (index) => {
@@ -240,17 +288,17 @@ export function SourcesView({ operations, onCapturingChange, onOpenCatalog, list
             return;
         }
         if (mode.kind === "confirm") {
-            if (mode.action === "refresh") {
-                const viewport = refreshViewport(mode, terminalRows || 24, columns || 80);
-                const cursor = movePreviewCursor(mode.cursor, viewport.total, input, key, viewport.height);
-                if (cursor !== undefined) {
-                    dispatch({ type: "preview-cursor", cursor });
-                    return;
-                }
-                if (input === "y" && !viewport.reachedEnd)
-                    return;
+            const { lines, chrome } = confirmPreview(mode);
+            const viewport = previewGeometry(lines, mode.cursor, chrome);
+            const cursor = movePreviewCursor(mode.cursor, viewport.total, input, key, viewport.height);
+            if (cursor !== undefined) {
+                dispatch({ type: "preview-cursor", cursor });
+                return;
             }
-            if (input === "y") {
+            const yes = isYes(input, key);
+            if (yes && !viewport.reachedEnd)
+                return;
+            if (yes) {
                 if (mode.action === "refresh") {
                     const { sources: targets } = mode;
                     void run(targets.length === 1 ? "Refreshing Git Source…" : "Refreshing Git Sources…", async () => {
@@ -329,17 +377,19 @@ export function SourcesView({ operations, onCapturingChange, onOpenCatalog, list
     if (state.status === "error")
         return _jsx(BorderPanel, { title: "Source error", children: _jsx(Text, { color: theme.error, children: state.message }) });
     const window = computeWindow(rows.length, selected, height);
+    const now = refreshSession?.now() ?? 0;
+    const selectedRefresh = selectedRow?.kind === "skills" ? refreshStates.get(selectedRow.source.id) : undefined;
     if (mode.kind === "confirm")
-        return _jsx(Prompt, { mode: mode, terminalRows: terminalRows || 24, terminalColumns: columns || 80 });
+        return _jsx(Prompt, { mode: mode, previewGeometry: previewGeometry });
     if (recipes.capturing)
         return _jsx(Box, { flexDirection: "column", children: recipes.panel });
     return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { color: theme.muted, children: ["      ", "ID  KIND  LOCATION / STATUS"] }), builtin ? _jsxs(Text, { children: ["    ", _jsx(Text, { color: theme.value, children: builtin.id }), _jsx(Text, { color: theme.legend, children: "  " }), _jsx(Text, { color: theme.field, children: "skills" }), _jsx(Text, { color: theme.legend, children: "  " }), _jsx(Text, { color: theme.warning, children: "included" })] }) : null, rows.length === 0 && recipes.loadingSince === undefined ? _jsx(Text, { children: "No sources or App recipes \u00B7 n to add" }) : null, rows.slice(window.start, window.end).map((row, offset) => {
                 const index = window.start + offset;
                 const id = row.kind === "skills" ? row.source.id : row.group.primary.entry.recipe?.name ?? row.group.primary.entry.file.split(/[\\/]/u).pop();
                 return (_jsxs(Text, { ...rowStyle(index === selected), children: [index === selected ? "> " : "  ", row.kind === "skills" ? (marked.has(row.id) ? "[x] " : "[ ] ") : "    ", _jsx(Text, { color: theme.value, children: id }), _jsx(Text, { color: theme.legend, children: "  " }), _jsx(Text, { color: theme.field, children: row.kind }), _jsx(Text, { color: theme.legend, children: "  " }), row.kind === "skills"
-                            ? _jsx(Text, { color: theme.value, children: row.source.url })
+                            ? _jsxs(_Fragment, { children: [_jsx(Text, { color: theme.value, children: row.source.url }), refreshSession === undefined ? null : _jsxs(_Fragment, { children: [_jsx(Text, { color: theme.legend, children: "  " }), _jsx(RefreshMark, { state: refreshStates.get(row.source.id), now: now })] })] })
                             : _jsx(RecipeStatus, { group: row.group })] }, row.id));
-            }), window.indicator ? _jsx(Text, { color: theme.muted, children: window.indicator }) : null, selectedCount > 0 ? _jsxs(Text, { children: [selectedCount, " selected"] }) : null, recipes.loadingSince !== undefined && mode.kind !== "busy" && !recipes.capturing
+            }), window.indicator ? _jsx(Text, { color: theme.muted, children: window.indicator }) : null, selectedRefresh?.status === "failed" && (terminalRows || 24) >= 24 ? _jsxs(Text, { color: theme.error, wrap: "truncate-end", children: ["Refresh failed: ", selectedRefresh.error] }) : null, selectedCount > 0 ? _jsxs(Text, { children: [selectedCount, " selected"] }) : null, recipes.loadingSince !== undefined && mode.kind !== "busy" && !recipes.capturing
                 ? _jsx(Working, { label: "Loading App recipes\u2026", since: recipes.loadingSince }) : null, recipes.panel, _jsx(Prompt, { mode: mode }), message ? (_jsx(BorderPanel, { title: message.kind === "error" ? "Source action · failed" : "Source action · complete", children: _jsx(Text, { color: message.kind === "error" ? theme.error : theme.success, children: message.text }) })) : null] }));
 }
 /** Status of the recipe that applies here, led by its platform when it names one; other platforms follow, muted. */
@@ -348,20 +398,16 @@ function RecipeStatus({ group }) {
     const platform = primary.entry.recipe?.platform;
     return (_jsxs(_Fragment, { children: [platform === undefined ? null : _jsxs(_Fragment, { children: [_jsx(Text, { color: theme.value, children: platform }), _jsx(Text, { color: theme.legend, children: " \u00B7 " })] }), primary.entry.error === undefined || primary.entry.recipe === undefined ? null : _jsxs(_Fragment, { children: [_jsx(Text, { color: theme.value, children: path.basename(primary.entry.file) }), _jsx(Text, { color: theme.legend, children: " \u00B7 " })] }), _jsx(Text, { color: primary.status === "approved" ? theme.success : theme.warning, children: primary.status === "approved" ? "✓ approved" : primary.status }), members.slice(1).map(other => (_jsxs(Text, { color: theme.muted, children: ["    ", other.entry.recipe?.platform ?? "all platforms", " (other platform)"] }, other.entry.file)))] }));
 }
-function Prompt({ mode, terminalRows = 24, terminalColumns = 80 }) {
+function Prompt({ mode, previewGeometry }) {
     if (mode.kind === "add-kind")
         return _jsx(Text, { children: "Add: 1 Git Source (skills + Packages) \u00B7 2 App recipe (Esc cancel)" });
     if (mode.kind === "input")
         return _jsxs(Text, { children: ["URL: ", mode.value] });
     if (mode.kind === "busy")
         return _jsx(BorderPanel, { title: "Sources", children: _jsx(Working, { label: mode.label, since: mode.startedAt }) });
-    if (mode.kind === "confirm") {
-        return mode.action === "refresh" ? (() => {
-            const viewport = refreshViewport(mode, terminalRows, terminalColumns);
-            return (_jsxs(BorderPanel, { title: "Refresh Git Sources", children: [_jsx(PreviewLines, { lines: viewport.rows }), viewport.total > viewport.height ? _jsxs(Text, { color: theme.legend, children: [viewport.start + 1, "\u2013", viewport.end, " of ", viewport.total] }) : null, _jsxs(Text, { color: theme.legend, children: ["Review ", viewport.cursor + 1, " of ", viewport.total, " \u00B7 arrows/Pg page"] }), viewport.reachedEnd
-                        ? _jsx(DecisionPrompt, { children: "Refresh these Sources?" })
-                        : _jsx(Text, { color: theme.legend, children: "Scroll to end; n cancels." })] }));
-        })() : (_jsxs(BorderPanel, { title: "Remove Git Source", children: [_jsx(FieldLine, { label: "Source", value: `remove Git Source ${mode.source.id} from ${mode.source.url}` }), _jsx(DecisionPrompt, { children: "Remove this Source?" })] }));
+    if (mode.kind === "confirm" && previewGeometry !== undefined) {
+        const { lines, chrome } = confirmPreview(mode);
+        return _jsx(PagedPreview, { lines: lines, viewport: previewGeometry(lines, mode.cursor, chrome) });
     }
     return null;
 }

package/dist/src/tui/text-wrap.js

@@ -1,11 +1,55 @@
 import stringWidth from "string-width";
 const graphemes = new Intl.Segmenter(undefined, { granularity: "grapheme" });
+// Control, format and line-separator characters the TUI prints as escapes; the zero-width joiner stays for emoji sequences.
+export const UNSAFE_PATTERN = "(?!\\u200D)[\\p{Cc}\\p{Cf}\\u2028\\u2029]";
+const UNSAFE_CHARACTER = new RegExp(UNSAFE_PATTERN, "u");
+/** Text shaped like an escape the TUI prints (`x1b`, `u202e`, `u{1f600}`), ignoring case. */
+export const ESCAPE_TEXT = "x[0-9a-f]{2}|u[0-9a-f]{4}|u\\{[0-9a-f]{1,6}\\}";
+const ESCAPE_UNIT = new RegExp(`(\\\\+)(${ESCAPE_TEXT})`, "giu");
+/** Whether `escape` (`x1b`, `u202e`, `u{1f600}`) names a character the TUI would print as an escape. */
+export function namesEscapedCharacter(escape) {
+    const code = Number.parseInt(escape.replace(/^[xu]\{?|\}$/giu, ""), 16);
+    return code <= 0x10ffff && UNSAFE_CHARACTER.test(String.fromCodePoint(code));
+}
+/**
+ * The units text is cut at: graphemes, except around an escape written as text that names a character the TUI escapes. Cut inside,
+ * its doubled backslash would leave a `\x1b` that reads as a real ESC. The backslash run splits into pairs from the left, so a cut
+ * between pairs keeps its parity, and the last one or two backslashes stay with the escape text: a unit is at most 12 columns. A unit
+ * wider than `maxWidth` falls back to graphemes. `index` is the UTF-16 offset of the unit.
+ */
+export function textUnits(value, maxWidth = Infinity) {
+    const units = [];
+    let from = 0;
+    const addGraphemes = (text, offset) => {
+        for (const { segment, index } of graphemes.segment(text))
+            units.push({ segment, index: offset + index });
+    };
+    for (const match of value.matchAll(ESCAPE_UNIT)) {
+        const [whole, backslashes = "", escape = ""] = match;
+        if (!namesEscapedCharacter(escape))
+            continue;
+        const tail = backslashes.length % 2 === 1 ? 1 : 2;
+        const pairs = backslashes.length - tail;
+        const unit = backslashes.slice(pairs) + escape;
+        addGraphemes(value.slice(from, match.index), from);
+        if (stringWidth(unit) > maxWidth)
+            addGraphemes(whole, match.index);
+        else {
+            for (let offset = 0; offset < pairs; offset += 2)
+                units.push({ segment: "\\\\", index: match.index + offset });
+            units.push({ segment: unit, index: match.index + pairs });
+        }
+        from = match.index + whole.length;
+    }
+    addGraphemes(value.slice(from), from);
+    return units;
+}
 /** Split text on grapheme boundaries so wide and combining characters wrap at `width` columns. */
 export function wrapText(value, width) {
     const lines = [];
     let line = "";
     let lineWidth = 0;
-    for (const { segment } of graphemes.segment(value)) {
+    for (const { segment } of textUnits(value, width)) {
         const segmentWidth = stringWidth(segment);
         if (line && lineWidth + segmentWidth > width) {
             lines.push(line);
@@ -26,7 +70,7 @@ export function fitLines(lines, maxRows, width) {
     const visible = lines.slice(0, maxRows);
     let last = "";
     let used = 0;
-    for (const { segment } of graphemes.segment(visible[maxRows - 1])) {
+    for (const { segment } of textUnits(visible[maxRows - 1])) {
         const segmentWidth = stringWidth(segment);
         if (used + segmentWidth > width - 1)
             break;
@@ -55,7 +99,7 @@ export function clipText(value, width) {
         return value;
     let last = "";
     let used = 0;
-    for (const { segment } of graphemes.segment(value)) {
+    for (const { segment } of textUnits(value)) {
         const segmentWidth = stringWidth(segment);
         if (used + segmentWidth > Math.max(width - 1, 0))
             break;

package/dist/src/tui/unmanaged-actions.js

@@ -1,8 +1,9 @@
 import { realpath } from "node:fs/promises";
+import { quoteText } from "../preview-model.js";
 import path from "node:path";
 import { describeUnmanagedRemoval, describeUnmanagedSymlinkRemoval, removeInspectedUnmanagedSkill, removeInspectedUnmanagedSymlink, } from "../unmanaged-removal.js";
 import { inspectUserGlobalSkillRemoval, inspectUserGlobalSymlinkRemoval, } from "../user-global-skill-inventory.js";
-import { answerYesNo, moveCursor } from "./mode-keys.js";
+import { answerPaged, moveCursor } from "./mode-keys.js";
 import { homeOf } from "./installations.js";
 import { busy } from "./working-model.js";
 export const UNMANAGED_KINDS = ["unmanaged-scope", "unmanaged-pick", "confirm-unmanaged"];
@@ -52,7 +53,7 @@ export async function prepareUnmanagedRemoval(operations, environment, group, lo
             if (planned.has(link.path))
                 continue;
             planned.set(link.path, link);
-            preview.push(`also removes link ${JSON.stringify(link.path)} → ${JSON.stringify(chosen.path)} (it would dangle)`);
+            preview.push(`also removes link ${quoteText(link.path)} → ${quoteText(chosen.path)} (it would dangle)`);
         }
     }
     for (const location of linksFirst([...planned.values()])) {
@@ -105,7 +106,7 @@ async function startPreview(context, group, locations) {
         const prepared = await prepareUnmanagedRemoval(context.operations, context.env, group, locations);
         if (!context.isMounted())
             return;
-        context.setMode({ kind: "confirm-unmanaged", group, prepared });
+        context.setMode({ kind: "confirm-unmanaged", group, prepared, cursor: 0 });
     }
     catch (error) {
         if (!context.isMounted())
@@ -125,6 +126,11 @@ function cancel(context) {
     context.setMessage({ kind: "ok", text: "Uninstall cancelled" });
     context.browse();
 }
+/** What the confirmation shows, so the key handler and the panel page the same rows. */
+export function unmanagedConfirmPreview(mode) {
+    const { name } = mode.group;
+    return { lines: mode.prepared.preview, chrome: { title: "Remove unmanaged skill", action: `Remove ${name}`, consequence: `Remove ${name}? y/n` } };
+}
 async function execute(context, group, prepared) {
     context.setMode(busy(`Removing ${group.name}…`));
     await context.finish(await runUnmanagedRemoval(prepared, context.operations, context.env));
@@ -170,9 +176,15 @@ export function handleUnmanagedKey(context, mode, input, key) {
             }
             return true;
         }
-        case "confirm-unmanaged":
-            answerYesNo(input, key, () => void execute(context, current.group, current.prepared), () => cancel(context));
+        case "confirm-unmanaged": {
+            const { lines, chrome } = unmanagedConfirmPreview(current);
+            answerPaged(context.previewGeometry(lines, current.cursor, chrome), current.cursor, input, key, {
+                moveTo: (cursor) => context.setMode({ ...current, cursor }),
+                yes: () => void execute(context, current.group, current.prepared),
+                no: () => cancel(context),
+            });
             return true;
+        }
         default:
             return false;
     }

package/dist/src/tui/updates-flow.js

@@ -1,4 +1,5 @@
 import { useCallback, useEffect, useRef, useState } from "react";
+import { formatProgressLabel } from "../flow-progress.js";
 import { errorText } from "./batch.js";
 import { BROWSE } from "./updates-mode.js";
 import { CHECKING, emptyData, PHASE_LABEL, REFRESHING } from "./updates-model.js";
@@ -12,7 +13,7 @@ export function useUpdatesFlow(inputs) {
     useEffect(() => () => {
         pendingAnswer.current?.(false);
     }, []);
-    const load = useCallback(async (refresh) => {
+    const load = useCallback(async (refresh, force = false) => {
         const token = ++loadToken.current;
         // The check after an applied update continues that update's clock; a check from browsing starts one.
         const running = busy(refresh ? REFRESHING : CHECKING, modeRef.current, clock);
@@ -26,7 +27,7 @@ export function useUpdatesFlow(inputs) {
         setMode(running);
         let next;
         try {
-            next = { status: "ready", data: await loadUpdateRows(operations, env, { refresh, onPhase: phase, now: clock }) };
+            next = { status: "ready", data: await loadUpdateRows(operations, env, { refresh, force, onPhase: phase, now: clock }) };
         }
         catch (error) {
             // The scopes are read separately, so this is unexpected; show it as the check's result.
@@ -62,9 +63,14 @@ export function useUpdatesFlow(inputs) {
         }
     };
     const apply = async (prepared, confirmedPaths) => {
-        setMode(busy("Applying updates…", undefined, clock));
+        const running = busy("Applying updates…", undefined, clock);
+        setMode(running);
         let result;
         try {
+            const progress = (event) => {
+                if (mounted.current)
+                    setMode(busy(formatProgressLabel(event), running, clock));
+            };
             const outcome = await runUpdates(prepared, confirmedPaths, (plan, reason) => new Promise(resolve => {
                 if (!mounted.current) {
                     resolve(false);
@@ -75,8 +81,8 @@ export function useUpdatesFlow(inputs) {
                     resolve(done);
                 };
                 pendingAnswer.current = answer;
-                setMode({ kind: "manual", plan, reason, answer, cursor: 0 });
-            }));
+                setMode({ kind: "manual", plan, reason, answer, cursor: 0, startedAt: running.startedAt });
+            }), progress);
             result = { kind: outcome.failed === 0 ? "ok" : "error", lines: outcome.lines };
         }
         catch (error) {

package/dist/src/tui/updates-keys.js

@@ -120,10 +120,10 @@ export function handleUpdatesKey(context, mode, input, key) {
             answerYesNo(input, key, () => {
                 if (!context.previewAtEnd(mode))
                     return;
-                context.setMode(busy("Checking App version…", undefined, context.now));
+                context.setMode(busy("Checking App version…", mode, context.now));
                 mode.answer(true);
             }, () => {
-                context.setMode(busy("Continuing updates…", undefined, context.now));
+                context.setMode(busy("Continuing updates…", mode, context.now));
                 mode.answer(false);
             });
             return;

package/dist/src/tui/updates-model.js

@@ -1,5 +1,6 @@
 import { buildUpdateTree } from "./updates-tree.js";
 import { flattenVisible } from "./tree.js";
+import { formatAgo } from "./updates.js";
 export const REFRESHING = "Refreshing sources…";
 export const CHECKING = "Checking for updates…";
 export const PHASE_LABEL = { refreshing: REFRESHING, checking: CHECKING };
@@ -40,7 +41,7 @@ export function viewOf(data, scope, showUnknown, expanded) {
     return { shown, updatable, unknown, upToDate, entries };
 }
 export function describeRefresh(data) {
-    const { attempted, refreshed, failed, unreadable } = data.refresh;
+    const { attempted, refreshed, failed, unreadable, reusedAt } = data.refresh;
     if (!attempted)
         return "sources not fetched again";
     if (unreadable.length > 0) {
@@ -49,7 +50,9 @@ export function describeRefresh(data) {
     if (failed.length > 0) {
         return `${failed.length} of ${failed.length + refreshed.length} sources could not be refreshed; their current data was used`;
     }
-    return refreshed.length > 0 ? "sources refreshed" : "no Git sources to refresh";
+    if (refreshed.length === 0)
+        return "no Git sources to refresh";
+    return reusedAt === undefined ? "sources refreshed" : `sources refreshed ${formatAgo(data.checkedAt - reusedAt)}`;
 }
 /** Data for a check that failed as a whole, so the view can show the reason. */
 export function emptyData(reason, checkedAt) {

package/dist/src/tui/updates-panel.js

@@ -1,12 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Box, Text, useWindowSize } from "ink";
+import { Box } from "ink";
+import { Text } from "./safe-text.js";
 import { rowStyle, theme } from "./theme.js";
-import { BorderPanel, FieldLine, PreviewConfirm } from "./panel-parts.js";
-import { previewViewport } from "./preview-window.js";
+import { BorderPanel, FieldLine, PagedPreview } from "./panel-parts.js";
+import { usePreviewGeometry } from "./preview-window.js";
 import { describeRefresh, describeUnknownReasons } from "./updates-model.js";
-import { formatAgo, previewLineText } from "./updates.js";
+import { formatAgo } from "./updates.js";
+import { lineText } from "./preview-render.js";
 import { groupCheckState, packageLeafLabel } from "./updates-tree.js";
-import { updateModePreviewChrome, updateModePreviewLines, updateModeQuestion } from "./updates-preview.js";
+import { updateModePreviewChrome, updateModePreviewLines } from "./updates-preview.js";
 function updateResultField(line, defaultOk) {
     if (line.startsWith("Update summary: ")) {
         const successful = /^Update summary: \d+ updated, 0 failed$/.test(line);
@@ -54,11 +56,10 @@ export function UpdatesFooter({ indicator, upToDate, updatableCount, checkedCoun
                 }) })) : null] }));
 }
 function CapturedUpdatePreview({ mode }) {
-    const { rows, columns } = useWindowSize();
-    const lines = updateModePreviewLines(mode).map(previewLineText);
+    const styled = updateModePreviewLines(mode);
+    const lines = styled.map(lineText);
     const chrome = updateModePreviewChrome(mode);
-    const viewport = previewViewport(lines, mode.cursor, rows || 24, columns || 80, chrome);
-    return (_jsx(PreviewConfirm, { title: chrome.title, lines: lines, cursor: mode.cursor, question: updateModeQuestion(mode, viewport.reachedEnd), chrome: chrome }));
+    return _jsx(PagedPreview, { lines: lines, styled: styled, viewport: usePreviewGeometry()(lines, mode.cursor, chrome) });
 }
 export function ModePanel({ mode }) {
     switch (mode.kind) {

package/dist/src/tui/updates-preview.js

@@ -1,65 +1,48 @@
-import { previewText } from "./updates.js";
+import { quoteText } from "../preview-model.js";
+import { appPlanLines } from "./app-actions.js";
+import { fieldLine, renderPreviewDocument, textLine } from "./preview-render.js";
 export function updateModePreviewLines(mode) {
     switch (mode.kind) {
         case "preview":
-            return [
-                ...mode.prepared.lines,
-                ...mode.prepared.appFailures.map(previewText),
-                ...mode.prepared.packageFailures.map(previewText),
-                ...mode.prepared.failures.map(({ item, message }) => previewText(`Preview failed for ${JSON.stringify(item.id)}: ${message}`)),
-            ];
+            return renderPreviewDocument(mode.prepared.document);
         case "manual":
-            return [
-                { kind: "field", label: "App:", value: mode.plan.entry.recipe?.name ?? mode.plan.entry.file },
-                { kind: "field", label: "Environment:", value: mode.plan.environment },
-                { kind: "field", label: "Working directory:", value: mode.plan.cwd },
-                { kind: "field", label: "Manual:", value: mode.plan.manual ?? "" },
-                ...(mode.reason === undefined ? [] : [previewText(mode.reason)]),
-            ];
+            return [...appPlanLines(mode.plan), ...(mode.reason === undefined ? [] : [textLine(mode.reason)])];
         case "confirm-paths":
             return [
-                previewText("Outside .agents/skills and .claude/skills:"),
-                ...mode.prepared.nonCanonicalPaths.map(({ scope, path }) => ({
-                    kind: "field",
-                    label: "Path:",
-                    value: `[${scope}] ${JSON.stringify(path)}`,
-                })),
+                textLine("Outside .agents/skills and .claude/skills:"),
+                ...mode.prepared.nonCanonicalPaths.map(({ scope, path }) => fieldLine("Path:", `[${scope}] ${quoteText(path)}`)),
             ];
         default:
             return [];
     }
 }
+/**
+ * What else confirming does besides applying: replaced local changes and external commands. Kept to
+ * a bounded length so a narrow footer still fits the question after it; the warnings name every Skill.
+ */
+function previewEffects(prepared) {
+    const replaced = prepared.groups.flatMap((group) => group.applicable.filter((item) => group.overwriteShown.has(item.id)));
+    const commands = prepared.document.sections.flatMap(({ items }) => items.flatMap(({ rows }) => rows.filter((row) => row.kind === "command"))).length;
+    return [
+        ...(replaced.length === 1 ? [`replaces ${replaced[0].selection.path}'s local changes`] : []),
+        ...(replaced.length > 1 ? [`replaces local changes in ${replaced.length} Skills`] : []),
+        ...(commands === 0 ? [] : [`runs ${commands} ${commands === 1 ? "command" : "commands"}`]),
+    ];
+}
 export function updateModePreviewChrome(mode) {
     switch (mode.kind) {
         case "preview": {
             const count = mode.prepared.applicable.length;
-            const question = `Apply ${count} ${count === 1 ? "update" : "updates"}? y/n`;
-            return {
-                title: "Update batch preview",
-                questions: ["Scroll to end before confirming; n cancels.", question],
-                footerRows: 2,
-            };
+            if (count === 0)
+                return { title: "Update batch preview", consequence: "Nothing can be applied.", cancel: "[Enter/Esc] back" };
+            const action = mode.prepared.document.action;
+            return { title: "Update batch preview", action, consequence: [...previewEffects(mode.prepared), `${action}? y/n`].join(" · ") };
         }
         case "manual":
-            return {
-                title: "Manual App update",
-                questions: ["Scroll to end before confirming; n cancels.", "Manual step done, check now? y/n"],
-                footerRows: 2,
-            };
+            return { title: "Manual App update", action: "Check now", consequence: "Manual step done, check now? y/n" };
         case "confirm-paths":
-            return {
-                title: "Confirm replacing non-canonical locations",
-                questions: ["Scroll to end before confirming; n cancels.", "Replace exactly these paths? y/n"],
-                footerRows: 2,
-            };
+            return { title: "Confirm replacing non-canonical locations", action: "Replace these paths", consequence: "Replace exactly these paths? y/n" };
         default:
-            return { title: "Updates", questions: ["Continue? y/n"] };
-    }
-}
-export function updateModeQuestion(mode, reachedEnd) {
-    if (mode.kind === "preview" && mode.prepared.applicable.length === 0) {
-        return "Nothing can be applied. Enter or Esc to go back.";
+            return { title: "Updates" };
     }
-    const chrome = updateModePreviewChrome(mode);
-    return reachedEnd ? chrome.questions.at(-1) ?? "Continue? y/n" : chrome.questions[0] ?? "Scroll to end before confirming; n cancels.";
 }

package/dist/src/tui/updates-view.js

@@ -1,8 +1,9 @@
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { Box, Text, useWindowSize } from "ink";
+import { Box } from "ink";
+import { Text } from "./safe-text.js";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { theme } from "./theme.js";
-import { previewViewport } from "./preview-window.js";
+import { usePreviewGeometry } from "./preview-window.js";
 import { computeWindow, useListHeight } from "./window.js";
 import { BROWSE } from "./updates-mode.js";
 import { defaultExpanded } from "./tree.js";
@@ -11,16 +12,21 @@ import { useUpdatesFlow } from "./updates-flow.js";
 import { handleUpdatesKey } from "./updates-keys.js";
 import { entryId, viewOf } from "./updates-model.js";
 import { CheckStatus, EntryLine, ModePanel, UpdatesFooter } from "./updates-panel.js";
-import { previewLineText } from "./updates.js";
+import { lineText } from "./preview-render.js";
 import { updateModePreviewChrome, updateModePreviewLines } from "./updates-preview.js";
 import { useKeys } from "./keys.js";
 import { BorderPanel, Working } from "./panel-parts.js";
+/** Whether the working panel is drawn. A preview owns the screen: its height was computed without the panel, so the two never share it. */
+export function showsWorkingPanel(state, mode) {
+    if (mode.kind === "preview" || mode.kind === "manual" || mode.kind === "confirm-paths")
+        return false;
+    return state.status === "loading" || mode.kind === "busy";
+}
 const NO_ENVIRONMENT = {};
 /** How often the age of the check is redrawn. */
 const CLOCK_TICK_MS = 10_000;
 export function UpdatesView({ operations, environment, onCapturingChange, listHeight, now }) {
     const height = useListHeight(listHeight, 9);
-    const { rows: terminalRows, columns: terminalColumns } = useWindowSize();
     const env = environment ?? NO_ENVIRONMENT;
     const clock = now ?? Date.now;
     // Scope, cursor, fold and selection are mirrored in refs updated first, so keys delivered in one burst act on the latest state.
@@ -73,7 +79,7 @@ export function UpdatesView({ operations, environment, onCapturingChange, listHe
     const { state, load, startPreview, apply } = useUpdatesFlow({
         operations, env, clock, mounted, checkedRef, latest, setChecked, setCursor, setMode, modeRef, setMessage,
     });
-    // Entering the view refreshes the Git sources first, like `r`.
+    // Entering the view refreshes the Git sources first, like `r`, but may reuse a recent refresh (ADR 0004).
     useEffect(() => {
         void load(true);
     }, [load]);
@@ -81,10 +87,8 @@ export function UpdatesView({ operations, environment, onCapturingChange, listHe
     dataRef.current = data;
     const { shown, updatable, unknown, upToDate, entries } = viewOf(data, scope, showUnknown, expanded);
     const index = Math.min(cursor, Math.max(entries.length - 1, 0));
-    const previewGeometry = (current) => {
-        const cursor = "cursor" in current ? current.cursor : 0;
-        return previewViewport(updateModePreviewLines(current).map(previewLineText), cursor, terminalRows || 24, terminalColumns || 80, updateModePreviewChrome(current));
-    };
+    const geometry = usePreviewGeometry();
+    const previewGeometry = (current) => geometry(updateModePreviewLines(current).map(lineText), "cursor" in current ? current.cursor : 0, updateModePreviewChrome(current));
     const keyContext = {
         height,
         now: clock,
@@ -105,7 +109,7 @@ export function UpdatesView({ operations, environment, onCapturingChange, listHe
         recheck: () => {
             setMessage(undefined);
             setShowUnknown(false);
-            void load(true);
+            void load(true, true);
         },
         startPreview: () => void startPreview(),
         setMode,
@@ -118,6 +122,6 @@ export function UpdatesView({ operations, environment, onCapturingChange, listHe
     const hasErrors = data?.appError !== undefined || (data?.results ?? []).some((result) => result.error !== undefined);
     const showingBrowse = mode.kind === "browse";
     // One indicator for the whole operation: a check's own phase label, else the busy mode's.
-    const working = state.status === "loading" ? state : mode.kind === "busy" ? mode : undefined;
+    const working = !showsWorkingPanel(state, mode) ? undefined : state.status === "loading" ? state : mode.kind === "busy" ? mode : undefined;
     return (_jsxs(Box, { flexDirection: "column", children: [showingBrowse ? _jsxs(Text, { color: theme.title, bold: true, children: ["Updates (scope: ", scope, ")  t all \u00B7 p project \u00B7 g user-global \u00B7 u update"] }) : null, working ? _jsx(BorderPanel, { title: state.status === "loading" ? "Update check" : "Updates", children: _jsx(Working, { label: working.label, since: working.startedAt, now: clock }) }) : null, showingBrowse && data ? _jsx(CheckStatus, { data: data, now: clock() }) : null, showingBrowse && data && !hasErrors && shown.length === 0 ? _jsx(Text, { children: "No installations" }) : null, showingBrowse ? entries.slice(window.start, window.end).map((entry, offset) => (_jsx(EntryLine, { entry: entry, selected: window.start + offset === index, checked: checked, view: view, showUnknown: showUnknown }, entryId(entry)))) : null, showingBrowse ? _jsx(UpdatesFooter, { indicator: window.indicator, upToDate: upToDate, updatableCount: updatable.length, checkedCount: checked.length, message: message }) : null, _jsx(ModePanel, { mode: mode })] }));
 }