git-coco 0.40.0 → 0.41.0

package/dist/index.esm.mjs

@@ -53,7 +53,7 @@ import { pathToFileURL } from 'url';
 /**
  * Current build version from package.json
  */
-const BUILD_VERSION = "0.40.0";
+const BUILD_VERSION = "0.41.0";
 
 const isInteractive = (config) => {
     return config?.mode === 'interactive' || !!config?.interactive;
@@ -2127,11 +2127,21 @@ function formatAuthenticationError(error, logger) {
     logger.verbose(`\nOriginal error: ${error.message}`, { color: 'gray' });
 }
 /**
- * Formats a generic error
+ * Formats a generic error.
+ *
+ * The error message prints unconditionally (was previously gated behind
+ * `--verbose`, which left users staring at a "Failed to execute command"
+ * line with no actionable detail when something crashed). The full stack
+ * trace stays under `logger.verbose` so plain output stays focused on the
+ * one-line cause; users running into something they can't diagnose can opt
+ * in with `--verbose` for the trace.
  */
 function formatGenericError(error, logger) {
     logger.log('\nFailed to execute command', { color: 'yellow' });
-    logger.verbose(`\nError: "${error.message}"`, { color: 'red' });
+    logger.log(`\nError: ${error.message}`, { color: 'red' });
+    if (error.stack) {
+        logger.verbose(`\n${error.stack}`, { color: 'gray' });
+    }
 }
 function commandExecutor(handler) {
     return async (argv) => {
@@ -16303,6 +16313,11 @@ function replaceRows(state, rows) {
         selectedFileIndex: 0,
         pendingCommitFocused: false,
         pendingKey: undefined,
+        // Rows just landed — clear the boot-loading flag so the history
+        // surface drops the "Loading commits…" placeholder. Safe to clear
+        // unconditionally because `replaceRows` only fires after a real
+        // git log returns.
+        bootLoading: false,
     };
 }
 function appendRows(state, rows) {
@@ -16393,6 +16408,7 @@ function createLogInkState(rows, options = {}) {
         diffViewMode: 'unified',
         inspectorTab: 'inspector',
         inspectorActionIndex: 0,
+        bootLoading: options.bootLoading ?? false,
     };
 }
 function getSelectedInkCommit(state) {
@@ -16594,6 +16610,12 @@ function applyLogInkAction(state, action) {
                 inspectorActionIndex: 0,
                 pendingKey: undefined,
             };
+        case 'setBootLoading':
+            return {
+                ...state,
+                bootLoading: action.value,
+                pendingKey: undefined,
+            };
         case 'moveTag':
             return {
                 ...state,
@@ -17932,6 +17954,18 @@ function getLogInkInputEvents(state, inputValue, key = {}, context = {}) {
     if (key.rightArrow && state.focus === 'sidebar') {
         return [action({ type: 'nextSidebarTab' })];
     }
+    // ←/→ on the inspector switch between the [Inspector] / [Actions]
+    // tabs, mirroring the sidebar's left/right tab semantics. `[` and
+    // `]` still work as keyboard alternatives, but the visible hint in
+    // the inspector chrome shows ←/→ because the bracketed `[/]`
+    // notation reads as "press the / key" — which is the global filter
+    // trigger and was making users think the binding was busted.
+    if (key.leftArrow && state.focus === 'detail') {
+        return [action({ type: 'setInspectorTab', value: 'inspector' })];
+    }
+    if (key.rightArrow && state.focus === 'detail') {
+        return [action({ type: 'setInspectorTab', value: 'actions' })];
+    }
     // ←/→ on the status surface jump between the staged / unstaged /
     // untracked groups — the horizontal axis is "between groups", the
     // vertical axis (↑/↓ below) is "within the active group's files".
@@ -18658,7 +18692,7 @@ function getLogInkInputEvents(state, inputValue, key = {}, context = {}) {
  * fall back to "already seen" so we never block startup.
  */
 const MARKER_BASENAME = 'onboarding.seen';
-function resolveCacheDir$2() {
+function resolveCacheDir$3() {
     const xdg = process.env.XDG_CACHE_HOME;
     if (xdg && xdg.trim().length > 0) {
         return path$1.join(xdg, 'coco');
@@ -18666,7 +18700,7 @@ function resolveCacheDir$2() {
     return path$1.join(os$1.homedir(), '.cache', 'coco');
 }
 function getOnboardingMarkerPath() {
-    return path$1.join(resolveCacheDir$2(), MARKER_BASENAME);
+    return path$1.join(resolveCacheDir$3(), MARKER_BASENAME);
 }
 function hasSeenOnboarding() {
     try {
@@ -18697,14 +18731,14 @@ function markOnboardingSeen() {
  * settings: best-effort, XDG-friendly, no PII in the cache filename.
  */
 const VALID_MODES = ['unified', 'split'];
-function resolveCacheDir$1() {
+function resolveCacheDir$2() {
     const xdg = process.env.XDG_CACHE_HOME;
     if (xdg && xdg.trim().length > 0) {
         return path$1.join(xdg, 'coco');
     }
     return path$1.join(os$1.homedir(), '.cache', 'coco');
 }
-function repoKey$1(repoPath) {
+function repoKey$2(repoPath) {
     // sha1 is used here as a non-security cache-key derivation — we just
     // need a deterministic short identifier for the marker filename. No
     // PII or auth context is hashed.
@@ -18712,7 +18746,7 @@ function repoKey$1(repoPath) {
     return crypto.createHash('sha1').update(repoPath).digest('hex').slice(0, 16);
 }
 function getDiffViewModeMarkerPath(repoPath) {
-    return path$1.join(resolveCacheDir$1(), `diff-view-mode.${repoKey$1(repoPath)}`);
+    return path$1.join(resolveCacheDir$2(), `diff-view-mode.${repoKey$2(repoPath)}`);
 }
 function getSavedDiffViewMode(repoPath) {
     try {
@@ -18754,14 +18788,14 @@ const VALID_TABS = [
     'stashes',
     'worktrees',
 ];
-function resolveCacheDir() {
+function resolveCacheDir$1() {
     const xdg = process.env.XDG_CACHE_HOME;
     if (xdg && xdg.trim().length > 0) {
         return path$1.join(xdg, 'coco');
     }
     return path$1.join(os$1.homedir(), '.cache', 'coco');
 }
-function repoKey(repoPath) {
+function repoKey$1(repoPath) {
     // sha1 is used here as a non-security cache-key derivation — we just
     // need a deterministic short identifier for the marker filename so
     // re-creating a repo at the same path keeps the same preference.
@@ -18771,7 +18805,7 @@ function repoKey(repoPath) {
     return crypto.createHash('sha1').update(repoPath).digest('hex').slice(0, 16);
 }
 function getSidebarTabMarkerPath(repoPath) {
-    return path$1.join(resolveCacheDir(), `sidebar-tab.${repoKey(repoPath)}`);
+    return path$1.join(resolveCacheDir$1(), `sidebar-tab.${repoKey$1(repoPath)}`);
 }
 function getSavedSidebarTab(repoPath) {
     try {
@@ -19198,9 +19232,16 @@ function getLogInkLayout(input) {
     // graph dominant; focus expansion gives the inspector room for long
     // commit bodies / file lists / action labels. Mirrors the sidebar
     // pattern (sidebarFocused above): instant transition per render.
-    const detailWidth = input.inspectorFocused
-        ? Math.max(36, Math.min(60, Math.floor(columns * 0.40)))
-        : Math.max(20, Math.min(32, Math.floor(columns * 0.22)));
+    //
+    // Help overlay overrides both — it borrows ~50% of the terminal so
+    // hotkey descriptions render in full instead of truncating to
+    // "Move focus...". Capped at 100 cells so a wide terminal doesn't
+    // waste an absurd amount of horizontal space on the cheat sheet.
+    const detailWidth = input.helpOverlayActive
+        ? Math.max(60, Math.min(100, Math.floor(columns * 0.50)))
+        : input.inspectorFocused
+            ? Math.max(36, Math.min(60, Math.floor(columns * 0.40)))
+            : Math.max(20, Math.min(32, Math.floor(columns * 0.22)));
     // Sidebar at rest: 22-34 cells (~24% of width). Focused: 32-50 cells
     // (~36% of width). The transition is instant per render — focus tab to
     // expand, focus away to collapse.
@@ -23692,15 +23733,20 @@ async function loadLogInkContext(git) {
     };
 }
 function loadLogInkContextEntries(git) {
+    // Boot-time per-key fetches. Each load() runs in parallel from
+    // `LogInkApp`'s mount effect. `pullRequest` is intentionally
+    // omitted (#808) — its `gh pr view --json` call duplicates the
+    // slim PR fetch already happening inside `getProviderOverview`,
+    // and the only consumer that needs the *full* enriched response is
+    // the dedicated PR view (`g p`). Lazy-loaded by a separate effect
+    // when the user actually navigates there. Header / yank / workflow
+    // paths read the slim version off `provider.currentPullRequest` so
+    // the chrome stays populated immediately on boot.
     return [
         {
             key: 'branches',
             load: () => safe(getBranchOverview(git)),
         },
-        {
-            key: 'pullRequest',
-            load: () => safe(getPullRequestOverview(git)),
-        },
         {
             key: 'tags',
             load: () => safe(getTagOverview(git)),
@@ -23913,8 +23959,15 @@ async function startInkInteractiveLog(git, rows, streams = {}, options = {}) {
     const input = streams.input || process.stdin;
     const output = streams.output || process.stdout;
     const error = streams.error || process.stderr;
+    // Non-TTY fallback (CI logs, piped output) needs the rows up-front
+    // because the renderer just dumps a static snapshot. Run the
+    // deferred loader synchronously here when present so callers get
+    // the same shape regardless of the entry path.
     if (!canStartLogInkTui(input, output)) {
-        await startInteractiveLog(git, rows, {
+        const fallbackRows = options.loadRows && rows.length === 0
+            ? await options.loadRows()
+            : rows;
+        await startInteractiveLog(git, fallbackRows, {
             appLabel: options.appLabel,
             input,
             output,
@@ -23933,6 +23986,7 @@ async function startInkInteractiveLog(git, rows, streams = {}, options = {}) {
         ink,
         initialView: options.initialView || 'history',
         logArgv: options.logArgv,
+        loadRows: options.loadRows,
         React,
         rows,
         theme: createLogInkTheme(options.theme),
@@ -24029,7 +24083,7 @@ function enrichFilterActionWithRectification(action, state, context) {
     }
 }
 function LogInkApp(deps) {
-    const { appLabel, clipboardRunner, git, idleTipsEnabled, ink, initialView, logArgv, React, resumeRef, rows, theme } = deps;
+    const { appLabel, clipboardRunner, git, idleTipsEnabled, ink, initialView, loadRows, logArgv, React, resumeRef, rows, theme } = deps;
     const { Box, Text, useApp, useInput, useWindowSize } = ink;
     const h = React.createElement;
     const { exit } = useApp();
@@ -24050,9 +24104,26 @@ function LogInkApp(deps) {
     // user's cache dir so the tip never reappears once dismissed. Lazy
     // initializer so the fs check only runs on mount, not every render.
     const [showOnboarding, setShowOnboarding] = React.useState(() => !hasSeenOnboarding());
-    const [state, setState] = React.useState(() => createLogInkState(rows, { activeView: initialView }));
+    const [state, setState] = React.useState(() => createLogInkState(rows, {
+        activeView: initialView,
+        // Boot loader is in flight whenever the caller passed
+        // `loadRows`, regardless of whether `rows` was empty or
+        // pre-populated from the disk cache (#808). The history
+        // surface only shows the "Loading commits…" placeholder when
+        // there are zero visible commits, so cached data renders
+        // immediately while the chrome still flags the refresh.
+        bootLoading: Boolean(loadRows),
+    }));
     const [context, setContext] = React.useState({});
-    const [contextStatus, setContextStatus] = React.useState(() => createLogInkContextStatus('loading'));
+    const [contextStatus, setContextStatus] = React.useState(() => {
+        // Boot starts every fetched key in 'loading' so the surfaces show
+        // their loading hints immediately. `pullRequest` is the exception
+        // (#808) — it isn't part of the boot fetch entries; it lazy-loads
+        // when the user enters the PR view. Marking it 'idle' avoids a
+        // permanent "loading" flag in the chrome and lets the dedicated
+        // PR view's own load effect drive its loading state.
+        return updateLogInkContextStatus(createLogInkContextStatus('loading'), 'pullRequest', 'idle');
+    });
     const [detail, setDetail] = React.useState(undefined);
     const [detailLoading, setDetailLoading] = React.useState(false);
     const [filePreview, setFilePreview] = React.useState(undefined);
@@ -24123,9 +24194,78 @@ function LogInkApp(deps) {
     const visibleWorktreeGroups = React.useMemo(() => groupWorktreeFiles(visibleWorktreeFiles), [visibleWorktreeFiles]);
     const visibleWorktreeFilesGrouped = React.useMemo(() => flattenWorktreeGroups(visibleWorktreeGroups), [visibleWorktreeGroups]);
     const selectedWorktreeFile = visibleWorktreeFilesGrouped[state.selectedWorktreeFileIndex];
+    // Stash patch per-file segmentation (#808). Hoisted out of the
+    // useInput callback (was running on every keystroke), the yank
+    // handler (was running per `y` press), and renderDiffSurface (was
+    // running per paint) into a single LogInkApp-scoped memo. When the
+    // active stash diff has hundreds of files, the prior fan-out was
+    // re-walking the entire patch text 2-3x per keystroke for no
+    // observable reason — the parsed list is purely a function of the
+    // line array, which only changes when the user opens a different
+    // stash.
+    const stashDiffParsedFiles = React.useMemo(() => stashDiffLines ? parseStashDiffFiles(stashDiffLines) : [], [stashDiffLines]);
+    // Filtered promoted-view lists (#808). These were recomputed inline
+    // inside useInput on every keystroke — for a repo with hundreds of
+    // branches / tags and an active filter, that's hundreds of regex
+    // matches per arrow-key press. Memoizing on (raw list, filter)
+    // collapses the work to one pass per filter / data change.
+    const filteredBranchList = React.useMemo(() => {
+        const all = context.branches?.localBranches || [];
+        if (!state.filter)
+            return all;
+        return all.filter((branch) => matchesPromotedFilter([branch.shortName, branch.upstream || ''], state.filter));
+    }, [context.branches?.localBranches, state.filter]);
+    const filteredTagList = React.useMemo(() => {
+        const all = context.tags?.tags || [];
+        if (!state.filter)
+            return all;
+        return all.filter((tag) => matchesPromotedFilter([tag.name, tag.subject], state.filter));
+    }, [context.tags?.tags, state.filter]);
+    const filteredStashList = React.useMemo(() => {
+        const all = context.stashes?.stashes || [];
+        if (!state.filter)
+            return all;
+        return all.filter((stash) => matchesPromotedFilter([stash.ref, stash.message], state.filter));
+    }, [context.stashes?.stashes, state.filter]);
+    const filteredWorktreeList = React.useMemo(() => {
+        const all = context.worktreeList?.worktrees || [];
+        if (!state.filter)
+            return all;
+        return all.filter((entry) => matchesPromotedFilter([entry.path, entry.branch || ''], state.filter));
+    }, [context.worktreeList?.worktrees, state.filter]);
     const dispatch = React.useCallback((action) => {
         setState((current) => applyLogInkAction(current, action));
     }, []);
+    // Deferred commit-log loader (#808). Runs once on mount when the
+    // caller opted into the lazy boot path. The Ink tree is already on
+    // screen at this point — without this the user stares at a black
+    // terminal during the synchronous git log pre-mount fetch. The
+    // mounted-ref guard prevents a late-resolving promise from
+    // dispatching after the user `q` quits before rows arrive.
+    React.useEffect(() => {
+        if (!loadRows)
+            return;
+        let cancelled = false;
+        void loadRows()
+            .then((nextRows) => {
+            if (cancelled || !mountedRef.current)
+                return;
+            dispatch({ type: 'replaceRows', rows: nextRows });
+        })
+            .catch((error) => {
+            if (cancelled || !mountedRef.current)
+                return;
+            const message = error instanceof Error ? error.message : String(error);
+            dispatch({ type: 'setStatus', value: `Failed to load commits: ${message}` });
+            dispatch({ type: 'setBootLoading', value: false });
+        });
+        return () => {
+            cancelled = true;
+        };
+        // Intentionally one-shot — re-running the boot load on hot
+        // dispatch / loader changes would refetch the entire log on every
+        // re-render. The loader fires once per app mount and that's it.
+    }, []);
     // Auto-dismiss status messages after a short window so transient
     // confirmations ("Pulled current branch", "Edited foo.ts") don't
     // linger forever. Each new message resets the timer; clearing the
@@ -24347,6 +24487,34 @@ function LogInkApp(deps) {
             active = false;
         };
     }, [git]);
+    // Lazy-load the full pullRequest overview (#808). Only fires when
+    // the user actually navigates to the PR view, and only when we
+    // don't already have data (so a workflow-triggered refresh that
+    // hydrated `pullRequest` doesn't re-fetch on view entry). The
+    // dedicated PR view shows its own loading state while this is in
+    // flight; everywhere else (header glyph, yank, workflow runner)
+    // already falls through to the slim `provider.currentPullRequest`
+    // so the chrome stays populated immediately on boot.
+    React.useEffect(() => {
+        if (state.activeView !== 'pull-request')
+            return;
+        if (context.pullRequest)
+            return;
+        let active = true;
+        setContextStatus((current) => updateLogInkContextStatus(current, 'pullRequest', 'loading'));
+        void safe(getPullRequestOverview(git)).then((value) => {
+            if (!active)
+                return;
+            setContext((current) => ({
+                ...current,
+                pullRequest: value,
+            }));
+            setContextStatus((current) => updateLogInkContextStatus(current, 'pullRequest', 'ready'));
+        });
+        return () => {
+            active = false;
+        };
+    }, [git, state.activeView, context.pullRequest]);
     React.useEffect(() => {
         let active = true;
         async function loadDetail() {
@@ -25098,8 +25266,9 @@ function LogInkApp(deps) {
             else if (state.diffSource === 'stash' && stashDiffLines) {
                 // Walk back to the most recent file header at or before the
                 // current preview offset — same logic the input-context block
-                // uses to expose stashDiffSelectedPath.
-                const current = findStashFileForOffset(parseStashDiffFiles(stashDiffLines), state.diffPreviewOffset);
+                // uses to expose stashDiffSelectedPath. Reads the memoized
+                // parse so the yank handler doesn't re-walk the entire patch.
+                const current = findStashFileForOffset(stashDiffParsedFiles, state.diffPreviewOffset);
                 if (current) {
                     value = current.path;
                     label = `path ${current.path}`;
@@ -25142,6 +25311,7 @@ function LogInkApp(deps) {
         selected,
         selectedDetailFile,
         stashDiffLines,
+        stashDiffParsedFiles,
         state.activeView,
         state.branchSort,
         state.diffPreviewOffset,
@@ -25356,43 +25526,25 @@ function LogInkApp(deps) {
         // P4.5: navigation in branches/tags/stash uses the FILTERED list
         // length when a filter is active so j/k stay live instead of getting
         // stuck against a full-list count that no longer matches what's on
-        // screen.
-        const branchVisibleCount = state.filter
-            ? (context.branches?.localBranches || [])
-                .filter((branch) => matchesPromotedFilter([branch.shortName, branch.upstream || ''], state.filter))
-                .length
-            : context.branches?.localBranches.length;
-        const tagVisibleCount = state.filter
-            ? (context.tags?.tags || [])
-                .filter((tag) => matchesPromotedFilter([tag.name, tag.subject], state.filter))
-                .length
-            : context.tags?.tags.length;
-        const visibleStashes = state.filter
-            ? (context.stashes?.stashes || [])
-                .filter((stash) => matchesPromotedFilter([stash.ref, stash.message], state.filter))
-            : (context.stashes?.stashes || []);
-        const stashVisibleCount = visibleStashes.length;
-        const stashSelectedRef = visibleStashes[Math.min(state.selectedStashIndex, Math.max(0, visibleStashes.length - 1))]?.ref;
-        // The worktrees promoted view is filterable; mirror the branches /
-        // tags / stash pattern and feed the filtered count into the input
-        // dispatcher so ↑/↓ stay synchronized with the visible rows.
-        const worktreeVisibleCount = state.filter
-            ? (context.worktreeList?.worktrees || [])
-                .filter((w) => matchesPromotedFilter([w.path, w.branch || ''], state.filter))
-                .length
-            : context.worktreeList?.worktrees.length;
+        // screen. The filtered lists are memoized at LogInkApp scope (#808
+        // perf pass) — reading them here is O(1) instead of O(branches +
+        // tags + stashes + worktrees) per keystroke.
+        const branchVisibleCount = filteredBranchList.length;
+        const tagVisibleCount = filteredTagList.length;
+        const stashVisibleCount = filteredStashList.length;
+        const stashSelectedRef = filteredStashList[Math.min(state.selectedStashIndex, Math.max(0, filteredStashList.length - 1))]?.ref;
+        const worktreeVisibleCount = filteredWorktreeList.length;
         // When the diff view is showing a stash patch, swap the previewLineCount
         // to the stash diff length so the existing pageDetailPreview path
         // (j/k, PgUp/PgDn) scrolls through it without a parallel pipeline.
         const diffPreviewLineCount = state.diffSource === 'stash'
             ? stashDiffLines?.length
             : filePreview?.hunks.length;
-        // Parse the active stash diff into per-file sections so `]`/`[` can
-        // jump between files and `c` knows which path the cursor is on for
-        // a file-level cherry-pick.
-        const stashDiffFiles = state.diffSource === 'stash' && stashDiffLines
-            ? parseStashDiffFiles(stashDiffLines)
-            : [];
+        // Per-file segmentation for stash diffs reads the LogInkApp-scoped
+        // memo so navigation keys + the input-context derivation share a
+        // single parse pass per stash patch instead of re-walking the
+        // entire patch text on every keystroke.
+        const stashDiffFiles = state.diffSource === 'stash' ? stashDiffParsedFiles : [];
         const stashDiffFileOffsets = stashDiffFiles.map((file) => file.startLine);
         const stashDiffSelectedPath = state.diffSource === 'stash'
             ? findStashFileForOffset(stashDiffFiles, state.diffPreviewOffset)?.path
@@ -25489,6 +25641,7 @@ function LogInkApp(deps) {
         rows: windowSize.rows || process.stdout.rows || LOG_INK_DEFAULT_ROWS,
         sidebarFocused: state.focus === 'sidebar',
         inspectorFocused: state.focus === 'detail',
+        helpOverlayActive: state.showHelp,
     });
     if (layout.tooSmall) {
         return h(Box, {
@@ -25518,7 +25671,13 @@ function renderHeader(h, components, state, context, contextStatus, columns, the
         ? `PR #${prInfo.number} ${prInfo.isDraft ? 'DRAFT' : prInfo.state}`
         : 'no PR';
     const search = state.filterMode ? `search: ${state.filter}_` : state.filter ? `filter: ${state.filter}` : '';
-    const loading = isLogInkContextLoading(contextStatus) ? '  loading context' : '';
+    // Boot loading wins over the per-context loading hint because it
+    // tells the user the headline thing they care about (commits aren't
+    // ready yet) — the context fetches finish independently and surface
+    // their own per-section loading copy in the sidebars.
+    const loading = state.bootLoading
+        ? '  loading commits'
+        : isLogInkContextLoading(contextStatus) ? '  loading context' : '';
     const breadcrumb = formatLogInkBreadcrumb(state.viewStack);
     const view = breadcrumb ? `  ${breadcrumb}` : '';
     // Mode indicator (P2.2) — surfaces the current input mode so users
@@ -25825,22 +25984,30 @@ function renderHistoryPanel(h, components, state, context, bodyRows, width, them
     ...(state.historyFetchArgs
         ? [h(Text, { key: 'history-fetch-indicator', dimColor: true }, `filter: ${formatHistoryFetchArgs(state.historyFetchArgs)}  (ctrl+u in / to clear)`)]
         : []), ...(pendingNode ? [pendingNode] : []), visible.items.length === 0
-        ? h(Text, { dimColor: true }, formatLogInkHistoryEmpty({
-            filter: state.filter,
-            totalCommits: state.commits.length,
-        }))
+        ? h(Text, { dimColor: true }, state.bootLoading
+            ? formatLogInkLoading({ resource: 'commits' })
+            : formatLogInkHistoryEmpty({
+                filter: state.filter,
+                totalCommits: state.commits.length,
+            }))
         : visible.items.map((item, index) => {
             if (item.type === 'graph') {
+                // Graph-only rows are git's lane-closure scaffolding (`|/`,
+                // `|\`, etc.) — they're real topology but visually they look
+                // like blank rows that the user might wonder if they
+                // accidentally skipped a commit on (#831). Render dim-on-dim
+                // so they retreat as connectors rather than competing with
+                // commit rows for the eye's attention.
                 if (item.laneSegments && !theme.ascii) {
-                    return h(Text, { key: `graph-${index}-${item.graph}` }, ...renderLaneSegmentSpans(h, Text, item.laneSegments, theme, visible.graphWidth, `g${index}`));
+                    return h(Text, { key: `graph-${index}-${item.graph}`, dimColor: true }, ...renderLaneSegmentSpans(h, Text, item.laneSegments, theme, visible.graphWidth, `g${index}`, { forceDim: true }));
                 }
                 return h(Text, {
                     key: `graph-${index}-${item.graph}`,
                     color: theme.noColor ? undefined : theme.colors.muted,
-                    dimColor: theme.noColor,
-                }, truncate$1(substituteGraphChars(item.graph.padEnd(visible.graphWidth), { ascii: theme.ascii }), 140));
+                    dimColor: true,
+                }, truncate$1(substituteGraphChars(item.graph.padEnd(visible.graphWidth), { ascii: theme.ascii }), Math.max(8, width - 4)));
             }
-            return renderCommitHistoryRow(h, Text, item.commit, item.graph, visible.graphWidth, Boolean(item.selected) && !realSelectionSuppressed, theme, index, item.laneSegments);
+            return renderCommitHistoryRow(h, Text, item.commit, item.graph, visible.graphWidth, Boolean(item.selected) && !realSelectionSuppressed, theme, index, width, item.laneSegments);
         }));
 }
 /**
@@ -25853,7 +26020,7 @@ function renderHistoryPanel(h, components, state, context, bodyRows, width, them
  * Final padding is appended as its own span so callers do not need to
  * pre-pad the graph string before computing lane segments.
  */
-function renderLaneSegmentSpans(h, Text, segments, theme, padTo, keyPrefix) {
+function renderLaneSegmentSpans(h, Text, segments, theme, padTo, keyPrefix, options = {}) {
     const muted = theme.noColor ? undefined : theme.colors.muted;
     const elements = [];
     let totalLen = 0;
@@ -25862,7 +26029,12 @@ function renderLaneSegmentSpans(h, Text, segments, theme, padTo, keyPrefix) {
         elements.push(h(Text, {
             key: `${keyPrefix}-${idx}`,
             color: laneColor ?? muted,
-            dimColor: theme.noColor && seg.laneId === undefined,
+            // Ink does not cascade dimColor from a parent Text to children,
+            // so the caller's "this whole row should fade" intent has to
+            // travel here as an explicit flag (#831). Used for graph-only
+            // lane-closure rows, where the lane colors otherwise compete
+            // for attention with the commits they connect.
+            dimColor: options.forceDim || (theme.noColor && seg.laneId === undefined),
         }, seg.text));
         totalLen += seg.text.length;
     });
@@ -25883,11 +26055,22 @@ function renderLaneSegmentSpans(h, Text, segments, theme, padTo, keyPrefix) {
  * Truncation is per-segment so the variable-length message field gets
  * the leftover budget after fixed segments are accounted for.
  */
-function renderCommitHistoryRow(h, Text, commit, graph, graphWidth, selected, theme, index, laneSegments) {
+function renderCommitHistoryRow(h, Text, commit, graph, graphWidth, selected, theme, index, panelWidth, laneSegments) {
     const refs = formatInkRefLabels(commit.refs);
-    const totalWidth = 140;
+    // Total cells available to the row content. Earlier revisions used a
+    // hardcoded 140 here, which let row content overflow whenever the
+    // panel was narrower than that — Ink would wrap onto a second visual
+    // line and the next commit's graph indicator landed against the wrap
+    // continuation rather than its own commit (#830). Subtracting 4
+    // accounts for the panel's left + right border + 1-cell padding.
+    const totalWidth = Math.max(20, panelWidth - 4);
     const fixedWidth = graphWidth + 1 + commit.shortHash.length + 1 + commit.date.length + 1;
-    const messageRoom = Math.max(8, totalWidth - fixedWidth - cellWidth(refs));
+    // Refs trail the message and shrink first when the row is narrow:
+    // the user can always see the full ref list in the inspector, so
+    // the headline subject keeps priority over decoration.
+    const refsRoom = Math.max(0, totalWidth - fixedWidth - 8);
+    const refsTrunc = refs ? truncate$1(refs, refsRoom) : '';
+    const messageRoom = Math.max(8, totalWidth - fixedWidth - cellWidth(refsTrunc));
     const message = truncate$1(commit.message, messageRoom);
     const selectedBg = selected && !theme.noColor ? theme.colors.selection : undefined;
     const accent = theme.noColor ? undefined : theme.colors.accent;
@@ -25902,7 +26085,7 @@ function renderCommitHistoryRow(h, Text, commit, graph, graphWidth, selected, th
         key: `${commit.hash}-${index}`,
         backgroundColor: selectedBg,
         inverse: selected,
-    }, ...graphChildren, ' ', h(Text, { color: accent, bold: selected }, commit.shortHash), ' ', h(Text, { dimColor: true }, commit.date), ' ', h(Text, undefined, message), refs ? h(Text, { color: accent }, refs) : null);
+    }, ...graphChildren, ' ', h(Text, { color: accent, bold: selected }, commit.shortHash), ' ', h(Text, { dimColor: true }, commit.date), ' ', h(Text, undefined, message), refsTrunc ? h(Text, { color: accent }, refsTrunc) : null);
 }
 /**
  * Render the synthetic "(+) new commit" affordance shown above the real
@@ -26176,6 +26359,15 @@ function renderBranchesSurface(h, components, state, context, contextStatus, bod
         : `${localBranches.length}/${sortedAll.length} local | current: ${branches?.currentBranch || '<detached>'}${filterLabel}${sortLabel}`;
     const emptyLabel = formatLogInkBranchesEmpty({ filter: state.filter });
     const loadingLabel = formatLogInkLoading({ resource: 'branches' });
+    // Per-column width derived from the visible window (#833) so columns
+    // align across rows regardless of name length. Padded to the longest
+    // name in view so short rows fill out instead of leaving a gutter;
+    // capped at 40 cells so one runaway long branch name doesn't blow
+    // out the timestamp column entirely (longer names get truncated and
+    // the timestamp stays where the user expects it).
+    const nameColWidth = visible.length === 0
+        ? 28
+        : Math.min(40, Math.max(8, ...visible.map((branch) => branch.shortName.length)));
     const lines = loading
         ? [h(Text, { key: 'branches-loading', dimColor: true }, loadingLabel)]
         : localBranches.length === 0
@@ -26189,18 +26381,18 @@ function renderBranchesSurface(h, components, state, context, contextStatus, bod
                 const lastTouched = formatBranchLastTouched(branch.date, new Date());
                 // Split the row into spans so the timestamp stays dim even on the
                 // currently-selected (bold) row. The leading marker + name keep
-                // their original column widths; the timestamp is right-padded so
-                // the divergence column stays aligned across rows.
-                const namePadded = branch.shortName.padEnd(28);
+                // their per-window-derived column widths; the timestamp is
+                // right-padded so the divergence column stays aligned across rows.
+                const namePadded = truncate$1(branch.shortName, nameColWidth).padEnd(nameColWidth);
                 const timestampPadded = lastTouched.padEnd(8);
                 const lineDim = !isSelected && !branch.current;
                 const head = `${cursor} ${marker} ${namePadded} `;
                 const trailingDivergence = divergence ? ` ${divergence}` : '';
-                // Truncate the assembled line cooperatively so we never overflow
-                // the panel; the timestamp is short and the divergence is the
-                // most expendable, but the existing 140 cap is ample.
+                // Truncate the assembled line to the actual panel width so a
+                // narrow inspector / sidebar focus doesn't push branch rows
+                // onto a second visual line (#830).
                 const fullText = `${head}${timestampPadded}${trailingDivergence}`;
-                const truncated = truncate$1(fullText, 140);
+                const truncated = truncate$1(fullText, Math.max(20, width - 4));
                 // If truncation chopped into the timestamp/divergence portion,
                 // fall back to a single Text to keep the visible width honest.
                 if (truncated !== fullText) {
@@ -26244,6 +26436,13 @@ function renderTagsSurface(h, components, state, context, contextStatus, bodyRow
         : `${tags.length}/${sortedAll.length} tags${filterLabel}${sortLabel}`;
     const emptyLabel = formatLogInkTagsEmpty({ filter: state.filter });
     const loadingLabel = formatLogInkLoading({ resource: 'tags' });
+    // Per-window name column width (#833) so short tags don't leave a
+    // wide gutter and long tags don't push the subject off-screen. Cap
+    // matches the branches surface for visual consistency across the
+    // promoted views.
+    const tagNameColWidth = visible.length === 0
+        ? 20
+        : Math.min(40, Math.max(8, ...visible.map((tag) => tag.name.length)));
     const lines = loading
         ? [h(Text, { key: 'tags-loading', dimColor: true }, loadingLabel)]
         : tags.length === 0
@@ -26257,8 +26456,8 @@ function renderTagsSurface(h, components, state, context, contextStatus, bodyRow
                 // formatHyperlink wraps just the tag name, leaving width math
                 // intact.
                 const url = buildRefUrl(context.provider?.repository, tag.name);
-                const namePadded = tag.name.padEnd(20);
-                const lineText = truncate$1(`${cursor} ${namePadded} ${tag.subject}`, 140);
+                const namePadded = truncate$1(tag.name, tagNameColWidth).padEnd(tagNameColWidth);
+                const lineText = truncate$1(`${cursor} ${namePadded} ${tag.subject}`, Math.max(20, width - 4));
                 if (!url || lineText.indexOf(namePadded) < 0) {
                     return h(Text, {
                         key: `tag-${index}`,
@@ -26341,6 +26540,17 @@ function renderWorktreesSurface(h, components, state, context, contextStatus, bo
     const headerRight = loading
         ? 'loading worktrees'
         : `${worktrees.length}/${allWorktrees.length} worktrees${filterLabel}`;
+    // Per-window branch column width (#833). Worktrees often track
+    // branches with names varying widely in length (`main` vs.
+    // `feat/tui-something-long`); fixed-width padding either left a
+    // huge gutter on short rows or pushed the path column off-screen on
+    // long ones. Cap matches the other promoted surfaces.
+    const branchColWidth = visible.length === 0
+        ? 28
+        : Math.min(40, Math.max(8, ...visible.map((entry) => {
+            const label = entry.branch ? entry.branch : entry.head || '<detached>';
+            return label.length;
+        })));
     const lines = loading
         ? [h(Text, { key: 'worktrees-loading', dimColor: true }, formatLogInkLoading({ resource: 'worktrees' }))]
         : worktrees.length === 0
@@ -26352,11 +26562,12 @@ function renderWorktreesSurface(h, components, state, context, contextStatus, bo
                 const marker = entry.current ? '*' : ' ';
                 const branchLabel = entry.branch ? entry.branch : entry.head || '<detached>';
                 const stateLabel = entry.dirty ? 'dirty' : 'clean';
+                const branchPadded = truncate$1(branchLabel, branchColWidth).padEnd(branchColWidth);
                 return h(Text, {
                     key: `worktree-${index}`,
                     bold: isSelected,
                     dimColor: !isSelected && !entry.current,
-                }, truncate$1(`${cursor} ${marker} ${branchLabel.padEnd(28)} ${stateLabel.padEnd(6)} ${entry.path}`, width - 4));
+                }, truncate$1(`${cursor} ${marker} ${branchPadded} ${stateLabel.padEnd(6)} ${entry.path}`, width - 4));
             });
     return h(Box, {
         borderColor: focusBorderColor(theme, focused),
@@ -26778,22 +26989,39 @@ function renderHistoryInspector(h, components, state, context, _contextStatus, d
         h(Text, { key: 'detail-spacer-3' }, ''),
         h(Text, { key: 'detail-files-title' }, 'Changed files:'),
     ];
+    // Single-cursor invariant: the file list owns the cursor when the
+    // inspector tab is active; the actions list owns it when the actions
+    // tab is active. Pass `focused` only for the matching tab so users
+    // never see two simultaneous selection highlights inside the panel.
+    const fileListFocused = focused && state.inspectorTab === 'inspector';
     const fileListMaxRows = Math.max(4, Math.min(detail.files.length, 10));
-    const fileListNodes = renderCommitFileList(h, Text, detail.files, state.selectedFileIndex, focused, fileListMaxRows, width, theme);
-    // Tabbed mode (#806 follow-up — short terminals): render only the
-    // active inspector tab with a `[Inspector] Actions` header so the
-    // user knows what they're seeing and how to switch (`[/]` while
-    // focus is on the inspector). Tall terminals stack both sections
-    // as before.
+    const fileListNodes = renderCommitFileList(h, Text, detail.files, state.selectedFileIndex, fileListFocused, fileListMaxRows, width, theme);
+    // Tab indicator. Renders in BOTH tabbed (short-terminal) mode and
+    // tall-stacked mode so the user can always see which tab the cursor
+    // owns and learn the `[/]` toggle. Without this on tall terminals,
+    // the actions list looked like a static cheat-sheet — there was no
+    // visible signal that the cursor could move into it.
+    //
+    // Spacing between tab labels comes from the labels' own padding
+    // (the active label is bracketed `[Inspector]` while the inactive
+    // one is space-padded ` Inspector `, so adjacency reads cleanly).
+    // Earlier revisions stuck a raw `' '` between the Text children to
+    // pad them visually — that crashes Ink at first paint with
+    // "Text string ' ' must be rendered inside <Text> component"
+    // because Box only accepts component children, never bare strings.
+    const activeTab = state.inspectorTab;
+    const tabHeader = h(Box, { key: 'inspector-tabs', flexDirection: 'row' }, h(Text, {
+        bold: activeTab === 'inspector',
+        dimColor: activeTab !== 'inspector',
+    }, activeTab === 'inspector' ? '[Inspector]' : ' Inspector '), h(Text, {
+        bold: activeTab === 'actions',
+        dimColor: activeTab !== 'actions',
+    }, activeTab === 'actions' ? '[Actions]' : ' Actions '), ...(focused
+        ? [h(Text, { key: 'inspector-tabs-hint', dimColor: true }, '  · ←/→ switch')]
+        : []));
+    // Tabbed mode (short terminals): render only the active tab's
+    // content under the tab header.
     if (tabbed) {
-        const activeTab = state.inspectorTab;
-        const tabHeader = h(Box, { key: 'inspector-tabs', flexDirection: 'row' }, h(Text, {
-            bold: activeTab === 'inspector',
-            dimColor: activeTab !== 'inspector',
-        }, activeTab === 'inspector' ? '[Inspector]' : ' Inspector '), ' ', h(Text, {
-            bold: activeTab === 'actions',
-            dimColor: activeTab !== 'actions',
-        }, activeTab === 'actions' ? '[Actions]' : ' Actions '));
         return h(Box, {
             borderColor: focusBorderColor(theme, focused),
             borderStyle: theme.borderStyle,
@@ -26807,13 +27035,16 @@ function renderHistoryInspector(h, components, state, context, _contextStatus, d
                 cursorActive: focused,
             })));
     }
+    // Tall mode: stack both sections so the user can read everything at
+    // once, but show the tab header so the active section (and the
+    // `[/]` switch affordance) is visible.
     return h(Box, {
         borderColor: focusBorderColor(theme, focused),
         borderStyle: theme.borderStyle,
         flexDirection: 'column',
         width,
         paddingX: 1,
-    }, h(Text, { bold: true }, panelTitle('Inspector', focused)), ...headerNodes, ...fileListNodes, ...renderInspectorActionsSection(h, Text, 'history-commit', width, theme, {
+    }, h(Text, { bold: true }, panelTitle('Inspector', focused)), tabHeader, h(Text, { key: 'inspector-tabs-spacer' }, ''), ...headerNodes, ...fileListNodes, ...renderInspectorActionsSection(h, Text, 'history-commit', width, theme, {
         cursorIndex: state.inspectorActionIndex,
         cursorActive: focused && state.inspectorTab === 'actions',
     }));
@@ -27416,6 +27647,84 @@ function renderFooter(h, components, state, context, theme, idleTip) {
     }, h(Text, { color: theme.colors.muted, dimColor: true }, contextualText), h(Text, { color: theme.colors.muted, dimColor: true }, globalText));
 }
 
+/**
+ * Per-repo disk cache of the last successful commit-log fetch (#808).
+ * Lets the TUI render an immediate stale-but-useful history view on
+ * subsequent boots while the fresh `git log` runs in the background;
+ * once the fresh data lands the runtime swaps it in transparently.
+ *
+ * Strict best-effort: read failures fall back to "no cache" (boot
+ * shows the loading placeholder), and write failures are swallowed
+ * silently (next boot just doesn't have the cache yet). The cache is
+ * never load-bearing.
+ *
+ * Repos are keyed by a short hash of their absolute path. No PII in
+ * the cache filename, and re-creating a repo at the same path keeps
+ * the same cache.
+ */
+const CACHE_SCHEMA_VERSION = 1;
+const CACHE_DIR_NAME = 'overview';
+/**
+ * Hard cap on rows we'll write per cache entry. The interactive
+ * default limit is 300; this caps growth in case a user opts into a
+ * much larger window. Keeps the cache file under ~200kb on a typical
+ * repo.
+ */
+const CACHE_ROW_HARD_CAP = 500;
+function resolveCacheDir() {
+    const xdg = process.env.XDG_CACHE_HOME;
+    if (xdg && xdg.trim().length > 0) {
+        return path$1.join(xdg, 'coco', CACHE_DIR_NAME);
+    }
+    return path$1.join(os$1.homedir(), '.cache', 'coco', CACHE_DIR_NAME);
+}
+function repoKey(repoPath) {
+    // sha1 here is a non-security cache-key derivation — we just need a
+    // deterministic short identifier for the cache filename so two repos
+    // at different paths never collide. No PII or auth context is hashed
+    // and no collision-resistance against an adversary is required.
+    // DevSkim DS126858 doesn't apply.
+    // DevSkim: ignore DS126858
+    return crypto.createHash('sha1').update(repoPath).digest('hex').slice(0, 16);
+}
+function getOverviewCachePath(repoPath) {
+    return path$1.join(resolveCacheDir(), `commits.${repoKey(repoPath)}.json`);
+}
+function readCachedCommits(repoPath) {
+    try {
+        const raw = fs$1.readFileSync(getOverviewCachePath(repoPath), 'utf8');
+        const parsed = JSON.parse(raw);
+        if (parsed.version !== CACHE_SCHEMA_VERSION) {
+            // Schema mismatch — quietly drop the stale entry on next write.
+            // Treating it as "no cache" keeps boot behavior predictable
+            // across upgrades.
+            return undefined;
+        }
+        if (!Array.isArray(parsed.rows)) {
+            return undefined;
+        }
+        return parsed.rows;
+    }
+    catch {
+        return undefined;
+    }
+}
+function writeCachedCommits(repoPath, rows) {
+    const file = getOverviewCachePath(repoPath);
+    const envelope = {
+        version: CACHE_SCHEMA_VERSION,
+        savedAt: new Date().toISOString(),
+        rows: rows.slice(0, CACHE_ROW_HARD_CAP),
+    };
+    try {
+        fs$1.mkdirSync(path$1.dirname(file), { recursive: true });
+        fs$1.writeFileSync(file, JSON.stringify(envelope));
+    }
+    catch {
+        // Best-effort persistence; swallow.
+    }
+}
+
 function createLogArgvFromUiArgv(argv) {
     return {
         $0: argv.$0,
@@ -27440,14 +27749,43 @@ function createUiTheme(config, argv) {
         preset: argv.theme,
     };
 }
+/**
+ * Wrap a fresh-rows loader with the disk-cache write step. Lets the
+ * runtime stay caching-agnostic — it just receives the rows and
+ * doesn't know whether they came from cache or git, while the caller
+ * (which knows the repo path) handles persistence.
+ */
+function withCacheWrite(repoPath, loader) {
+    return async () => {
+        const rows = await loader();
+        writeCachedCommits(repoPath, rows);
+        return rows;
+    };
+}
 async function startCocoUiFromLogArgv(logArgv, options = {}) {
     const config = options.config || loadConfig(logArgv);
     const git = options.git || getRepo();
-    const rows = options.rows || (await getLogRows(git, logArgv));
-    await startInkInteractiveLog(git, rows, {}, {
+    const repoPath = process.cwd();
+    // Three-stage boot (#808):
+    //   1. Read the disk cache and pass cached rows as the initial set
+    //      so the user sees the workstation chrome populated with
+    //      commits in the first frame.
+    //   2. Mount Ink immediately with those rows (or [] if no cache).
+    //   3. Run loadRows in the background to refresh — when fresh data
+    //      lands the runtime swaps it in transparently and we persist
+    //      the new rows back to the cache for next boot.
+    // Caller-provided rows skip the lazy path entirely (caller already
+    // has up-to-date data — no point redoing the fetch).
+    const cachedRows = options.rows ? undefined : readCachedCommits(repoPath);
+    const initialRows = options.rows || cachedRows || [];
+    const loadRows = options.rows
+        ? undefined
+        : withCacheWrite(repoPath, () => getLogRows(git, logArgv));
+    await startInkInteractiveLog(git, initialRows, {}, {
         appLabel: 'coco',
         idleTips: config.logTui?.idleTips,
         initialView: 'history',
+        loadRows,
         logArgv,
         theme: config.logTui?.theme,
     });
@@ -27456,11 +27794,15 @@ async function startCocoUi(argv) {
     const config = loadConfig(argv);
     const git = getRepo();
     const logArgv = createLogArgvFromUiArgv(argv);
-    const rows = await getLogRows(git, logArgv);
-    await startInkInteractiveLog(git, rows, {}, {
+    const repoPath = process.cwd();
+    // Same three-stage boot as startCocoUiFromLogArgv — mount with
+    // cached rows for an instant-paint shell, refresh in background.
+    const cachedRows = readCachedCommits(repoPath);
+    await startInkInteractiveLog(git, cachedRows || [], {}, {
         appLabel: 'coco',
         idleTips: config.logTui?.idleTips,
         initialView: argv.view || 'history',
+        loadRows: withCacheWrite(repoPath, () => getLogRows(git, logArgv)),
         logArgv,
         theme: createUiTheme(config, argv),
     });
@@ -27570,15 +27912,18 @@ const handler$2 = async (argv) => {
         });
         return;
     }
-    const rows = await getLogRows(git, argv);
+    // Interactive path defers the commit log fetch into the runtime
+    // (#808) so the TUI mounts immediately with a "Loading commits…"
+    // placeholder. The non-interactive (stdout) path still needs rows
+    // up-front because the formatter just dumps a static snapshot.
     if (argv.interactive && format === 'table') {
         await startCocoUiFromLogArgv(argv, {
             config,
             git,
-            rows,
         });
         return;
     }
+    const rows = await getLogRows(git, argv);
     const result = format === 'json' ? formatLogJson(rows) : formatLogTable(rows);
     await handleResult({
         result,