ENG-1730: Add node type filter dropdown to advanced node search (#1054)

* basic filter

* Address PR review feedback for node type filter.

Fix indeterminate checkbox sizing, use Blueprint controls, improve Escape handling when the filter popover is open, disable the trigger while types load, colocate click-outside handling, and add unit tests for filter state helpers.

Co-authored-by: Cursor <cursoragent@cursor.com>

* Fix eslint no-floating-promises in filter unit tests.

Co-authored-by: Cursor <cursoragent@cursor.com>

* remove test

* cleanup styling

* final clean

* lint fix

* cleanup

* Address review feedback on node type filter UI.

Use Roam-safe hover styles, inline padding instead of important utilities, filter-keep icon, and clearer filter-state comment.

Co-authored-by: Cursor <cursoragent@cursor.com>

* fix filter icon janky

---------

Co-authored-by: Cursor <cursoragent@cursor.com>

Author: trangdoan982

apps/roam/src/components/AdvancedNodeSearchDialog/AdvancedSearchDialog.tsx

@@ -43,6 +43,7 @@ import {
   splitWithHighlights,
   stripTypePrefix,
 } from "./utils";
+import { DiscourseNodeTypeFilter } from "~/components/AdvancedNodeSearchDialog/DiscourseNodeTypeFilter";
 import { RenderRoamBlock, RenderRoamPage } from "~/utils/roamReactComponents";
 import { AdvancedSearchFooter } from "./AdvancedSearchFooter";
 
@@ -157,6 +158,8 @@ const AdvancedNodeSearchDialog = ({
   const [activeIndex, setActiveIndex] = useState(0);
   const [results, setResults] = useState<SearchResult[]>([]);
   const [sort, setSort] = useState<SortConfig>(DEFAULT_SORT_CONFIG);
+  const [discourseNodes, setDiscourseNodes] = useState<DiscourseNode[]>([]);
+  const [selectedNodeTypeIds, setSelectedNodeTypeIds] = useState<string[]>([]);
   const miniSearchRef = useRef<MiniSearch<
     SearchResult & { id: string }
   > | null>(null);
@@ -165,14 +168,9 @@ const AdvancedNodeSearchDialog = ({
   const inputRef = useRef<HTMLInputElement | null>(null);
   const [insertTarget, setInsertTarget] = useState<InsertTarget | null>(null);
 
-  const nodeConfigByType = useMemo(() => {
-    const discourseNodes = getDiscourseNodes().filter(
-      (node) => node.backedBy === "user",
-    );
-    return Object.fromEntries(
-      discourseNodes.map((node) => [node.type, node]),
-    ) as Record<string, DiscourseNode>;
-  }, []);
+  const nodeConfigByType = Object.fromEntries(
+    discourseNodes.map((node) => [node.type, node]),
+  );
 
   const activeResult = results[activeIndex] ?? null;
   const keywords = debouncedSearchTerm.split(/\s+/).filter(Boolean);
@@ -200,6 +198,7 @@ const AdvancedNodeSearchDialog = ({
       setDebouncedSearchTerm("");
       setActiveIndex(0);
       setSort(DEFAULT_SORT_CONFIG);
+      setSelectedNodeTypeIds([]);
       setResults([]);
       setIndexError(false);
     }
@@ -221,10 +220,18 @@ const AdvancedNodeSearchDialog = ({
       miniSearch: miniSearchRef.current,
       allResults: allResultsRef.current,
       searchTerm: debouncedSearchTerm,
+      typeFilter: selectedNodeTypeIds.length ? selectedNodeTypeIds : undefined,
     });
 
     setResults(sortSearchResults({ hits: scoredHits, sort }));
-  }, [debouncedSearchTerm, indexError, isIndexLoading, isOpen, sort]);
+  }, [
+    debouncedSearchTerm,
+    indexError,
+    isIndexLoading,
+    isOpen,
+    selectedNodeTypeIds,
+    sort,
+  ]);
 
   useEffect(() => {
     let cancelled = false;
@@ -234,6 +241,7 @@ const AdvancedNodeSearchDialog = ({
     const discourseNodes = getDiscourseNodes().filter(
       (node) => node.backedBy === "user",
     );
+    setDiscourseNodes(discourseNodes);
 
     void buildSearchIndex(discourseNodes)
       .then(({ miniSearch, results: indexedResults }) => {
@@ -270,7 +278,7 @@ const AdvancedNodeSearchDialog = ({
 
   useEffect(() => {
     setActiveIndex(0);
-  }, [debouncedSearchTerm, sort]);
+  }, [debouncedSearchTerm, selectedNodeTypeIds, sort]);
 
   useEffect(() => {
     const panel = resultsPanelRef.current;
@@ -419,7 +427,11 @@ const AdvancedNodeSearchDialog = ({
             placeholder="Search discourse nodes..."
             value={searchTerm}
           />
-
+          <DiscourseNodeTypeFilter
+            nodeTypes={discourseNodes}
+            onSelectedTypeIdsChange={setSelectedNodeTypeIds}
+            selectedTypeIds={selectedNodeTypeIds}
+          />
           <DiscourseNodeSortControl
             disabled={isIndexLoading || indexError}
             onSortChange={handleSortChange}