@ohzw/worktree-command-tui 0.1.6 → 0.1.7

package/dist/app.js

@@ -3,7 +3,7 @@ import { Alert, Spinner } from '@inkjs/ui';
 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 { ShortcutBar } from './components/ShortcutBar.js';
 import { Header } from './components/Header.js';
 import { HelpWindow } from './components/HelpWindow.js';
 import { FloatingLogWindow } from './components/FloatingLogWindow.js';
@@ -50,14 +50,14 @@ export function shouldUseCompactLayout(_columns, _rows, _worktreeCount = 0) {
 export function shouldUseMinimalLayout(columns, rows) {
     return columns < 20 || rows < 10;
 }
-const STACKED_LAYOUT_FRAME_ROWS = 9;
-const HEADER_HEIGHT = 5;
-const CONTEXT_BAR_HEIGHT = 4;
+const STACKED_LAYOUT_FRAME_ROWS = 5;
+const HEADER_HEIGHT = 4;
+const SHORTCUT_BAR_HEIGHT = 1;
 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.
+    // Header + shortcut 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);
 }
 function getLogPaneHeight(_rootHeight) {
@@ -579,8 +579,8 @@ function AppShellContent({ initialModel, actions, windowSize, }) {
     const stackedWorktreePaneBottom = stackedLayout && stackedWorktreePaneTop !== undefined && paneHeight !== undefined ? stackedWorktreePaneTop + paneHeight - 1 : undefined;
     const stackedSelectionPaneTop = stackedLayout && stackedWorktreePaneBottom !== undefined ? stackedWorktreePaneBottom + 1 : undefined;
     const stackedSelectionPaneBottom = stackedLayout && stackedSelectionPaneTop !== undefined && paneHeight !== undefined ? stackedSelectionPaneTop + paneHeight - 1 : undefined;
-    const logPaneTop = showLogPanel ? rootHeight - CONTEXT_BAR_HEIGHT - logPaneHeight + 1 : undefined;
-    const logPaneBottom = showLogPanel ? rootHeight - CONTEXT_BAR_HEIGHT : undefined;
+    const logPaneTop = showLogPanel ? rootHeight - SHORTCUT_BAR_HEIGHT - logPaneHeight + 1 : undefined;
+    const logPaneBottom = showLogPanel ? rootHeight - SHORTCUT_BAR_HEIGHT : undefined;
     useEffect(() => {
         const onData = (data) => {
             if (isHelpOverlayOpen) {
@@ -712,6 +712,6 @@ function AppShellContent({ initialModel, actions, windowSize, }) {
                         ? 'Keys: d/y confirm | Esc/n/q cancel'
                         : `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: 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] }));
+    return (_jsxs(Box, { width: rootWidth, height: rootHeight, flexDirection: "column", children: [_jsx(Header, { repoName: model.repoName, activeBranch: model.activeBranch, status: visibleStatus }), _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(ShortcutBar, { 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/Header.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-export declare function Header({ repoName, namespace, activeBranch, }: {
+import type { AppStatus } from '../core/runtime.js';
+export declare function Header({ repoName, activeBranch, status, }: {
     repoName: string;
-    namespace: string;
     activeBranch: string | null;
-}): React.JSX.Element;
+    status: AppStatus;
+}): import("react").JSX.Element;

package/dist/components/Header.js

@@ -1,9 +1,49 @@
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Text } from 'ink';
 import { sanitizeInlineText } from '../core/worktree-projection.js';
-export function Header({ repoName, namespace, activeBranch, }) {
+const KIND_TO_ICON = {
+    idle: 'ℹ',
+    starting: '⚠',
+    'setting-up': '⚠',
+    running: '✓',
+    stopping: '⚠',
+    error: '✘',
+};
+const KIND_TO_COLOR = {
+    idle: 'blue',
+    starting: 'yellow',
+    'setting-up': 'yellow',
+    running: 'green',
+    stopping: 'yellow',
+    error: 'red',
+};
+const KIND_TO_LABEL = {
+    idle: 'Idle',
+    starting: 'Starting',
+    'setting-up': 'Setting up',
+    running: 'Running',
+    stopping: 'Stopping',
+    error: 'Error',
+};
+export function Header({ repoName, activeBranch, status, }) {
     const safeRepoName = sanitizeInlineText(repoName);
-    const safeNamespace = sanitizeInlineText(namespace);
-    const safeActiveBranch = activeBranch === null ? '-' : sanitizeInlineText(activeBranch);
-    return (_jsxs(Box, { borderStyle: "round", borderColor: "blue", flexDirection: "column", paddingX: 1, children: [_jsxs(Text, { bold: true, color: "blue", wrap: "truncate-end", children: ["Worktree Command TUI \u00B7 Repo: ", safeRepoName] }), _jsxs(Text, { color: "green", wrap: "truncate-end", children: ["Active: ", safeActiveBranch] }), _jsxs(Text, { dimColor: true, wrap: "truncate-end", children: ["Namespace: ", safeNamespace] })] }));
+    const safeActiveBranch = activeBranch === null ? null : sanitizeInlineText(activeBranch);
+    const safeStatusMessage = sanitizeInlineText(status.message);
+    const branchSummary = safeActiveBranch === null
+        ? ''
+        : status.kind === 'running' ? `: ${safeActiveBranch}` : ` · ${safeActiveBranch}`;
+    let statusMessageSummary = safeStatusMessage;
+    if (status.kind === 'running' && safeActiveBranch !== null) {
+        if (safeStatusMessage === 'running' || safeStatusMessage === `Active: ${safeActiveBranch}`) {
+            statusMessageSummary = '';
+        }
+        else if (safeStatusMessage === `started ${safeActiveBranch}`) {
+            statusMessageSummary = 'started';
+        }
+        else if (safeStatusMessage === `restarted ${safeActiveBranch}`) {
+            statusMessageSummary = 'restarted';
+        }
+    }
+    const messageSummary = statusMessageSummary === '' ? '' : ` — ${statusMessageSummary}`;
+    return (_jsxs(Box, { borderStyle: "round", borderColor: "blue", flexDirection: "column", paddingX: 1, children: [_jsxs(Text, { bold: true, color: "blue", wrap: "truncate-end", children: ["Repo: ", safeRepoName] }), _jsxs(Text, { color: KIND_TO_COLOR[status.kind], wrap: "truncate-end", children: [KIND_TO_ICON[status.kind], " ", KIND_TO_LABEL[status.kind], branchSummary, messageSummary] })] }));
 }

package/dist/components/ShortcutBar.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export declare function ShortcutBar({ setupAvailable, editorAvailable, confirmationOpen, }: {
+    setupAvailable: boolean;
+    editorAvailable: boolean;
+    confirmationOpen: boolean;
+}): React.JSX.Element;

package/dist/components/ShortcutBar.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { Box, Text } from 'ink';
+function buildKeyHints(setupAvailable, editorAvailable, confirmationOpen) {
+    if (confirmationOpen) {
+        return [
+            { binding: 'd/y', label: 'Confirm' },
+            { binding: 'Esc/n/q', label: 'Cancel' },
+        ];
+    }
+    const hints = [
+        { binding: '↑↓/jk', label: 'Move' },
+        { binding: 'Enter', label: 'Switch' },
+    ];
+    hints.push({ binding: '/', label: 'Filter' });
+    if (setupAvailable) {
+        hints.push({ binding: 'i', label: 'Setup' });
+    }
+    if (editorAvailable) {
+        hints.push({ binding: 'e', label: 'Editor' });
+    }
+    hints.push({ binding: 'o', label: 'Open PR' }, { binding: 'd', label: 'Delete' }, { binding: 'L', label: 'Logs' }, { binding: 's', label: 'Stop' }, { binding: 'r', label: 'Refresh' }, { binding: '?', label: 'Help' }, { binding: 'q', label: 'Quit' });
+    return hints;
+}
+export function ShortcutBar({ setupAvailable, editorAvailable, confirmationOpen, }) {
+    const keyHints = buildKeyHints(setupAvailable, editorAvailable, confirmationOpen);
+    return (_jsx(Box, { flexShrink: 0, paddingX: 1, children: _jsx(Text, { wrap: "truncate-end", children: keyHints.map((hint, hintIndex) => (_jsxs(React.Fragment, { children: [hintIndex === 0 ? null : _jsx(Text, { dimColor: true, children: " | " }), _jsx(Text, { color: "white", children: hint.binding }), _jsxs(Text, { dimColor: true, children: [" ", hint.label] })] }, hint.binding))) }) }));
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohzw/worktree-command-tui",
-  "version": "0.1.6",
+  "version": "0.1.7",
   "description": "A TUI for managing git worktrees",
   "private": false,
   "type": "module",