Improved search input (#13815)

* create input with tags component

* tweaks

* only show filters pane when there are actual filters

* special case for similarity searches

* similarity search tweaks

* populate suggestions values

* scrollbar on outer div

* clean up

* separate custom hook

* use command component

* tooltips

* regex tweaks

* saved searches with confirmation dialogs

* better date handling

* fix filters

* filter capitalization

* filter instructions

* replace underscore in filter type

* alert dialog button color

* toaster on success

web/src/pages/Explore.tsx

@@ -20,7 +20,6 @@ export default function Explore() {
 
   // search field handler
 
-  const [searchTimeout, setSearchTimeout] = useState<NodeJS.Timeout>();
   const [search, setSearch] = useState("");
   const [searchTerm, setSearchTerm] = useState("");
 
@@ -50,18 +49,7 @@ export default function Explore() {
   });
 
   useEffect(() => {
-    if (searchTimeout) {
-      clearTimeout(searchTimeout);
-    }
-
-    setSearchTimeout(
-      setTimeout(() => {
-        setSearchTimeout(undefined);
-        setSearchTerm(search);
-      }, 750),
-    );
-    // we only want to update the searchTerm when search changes
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    setSearchTerm(search);
   }, [search]);
 
   const searchQuery: SearchQuery = useMemo(() => {
@@ -148,7 +136,7 @@ export default function Explore() {
   const { data, size, setSize, isValidating } = useSWRInfinite<SearchResult[]>(
     getKey,
     {
-      revalidateFirstPage: false,
+      revalidateFirstPage: true,
       revalidateAll: false,
     },
   );
@@ -277,6 +265,7 @@ export default function Explore() {
         isLoading={(isLoadingInitialData || isLoadingMore) ?? true}
         setSearch={setSearch}
         setSimilaritySearch={(search) => setSearch(`similarity:${search.id}`)}
+        setSearchFilter={setSearchFilter}
         onUpdateFilter={setSearchFilter}
         onOpenSearch={onOpenSearch}
         loadMore={loadMore}