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) => {
+    const [filter, setFilter] = useState('[]');
-        setSelected(value);
+
-        navigator.clipboard.writeText(`[[${value.label}]]`)
+    const onChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {
+        setFilter(e.target.value);
     }, []);
 
-    return <AsyncSelect
+    const { data: options } = useQuery({
-        isDisabled={isLoading}
+        queryKey: ['obsidian-omnisearch', filter],
-        loadOptions={async (inputValue) => {
+        initialData: [],
-            const response = await fetch(`/search?q=${encodeURIComponent(inputValue)}`)
+        queryFn: async () => {
+            const response = await fetch(`/search?q=${filter}`)
             const fullData: ResultNoteApi[] = await response.json();
 
-            return fullData.map(item => ({
+            return fullData;
-                value: item.path,
+        }
-                label: item.basename,
+    });
-                data: metadata!.find(md => md.value == item.path)!.data
+
-            } satisfies Option))
+    return (<>
-        }}
+        <input onChange={onChange}/>
-        onChange={onChange as any}
+
-        components={{MenuList}}
+        {options.map(option => (
-        isClearable={true}
+            <div>{option.basename}</div>
-        filterOption={(option, inputValue) => {
+        ))}
-            console.log(option, inputValue);
+    </>);
-            return true;
-        }}
-    />
 }
 
 export function App() {