diff --git a/src/components/SubStepForms/ConfirmationStep.tsx b/src/components/SubStepForms/ConfirmationStep.tsx index fe12036fa120..4333f48a864f 100644 --- a/src/components/SubStepForms/ConfirmationStep.tsx +++ b/src/components/SubStepForms/ConfirmationStep.tsx @@ -12,12 +12,15 @@ import useSafeAreaPaddings from '@hooks/useSafeAreaPaddings'; import type {SubStepProps} from '@hooks/useSubStep/types'; import useThemeStyles from '@hooks/useThemeStyles'; import type {ForwardedFSClassProps} from '@libs/Fullstory/types'; +import type {BrickRoad} from '@libs/WorkspacesSettingsUtils'; type SummaryItem = { description: string; title: string; shouldShowRightIcon: boolean; onPress: () => void; + brickRoadIndicator?: BrickRoad; + errorText?: string; }; type ConfirmationStepProps = SubStepProps & @@ -67,13 +70,15 @@ function ConfirmationStep({ contentContainerStyle={[styles.flexGrow1, shouldApplySafeAreaPaddingBottom && {paddingBottom: safeAreaInsetPaddingBottom + styles.pb5.paddingBottom}]} > {pageTitle} - {summaryItems.map(({description, title, shouldShowRightIcon, onPress}) => ( + {summaryItems.map(({description, title, shouldShowRightIcon, onPress, brickRoadIndicator, errorText}) => ( ))} diff --git a/src/libs/actions/Wallet.ts b/src/libs/actions/Wallet.ts index 6158443e08b9..2e2fc2c614b3 100644 --- a/src/libs/actions/Wallet.ts +++ b/src/libs/actions/Wallet.ts @@ -62,7 +62,7 @@ function setKYCWallSource(source?: ValueOf, chatRe * Validates a user's provided details against a series of checks */ function updatePersonalDetails(personalDetails: UpdatePersonalDetailsForWalletParams) { - const optimisticData: Array> = [ + const optimisticData: Array> = [ { onyxMethod: Onyx.METHOD.MERGE, key: ONYXKEYS.FORMS.WALLET_ADDITIONAL_DETAILS, @@ -72,6 +72,14 @@ function updatePersonalDetails(personalDetails: UpdatePersonalDetailsForWalletPa errorFields: null, }, }, + { + onyxMethod: Onyx.METHOD.MERGE, + key: ONYXKEYS.WALLET_ADDITIONAL_DETAILS, + value: { + errorCode: null, + errors: null, + }, + }, ]; const finallyData: Array> = [ diff --git a/src/pages/EnablePayments/PersonalInfo/substeps/ConfirmationStep.tsx b/src/pages/EnablePayments/PersonalInfo/substeps/ConfirmationStep.tsx index 116495d31227..66bcba239ee7 100644 --- a/src/pages/EnablePayments/PersonalInfo/substeps/ConfirmationStep.tsx +++ b/src/pages/EnablePayments/PersonalInfo/substeps/ConfirmationStep.tsx @@ -22,6 +22,7 @@ function ConfirmationStep({onNext, onMove, isEditing}: SubStepProps) { const error = getLatestErrorMessage(walletAdditionalDetails ?? {}); const values = useMemo(() => getSubstepValues(PERSONAL_INFO_STEP_KEYS, walletAdditionalDetailsDraft, walletAdditionalDetails), [walletAdditionalDetails, walletAdditionalDetailsDraft]); const shouldAskForFullSSN = walletAdditionalDetails?.errorCode === CONST.WALLET.ERROR.SSN; + const shouldShowSSNRowError = shouldAskForFullSSN && values[PERSONAL_INFO_STEP_KEYS.SSN_LAST_4].length < CONST.BANK_ACCOUNT.MAX_LENGTH.FULL_SSN; const summaryItems = [ { @@ -60,6 +61,8 @@ function ConfirmationStep({onNext, onMove, isEditing}: SubStepProps) { description: translate(shouldAskForFullSSN ? 'common.ssnFull9' : 'personalInfoStep.last4SSN'), title: values[PERSONAL_INFO_STEP_KEYS.SSN_LAST_4], shouldShowRightIcon: true, + brickRoadIndicator: shouldShowSSNRowError ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined, + errorText: shouldShowSSNRowError ? error : undefined, onPress: () => { onMove(PERSONAL_INFO_STEP_INDEXES.SSN); },