Improve filesystem fuzzy search results

apps/desktop/src/lib/trpc/routers/filesystem/index.ts

@@ -1,10 +1,147 @@
 import fs from "node:fs/promises";
 import path from "node:path";
 import { shell } from "electron";
+import fg from "fast-glob";
+import Fuse from "fuse.js";
 import type { DirectoryEntry } from "shared/file-tree-types";
 import { z } from "zod";
 import { publicProcedure, router } from "../..";
 
+const SEARCH_INDEX_TTL_MS = 30_000;
+const MAX_SEARCH_RESULTS = 500;
+const DEFAULT_IGNORE_PATTERNS = [
+	"**/node_modules/**",
+	"**/.git/**",
+	"**/dist/**",
+	"**/build/**",
+	"**/.next/**",
+	"**/.turbo/**",
+	"**/coverage/**",
+];
+
+interface FileSearchItem {
+	id: string;
+	name: string;
+	relativePath: string;
+	path: string;
+	isDirectory: boolean;
+}
+
+interface FileSearchIndex {
+	items: FileSearchItem[];
+	fuse: Fuse<FileSearchItem>;
+}
+
+interface FileSearchCacheEntry {
+	index: FileSearchIndex;
+	builtAt: number;
+}
+
+const searchIndexCache = new Map<string, FileSearchCacheEntry>();
+const searchIndexBuilds = new Map<string, Promise<FileSearchIndex>>();
+
+function getSearchCacheKey({
+	rootPath,
+	includeHidden,
+}: {
+	rootPath: string;
+	includeHidden: boolean;
+}) {
+	return `${rootPath}::${includeHidden ? "hidden" : "visible"}`;
+}
+
+async function buildSearchIndex({
+	rootPath,
+	includeHidden,
+}: {
+	rootPath: string;
+	includeHidden: boolean;
+}): Promise<FileSearchIndex> {
+	const entries = await fg("**/*", {
+		cwd: rootPath,
+		onlyFiles: true,
+		dot: includeHidden,
+		followSymbolicLinks: false,
+		unique: true,
+		suppressErrors: true,
+		ignore: DEFAULT_IGNORE_PATTERNS,
+	});
+
+	const items = entries.map((relativePath) => ({
+		id: relativePath,
+		name: path.basename(relativePath),
+		relativePath,
+		path: path.join(rootPath, relativePath),
+		isDirectory: false,
+	}));
+
+	const fuse = new Fuse(items, {
+		keys: [
+			{ name: "name", weight: 2 },
+			{ name: "relativePath", weight: 1 },
+		],
+		threshold: 0.4,
+		includeScore: true,
+		ignoreLocation: true,
+	});
+
+	return { items, fuse };
+}
+
+async function getSearchIndex({
+	rootPath,
+	includeHidden,
+}: {
+	rootPath: string;
+	includeHidden: boolean;
+}): Promise<FileSearchIndex> {
+	const cacheKey = getSearchCacheKey({ rootPath, includeHidden });
+	const cached = searchIndexCache.get(cacheKey);
+	const now = Date.now();
+	const inFlight = searchIndexBuilds.get(cacheKey);
+
+	if (cached && now - cached.builtAt < SEARCH_INDEX_TTL_MS) {
+		return cached.index;
+	}
+
+	if (cached && !inFlight) {
+		const buildPromise = buildSearchIndex({ rootPath, includeHidden })
+			.then((index) => {
+				searchIndexCache.set(cacheKey, { index, builtAt: Date.now() });
+				searchIndexBuilds.delete(cacheKey);
+				return index;
+			})
+			.catch((error) => {
+				searchIndexBuilds.delete(cacheKey);
+				throw error;
+			});
+		searchIndexBuilds.set(cacheKey, buildPromise);
+		return cached.index;
+	}
+
+	if (cached) {
+		return cached.index;
+	}
+
+	if (inFlight) {
+		return await inFlight;
+	}
+
+	const buildPromise = buildSearchIndex({ rootPath, includeHidden })
+		.then((index) => {
+			searchIndexCache.set(cacheKey, { index, builtAt: Date.now() });
+			searchIndexBuilds.delete(cacheKey);
+			return index;
+		})
+		.catch((error) => {
+			searchIndexBuilds.delete(cacheKey);
+			throw error;
+		});
+	searchIndexBuilds.set(cacheKey, buildPromise);
+
+	return await buildPromise;
+}
+
 export const createFilesystemRouter = () => {
 	return router({
 		readDirectory: publicProcedure
@@ -49,6 +186,48 @@ export const createFilesystemRouter = () => {
 				}
 			}),
 
+		searchFiles: publicProcedure
+			.input(
+				z.object({
+					rootPath: z.string(),
+					query: z.string(),
+					includeHidden: z.boolean().default(false),
+					limit: z.number().default(200),
+				}),
+			)
+			.query(async ({ input }) => {
+				const { rootPath, query, includeHidden, limit } = input;
+				const trimmedQuery = query.trim();
+
+				if (!trimmedQuery) {
+					return [];
+				}
+
+				try {
+					const index = await getSearchIndex({ rootPath, includeHidden });
+					const safeLimit = Math.max(1, Math.min(limit, MAX_SEARCH_RESULTS));
+					const results = index.fuse.search(trimmedQuery, {
+						limit: safeLimit,
+					});
+
+					return results.map((result) => ({
+						id: result.item.id,
+						name: result.item.name,
+						relativePath: result.item.relativePath,
+						path: result.item.path,
+						isDirectory: false,
+						score: 1 - (result.score ?? 0),
+					}));
+				} catch (error) {
+					console.error("[filesystem/searchFiles] Failed:", {
+						rootPath,
+						query,
+						error,
+					});
+					return [];
+				}
+			}),
+
 		createFile: publicProcedure
 			.input(
 				z.object({

apps/desktop/src/renderer/screens/main/components/WorkspaceView/RightSidebar/ChangesView/ChangesView.tsx

@@ -221,9 +221,7 @@ export function ChangesView({ onFileOpen, isExpandedView }: ChangesViewProps) {
 		new Set(),
 	);
 
-	// Reset expanded commits when workspace changes to avoid querying
-	// old commit hashes against the new worktree
-	// biome-ignore lint/correctness/useExhaustiveDependencies: intentionally resets on worktreePath change
+	// biome-ignore lint/correctness/useExhaustiveDependencies: reset on workspace change
 	useEffect(() => {
 		setExpandedCommits(new Set());
 	}, [worktreePath]);

apps/desktop/src/renderer/screens/main/components/WorkspaceView/RightSidebar/FilesView/FilesView.tsx

@@ -11,11 +11,18 @@ import type {
 } from "shared/file-tree-types";
 import useResizeObserver from "use-resize-observer";
 import { DeleteConfirmDialog } from "./components/DeleteConfirmDialog";
+import { FileSearchResultNode } from "./components/FileSearchResultNode";
 import { FileTreeContextMenu } from "./components/FileTreeContextMenu";
 import { FileTreeNode } from "./components/FileTreeNode";
 import { FileTreeToolbar } from "./components/FileTreeToolbar";
 import { NewItemInput } from "./components/NewItemInput";
-import { OVERSCAN_COUNT, ROW_HEIGHT, TREE_INDENT } from "./constants";
+import {
+	OVERSCAN_COUNT,
+	ROW_HEIGHT,
+	SEARCH_RESULT_ROW_HEIGHT,
+	TREE_INDENT,
+} from "./constants";
+import { useFileSearch } from "./hooks/useFileSearch";
 import { useFileTreeActions } from "./hooks/useFileTreeActions";
 import type { NewItemMode } from "./types";
 
@@ -31,6 +38,7 @@ export function FilesView() {
 	const { ref: containerRef, height: treeHeight = 400 } = useResizeObserver();
 
 	const {
+		expandedFolders,
 		searchTerm,
 		showHiddenFiles,
 		toggleFolder,
@@ -41,6 +49,10 @@ export function FilesView() {
 	} = useFileExplorerStore();
 
 	const currentSearchTerm = worktreePath ? searchTerm[worktreePath] || "" : "";
+	const currentExpandedFolders = useMemo(
+		() => new Set(worktreePath ? expandedFolders[worktreePath] || [] : []),
+		[worktreePath, expandedFolders],
+	);
 
 	const [childrenCache, setChildrenCache] = useState<
 		Record<string, DirectoryEntry[]>
@@ -71,8 +83,10 @@ export function FilesView() {
 					return { ...entry, children: undefined };
 				}
 
+				const isExpanded = currentExpandedFolders.has(entry.id);
 				const cachedChildren = childrenCache[entry.path];
-				if (cachedChildren) {
+
+				if (isExpanded && cachedChildren) {
 					return {
 						...entry,
 						children: entriesToNodes(cachedChildren),
@@ -82,7 +96,7 @@ export function FilesView() {
 				return { ...entry, children: null };
 			});
 		},
-		[childrenCache],
+		[childrenCache, currentExpandedFolders],
 	);
 
 	const treeData = useMemo((): FileTreeNodeType[] => {
@@ -129,7 +143,7 @@ export function FilesView() {
 		[worktreePath, childrenCache, loadingFolders, showHiddenFiles, trpcUtils],
 	);
 
-	// biome-ignore lint/correctness/useExhaustiveDependencies: intentionally reset on these changes
+	// biome-ignore lint/correctness/useExhaustiveDependencies: reset cache on workspace/visibility change
 	useEffect(() => {
 		setChildrenCache({});
 	}, [worktreePath, showHiddenFiles]);
@@ -140,6 +154,17 @@ export function FilesView() {
 			onRefresh: () => refetch(),
 		});
 
+	const {
+		searchResults,
+		isFetching: isSearchFetching,
+		hasQuery,
+	} = useFileSearch({
+		worktreePath,
+		searchTerm: currentSearchTerm,
+		includeHidden: showHiddenFiles,
+	});
+	const isSearching = hasQuery;
+
 	const addFileViewerPane = useTabsStore((s) => s.addFileViewerPane);
 
 	const [newItemMode, setNewItemMode] = useState<NewItemMode>(null);
@@ -186,12 +211,12 @@ export function FilesView() {
 
 	const handleRename = useCallback(
 		({ id, name }: { id: string; name: string }) => {
-			const node = treeData.find((n) => n.id === id);
+			const node = treeRef.current?.get(id)?.data;
 			if (node) {
 				rename(node.path, name);
 			}
 		},
-		[treeData, rename],
+		[rename],
 	);
 
 	const handleNewFile = useCallback((parentPath: string) => {
@@ -320,30 +345,54 @@ export function FilesView() {
 						/>
 					)}
 
-					<Tree<FileTreeNodeType>
-						ref={treeRef}
-						data={treeData}
-						width="100%"
-						height={treeHeight}
-						rowHeight={ROW_HEIGHT}
-						indent={TREE_INDENT}
-						overscanCount={OVERSCAN_COUNT}
-						idAccessor="id"
-						childrenAccessor="children"
-						openByDefault={false}
-						disableMultiSelection={false}
-						searchTerm={currentSearchTerm}
-						searchMatch={(node, term) =>
-							node.data.name.toLowerCase().includes(term.toLowerCase())
-						}
-						onActivate={handleActivate}
-						onSelect={handleSelect}
-						onToggle={handleToggle}
-						onRename={handleRename}
-						dndManager={dragDropManager}
-					>
-						{FileTreeNode}
-					</Tree>
+					{isSearching ? (
+						searchResults.length > 0 ? (
+							<Tree<FileTreeNodeType>
+								ref={treeRef}
+								data={searchResults}
+								width="100%"
+								height={treeHeight}
+								rowHeight={SEARCH_RESULT_ROW_HEIGHT}
+								indent={0}
+								overscanCount={OVERSCAN_COUNT}
+								idAccessor="id"
+								childrenAccessor="children"
+								openByDefault={false}
+								disableMultiSelection={false}
+								onActivate={handleActivate}
+								onSelect={handleSelect}
+								onRename={handleRename}
+								dndManager={dragDropManager}
+							>
+								{FileSearchResultNode}
+							</Tree>
+						) : (
+							<div className="flex-1 flex items-center justify-center text-muted-foreground text-sm p-4">
+								{isSearchFetching ? "Searching files..." : "No matching files"}
+							</div>
+						)
+					) : (
+						<Tree<FileTreeNodeType>
+							ref={treeRef}
+							data={treeData}
+							width="100%"
+							height={treeHeight}
+							rowHeight={ROW_HEIGHT}
+							indent={TREE_INDENT}
+							overscanCount={OVERSCAN_COUNT}
+							idAccessor="id"
+							childrenAccessor="children"
+							openByDefault={false}
+							disableMultiSelection={false}
+							onActivate={handleActivate}
+							onSelect={handleSelect}
+							onToggle={handleToggle}
+							onRename={handleRename}
+							dndManager={dragDropManager}
+						>
+							{FileTreeNode}
+						</Tree>
+					)}
 				</div>
 			</FileTreeContextMenu>