feat: add debouncing to workspace search for better user experience

yelnatscoding · yelnatscoding · commit 9dd25a8a9d38 · 2025-07-29T15:44:59.000-07:00
- Add 150ms debounce delay to prevent excessive search operations
- Implement immediate clear functionality without debouncing
- Add proper cleanup for debounce timers to prevent memory leaks
- Improve search responsiveness, especially for users with many workspaces
diff --git a/src/commands.ts b/src/commands.ts
@@ -724,13 +724,6 @@ export class Commands {
 		quickPick.show();
 	}
 
-	/**
-	 * Clear the workspace search filter.
-	 */
-	public clearWorkspaceSearch(): void {
-		vscode.commands.executeCommand("coder.setWorkspaceSearchFilter", "");
-	}
-
 	/**
 	 * Return agents from the workspace.
 	 *
diff --git a/src/extension.ts b/src/extension.ts
@@ -303,10 +303,9 @@ export async function activate(ctx: vscode.ExtensionContext): Promise<void> {
 	vscode.commands.registerCommand("coder.getWorkspaceSearchFilter", () => {
 		return allWorkspacesProvider.getSearchFilter();
 	});
-	vscode.commands.registerCommand(
-		"coder.clearWorkspaceSearch",
-		commands.clearWorkspaceSearch.bind(commands),
-	);
+	vscode.commands.registerCommand("coder.clearWorkspaceSearch", () => {
+		allWorkspacesProvider.clearSearchFilter();
+	});
 
 	// Since the "onResolveRemoteAuthority:ssh-remote" activation event exists
 	// in package.json we're able to perform actions before the authority is
diff --git a/src/workspacesProvider.ts b/src/workspacesProvider.ts
@@ -44,6 +44,7 @@ export class WorkspaceProvider
 	private visible = false;
 	private searchFilter = "";
 	private metadataCache: Record<string, string> = {};
+	private searchDebounceTimer: NodeJS.Timeout | undefined;
 
 	constructor(
 		private readonly getWorkspacesQuery: WorkspaceQuery,
@@ -59,14 +60,38 @@ export class WorkspaceProvider
 		if (filter.length > 200) {
 			filter = filter.substring(0, 200);
 		}
-		this.searchFilter = filter;
-		this.refresh(undefined);
+
+		// Clear any existing debounce timer
+		if (this.searchDebounceTimer) {
+			clearTimeout(this.searchDebounceTimer);
+		}
+
+		// Debounce the search operation to improve performance
+		this.searchDebounceTimer = setTimeout(() => {
+			this.searchFilter = filter;
+			this.refresh(undefined);
+			this.searchDebounceTimer = undefined;
+		}, 150); // 150ms debounce delay - good balance between responsiveness and performance
 	}
 
 	getSearchFilter(): string {
 		return this.searchFilter;
 	}
 
+	/**
+	 * Clear the search filter immediately without debouncing.
+	 * Use this when the user explicitly clears the search.
+	 */
+	clearSearchFilter(): void {
+		// Clear any pending debounce timer
+		if (this.searchDebounceTimer) {
+			clearTimeout(this.searchDebounceTimer);
+			this.searchDebounceTimer = undefined;
+		}
+		this.searchFilter = "";
+		this.refresh(undefined);
+	}
+
 	// fetchAndRefresh fetches new workspaces, re-renders the entire tree, then
 	// keeps refreshing (if a timer length was provided) as long as the user is
 	// still logged in and no errors were encountered fetching workspaces.
@@ -219,6 +244,11 @@ export class WorkspaceProvider
 			clearTimeout(this.timeout);
 			this.timeout = undefined;
 		}
+		// clear search debounce timer
+		if (this.searchDebounceTimer) {
+			clearTimeout(this.searchDebounceTimer);
+			this.searchDebounceTimer = undefined;
+		}
 	}
 
 	/**

Original file line number	Diff line number	Diff line change
`@@ -724,13 +724,6 @@ export class Commands {`
`724`	`724`	`quickPick.show();`
`725`	`725`	`}`
`726`	`726`
`727`		`- /**`
`728`		`- * Clear the workspace search filter.`
`729`		`- */`
`730`		`- public clearWorkspaceSearch(): void {`
`731`		`- vscode.commands.executeCommand("coder.setWorkspaceSearchFilter", "");`
`732`		`- }`
`733`		`-`
`734`	`727`	`/**`
`735`	`728`	`* Return agents from the workspace.`
`736`	`729`	`*`