tree: forward searchChanged event to extension backend

Expose search text updates through vscode-messenger so extensions
can implement backend search for large trees.

Also document the new onDidSearchChanged event in the tree README.

Author: phongtrinh1234

src/tree/README.md

@@ -68,6 +68,9 @@ export class TreeDataProvider implements CDTTreeDataProvider<Example, ExampleDTO
             }),
             webview.onDidToggleNode(event => {
                 // Handle toggle
+            }),
+            webview.onDidSearchChanged(event => {
+                // Handle search input changes
             })
         );
     }

src/tree/browser/tree.tsx

@@ -14,7 +14,9 @@ import classNames from 'classnames';
 import { Resizable } from 're-resizable';
 import { default as React, useCallback, useEffect, useLayoutEffect, useMemo, useState } from 'react';
 import { debounce } from 'throttle-debounce';
+import { HOST_EXTENSION } from 'vscode-messenger-common';
 import { findNestedValue } from '../../base';
+import { messenger } from '../../browser-types';
 import { CommandDefinition } from '../../vscode/webview-types';
 import {
     CDTTreeItem,
@@ -25,6 +27,7 @@ import {
     CDTTreeTableStringColumn,
     CDTTreeWebviewContext
 } from '../common/index';
+import { CDTTreeMessengerType } from '../common/tree-messenger-types';
 import ActionCell from './components/cells/ActionCell';
 import StringCell from './components/cells/StringCell';
 import { ExpandIcon } from './components/expand-icon';
@@ -238,12 +241,31 @@ export const CDTTree = <T extends CDTTreeItemResource>(props: CDTTreeProps<T>) =
         }
     }, []);
 
-    const onSearchShow = useCallback(() => setGlobalSearchText(globalSearchRef.current?.value()), []);
+    const notifySearchChanged = useCallback((text: string) => {
+        messenger.sendNotification(CDTTreeMessengerType.searchChanged, HOST_EXTENSION, { data: { text } });
+    }, []);
+
+    const onSearchShow = useCallback(() => {
+        const text = globalSearchRef.current?.value() ?? '';
+        setGlobalSearchText(text);
+        notifySearchChanged(text);
+    }, [notifySearchChanged]);
+
     const onSearchHide = useCallback(() => {
         setGlobalSearchText(undefined);
         autoSelectRowRef.current = true;
-    }, [autoSelectRowRef]);
-    const onSearchChange = useMemo(() => debounce(300, (text: string) => setGlobalSearchText(text)), []);
+
+        notifySearchChanged('');
+    }, [notifySearchChanged]);
+
+    const onSearchChange = useMemo(
+        () =>
+            debounce(300, (text: string) => {
+                setGlobalSearchText(text);
+                notifySearchChanged(text);
+            }),
+        [notifySearchChanged]
+    );
 
     // ==== Selection ====
 

src/tree/common/tree-messenger-types.ts

@@ -45,4 +45,5 @@ export namespace CDTTreeMessengerType {
     export const toggleNode: NotificationType<CDTTreeNotification<string>> = { method: 'toggleNode' };
     export const clickNode: NotificationType<CDTTreeNotification<string>> = { method: 'clickNode' };
     export const openSearch: NotificationType<void> = { method: 'openSearch' };
+    export const searchChanged: NotificationType<CDTTreeNotification<{ text: string }>> = { method: 'searchChanged' };
 }

src/tree/vscode/tree-webview-view-provider.ts

@@ -18,6 +18,8 @@ export abstract class CDTTreeWebviewViewProvider<TNode> implements vscode.Webvie
     public readonly onDidExecuteCommand = this.onDidExecuteCommandEvent.event;
     protected onDidClickNodeEvent = new vscode.EventEmitter<CDTTreeNotification<string>>();
     public readonly onDidClickNode = this.onDidClickNodeEvent.event;
+    protected onDidSearchChangedEvent = new vscode.EventEmitter<CDTTreeNotification<{ text: string }>>();
+    public readonly onDidSearchChanged = this.onDidSearchChangedEvent.event;
 
     protected get extensionUri(): vscode.Uri {
         return this.context.extensionUri;
@@ -119,6 +121,9 @@ export abstract class CDTTreeWebviewViewProvider<TNode> implements vscode.Webvie
             }),
             this.messenger.onNotification(CDTTreeMessengerType.clickNode, event => this.onDidClickNodeEvent.fire(event), {
                 sender: participant
+            }),
+            this.messenger.onNotification(CDTTreeMessengerType.searchChanged, event => this.onDidSearchChangedEvent.fire(event), {
+                sender: participant
             })
         ];