Stash

src/App.tsx

@@ -1,4 +1,4 @@
-import {ReactNode, useCallback, useState} from "react";
+import {ChangeEvent, ReactNode, useCallback, useState} from "react";
 import {FixedSizeList as List} from "react-window";
 import Select, {createFilter, MenuListProps} from "react-select";
 import * as R from 'ramda';
@@ -108,31 +108,30 @@ export function OmnisearchSelect({ setSelected }: { setSelected: (value: Option)
         },
     });
 
-    const onChange = useCallback((value: Option) => {
-        setSelected(value);
-        navigator.clipboard.writeText(`[[${value.label}]]`)
+    const [filter, setFilter] = useState('[]');
+
+    const onChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {
+        setFilter(e.target.value);
     }, []);
 
-    return <AsyncSelect
-        isDisabled={isLoading}
-        loadOptions={async (inputValue) => {
-            const response = await fetch(`/search?q=${encodeURIComponent(inputValue)}`)
+    const { data: options } = useQuery({
+        queryKey: ['obsidian-omnisearch', filter],
+        initialData: [],
+        queryFn: async () => {
+            const response = await fetch(`/search?q=${filter}`)
             const fullData: ResultNoteApi[] = await response.json();
 
-            return fullData.map(item => ({
-                value: item.path,
-                label: item.basename,
-                data: metadata!.find(md => md.value == item.path)!.data
-            } satisfies Option))
-        }}
-        onChange={onChange as any}
-        components={{MenuList}}
-        isClearable={true}
-        filterOption={(option, inputValue) => {
-            console.log(option, inputValue);
-            return true;
-        }}
-    />
+            return fullData;
+        }
+    });
+
+    return (<>
+        <input onChange={onChange}/>
+
+        {options.map(option => (
+            <div>{option.basename}</div>
+        ))}
+    </>);
 }
 
 export function App() {