@ohzw/worktree-command-tui 0.1.4 → 0.1.6

package/README.md

@@ -3,6 +3,9 @@
 `worktree-command-tui` is a terminal UI for managing Git worktrees from inside a repository.
 It keeps one active runtime session per namespace, lets you switch worktrees with the keyboard, and keeps logs/process cleanup tied to the repo's shared Git state.
 
+<img width="1023" height="582" alt="image" src="https://github.com/user-attachments/assets/ef33c2aa-0af4-4701-b1ec-fa9289e8ee3a" />
+
+
 ## Features
 
 - Discover worktrees from the current repository even when launched from a subdirectory
@@ -121,8 +124,8 @@ Example config:
   // The selected worktree path is appended as the final argv entry.
   "editorCommand": ["code"],
 
-  // TCP port owned by the command, used when stopping stale/orphaned processes.
-  "port": 3000,
+  // TCP ports owned by the command, used when stopping stale/orphaned processes.
+  "ports": [3000],
 
   // Files that must exist in a worktree before the command can be started there.
   "requiredFiles": ["package.json"],
@@ -134,8 +137,9 @@ Example config:
 
 Notes:
 
-- `setupCommand` is optional and never runs automatically; `i` only appears when it is configured
+- `setupCommand` is optional and never runs automatically; `i` only appears when it is configured. It accepts one argv array or an array of argv arrays executed in order. The built-in `["copy-root-file", "source", "destination"]` copies from the repo root into the selected worktree.
 - `editorCommand` is optional; when set, the selected worktree path is appended to the argv and `e` becomes available
+- Use `ports` for every backend/frontend/dev-server port the command may bind; legacy single `port` configs still load
 - The generated default config auto-detects package manager hints from `packageManager` or common lockfiles and chooses a default script such as `dev`, `start`, or `serve`
 - Session records and logs are stored under the repository's Git common dir, so they are shared across worktrees in the same repo
 

package/dist/app.d.ts

@@ -1,4 +1,4 @@
-import type { AppActions, AppModel } from './core/runtime.js';
+import type { AppActions, AppLogRefresh, AppModel } from './core/runtime.js';
 export interface ShellDimensions {
     rootWidth: number;
     rootHeight: number;
@@ -14,9 +14,12 @@ export declare function getMouseWheelDelta(input: string): number;
 export declare function getShellDimensions(columns: number, rows: number): ShellDimensions;
 export declare function shouldUseCompactLayout(_columns: number, _rows: number, _worktreeCount?: number): boolean;
 export declare function shouldUseMinimalLayout(columns: number, rows: number): boolean;
+export declare const RESIZE_DEBOUNCE_MS = 100;
 export declare function shouldStackPanes(columns: number, rows: number, _worktreeCount?: number): boolean;
-export declare function App({ initialModel, actions, windowSizeOverride, }: {
+export declare function getModelAfterLogRefresh(current: AppModel, refresh: AppLogRefresh): AppModel;
+export declare function App({ initialModel, actions, windowSizeOverride, resizeDebounceMs, }: {
     initialModel: AppModel;
     actions: AppActions;
     windowSizeOverride?: AppWindowSize;
+    resizeDebounceMs?: number;
 }): import("react").JSX.Element;

package/dist/app.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Alert, Spinner } from '@inkjs/ui';
-import { useEffect, useMemo, useRef, useState } from 'react';
-import { Box, Text, useApp, useInput, useStdin, useStdout, useWindowSize } from 'ink';
+import { memo, useEffect, useMemo, useRef, useState } from 'react';
+import { Box, Text, useApp, useInput, useStdin, useStdout } from 'ink';
 import { ActionPanel } from './components/ActionPanel.js';
 import { ContextBar } from './components/ContextBar.js';
 import { Header } from './components/Header.js';
@@ -9,7 +9,7 @@ import { HelpWindow } from './components/HelpWindow.js';
 import { FloatingLogWindow } from './components/FloatingLogWindow.js';
 import { LogPanel, buildLogLines } from './components/LogPanel.js';
 import { WorktreeList } from './components/WorktreeList.js';
-import { clampSelectionIndex, decideEnterInteraction, decideSetupInteraction, getNextSelectedPath, getSelectedIndex } from './core/tui-interaction.js';
+import { clampSelectionIndex, decideEnterInteraction, decideSetupInteraction, getNextSelectedPath, getSelectedIndex, wrapSelectionIndex } from './core/tui-interaction.js';
 import { sanitizeInlineText } from './core/worktree-projection.js';
 const ENABLE_MOUSE_TRACKING = '\u001B[?1000h\u001B[?1006h';
 const DISABLE_MOUSE_TRACKING = '\u001B[?1000l\u001B[?1006l';
@@ -55,6 +55,7 @@ const HEADER_HEIGHT = 5;
 const CONTEXT_BAR_HEIGHT = 4;
 const PANE_GAP_WIDTH = 1;
 const MIN_STACKED_PANE_HEIGHT = 9;
+export const RESIZE_DEBOUNCE_MS = 100;
 export function shouldStackPanes(columns, rows, _worktreeCount = 0) {
     // Header + context bar consume the fixed chrome; each stacked pane still keeps ~6 visible content lines at the minimum height.
     return columns < 96 && rows >= STACKED_LAYOUT_FRAME_ROWS + (MIN_STACKED_PANE_HEIGHT * 2);
@@ -81,6 +82,25 @@ function syncActiveTags(rows, activePath) {
     });
     return changed ? nextRows : rows;
 }
+function rowMatchesFilter(row, normalizedQuery) {
+    if (normalizedQuery === '') {
+        return true;
+    }
+    const pullRequest = row.pullRequest?.kind === 'found' ? row.pullRequest : null;
+    const headCommit = `${row.headSha ?? ''} ${row.headCommit?.message ?? ''}`.toLowerCase();
+    return row.branch.toLowerCase().includes(normalizedQuery)
+        || row.path.toLowerCase().includes(normalizedQuery)
+        || row.shortPath.toLowerCase().includes(normalizedQuery)
+        || headCommit.includes(normalizedQuery)
+        || (pullRequest !== null && (`${pullRequest.number} ${pullRequest.title}`).toLowerCase().includes(normalizedQuery));
+}
+function filterRows(rows, query) {
+    const normalizedQuery = query.trim().toLowerCase();
+    if (normalizedQuery === '') {
+        return rows;
+    }
+    return rows.filter(row => rowMatchesFilter(row, normalizedQuery));
+}
 function shouldRefreshLogs(model) {
     return model.activePath !== null && (model.status.kind === 'running' || model.status.kind === 'error');
 }
@@ -99,14 +119,104 @@ function getStatusAfterLogRefresh(current, refresh) {
     }
     return { kind: 'running', message: 'running' };
 }
-export function App({ initialModel, actions, windowSizeOverride, }) {
+function areLogsEqual(left, right) {
+    if (left.length !== right.length) {
+        return false;
+    }
+    return left.every((entry, index) => {
+        const other = right[index];
+        return other !== undefined
+            && entry.name === other.name
+            && entry.path === other.path
+            && entry.content === other.content;
+    });
+}
+export function getModelAfterLogRefresh(current, refresh) {
+    const activeChanged = current.activePath !== refresh.activePath || current.activeBranch !== refresh.activeBranch;
+    const status = getStatusAfterLogRefresh(current, refresh);
+    const logsChanged = !areLogsEqual(current.logs, refresh.logs);
+    const statusChanged = current.status.kind !== status.kind || current.status.message !== status.message;
+    const rows = activeChanged ? syncActiveTags(current.rows, refresh.activePath) : current.rows;
+    if (!activeChanged && !logsChanged && !statusChanged) {
+        return current;
+    }
+    return {
+        ...current,
+        logs: refresh.logs,
+        activePath: refresh.activePath,
+        activeBranch: refresh.activeBranch,
+        status,
+        rows,
+    };
+}
+function readWindowSize(stdout) {
+    return {
+        columns: stdout.columns || process.stdout.columns || 80,
+        rows: stdout.rows || process.stdout.rows || 24,
+    };
+}
+function useDebouncedWindowSize(windowSizeOverride, debounceMs) {
+    const { stdout } = useStdout();
+    const resizeTimerRef = useRef(undefined);
+    const [stableWindowSize, setStableWindowSize] = useState(() => windowSizeOverride ?? readWindowSize(stdout));
+    useEffect(() => {
+        return () => {
+            clearTimeout(resizeTimerRef.current);
+        };
+    }, []);
+    useEffect(() => {
+        if (windowSizeOverride === undefined) {
+            return;
+        }
+        clearTimeout(resizeTimerRef.current);
+        if (stableWindowSize.columns === windowSizeOverride.columns && stableWindowSize.rows === windowSizeOverride.rows) {
+            return;
+        }
+        resizeTimerRef.current = setTimeout(() => {
+            resizeTimerRef.current = undefined;
+            setStableWindowSize({ columns: windowSizeOverride.columns, rows: windowSizeOverride.rows });
+        }, debounceMs);
+    }, [windowSizeOverride?.columns, windowSizeOverride?.rows, debounceMs, stableWindowSize.columns, stableWindowSize.rows]);
+    useEffect(() => {
+        if (windowSizeOverride !== undefined) {
+            return;
+        }
+        const scheduleResize = () => {
+            const nextWindowSize = readWindowSize(stdout);
+            clearTimeout(resizeTimerRef.current);
+            if (stableWindowSize.columns === nextWindowSize.columns && stableWindowSize.rows === nextWindowSize.rows) {
+                return;
+            }
+            resizeTimerRef.current = setTimeout(() => {
+                resizeTimerRef.current = undefined;
+                setStableWindowSize(nextWindowSize);
+            }, debounceMs);
+        };
+        scheduleResize();
+        stdout.on('resize', scheduleResize);
+        return () => {
+            stdout.off('resize', scheduleResize);
+        };
+    }, [stdout, windowSizeOverride, debounceMs, stableWindowSize.columns, stableWindowSize.rows]);
+    return stableWindowSize;
+}
+export function App({ initialModel, actions, windowSizeOverride, resizeDebounceMs, }) {
+    const stableWindowSize = useDebouncedWindowSize(windowSizeOverride, resizeDebounceMs ?? RESIZE_DEBOUNCE_MS);
+    return _jsx(MemoizedAppShell, { initialModel: initialModel, actions: actions, windowSize: stableWindowSize });
+}
+function AppShell(props) {
+    return _jsx(AppShellContent, { ...props });
+}
+function AppShellContent({ initialModel, actions, windowSize, }) {
     const { exit } = useApp();
     const { stdin } = useStdin();
     const { stdout } = useStdout();
-    const liveWindowSize = useWindowSize();
-    const { columns, rows } = windowSizeOverride ?? liveWindowSize;
+    const { columns, rows } = windowSize;
     const [model, setModel] = useState(initialModel);
-    const [selectedPath, setSelectedPath] = useState(initialModel.rows[0]?.path ?? null);
+    const [filterQuery, setFilterQuery] = useState('');
+    const [isFilterInputOpen, setIsFilterInputOpen] = useState(false);
+    const visibleRows = useMemo(() => filterRows(model.rows, filterQuery), [model.rows, filterQuery]);
+    const [selectedPath, setSelectedPath] = useState(visibleRows[0]?.path ?? null);
     const [selectionScrollOffset, setSelectionScrollOffset] = useState(0);
     const [worktreeScrollOffset, setWorktreeScrollOffset] = useState(0);
     const [logScrollOffset, setLogScrollOffset] = useState(0);
@@ -121,8 +231,8 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
     const lastStartRequestRef = useRef({ path: null, atMs: 0 });
     const alertTimeoutRef = useRef(null);
     useEffect(() => {
-        setSelectedPath(currentPath => getNextSelectedPath(model.rows, currentPath));
-    }, [model.rows]);
+        setSelectedPath(currentPath => getNextSelectedPath(visibleRows, currentPath));
+    }, [visibleRows]);
     useEffect(() => {
         setSelectionScrollOffset(0);
     }, [selectedPath]);
@@ -169,18 +279,7 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
                 if (generation !== actionGenerationRef.current || userActionInFlightRef.current) {
                     return;
                 }
-                setModel(current => {
-                    const activeChanged = current.activePath !== refresh.activePath || current.activeBranch !== refresh.activeBranch;
-                    const status = getStatusAfterLogRefresh(current, refresh);
-                    return {
-                        ...current,
-                        logs: refresh.logs,
-                        activePath: refresh.activePath,
-                        activeBranch: refresh.activeBranch,
-                        status,
-                        rows: activeChanged ? syncActiveTags(current.rows, refresh.activePath) : current.rows,
-                    };
-                });
+                setModel(current => getModelAfterLogRefresh(current, refresh));
             })
                 .catch(() => { })
                 .finally(() => {
@@ -196,16 +295,16 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
             setPendingDelete(null);
         }
     }, [confirmationOpen, model.rows, pendingDelete]);
-    const selectedIndex = useMemo(() => getSelectedIndex(model.rows, selectedPath), [model.rows, selectedPath]);
-    const selected = model.rows[selectedIndex];
+    const selectedIndex = useMemo(() => getSelectedIndex(visibleRows, selectedPath), [visibleRows, selectedPath]);
+    const selected = visibleRows[selectedIndex];
     const { rootWidth, rootHeight, bodyWidth, listWidth, actionWidth } = getShellDimensions(columns, rows);
     const minimalLayout = shouldUseMinimalLayout(rootWidth, rootHeight);
-    const compactLayout = !minimalLayout && shouldUseCompactLayout(rootWidth, rootHeight, model.rows.length);
-    const stackedLayout = !minimalLayout && !compactLayout && shouldStackPanes(rootWidth, rootHeight, model.rows.length);
-    const compactDetailPane = !stackedLayout && rootHeight <= 30 && model.rows.length > 1;
-    const showLogPanel = !stackedLayout && rootHeight >= 34;
+    const compactLayout = !minimalLayout && shouldUseCompactLayout(rootWidth, rootHeight, visibleRows.length);
+    const stackedLayout = !minimalLayout && !compactLayout && shouldStackPanes(rootWidth, rootHeight, visibleRows.length);
+    const compactDetailPane = !stackedLayout && rootHeight <= 30 && visibleRows.length > 1;
+    const showLogPanel = rootHeight >= 34;
     const logPaneHeight = showLogPanel ? getLogPaneHeight(rootHeight) : 0;
-    const stackedPaneHeight = Math.max(3, Math.floor((rootHeight - STACKED_LAYOUT_FRAME_ROWS) / 2));
+    const stackedPaneHeight = Math.max(3, Math.floor((rootHeight - STACKED_LAYOUT_FRAME_ROWS - logPaneHeight) / 2));
     const paneHeight = stackedLayout
         ? stackedPaneHeight
         : Math.max(3, rootHeight - STACKED_LAYOUT_FRAME_ROWS - logPaneHeight);
@@ -216,12 +315,18 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
         : showLogPanel ? Math.max(1, logPaneHeight - 3) : 0;
     const maxLogScrollOffset = Math.max(0, logLineCount - logViewportHeight);
     const logScrollPageSize = Math.max(1, Math.floor((logViewportHeight || rootHeight) / 2));
-    function moveSelection(nextIndex) {
-        const clampedIndex = clampSelectionIndex(nextIndex, model.rows.length);
-        if (clampedIndex === null) {
+    function moveSelection(nextIndex, mode = 'clamp') {
+        const nextSelectionIndex = mode === 'wrap'
+            ? wrapSelectionIndex(nextIndex, visibleRows.length)
+            : clampSelectionIndex(nextIndex, visibleRows.length);
+        if (nextSelectionIndex === null) {
             return;
         }
-        setSelectedPath(model.rows[clampedIndex].path);
+        setSelectedPath(visibleRows[nextSelectionIndex].path);
+    }
+    function clearFilter() {
+        setFilterQuery('');
+        setIsFilterInputOpen(false);
     }
     function clearTransientAlert() {
         if (alertTimeoutRef.current !== null) {
@@ -262,6 +367,29 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
         last.atMs = nowMs;
         return true;
     }
+    function startSelectedWorktree() {
+        if (userActionInFlightRef.current) {
+            return;
+        }
+        const decision = decideEnterInteraction(selected, model.activePath);
+        if (decision.kind === 'ignore') {
+            return;
+        }
+        if (decision.kind === 'set-status') {
+            if (decision.suppressesBackgroundRefreshes) {
+                invalidateStaleLogRefreshes();
+            }
+            setModel(current => ({ ...current, status: decision.status }));
+            clearTransientAlert();
+            return;
+        }
+        if (!shouldAcceptStartRequest(decision.path)) {
+            return;
+        }
+        setModel(current => ({ ...current, status: decision.status }));
+        clearTransientAlert();
+        void apply(() => actions.start(decision.path));
+    }
     useInput((input, key) => {
         if (isHelpOverlayOpen) {
             if (key.escape || input === '\u001B' || input === 'q' || input === '?') {
@@ -318,16 +446,54 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
             }
             return;
         }
+        if (isFilterInputOpen) {
+            if (key.escape || input === '\u001B') {
+                clearFilter();
+                return;
+            }
+            if (key.upArrow) {
+                moveSelection(selectedIndex - 1, 'wrap');
+                return;
+            }
+            if (key.downArrow) {
+                moveSelection(selectedIndex + 1, 'wrap');
+                return;
+            }
+            if (key.pageDown) {
+                setSelectionScrollOffset(current => current + selectionScrollPageSize);
+                return;
+            }
+            if (key.pageUp) {
+                setSelectionScrollOffset(current => Math.max(0, current - selectionScrollPageSize));
+                return;
+            }
+            if (key.backspace || key.delete) {
+                setFilterQuery(current => current.slice(0, -1));
+                return;
+            }
+            if (key.return) {
+                startSelectedWorktree();
+                return;
+            }
+            if (input && !key.ctrl && !key.meta) {
+                setFilterQuery(current => current + input);
+            }
+            return;
+        }
+        if (input === '/') {
+            setIsFilterInputOpen(true);
+            return;
+        }
         if (key.escape || input === 'q') {
             exit();
             return;
         }
         if (key.upArrow || input === 'k') {
-            moveSelection(selectedIndex - 1);
+            moveSelection(selectedIndex - 1, 'wrap');
             return;
         }
         if (key.downArrow || input === 'j') {
-            moveSelection(selectedIndex + 1);
+            moveSelection(selectedIndex + 1, 'wrap');
             return;
         }
         if (input === 'g') {
@@ -335,7 +501,7 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
             return;
         }
         if (input === 'G') {
-            moveSelection(model.rows.length - 1);
+            moveSelection(visibleRows.length - 1);
             return;
         }
         if (input === '?') {
@@ -362,28 +528,8 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
             setSelectionScrollOffset(current => Math.max(0, current - selectionScrollPageSize));
             return;
         }
-        if (userActionInFlightRef.current) {
-            return;
-        }
         if (key.return) {
-            const decision = decideEnterInteraction(selected, model.activePath);
-            if (decision.kind === 'ignore') {
-                return;
-            }
-            if (decision.kind === 'set-status') {
-                if (decision.suppressesBackgroundRefreshes) {
-                    invalidateStaleLogRefreshes();
-                }
-                setModel(current => ({ ...current, status: decision.status }));
-                clearTransientAlert();
-                return;
-            }
-            if (!shouldAcceptStartRequest(decision.path)) {
-                return;
-            }
-            setModel(current => ({ ...current, status: decision.status }));
-            clearTransientAlert();
-            void apply(() => actions.start(decision.path));
+            startSelectedWorktree();
             return;
         }
         if (input === 's') {
@@ -462,7 +608,7 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
                         if (listPaneViewportHeight === undefined) {
                             return 0;
                         }
-                        const max = Math.max(0, model.rows.length - listPaneViewportHeight);
+                        const max = Math.max(0, visibleRows.length - listPaneViewportHeight);
                         return Math.max(0, Math.min(max, current + event.delta * mouseWheelLineStep));
                     });
                 };
@@ -519,14 +665,14 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
                 stdout.write(DISABLE_MOUSE_TRACKING);
             }
         };
-    }, [stdin, stdout, listWidth, stackedLayout, listPaneViewportHeight, mouseWheelLineStep, model.rows.length, showLogPanel, logPaneTop, logPaneBottom, maxLogScrollOffset, worktreePaneRight, selectionPaneLeft, bodyPaneTop, bodyPaneBottom, stackedWorktreePaneTop, stackedWorktreePaneBottom, stackedSelectionPaneTop, stackedSelectionPaneBottom, isLogOverlayOpen, isHelpOverlayOpen]);
+    }, [stdin, stdout, listWidth, stackedLayout, listPaneViewportHeight, mouseWheelLineStep, visibleRows.length, showLogPanel, logPaneTop, logPaneBottom, maxLogScrollOffset, worktreePaneRight, selectionPaneLeft, bodyPaneTop, bodyPaneBottom, stackedWorktreePaneTop, stackedWorktreePaneBottom, stackedSelectionPaneTop, stackedSelectionPaneBottom, isLogOverlayOpen, isHelpOverlayOpen]);
     useEffect(() => {
         if (listPaneViewportHeight === undefined) {
             setWorktreeScrollOffset(0);
             return;
         }
         setWorktreeScrollOffset(current => {
-            const max = Math.max(0, model.rows.length - listPaneViewportHeight);
+            const max = Math.max(0, visibleRows.length - listPaneViewportHeight);
             if (selectedIndex < current) {
                 return Math.max(0, selectedIndex);
             }
@@ -535,7 +681,7 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
             }
             return Math.min(current, max);
         });
-    }, [selectedIndex, listPaneViewportHeight, model.rows.length]);
+    }, [selectedIndex, listPaneViewportHeight, visibleRows.length]);
     useEffect(() => {
         if (!showLogPanel && !isLogOverlayOpen) {
             setLogScrollOffset(0);
@@ -557,14 +703,15 @@ export function App({ initialModel, actions, windowSizeOverride, }) {
     if (minimalLayout) {
         return (_jsxs(Box, { width: rootWidth, height: rootHeight, flexDirection: "column", children: [_jsxs(Text, { bold: true, color: "green", wrap: "truncate-end", children: ["A:", safeActiveBranch] }), rootHeight >= 2 ? _jsxs(Text, { wrap: "truncate-end", children: ["S:", safeSelectedBranch] }) : null, rootHeight >= 3 ? _jsx(Text, { wrap: "truncate-end", children: confirmationOpen ? `D:${safeVisibleStatusMessage}` : `T:${model.status.kind}` }) : null, rootHeight >= 4 ? (confirmationOpen
                     ? _jsx(Text, { dimColor: true, wrap: "truncate-end", children: "d/y confirm \u00B7 Esc/n/q cancel" })
-                    : _jsxs(Text, { dimColor: true, wrap: "truncate-end", children: ["\u2191\u2193jk\u21B5", model.setupAvailable ? 'i' : '', model.editorAvailable ? 'e' : '', "odLq"] })) : null] }));
+                    : _jsxs(Text, { dimColor: true, wrap: "truncate-end", children: ["\u2191\u2193jk/\u21B5", model.setupAvailable ? 'i' : '', model.editorAvailable ? 'e' : '', "odLq"] })) : null] }));
     }
     if (compactLayout) {
         return (_jsxs(Box, { width: rootWidth, height: rootHeight, flexDirection: "column", children: [_jsxs(Text, { bold: true, color: "green", wrap: "truncate-end", children: ["Active: ", safeActiveBranch] }), _jsxs(Text, { wrap: "truncate-end", children: ["Selected: ", safeSelectedBranch] }), safeCompletedAlert
                     ? _jsxs(Text, { color: "green", wrap: "truncate-end", children: ["\u2714 ", safeCompletedAlert] })
                     : model.status.kind === 'setting-up' || model.status.kind === 'starting' || model.status.kind === 'stopping' ? (_jsx(Spinner, { label: `Status: ${model.status.kind} — ${safeModelStatusMessage}` })) : (_jsxs(Text, { wrap: "truncate-end", children: ["Status: ", visibleStatus.kind, " \u2014 ", safeVisibleStatusMessage] })), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: confirmationOpen
                         ? 'Keys: d/y confirm | Esc/n/q cancel'
-                        : `Keys: ↑↓/jk g/G ↵${model.setupAvailable ? ' i' : ''}${model.editorAvailable ? ' e' : ''} o d L s r q · Resize terminal for split view` })] }));
+                        : `Keys: ↑↓/jk g/G / Filter ↵${model.setupAvailable ? ' i' : ''}${model.editorAvailable ? ' e' : ''} o d L s r q · Resize terminal for split view` })] }));
     }
-    return (_jsxs(Box, { width: rootWidth, height: rootHeight, flexDirection: "column", children: [_jsx(Header, { repoName: model.repoName, namespace: model.namespace, activeBranch: model.activeBranch }), _jsxs(Box, { flexDirection: stackedLayout ? 'column' : 'row', flexGrow: stackedLayout ? 0 : 1, flexShrink: 1, children: [_jsx(WorktreeList, { rows: model.rows, selectedIndex: selectedIndex, width: stackedLayout ? bodyWidth : listWidth, height: paneHeight, stacked: stackedLayout, scrollOffset: worktreeScrollOffset }), _jsx(ActionPanel, { selectedRow: selected, activePath: model.activePath, setupAvailable: model.setupAvailable, stacked: stackedLayout, width: stackedLayout ? bodyWidth : actionWidth, height: paneHeight, compactDetails: compactDetailPane, scrollOffset: selectionScrollOffset })] }), showLogPanel ? _jsx(LogPanel, { logs: model.logs, width: bodyWidth, height: logPaneHeight, scrollOffset: logScrollOffset }) : null, _jsx(ContextBar, { status: visibleStatus, setupAvailable: model.setupAvailable, editorAvailable: model.editorAvailable, confirmationOpen: confirmationOpen }), safeCompletedAlert ? (_jsx(Box, { position: "absolute", top: 1, right: 2, children: _jsx(Alert, { variant: "success", children: safeCompletedAlert }) })) : null] }));
+    return (_jsxs(Box, { width: rootWidth, height: rootHeight, flexDirection: "column", children: [_jsx(Header, { repoName: model.repoName, namespace: model.namespace, activeBranch: model.activeBranch }), _jsxs(Box, { flexDirection: stackedLayout ? 'column' : 'row', flexGrow: stackedLayout ? 0 : 1, flexShrink: 1, children: [_jsx(WorktreeList, { rows: visibleRows, selectedIndex: selectedIndex, width: stackedLayout ? bodyWidth : listWidth, height: paneHeight, stacked: stackedLayout, scrollOffset: worktreeScrollOffset, filterQuery: filterQuery, isFilterInputOpen: isFilterInputOpen, totalRowCount: model.rows.length }), _jsx(ActionPanel, { selectedRow: selected, activePath: model.activePath, setupAvailable: model.setupAvailable, stacked: stackedLayout, width: stackedLayout ? bodyWidth : actionWidth, height: paneHeight, compactDetails: compactDetailPane, scrollOffset: selectionScrollOffset })] }), showLogPanel ? _jsx(LogPanel, { logs: model.logs, width: bodyWidth, height: logPaneHeight, scrollOffset: logScrollOffset }) : null, _jsx(ContextBar, { status: visibleStatus, setupAvailable: model.setupAvailable, editorAvailable: model.editorAvailable, confirmationOpen: confirmationOpen }), safeCompletedAlert ? (_jsx(Box, { position: "absolute", top: 1, right: 2, children: _jsx(Alert, { variant: "success", children: safeCompletedAlert }) })) : null] }));
 }
+const MemoizedAppShell = memo(AppShell);

package/dist/components/ActionPanel.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Text } from 'ink';
-import { getOrderedNonActiveTags, projectAction, projectNote, projectPullRequest, projectUpstream, projectWorkingTree, sanitizeInlineText, } from '../core/worktree-projection.js';
+import { getOrderedNonActiveTags, projectAction, projectHeadCommit, projectNote, projectPullRequest, projectUpstream, projectWorkingTree, sanitizeInlineText, } from '../core/worktree-projection.js';
 import { getScrollbarThumbRows, sliceListViewport } from '../terminal/viewport.js';
 export function getActionVariant(selectedRow, activePath) {
     return projectAction(selectedRow, activePath).severity;
@@ -72,6 +72,13 @@ function formatPullRequest(selectedRow) {
     const stateText = pullRequest.state.toLowerCase();
     return `#${pullRequest.number} ${draft}${stateText} → ${pullRequest.baseBranch}`;
 }
+function formatHeadCommit(selectedRow) {
+    const headCommit = projectHeadCommit(selectedRow);
+    if (headCommit.kind === 'unavailable') {
+        return '-';
+    }
+    return headCommit.label;
+}
 function getPullRequestColorFromProjection(pullRequest) {
     if (pullRequest.kind === 'unavailable') {
         return 'red';
@@ -150,7 +157,7 @@ function getPanelLines(selectedRow, activePath, setupAvailable, compactDetails)
     if (showFullPath) {
         lines.push({ text: `Full Path: ${sanitizeInlineText(selectedRow.path)}` });
     }
-    lines.push({ text: `HEAD: ${selectedRow.headSha || '-'}` });
+    lines.push({ text: `HEAD: ${formatHeadCommit(selectedRow)}` });
     lines.push({ text: `Branch Created: ${formatUtcDateTime(selectedRow.branchCreatedAtMs)}` });
     if (showTags) {
         for (const { tag } of getOrderedNonActiveTags(selectedRow.tags)) {

package/dist/components/ContextBar.js

@@ -30,6 +30,7 @@ function buildKeyHints(setupAvailable, editorAvailable, confirmationOpen) {
         { binding: '↑↓/jk', label: 'Move' },
         { binding: 'Enter', label: 'Switch' },
     ];
+    hints.push({ binding: '/', label: 'Filter' });
     if (setupAvailable) {
         hints.push({ binding: 'i', label: 'Setup' });
     }

package/dist/components/HelpWindow.js

@@ -9,6 +9,8 @@ function buildHelpLines(setupAvailable, editorAvailable) {
         { section: 'Logs', binding: 'L', description: 'full-screen logs' },
         { section: 'Logs', binding: '[/]', description: 'scroll log' },
         { section: 'Actions', binding: 'Enter', description: 'start/switch/restart worktree' },
+        { section: 'Filter', binding: '/', description: 'filter by branch, path, or pull request' },
+        { section: 'Filter', binding: 'Esc', description: 'clear filter' },
     ];
     if (setupAvailable) {
         lines.push({ section: 'Actions', binding: 'i', description: 'setup selected worktree' });

package/dist/components/WorktreeList.d.ts

@@ -1,9 +1,12 @@
 import type { AppRow } from '../core/runtime.js';
-export declare function WorktreeList({ rows, selectedIndex, width, height, stacked, scrollOffset, }: {
+export declare function WorktreeList({ rows, selectedIndex, width, height, stacked, scrollOffset, filterQuery, isFilterInputOpen, totalRowCount, }: {
     rows: AppRow[];
     selectedIndex: number;
     width?: number;
     height?: number;
     stacked: boolean;
     scrollOffset?: number;
+    filterQuery?: string;
+    isFilterInputOpen?: boolean;
+    totalRowCount?: number;
 }): import("react").JSX.Element;

package/dist/components/WorktreeList.js

@@ -33,7 +33,7 @@ function truncateLabel(value, width) {
     }
     return `${value.slice(0, Math.max(width - 1, 0))}…`;
 }
-export function WorktreeList({ rows, selectedIndex, width, height, stacked, scrollOffset = 0, }) {
+export function WorktreeList({ rows, selectedIndex, width, height, stacked, scrollOffset = 0, filterQuery = '', isFilterInputOpen = false, totalRowCount = rows.length, }) {
     const branchWidth = Math.max(MIN_BRANCH_WIDTH, (width ?? 34) - 7);
     const viewport = sliceListViewport(rows, height === undefined ? rows.length : height - 3, scrollOffset);
     const contentViewportHeight = viewport.viewportHeight;
@@ -41,7 +41,12 @@ export function WorktreeList({ rows, selectedIndex, width, height, stacked, scro
     const visibleRows = viewport.visibleItems;
     const showScrollbar = height !== undefined && rows.length > contentViewportHeight;
     const scrollbarThumbRows = showScrollbar ? getScrollbarThumbRows(rows.length, contentViewportHeight, effectiveScrollOffset) : new Set();
-    return (_jsxs(Box, { width: width, height: height, flexGrow: stacked ? 0 : 1, marginRight: stacked ? 0 : 1, borderStyle: "round", borderColor: "cyan", flexDirection: "column", paddingX: 1, overflowY: "hidden", children: [_jsx(Text, { bold: true, color: "cyan", children: "Worktrees" }), visibleRows.map((row, index) => {
+    const hasFilter = filterQuery.trim() !== '';
+    const filterText = sanitizeInlineText(filterQuery);
+    const title = hasFilter || isFilterInputOpen
+        ? `Worktrees /${filterText}${isFilterInputOpen ? '█' : ''} (${rows.length}/${totalRowCount})`
+        : 'Worktrees';
+    return (_jsxs(Box, { width: width, height: height, flexGrow: stacked ? 0 : 1, marginRight: stacked ? 0 : 1, borderStyle: "round", borderColor: "cyan", flexDirection: "column", paddingX: 1, overflowY: "hidden", children: [_jsx(Text, { bold: true, color: "cyan", wrap: "truncate-end", children: title }), rows.length === 0 ? (_jsx(Text, { dimColor: true, wrap: "truncate-end", children: "No worktrees match filter." })) : null, visibleRows.map((row, index) => {
                 const isSelected = index + effectiveScrollOffset === selectedIndex;
                 const projection = projectWorktreeListRow(row, isSelected);
                 const tagSuffix = projection.isMain ? ' [root]' : '';

package/dist/core/command-runner.d.ts

@@ -4,8 +4,9 @@ interface CommandLogOptions {
     logsDir: string;
     logFileBase: string;
     errorLabel?: string;
+    workspaceRoot?: string;
 }
-export declare function runCommandToLog({ command, cwd, logsDir, logFileBase, errorLabel, }: CommandLogOptions): Promise<{
+export declare function runCommandToLog({ command, cwd, logsDir, logFileBase, errorLabel, workspaceRoot, }: CommandLogOptions): Promise<{
     logPath: string;
 }>;
 export declare function startDetachedCommand({ command, cwd, logsDir, logFileBase, }: {