diff --git a/.changeset/brown-hats-think.md b/.changeset/brown-hats-think.md new file mode 100644 index 000000000000..905763e74538 --- /dev/null +++ b/.changeset/brown-hats-think.md @@ -0,0 +1,5 @@ +--- +"live-mobile": minor +--- + +Debounce memo tag changes diff --git a/apps/ledger-live-mobile/src/newArch/features/MemoTag/hooks/useMemoTagInput.ts b/apps/ledger-live-mobile/src/newArch/features/MemoTag/hooks/useMemoTagInput.ts index 9b3bdcb9284d..b9adae6e9daa 100644 --- a/apps/ledger-live-mobile/src/newArch/features/MemoTag/hooks/useMemoTagInput.ts +++ b/apps/ledger-live-mobile/src/newArch/features/MemoTag/hooks/useMemoTagInput.ts @@ -1,4 +1,5 @@ -import { FC, useCallback, useState } from "react"; +import debounce from "lodash/debounce"; +import { FC, useCallback, useMemo, useState } from "react"; import { useFeature } from "@ledgerhq/live-common/featureFlags/index"; import { Transaction } from "@ledgerhq/live-common/generated/types"; @@ -18,14 +19,20 @@ export const useMemoTagInput = ( const [isEmpty, setIsEmpty] = useState(true); const [error, setError] = useState(); + const debouncedUpdateTransaction = useMemo( + () => debounce(updateTransaction, DEBOUNCE_DELAY), + [updateTransaction], + ); const handleChange = useCallback( ({ patch, value, error }) => { setIsEmpty(!value); setError(error); - updateTransaction(patch); + debouncedUpdateTransaction(patch); }, - [updateTransaction], + [debouncedUpdateTransaction], ); return Input && { Input, isEmpty, error, handleChange }; }; + +const DEBOUNCE_DELAY = 300;