Add 'f' key to toggle flat/folder file tree mode

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
banga · armanarutiunov · Feb 11, 2026 · Feb 11, 2026 · Feb 11, 2026 · Feb 11, 2026
commit 6f29eeee8849462adb2265aa23d7516c9bbb20ec
diff --git a/src/tui/FileTreePanel.ts b/src/tui/FileTreePanel.ts
@@ -91,10 +91,26 @@ export function flattenVisible(nodes: TreeNode[]): VisibleNode[] {
     return result;
 }
 
+export function flattenFlat(files: DiffFile[]): VisibleNode[] {
+    return files.map((file, i) => ({
+        type: 'file' as const,
+        node: {
+            type: 'file' as const,
+            name: file.fileNameB || file.fileNameA || file.displayName,
+            path: file.fileNameB || file.fileNameA || file.displayName,
+            file,
+            fileIndex: i,
+            depth: 0,
+        },
+        fileIndex: i,
+    }));
+}
+
 export class FileTreePanel {
     private files: DiffFile[];
     private rootNodes: TreeNode[];
     private visibleNodes: VisibleNode[] = [];
+    private flatMode: boolean = false;
     private width: number;
     private height: number;
     private context: Context;
@@ -120,7 +136,30 @@ export class FileTreePanel {
     }
 
     private regenerateVisible(): void {
-        this.visibleNodes = flattenVisible(this.rootNodes);
+        this.visibleNodes = this.flatMode
+            ? flattenFlat(this.files)
+            : flattenVisible(this.rootNodes);
+    }
+
+    toggleFlatMode(): void {
+        const selectedFileIndex = this.getSelectedFileIndex();
+        this.flatMode = !this.flatMode;
+        this.regenerateVisible();
+        if (selectedFileIndex != null) {
+            for (let i = 0; i < this.visibleNodes.length; i++) {
+                const vn = this.visibleNodes[i];
+                if (vn.type === 'file' && vn.fileIndex === selectedFileIndex) {
+                    this.selectedIndex = i;
+                    this.ensureVisible();
+                    return;
+                }
+            }
+        }
+        this.selectedIndex = Math.min(
+            this.selectedIndex,
+            Math.max(0, this.visibleNodes.length - 1)
+        );
+        this.ensureVisible();
     }
 
     resize(width: number, height: number): void {

diff --git a/src/tui/TuiApp.ts b/src/tui/TuiApp.ts
@@ -159,6 +159,12 @@ export class TuiApp {
             return;
         }
 
+        if (key === 'f') {
+            this.tree.toggleFlatMode();
+            this.render();
+            return;
+        }
+
         if (key === 'tab') {
             if (!this.treeVisible) return;
             this.focus = this.focus === 'tree' ? 'diff' : 'tree';

diff --git a/src/tui/tui.test.ts b/src/tui/tui.test.ts
@@ -1,7 +1,7 @@
 import { truncateAnsi } from './Screen';
 import { getFileIcon } from './fileIcons';
 import { binarySearchBoundary } from './sync';
-import { buildTree, flattenVisible } from './FileTreePanel';
+import { buildTree, flattenVisible, flattenFlat } from './FileTreePanel';
 import { DiffFile } from './collectDiffData';
 
 const RESET = '\x1b[0m';
@@ -171,3 +171,40 @@ describe('flattenVisible', () => {
         expect(visible[1].node.name).toBe('README.md');
     });
 });
+
+describe('flattenFlat', () => {
+    test('returns only files with full paths, no dirs', () => {
+        const files = [
+            makeDiffFile('src/tui/App.ts'),
+            makeDiffFile('src/utils.ts'),
+            makeDiffFile('README.md'),
+        ];
+        const visible = flattenFlat(files);
+        expect(visible).toHaveLength(3);
+        expect(visible.every((v) => v.type === 'file')).toBe(true);
+        expect(visible[0].node.name).toBe('src/tui/App.ts');
+        expect(visible[1].node.name).toBe('src/utils.ts');
+        expect(visible[2].node.name).toBe('README.md');
+    });
+
+    test('all nodes have depth 0', () => {
+        const files = [
+            makeDiffFile('a/b/c.ts'),
+            makeDiffFile('d.ts'),
+        ];
+        const visible = flattenFlat(files);
+        expect(visible.every((v) => v.node.depth === 0)).toBe(true);
+    });
+
+    test('preserves file indices', () => {
+        const files = [
+            makeDiffFile('x.ts'),
+            makeDiffFile('y.ts'),
+            makeDiffFile('z.ts'),
+        ];
+        const visible = flattenFlat(files);
+        expect(visible[0].type === 'file' && visible[0].fileIndex).toBe(0);
+        expect(visible[1].type === 'file' && visible[1].fileIndex).toBe(1);
+        expect(visible[2].type === 'file' && visible[2].fileIndex).toBe(2);
+    });
+});