add ListSearchInput component

src/renderer/features/shared/components/list-search-input.tsx

@@ -0,0 +1,10 @@
+import { SearchInput } from '/@/renderer/features/shared/components/search-input';
+import { useSearchTermFilter } from '/@/renderer/features/shared/hooks/use-search-term-filter';
+
+export const ListSearchInput = () => {
+    const { searchTerm, setSearchTerm } = useSearchTermFilter();
+
+    return (
+        <SearchInput defaultValue={searchTerm} onChange={(e) => setSearchTerm(e.target.value)} />
+    );
+};

src/renderer/features/shared/hooks/use-search-term-filter.ts

@@ -1,4 +1,4 @@
-import { useDebouncedValue } from '@mantine/hooks';
+import { useDebouncedCallback } from '@mantine/hooks';
 import { parseAsString, useQueryState } from 'nuqs';
 
 import { FILTER_KEYS } from '/@/renderer/features/shared/utils';
@@ -9,11 +9,10 @@ export const useSearchTermFilter = (defaultValue?: string) => {
         defaultValue ? parseAsString.withDefault(defaultValue) : parseAsString,
     );
 
-    const [debouncedSearchTerm] = useDebouncedValue(searchTerm, 300);
+    const debouncedSetSearchTerm = useDebouncedCallback(setSearchTerm, 300);
 
     return {
-        [FILTER_KEYS.SHARED.SEARCH_TERM]: debouncedSearchTerm ?? undefined,
-        rawSearchTerm: searchTerm ?? undefined,
-        setSearchTerm,
+        [FILTER_KEYS.SHARED.SEARCH_TERM]: searchTerm ?? undefined,
+        setSearchTerm: debouncedSetSearchTerm,
     };
 };