From 053589176db889b7b67424bebacb368edaef0932 Mon Sep 17 00:00:00 2001 From: VH Date: Thu, 13 Jul 2023 06:46:34 +0700 Subject: [PATCH 1/2] Avoid magic code submit when onFulfill prop change --- src/components/MagicCodeInput.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/MagicCodeInput.js b/src/components/MagicCodeInput.js index f27b1a2fd0c5..f60ce743da5e 100644 --- a/src/components/MagicCodeInput.js +++ b/src/components/MagicCodeInput.js @@ -149,7 +149,7 @@ function MagicCodeInput(props) { // We have not added the editIndex as the dependency because we don't want to run this logic after focusing on an input to edit it after the user has completed the code. // eslint-disable-next-line react-hooks/exhaustive-deps - }, [props.value, props.shouldSubmitOnComplete, props.onFulfill]); + }, [props.value, props.shouldSubmitOnComplete]); useEffect(() => { if (!props.autoFocus) { From ec2fd2e20934212bd0152975be865316b682f68b Mon Sep 17 00:00:00 2001 From: VH Date: Fri, 14 Jul 2023 15:57:27 +0700 Subject: [PATCH 2/2] Update comment --- src/components/MagicCodeInput.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/MagicCodeInput.js b/src/components/MagicCodeInput.js index f60ce743da5e..6fd14f34b7f1 100644 --- a/src/components/MagicCodeInput.js +++ b/src/components/MagicCodeInput.js @@ -147,7 +147,9 @@ function MagicCodeInput(props) { useEffect(() => { validateAndSubmit(); - // We have not added the editIndex as the dependency because we don't want to run this logic after focusing on an input to edit it after the user has completed the code. + // We have not added: + // + the editIndex as the dependency because we don't want to run this logic after focusing on an input to edit it after the user has completed the code. + // + the props.onFulfill as the dependency because props.onFulfill is changed when the preferred locale changed => avoid auto submit form when preferred locale changed. // eslint-disable-next-line react-hooks/exhaustive-deps }, [props.value, props.shouldSubmitOnComplete]);