diffstalker 0.2.0 → 0.2.1

package/dist/ui/widgets/ExplorerContent.js

@@ -1,16 +1,13 @@
-import { buildExplorerContentRows, wrapExplorerContentRows, getExplorerContentRowCount, getExplorerContentLineNumWidth, applyMiddleDots, } from '../../utils/explorerDisplayRows.js';
+import { buildExplorerContentRows, wrapExplorerContentRows, getExplorerContentRowCount, getExplorerContentLineNumWidth, } from '../../utils/explorerDisplayRows.js';
 import { truncateAnsi } from '../../utils/ansiTruncate.js';
-import { ansiToBlessed } from '../../utils/ansiToBlessed.js';
-/**
- * Escape blessed tags in content.
- */
-function escapeContent(content) {
-    return content.replace(/\{/g, '{{').replace(/\}/g, '}}');
-}
+const ANSI_RESET = '\x1b[0m';
+const ANSI_GRAY = '\x1b[90m';
+const ANSI_CYAN = '\x1b[36m';
+const ANSI_YELLOW = '\x1b[33m';
 /**
  * Format explorer file content as blessed-compatible tagged string.
  */
-export function formatExplorerContent(filePath, content, width, scrollOffset = 0, maxHeight, truncated = false, wrapMode = false, showMiddleDots = false) {
+export function formatExplorerContent(filePath, content, width, scrollOffset = 0, maxHeight, truncated = false, wrapMode = false) {
     if (!filePath) {
         return '{gray-fg}Select a file to view its contents{/gray-fg}';
     }
@@ -36,7 +33,8 @@ export function formatExplorerContent(filePath, content, width, scrollOffset = 0
     const lines = [];
     for (const row of visibleRows) {
         if (row.type === 'truncation') {
-            lines.push(`{yellow-fg}${escapeContent(row.content)}{/yellow-fg}`);
+            // Use {escape} with raw ANSI for consistency
+            lines.push(`{escape}${ANSI_YELLOW}${row.content}${ANSI_RESET}{/escape}`);
             continue;
         }
         // Code row
@@ -52,38 +50,27 @@ export function formatExplorerContent(filePath, content, width, scrollOffset = 0
         // Determine what content to display
         const rawContent = row.content;
         const shouldTruncate = !wrapMode && rawContent.length > contentWidth;
-        // Use highlighted content if available and not a continuation or middle-dots mode
-        const canUseHighlighting = row.highlighted && !isContinuation && !showMiddleDots;
+        // Use highlighted content if available and not a continuation
+        const canUseHighlighting = row.highlighted && !isContinuation;
         let displayContent;
         if (canUseHighlighting && row.highlighted) {
             // Use ANSI-aware truncation to preserve syntax highlighting
-            const truncatedHighlight = shouldTruncate
+            displayContent = shouldTruncate
                 ? truncateAnsi(row.highlighted, contentWidth)
                 : row.highlighted;
-            // Convert ANSI to blessed tags
-            displayContent = ansiToBlessed(truncatedHighlight);
         }
         else {
             // Plain content path
             let plainContent = rawContent;
-            // Apply middle-dots to raw content
-            if (showMiddleDots && !isContinuation) {
-                plainContent = applyMiddleDots(plainContent, true);
-            }
             // Simple truncation for plain content
             if (shouldTruncate) {
                 plainContent = plainContent.slice(0, Math.max(0, contentWidth - 1)) + '...';
             }
-            displayContent = escapeContent(plainContent);
-        }
-        // Format line with line number
-        let line = '';
-        if (isContinuation) {
-            line = `{cyan-fg}${lineNumDisplay}{/cyan-fg} ${displayContent || ' '}`;
-        }
-        else {
-            line = `{gray-fg}${lineNumDisplay}{/gray-fg} ${displayContent || ' '}`;
+            displayContent = plainContent;
         }
+        // Format line with line number using raw ANSI (avoids blessed escaping issues)
+        const lineNumColor = isContinuation ? ANSI_CYAN : ANSI_GRAY;
+        const line = `{escape}${lineNumColor}${lineNumDisplay}${ANSI_RESET} ${displayContent || ' '}{/escape}`;
         lines.push(line);
     }
     return lines.join('\n');

package/dist/ui/widgets/ExplorerView.js

@@ -1,59 +1,168 @@
+// ANSI escape codes
+const ANSI_RESET = '\x1b[0m';
+const ANSI_BOLD = '\x1b[1m';
+const ANSI_GRAY = '\x1b[90m';
+const ANSI_CYAN = '\x1b[36m';
+const ANSI_YELLOW = '\x1b[33m';
+const ANSI_GREEN = '\x1b[32m';
+const ANSI_RED = '\x1b[31m';
+const ANSI_BLUE = '\x1b[34m';
+const ANSI_MAGENTA = '\x1b[35m';
+const ANSI_INVERSE = '\x1b[7m';
 /**
- * Escape blessed tags in content.
+ * Build tree prefix characters (│ ├ └).
  */
-function escapeContent(content) {
-    return content.replace(/\{/g, '{{').replace(/\}/g, '}}');
+function buildTreePrefix(row) {
+    let prefix = '';
+    // Add vertical lines for parent levels
+    for (let i = 0; i < row.depth; i++) {
+        if (row.parentIsLast[i]) {
+            prefix += '  '; // Parent was last, no line needed
+        }
+        else {
+            prefix += '│ '; // Parent has siblings below, draw line
+        }
+    }
+    // Add connector for this item
+    if (row.depth > 0 || row.parentIsLast.length === 0) {
+        if (row.isLast) {
+            prefix += '└ ';
+        }
+        else {
+            prefix += '├ ';
+        }
+    }
+    return prefix;
+}
+/**
+ * Get status marker for git status.
+ */
+function getStatusMarker(status) {
+    if (!status)
+        return '';
+    switch (status) {
+        case 'modified':
+            return 'M';
+        case 'added':
+            return 'A';
+        case 'deleted':
+            return 'D';
+        case 'untracked':
+            return '?';
+        case 'renamed':
+            return 'R';
+        case 'copied':
+            return 'C';
+        default:
+            return '';
+    }
 }
 /**
- * Format the explorer directory listing as blessed-compatible tagged string.
+ * Get color for git status.
  */
-export function formatExplorerView(items, selectedIndex, isFocused, width, scrollOffset = 0, maxHeight, isLoading = false, error = null) {
+function getStatusColor(status) {
+    if (!status)
+        return ANSI_RESET;
+    switch (status) {
+        case 'modified':
+            return ANSI_YELLOW;
+        case 'added':
+            return ANSI_GREEN;
+        case 'deleted':
+            return ANSI_RED;
+        case 'untracked':
+            return ANSI_GRAY;
+        case 'renamed':
+            return ANSI_BLUE;
+        case 'copied':
+            return ANSI_MAGENTA;
+        default:
+            return ANSI_RESET;
+    }
+}
+/**
+ * Format the explorer tree view as blessed-compatible tagged string.
+ */
+export function formatExplorerView(displayRows, selectedIndex, isFocused, width, scrollOffset = 0, maxHeight, isLoading = false, error = null) {
     if (error) {
         return `{red-fg}Error: ${escapeContent(error)}{/red-fg}`;
     }
     if (isLoading) {
         return '{gray-fg}Loading...{/gray-fg}';
     }
-    if (items.length === 0) {
+    if (displayRows.length === 0) {
         return '{gray-fg}(empty directory){/gray-fg}';
     }
     // Apply scroll offset and max height
-    const visibleItems = maxHeight
-        ? items.slice(scrollOffset, scrollOffset + maxHeight)
-        : items.slice(scrollOffset);
-    // Calculate max name width for alignment
-    const maxNameWidth = Math.min(Math.max(...items.map((item) => item.name.length + (item.isDirectory ? 1 : 0))), width - 10);
+    const visibleRows = maxHeight
+        ? displayRows.slice(scrollOffset, scrollOffset + maxHeight)
+        : displayRows.slice(scrollOffset);
     const lines = [];
-    for (let i = 0; i < visibleItems.length; i++) {
-        const item = visibleItems[i];
+    for (let i = 0; i < visibleRows.length; i++) {
+        const row = visibleRows[i];
         const actualIndex = scrollOffset + i;
         const isSelected = actualIndex === selectedIndex;
         const isHighlighted = isSelected && isFocused;
-        const displayName = item.isDirectory ? `${item.name}/` : item.name;
-        const paddedName = displayName.padEnd(maxNameWidth + 1);
-        let line = '';
-        if (isHighlighted) {
-            // Selected and focused - highlight with cyan
-            if (item.isDirectory) {
-                line = `{cyan-fg}{bold}{inverse}${escapeContent(paddedName)}{/inverse}{/bold}{/cyan-fg}`;
+        const node = row.node;
+        // Build tree prefix
+        const prefix = buildTreePrefix(row);
+        // Directory icon (▸ collapsed, ▾ expanded)
+        let icon = '';
+        if (node.isDirectory) {
+            icon = node.expanded ? '▾ ' : '▸ ';
+        }
+        // Git status indicator
+        const statusMarker = getStatusMarker(node.gitStatus);
+        const statusColor = getStatusColor(node.gitStatus);
+        const statusDisplay = statusMarker ? `${statusColor}${statusMarker}${ANSI_RESET} ` : '';
+        // Directory status indicator (dot if has changed children)
+        const dirStatusDisplay = node.isDirectory && node.hasChangedChildren ? `${ANSI_YELLOW}●${ANSI_RESET} ` : '';
+        // Calculate available width for name
+        const prefixLen = prefix.length +
+            icon.length +
+            (statusMarker ? 2 : 0) +
+            (node.hasChangedChildren && node.isDirectory ? 2 : 0);
+        const maxNameLen = Math.max(5, width - prefixLen - 2);
+        // Display name (with trailing / for directories)
+        let displayName = node.isDirectory ? `${node.name}/` : node.name;
+        if (displayName.length > maxNameLen) {
+            displayName = displayName.slice(0, maxNameLen - 1) + '…';
+        }
+        // Build the line
+        let line = `${ANSI_GRAY}${prefix}${ANSI_RESET}`;
+        if (node.isDirectory) {
+            line += `${ANSI_BLUE}${icon}${ANSI_RESET}`;
+            line += dirStatusDisplay;
+            if (isHighlighted) {
+                line += `${ANSI_CYAN}${ANSI_BOLD}${ANSI_INVERSE}${displayName}${ANSI_RESET}`;
             }
             else {
-                line = `{cyan-fg}{bold}{inverse}${escapeContent(paddedName)}{/inverse}{/bold}{/cyan-fg}`;
+                line += `${ANSI_BLUE}${displayName}${ANSI_RESET}`;
             }
         }
         else {
-            // Not selected or not focused
-            if (item.isDirectory) {
-                line = `{blue-fg}${escapeContent(paddedName)}{/blue-fg}`;
+            // File
+            line += statusDisplay;
+            if (isHighlighted) {
+                line += `${ANSI_CYAN}${ANSI_BOLD}${ANSI_INVERSE}${displayName}${ANSI_RESET}`;
+            }
+            else if (node.gitStatus) {
+                line += `${statusColor}${displayName}${ANSI_RESET}`;
             }
             else {
-                line = escapeContent(paddedName);
+                line += displayName;
             }
         }
-        lines.push(line);
+        lines.push(`{escape}${line}{/escape}`);
     }
     return lines.join('\n');
 }
+/**
+ * Escape blessed tags in content.
+ */
+function escapeContent(content) {
+    return content.replace(/\{/g, '{{').replace(/\}/g, '}}');
+}
 /**
  * Build breadcrumb segments from a path.
  * Returns segments like ["src", "components"] for "src/components"
@@ -84,12 +193,12 @@ export function formatBreadcrumbs(currentPath, repoName) {
 /**
  * Get total rows in explorer for scroll calculations.
  */
-export function getExplorerTotalRows(items) {
-    return items.length;
+export function getExplorerTotalRows(displayRows) {
+    return displayRows.length;
 }
 /**
- * Get item at index.
+ * Get row at index.
  */
-export function getExplorerItemAtIndex(items, index) {
-    return items[index] ?? null;
+export function getExplorerRowAtIndex(displayRows, index) {
+    return displayRows[index] ?? null;
 }

package/dist/ui/widgets/Footer.js

@@ -7,7 +7,7 @@ function calculateVisibleLength(content) {
 /**
  * Format footer content as blessed-compatible tagged string.
  */
-export function formatFooter(activeTab, mouseEnabled, autoTabEnabled, wrapMode, showMiddleDots, width) {
+export function formatFooter(activeTab, mouseEnabled, autoTabEnabled, wrapMode, followEnabled, showOnlyChanges, width) {
     // Left side: indicators
     let leftContent = '{gray-fg}?{/gray-fg} ';
     leftContent += mouseEnabled
@@ -17,9 +17,13 @@ export function formatFooter(activeTab, mouseEnabled, autoTabEnabled, wrapMode,
     leftContent += autoTabEnabled ? '{blue-fg}[auto]{/blue-fg}' : '{gray-fg}[auto]{/gray-fg}';
     leftContent += ' ';
     leftContent += wrapMode ? '{blue-fg}[wrap]{/blue-fg}' : '{gray-fg}[wrap]{/gray-fg}';
+    leftContent += ' ';
+    leftContent += followEnabled ? '{blue-fg}[follow]{/blue-fg}' : '{gray-fg}[follow]{/gray-fg}';
     if (activeTab === 'explorer') {
         leftContent += ' ';
-        leftContent += showMiddleDots ? '{blue-fg}[dots]{/blue-fg}' : '{gray-fg}[dots]{/gray-fg}';
+        leftContent += showOnlyChanges
+            ? '{blue-fg}[changes]{/blue-fg}'
+            : '{gray-fg}[changes]{/gray-fg}';
     }
     // Right side: tabs
     const tabs = [

package/dist/ui/widgets/Header.js

@@ -1,43 +1,9 @@
 import { abbreviateHomePath } from '../../config.js';
 /**
  * Calculate header height based on content.
+ * Currently always returns 1 (single line header).
  */
-export function getHeaderHeight(repoPath, branch, watcherState, width, error = null, isLoading = false) {
-    if (!repoPath)
-        return 1;
-    const displayPath = abbreviateHomePath(repoPath);
-    const isNotGitRepo = error === 'Not a git repository';
-    // Calculate branch width
-    let branchWidth = 0;
-    if (branch) {
-        branchWidth = branch.current.length;
-        if (branch.tracking)
-            branchWidth += 3 + branch.tracking.length;
-        if (branch.ahead > 0)
-            branchWidth += 3 + String(branch.ahead).length;
-        if (branch.behind > 0)
-            branchWidth += 3 + String(branch.behind).length;
-    }
-    // Calculate left side width
-    let leftWidth = displayPath.length;
-    if (isLoading)
-        leftWidth += 2;
-    if (isNotGitRepo)
-        leftWidth += 24;
-    if (error && !isNotGitRepo)
-        leftWidth += error.length + 3;
-    // Check if follow indicator causes wrap
-    if (watcherState?.enabled && watcherState.sourceFile) {
-        const followPath = abbreviateHomePath(watcherState.sourceFile);
-        const fullFollow = ` (follow: ${followPath})`;
-        const availableOneLine = width - leftWidth - branchWidth - 4;
-        if (fullFollow.length > availableOneLine) {
-            const availableWithWrap = width - leftWidth - 2;
-            if (fullFollow.length <= availableWithWrap) {
-                return 2;
-            }
-        }
-    }
+export function getHeaderHeight() {
     return 1;
 }
 /**
@@ -59,7 +25,7 @@ function formatBranch(branch) {
 /**
  * Format header content as blessed-compatible tagged string.
  */
-export function formatHeader(repoPath, branch, isLoading, error, watcherState, width) {
+export function formatHeader(repoPath, branch, isLoading, error, width) {
     if (!repoPath) {
         return '{gray-fg}Waiting for target path...{/gray-fg}';
     }
@@ -76,11 +42,6 @@ export function formatHeader(repoPath, branch, isLoading, error, watcherState, w
     else if (error) {
         leftContent += ` {red-fg}(${error}){/red-fg}`;
     }
-    // Add follow indicator if enabled
-    if (watcherState?.enabled && watcherState.sourceFile) {
-        const followPath = abbreviateHomePath(watcherState.sourceFile);
-        leftContent += ` {gray-fg}(follow: ${followPath}){/gray-fg}`;
-    }
     // Build right side content (branch info)
     const rightContent = branch ? formatBranch(branch) : '';
     if (rightContent) {
@@ -94,10 +55,6 @@ export function formatHeader(repoPath, branch, isLoading, error, watcherState, w
         else if (error) {
             leftLen += error.length + 3; // " (error)"
         }
-        if (watcherState?.enabled && watcherState.sourceFile) {
-            const followPath = abbreviateHomePath(watcherState.sourceFile);
-            leftLen += 10 + followPath.length; // " (follow: path)"
-        }
         const rightLen = branch
             ? branch.current.length +
                 (branch.tracking ? 3 + branch.tracking.length : 0) +

package/dist/utils/fileCategories.js

@@ -24,3 +24,40 @@ export function getFileListSectionCounts(files) {
         stagedCount: staged.length,
     };
 }
+/**
+ * Which category does flat index `i` fall in, and what's the position within it?
+ * Flat order is: modified → untracked → staged.
+ */
+export function getCategoryForIndex(files, index) {
+    const { modified, untracked } = categorizeFiles(files);
+    const modLen = modified.length;
+    const untLen = untracked.length;
+    if (index < modLen) {
+        return { category: 'modified', categoryIndex: index };
+    }
+    if (index < modLen + untLen) {
+        return { category: 'untracked', categoryIndex: index - modLen };
+    }
+    return { category: 'staged', categoryIndex: index - modLen - untLen };
+}
+/**
+ * Convert category + position back to a flat index (clamped).
+ * If the target category is empty, falls back to last file overall, or 0 if no files.
+ */
+export function getIndexForCategoryPosition(files, category, categoryIndex) {
+    const { modified, untracked, staged, ordered } = categorizeFiles(files);
+    if (ordered.length === 0)
+        return 0;
+    const categories = { modified, untracked, staged };
+    const catFiles = categories[category];
+    if (catFiles.length === 0) {
+        return ordered.length - 1;
+    }
+    const clampedIndex = Math.min(categoryIndex, catFiles.length - 1);
+    const offsets = {
+        modified: 0,
+        untracked: modified.length,
+        staged: modified.length + untracked.length,
+    };
+    return offsets[category] + clampedIndex;
+}

package/dist/utils/fileTree.js

@@ -0,0 +1,148 @@
+/**
+ * Utility for building a tree view from flat file paths.
+ * Collapses single-child directories into combined path segments.
+ */
+/**
+ * Build a tree structure from flat file paths.
+ * Paths should be sorted alphabetically before calling this.
+ */
+export function buildFileTree(files) {
+    // Root node
+    const root = {
+        name: '',
+        fullPath: '',
+        isDirectory: true,
+        children: [],
+        depth: 0,
+    };
+    // Build initial trie structure
+    for (let i = 0; i < files.length; i++) {
+        const file = files[i];
+        const parts = file.path.split('/');
+        let current = root;
+        for (let j = 0; j < parts.length; j++) {
+            const part = parts[j];
+            const isFile = j === parts.length - 1;
+            const pathSoFar = parts.slice(0, j + 1).join('/');
+            let child = current.children.find((c) => c.name === part && c.isDirectory === !isFile);
+            if (!child) {
+                child = {
+                    name: part,
+                    fullPath: pathSoFar,
+                    isDirectory: !isFile,
+                    children: [],
+                    depth: current.depth + 1,
+                    fileIndex: isFile ? i : undefined,
+                };
+                current.children.push(child);
+            }
+            current = child;
+        }
+    }
+    // Collapse single-child directories
+    collapseTree(root);
+    // Sort children: directories first, then files, alphabetically
+    sortTree(root);
+    return root;
+}
+/**
+ * Collapse single-child directory chains.
+ * e.g., a -> b -> c -> file becomes "a/b/c" -> file
+ */
+function collapseTree(node) {
+    // First, recursively collapse children
+    for (const child of node.children) {
+        collapseTree(child);
+    }
+    // Then collapse this node's single-child directory chains
+    for (let i = 0; i < node.children.length; i++) {
+        const child = node.children[i];
+        // Collapse if: directory with exactly one child that is also a directory
+        while (child.isDirectory && child.children.length === 1 && child.children[0].isDirectory) {
+            const grandchild = child.children[0];
+            child.name = `${child.name}/${grandchild.name}`;
+            child.fullPath = grandchild.fullPath;
+            child.children = grandchild.children;
+            // Update depths of all descendants
+            updateDepths(child, child.depth);
+        }
+    }
+}
+/**
+ * Update depths recursively after collapsing.
+ */
+function updateDepths(node, depth) {
+    node.depth = depth;
+    for (const child of node.children) {
+        updateDepths(child, depth + 1);
+    }
+}
+/**
+ * Sort tree: directories first (alphabetically), then files (alphabetically).
+ */
+function sortTree(node) {
+    node.children.sort((a, b) => {
+        // Directories before files
+        if (a.isDirectory && !b.isDirectory)
+            return -1;
+        if (!a.isDirectory && b.isDirectory)
+            return 1;
+        // Alphabetically within same type
+        return a.name.localeCompare(b.name);
+    });
+    for (const child of node.children) {
+        sortTree(child);
+    }
+}
+/**
+ * Flatten tree into a list of row items for rendering.
+ * Skips the root node (which has empty name).
+ */
+export function flattenTree(root) {
+    const rows = [];
+    function traverse(node, parentIsLast) {
+        for (let i = 0; i < node.children.length; i++) {
+            const child = node.children[i];
+            const isLast = i === node.children.length - 1;
+            rows.push({
+                type: child.isDirectory ? 'directory' : 'file',
+                name: child.name,
+                fullPath: child.fullPath,
+                depth: child.depth - 1, // Subtract 1 because root is depth 0
+                fileIndex: child.fileIndex,
+                isLast,
+                parentIsLast: [...parentIsLast],
+            });
+            if (child.isDirectory) {
+                traverse(child, [...parentIsLast, isLast]);
+            }
+        }
+    }
+    traverse(root, []);
+    return rows;
+}
+/**
+ * Build tree prefix for rendering (the │ ├ └ characters).
+ */
+export function buildTreePrefix(row) {
+    let prefix = '';
+    // Add vertical lines for parent levels
+    for (let i = 0; i < row.depth; i++) {
+        if (row.parentIsLast[i]) {
+            prefix += '  '; // Parent was last, no line needed
+        }
+        else {
+            prefix += '│ '; // Parent has siblings below, draw line
+        }
+    }
+    // Add connector for this item
+    if (row.depth >= 0) {
+        if (row.isLast) {
+            prefix += '└ ';
+        }
+        else {
+            prefix += '├ ';
+        }
+    }
+    return prefix;
+}

package/eslint.metrics.js

@@ -0,0 +1,16 @@
+// eslint.metrics.js
+// Used by the metrics script to gather complexity data.
+// Warns at low thresholds so all functions appear in the output.
+import baseConfig from './eslint.config.js';
+
+export default [
+  ...baseConfig,
+  {
+    rules: {
+      complexity: ['warn', { max: 1 }],
+      'sonarjs/cognitive-complexity': ['warn', 1],
+      'max-depth': ['warn', { max: 1 }],
+      'max-lines-per-function': ['warn', { max: 1 }],
+    },
+  },
+];