@iseoane/agent-depot 0.6.13 → 0.6.14

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

@@ -1,5 +1,6 @@
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { Box, Text } from "ink";
+import { Box } from "ink";
+import { Text } from "./safe-text.js";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { createAppOperations } from "../app-flow.js";
 import { planAppRecipeRemoval, removeAppRecipe } from "../app-recipe-removal.js";
@@ -7,12 +8,14 @@ import { BUILT_IN_SOURCE } from "../sources.js";
 import { handleCatalogActionKey } from "./catalog-flow.js";
 import { ActionPanel } from "./catalog-panel.js";
 import { hasUnmanagedCopy, isInstalled, loadInstalledSkills } from "./catalog-installs.js";
-import { appName, appRecipePreviewLines, appStepLines } from "./app-actions.js";
+import { appName, appPlanLines, appRecipePreviewLines, recipeApprovalChrome } from "./app-actions.js";
 import { errorText } from "./batch.js";
 import { useMounted } from "./view-state.js";
-import { BorderPanel, DecisionPrompt, PreviewConfirm, Working } from "./panel-parts.js";
+import { BorderPanel, DecisionPrompt, PagedPreview, Working } from "./panel-parts.js";
+import { isYes } from "./keys.js";
 import { answerYesNo, movePreviewCursor } from "./mode-keys.js";
-import { previewViewport } from "./preview-window.js";
+import { usePreviewGeometry } from "./preview-window.js";
+import { lineText, textLine } from "./preview-render.js";
 import { theme } from "./theme.js";
 import { busy } from "./working-model.js";
 /**
@@ -34,24 +37,24 @@ export function groupRecipeRows(rows) {
 function recipeMemberLine(row) {
     return `${row.entry.recipe?.platform ?? "all platforms"} · ${row.status} · ${row.entry.file}${row.entry.applicable ? " (used here)" : ""}`;
 }
-function recipeApprovalChrome(entry) {
-    return {
-        title: "Recipe approval · does not install",
-        questions: [`Approve ${appName(entry)}? y/n · recipe approval does not install the App.`, "Scroll to end before y; n cancels."],
-        footerRows: 2,
-    };
-}
 function uninstallChrome(mode) {
-    return {
-        title: mode.kind === "uninstall-manual" ? "App manual uninstall" : "App uninstall confirmation",
-        questions: [mode.kind === "uninstall-manual" ? "Complete the manual uninstall, then check now? y/n" : `Uninstall ${appName(mode.removal.entry)}? y/n`, "Scroll to end before y; n cancels."],
-        footerRows: 2,
-    };
+    const name = appName(mode.removal.entry);
+    return mode.kind === "uninstall-manual"
+        ? { title: "App manual uninstall", action: "Check the uninstall now", consequence: "Complete the manual uninstall, then check now? y/n" }
+        : { title: "App uninstall confirmation", action: `Uninstall ${name}`, consequence: `Uninstall ${name}? y/n` };
+}
+function removeChrome(removal) {
+    const name = appName(removal.entry);
+    return { title: "Recipe removal", action: `Remove the ${name} recipe`, consequence: `Remove recipe for ${name}? y/n` };
+}
+function removeLines(removal) {
+    return [`Delete recipe: ${removal.file}`, "Only this recipe file or symlink will be removed; App data and Host configuration are not deleted."];
 }
 /**
  * Recipe loading and captured actions; Sources owns the single list and cursor.
  */
-export function useSourcesRecipes({ operations, environment, onCapturingChange, highlightedFile, terminalRows, terminalColumns, }) {
+export function useSourcesRecipes({ operations, environment, onCapturingChange, highlightedFile, }) {
+    const previewGeometry = usePreviewGeometry();
     const homeDirectory = environment?.homeDirectory;
     const appEnvironment = environment?.appEnvironment;
     const apps = useMemo(() => createAppOperations({
@@ -90,7 +93,9 @@ export function useSourcesRecipes({ operations, environment, onCapturingChange,
                     kind: "approve",
                     entry, removeAfterApproval, cursor: 0,
                     lines: [
-                        ...(members.length > 1 ? [`Recipes named ${appName(entry)}:`, ...members.map(row => `  ${recipeMemberLine(row)}`), ""] : []),
+                        ...(members.length > 1
+                            ? [textLine(`Recipes named ${appName(entry)}:`), ...members.map(row => textLine(`  ${recipeMemberLine(row)}`)), textLine(" ")]
+                            : []),
                         ...appRecipePreviewLines(entry, status, steps),
                     ],
                 });
@@ -106,6 +111,7 @@ export function useSourcesRecipes({ operations, environment, onCapturingChange,
     const flow = {
         operations,
         env: environment ?? {},
+        previewGeometry,
         isMounted: () => mounted.current,
         setAction: action => setMode(action.kind === "browse"
             ? { kind: "browse" }
@@ -161,7 +167,7 @@ export function useSourcesRecipes({ operations, environment, onCapturingChange,
             }
             const removal = await planAppRecipeRemoval(apps, entry);
             if (mounted.current)
-                setMode({ kind: removal.installed ? "uninstall-question" : "remove", removal });
+                setMode(removal.installed ? { kind: "uninstall-question", removal } : { kind: "remove", removal, cursor: 0 });
         }
         catch (error) {
             if (mounted.current) {
@@ -181,7 +187,7 @@ export function useSourcesRecipes({ operations, environment, onCapturingChange,
             if (result.status === "manual required")
                 setMode({ ...current, kind: "uninstall-manual" });
             else if (result.status === "untracked")
-                setMode({ kind: "remove", removal: current.removal });
+                setMode({ kind: "remove", removal: current.removal, cursor: 0 });
             else {
                 setError(`Uninstall failed: ${result.reason ?? result.status}; recipe retained`);
                 setMode({ kind: "browse" });
@@ -229,13 +235,13 @@ export function useSourcesRecipes({ operations, environment, onCapturingChange,
             return true;
         }
         if (current.kind === "approve") {
-            const viewport = previewViewport(current.lines, current.cursor, terminalRows, terminalColumns, recipeApprovalChrome(current.entry));
+            const viewport = previewGeometry(current.lines.map(lineText), current.cursor, recipeApprovalChrome(current.entry));
             const cursor = movePreviewCursor(current.cursor, viewport.total, input, key, viewport.height);
             if (cursor !== undefined)
                 setMode({ ...current, cursor });
             else if (input === "n" || key.escape)
                 cancel();
-            else if (input === "y" && viewport.reachedEnd) {
+            else if (isYes(input, key) && viewport.reachedEnd) {
                 setBusy("Approving App recipe…");
                 void apps.approve(current.entry).then(async () => {
                     await reload();
@@ -268,18 +274,26 @@ export function useSourcesRecipes({ operations, environment, onCapturingChange,
             return true;
         }
         if (current.kind === "uninstall-confirm" || current.kind === "uninstall-manual") {
-            const lines = appStepLines(current.plan);
-            const viewport = previewViewport(lines, current.cursor, terminalRows, terminalColumns, uninstallChrome(current));
+            const lines = appPlanLines(current.plan).map(lineText);
+            const viewport = previewGeometry(lines, current.cursor, uninstallChrome(current));
             const cursor = movePreviewCursor(current.cursor, viewport.total, input, key, viewport.height);
             if (cursor !== undefined)
                 setMode({ ...current, cursor });
             else if (input === "n" || key.escape)
                 cancel();
-            else if (input === "y" && viewport.reachedEnd)
+            else if (isYes(input, key) && viewport.reachedEnd)
                 void uninstall(current);
             return true;
         }
         if (current.kind === "remove") {
+            const viewport = previewGeometry(removeLines(current.removal), current.cursor, removeChrome(current.removal));
+            const cursor = movePreviewCursor(current.cursor, viewport.total, input, key, viewport.height);
+            if (cursor !== undefined) {
+                setMode({ ...current, cursor });
+                return true;
+            }
+            if (isYes(input, key) && !viewport.reachedEnd)
+                return true;
             answerYesNo(input, key, () => {
                 setBusy("Removing App recipe…");
                 void removeAppRecipe(apps, current.removal, true).then(async () => {
@@ -344,15 +358,22 @@ export function useSourcesRecipes({ operations, environment, onCapturingChange,
         }
     }, [apps, mounted]);
     useEffect(() => { void reload(); }, [reload]);
-    const panel = (_jsxs(Box, { flexDirection: "column", children: [loadError ? _jsxs(Text, { color: theme.error, children: ["Error loading App recipes: ", loadError] }) : null, error ? _jsx(Text, { color: theme.error, children: error }) : null, notice ? _jsx(Text, { color: theme.success, children: notice }) : null, mode.kind === "guide" ? (_jsxs(BorderPanel, { title: "Add an App recipe", children: [_jsx(Text, { children: "1 With the AI skill \u00B7 install if missing, then copy the prompt" }), _jsx(Text, { children: "2 Manual \u00B7 write a recipe using the schema" }), _jsx(Text, { children: "n or Esc closes" })] })) : null, mode.kind === "manual" ? (_jsxs(BorderPanel, { title: "Write an App recipe", children: [_jsxs(Text, { children: ["Write a JSON recipe in ", apps.directory] }), _jsx(Text, { children: "Schema: agent-depot app schema \u00B7 n or Esc closes" })] })) : null, mode.kind === "prompt" ? (_jsxs(BorderPanel, { title: "App recipe authoring prompt", children: [_jsx(Text, { children: "Use the agent-depot-apprecipe skill to create the recipe for <app>" }), _jsxs(Text, { children: ["Recipes: ", apps.directory, " \u00B7 n or Esc closes"] })] })) : null, mode.kind === "install" ? _jsx(ActionPanel, { mode: mode.action }) : null, mode.kind === "busy" ? _jsx(BorderPanel, { title: "App recipe workflow", children: _jsx(Working, { label: mode.label, since: mode.startedAt }) }) : null, mode.kind === "approve" ? (() => {
+    // A paged preview sizes itself to the whole terminal, so no message row may sit above it.
+    const pagedPreview = (mode.kind === "install" && mode.action.kind === "confirm-install")
+        || ["approve", "remove", "uninstall-confirm", "uninstall-manual"].includes(mode.kind);
+    const panel = (_jsxs(Box, { flexDirection: "column", children: [loadError && !pagedPreview ? _jsxs(Text, { color: theme.error, children: ["Error loading App recipes: ", loadError] }) : null, error && !pagedPreview ? _jsx(Text, { color: theme.error, children: error }) : null, notice && !pagedPreview ? _jsx(Text, { color: theme.success, children: notice }) : null, mode.kind === "guide" ? (_jsxs(BorderPanel, { title: "Add an App recipe", children: [_jsx(Text, { children: "1 With the AI skill \u00B7 install if missing, then copy the prompt" }), _jsx(Text, { children: "2 Manual \u00B7 write a recipe using the schema" }), _jsx(Text, { children: "n or Esc closes" })] })) : null, mode.kind === "manual" ? (_jsxs(BorderPanel, { title: "Write an App recipe", children: [_jsxs(Text, { children: ["Write a JSON recipe in ", apps.directory] }), _jsx(Text, { children: "Schema: agent-depot app schema \u00B7 n or Esc closes" })] })) : null, mode.kind === "prompt" ? (_jsxs(BorderPanel, { title: "App recipe authoring prompt", children: [_jsx(Text, { children: "Use the agent-depot-apprecipe skill to create the recipe for <app>" }), _jsxs(Text, { children: ["Recipes: ", apps.directory, " \u00B7 n or Esc closes"] })] })) : null, mode.kind === "install" ? _jsx(ActionPanel, { mode: mode.action }) : null, mode.kind === "busy" ? _jsx(BorderPanel, { title: "App recipe workflow", children: _jsx(Working, { label: mode.label, since: mode.startedAt }) }) : null, mode.kind === "approve" ? (() => {
                 const chrome = recipeApprovalChrome(mode.entry);
-                const viewport = previewViewport(mode.lines, mode.cursor, terminalRows, terminalColumns, chrome);
-                return _jsx(PreviewConfirm, { title: chrome.title, lines: mode.lines, cursor: mode.cursor, question: viewport.reachedEnd ? chrome.questions[0] : chrome.questions[1], chrome: chrome });
+                const lines = mode.lines.map(lineText);
+                return _jsx(PagedPreview, { chrome: chrome, lines: lines, styled: mode.lines, viewport: previewGeometry(lines, mode.cursor, chrome) });
             })() : null, mode.kind === "pick" ? (_jsxs(BorderPanel, { title: "Remove which recipe?", children: [mode.members.map((row, index) => _jsxs(Text, { children: [index + 1, " ", recipeMemberLine(row)] }, row.entry.file)), _jsx(Text, { color: theme.legend, children: "Press a number to review that one file for removal \u00B7 n or Esc cancels" })] })) : null, mode.kind === "uninstall-question" ? (_jsxs(BorderPanel, { title: "Uninstall before recipe removal", children: [_jsxs(Text, { children: ["App ", appName(mode.removal.entry), " is installed or tracked", mode.removal.installedVersion ? ` (${mode.removal.installedVersion})` : "", "."] }), _jsxs(Text, { children: [_jsx(DecisionPrompt, { children: "Uninstall it before removing the recipe?" }), _jsx(Text, { color: theme.legend, children: "(n cancels removal)" })] })] })) : null, mode.kind === "uninstall-confirm" || mode.kind === "uninstall-manual" ? (() => {
                 const chrome = uninstallChrome(mode);
-                const lines = appStepLines(mode.plan);
-                const viewport = previewViewport(lines, mode.cursor, terminalRows, terminalColumns, chrome);
-                return _jsx(PreviewConfirm, { title: chrome.title, lines: lines, cursor: mode.cursor, question: viewport.reachedEnd ? chrome.questions[0] : chrome.questions[1], chrome: chrome });
-            })() : null, mode.kind === "remove" ? (_jsx(PreviewConfirm, { title: "Recipe removal", lines: [`Delete recipe: ${mode.removal.file}`, "Only this recipe file or symlink will be removed; App data and Host configuration are not deleted."], question: `Remove recipe for ${appName(mode.removal.entry)}? y/n` })) : null] }));
+                const styled = appPlanLines(mode.plan);
+                const lines = styled.map(lineText);
+                return _jsx(PagedPreview, { chrome: chrome, lines: lines, styled: styled, viewport: previewGeometry(lines, mode.cursor, chrome) });
+            })() : null, mode.kind === "remove" ? (() => {
+                const chrome = removeChrome(mode.removal);
+                const lines = removeLines(mode.removal);
+                return _jsx(PagedPreview, { chrome: chrome, lines: lines, viewport: previewGeometry(lines, mode.cursor, chrome) });
+            })() : null] }));
     return { rows, loadingSince, handleKey, startAdd, reload, clearMessage: () => { setError(undefined); setNotice(undefined); }, panel, directory: apps.directory, capturing: mode.kind !== "browse" };
 }

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

@@ -1,15 +1,18 @@
 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 { formatAgo } from "./updates.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 +32,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 +44,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 _jsxs(Text, { color: theme.success, children: ["\u2713 refreshed ", formatAgo(now - (state.finishedAt ?? now))] });
+        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 +177,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 +185,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 +289,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 +378,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 +399,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, { chrome: chrome, lines: lines, viewport: previewGeometry(lines, mode.cursor, chrome) });
     }
     return null;
 }

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, { chrome: chrome, lines: lines, styled: styled, viewport: usePreviewGeometry()(lines, mode.cursor, chrome) });
 }
 export function ModePanel({ mode }) {
     switch (mode.kind) {