useTransactionsSearch

packages/desktop-client/src/components/accounts/Account.tsx

@@ -12,7 +12,6 @@ import { useDispatch, useSelector } from 'react-redux';
 import { Navigate, useParams, useLocation } from 'react-router-dom';
 
 import { t } from 'i18next';
-import { useDebounceCallback } from 'usehooks-ts';
 import { v4 as uuidv4 } from 'uuid';
 
 import {
@@ -32,6 +31,7 @@ import {
 import {
   usePreviewTransactions,
   useTransactions,
+  useTransactionsSearch,
 } from 'loot-core/client/data-hooks/transactions';
 import { validForTransfer } from 'loot-core/client/transfer';
 import { type UndoState } from 'loot-core/server/undo';
@@ -275,7 +275,6 @@ function AccountTransactions({
     onBatchUnlinkSchedule,
   } = useTransactionBatchActions();
 
-  const [isSearching, setIsSearching] = useState<boolean>(false);
   const [filterConditions, setFilterConditions] = useState<ConditionEntity[]>(
     location?.state?.filterConditions || [],
   );
@@ -688,25 +687,11 @@ function AccountTransactions({
     }
   }, [modalShowing, reloadTransactions, wasModalShowing]);
 
-  const updateSearchQuery = useDebounceCallback(
-    useCallback(
-      async (searchText: string) => {
-        if (searchText === '') {
-          setTransactionsQuery(await rootTransactionsQuery());
-        } else if (searchText) {
-          setTransactionsQuery(currentQuery =>
-            queries.transactionsSearch(currentQuery, searchText, dateFormat),
-          );
-        }
-
-        setIsSearching(searchText !== '');
-      },
-      [rootTransactionsQuery, dateFormat],
-    ),
-    150,
-  );
-
-  const onSearch = useCallback(updateSearchQuery, [updateSearchQuery]);
+  const { isSearching, search: onSearch } = useTransactionsSearch({
+    updateQuery: setTransactionsQuery,
+    resetQuery: () => rootTransactionsQuery().then(setTransactionsQuery),
+    dateFormat,
+  });
 
   const onSync = useCallback(async () => {
     const account = accounts.find(acct => acct.id === accountId);