[ENG-1335] Node create modal results limit (#854)

* Add 50-result limit to FuzzySelectInput to prevent UI freezes

- Limit displayed results to max 50 items in node create modal
- Show truncation hint when results exceed limit
- Update keyboard navigation and selection to use displayedItems
- Fixes ENG-1335: Performance issues with large result sets

Co-authored-by: Trang Doan <trangdoan982@users.noreply.github.com>

* Remove truncation hint from FuzzySelectInput

Users don't need to see the truncation message

Co-authored-by: Trang Doan <trangdoan982@users.noreply.github.com>

* lower lim

* address PR comments

---------

Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: Trang Doan <trangdoan982@users.noreply.github.com>

Author: trangdoan982

apps/roam/src/components/FuzzySelectInput.tsx

@@ -17,6 +17,8 @@ import {
 import fuzzy from "fuzzy";
 import { Result } from "~/utils/types";
 
+const RESULTS_LIMIT = 50;
+
 type FuzzySelectInputProps<T extends Result = Result> = {
   value?: T;
   setValue: (q: T) => void;
@@ -51,6 +53,10 @@ const FuzzySelectInput = <T extends Result = Result>({
       .map((result) => result.original);
   }, [query, options]);
 
+  const displayedItems = useMemo(() => {
+    return filteredItems.slice(0, RESULTS_LIMIT);
+  }, [filteredItems]);
+
   const handleSelect = useCallback(
     (item: T) => {
       setQuery(item.text);
@@ -84,15 +90,15 @@ const FuzzySelectInput = <T extends Result = Result>({
       if (e.key === "ArrowDown") {
         e.preventDefault();
         setActiveIndex((prev) =>
-          prev < filteredItems.length - 1 ? prev + 1 : prev,
+          prev < displayedItems.length - 1 ? prev + 1 : prev,
         );
       } else if (e.key === "ArrowUp") {
         e.preventDefault();
         setActiveIndex((prev) => (prev > 0 ? prev - 1 : 0));
       } else if (e.key === "Enter") {
         e.preventDefault();
         e.stopPropagation();
-        if (isOpen && filteredItems[activeIndex]) {
+        if (isOpen && displayedItems[activeIndex]) {
           const keyUpHandler = (keyUpEvent: KeyboardEvent) => {
             if (keyUpEvent.key === "Enter" || keyUpEvent.key === " ") {
               keyUpEvent.preventDefault();
@@ -104,14 +110,14 @@ const FuzzySelectInput = <T extends Result = Result>({
           setTimeout(() => {
             document.removeEventListener("keyup", keyUpHandler, true);
           }, 150);
-          handleSelect(filteredItems[activeIndex]);
+          handleSelect(displayedItems[activeIndex]);
         }
       } else if (e.key === "Escape") {
         e.preventDefault();
         setIsOpen(false);
       }
     },
-    [filteredItems, activeIndex, isOpen, handleSelect],
+    [displayedItems, activeIndex, isOpen, handleSelect],
   );
 
   useEffect(() => {
@@ -129,7 +135,7 @@ const FuzzySelectInput = <T extends Result = Result>({
 
   useEffect(() => {
     setActiveIndex(0);
-  }, [filteredItems]);
+  }, [displayedItems]);
 
   useEffect(() => {
     if (menuRef.current && isOpen) {
@@ -200,7 +206,7 @@ const FuzzySelectInput = <T extends Result = Result>({
       enforceFocus={false}
       content={
         <Menu className="max-h-64 max-w-md overflow-auto" ulRef={menuRef}>
-          {filteredItems.map((item, index) => (
+          {displayedItems.map((item, index) => (
             <MenuItem
               key={item.uid || index}
               text={item.text}
@@ -212,6 +218,12 @@ const FuzzySelectInput = <T extends Result = Result>({
               multiline
             />
           ))}
+          {filteredItems.length > RESULTS_LIMIT && (
+            <li className="px-3 py-2 text-center text-xs italic text-gray-500">
+              Showing first {RESULTS_LIMIT} results — refine your search to see
+              more.
+            </li>
+          )}
         </Menu>
       }
       target={