diff --git a/src/libs/API/parameters/SetPersonalDetailsAndShipExpensifyCardsParams.ts b/src/libs/API/parameters/SetPersonalDetailsAndShipExpensifyCardsParams.ts index 0ab82ba6b755..7f57658f2016 100644 --- a/src/libs/API/parameters/SetPersonalDetailsAndShipExpensifyCardsParams.ts +++ b/src/libs/API/parameters/SetPersonalDetailsAndShipExpensifyCardsParams.ts @@ -9,6 +9,7 @@ type SetPersonalDetailsAndShipExpensifyCardsParams = { addressCountry: string; addressState: string; dob: string; + validateCode: string; }; export default SetPersonalDetailsAndShipExpensifyCardsParams; diff --git a/src/libs/actions/PersonalDetails.ts b/src/libs/actions/PersonalDetails.ts index f759decda812..94a9dc95e846 100644 --- a/src/libs/actions/PersonalDetails.ts +++ b/src/libs/actions/PersonalDetails.ts @@ -465,7 +465,7 @@ function clearAvatarErrors() { }); } -function updatePersonalDetailsAndShipExpensifyCards(values: FormOnyxValues) { +function updatePersonalDetailsAndShipExpensifyCards(values: FormOnyxValues, validateCode: string) { const parameters: SetPersonalDetailsAndShipExpensifyCardsParams = { legalFirstName: values.legalFirstName?.trim() ?? '', legalLastName: values.legalLastName?.trim() ?? '', @@ -477,6 +477,7 @@ function updatePersonalDetailsAndShipExpensifyCards(values: FormOnyxValues = useRef(null); const values = useMemo(() => getSubstepValues(privatePersonalDetails, draftValues), [privatePersonalDetails, draftValues]); @@ -44,9 +52,7 @@ function MissingPersonalDetailsContent({privatePersonalDetails, draftValues}: Mi if (!values) { return; } - PersonalDetails.updatePersonalDetailsAndShipExpensifyCards(values); - FormActions.clearDraftValues(ONYXKEYS.FORMS.PERSONAL_DETAILS_FORM); - Navigation.goBack(); + setIsValidateCodeActionModalVisible(true); }, [values]); const { @@ -75,6 +81,23 @@ function MissingPersonalDetailsContent({privatePersonalDetails, draftValues}: Mi prevScreen(); }; + const handleValidateCodeEntered = useCallback( + (validateCode: string) => { + PersonalDetails.updatePersonalDetailsAndShipExpensifyCards(values, validateCode); + FormActions.clearDraftValues(ONYXKEYS.FORMS.PERSONAL_DETAILS_FORM); + Navigation.goBack(); + }, + [values], + ); + + const sendValidateCode = () => { + if (validateCodeAction?.validateCodeSent) { + return; + } + + requestValidateCodeAction(); + }; + const handleNextScreen = useCallback(() => { if (isEditing) { goToTheLastStep(); @@ -108,6 +131,17 @@ function MissingPersonalDetailsContent({privatePersonalDetails, draftValues}: Mi screenIndex={screenIndex} personalDetailsValues={values} /> + + {}} + onClose={() => setIsValidateCodeActionModalVisible(false)} + isVisible={isValidateCodeActionModalVisible} + title={translate('cardPage.validateCardTitle')} + descriptionPrimary={translate('cardPage.enterMagicCode', {contactMethod: primaryLogin})} + hasMagicCodeBeenSent={!!validateCodeAction?.validateCodeSent} + /> ); }