Skip to content

Commit

Permalink
Merge pull request #36763 from abzokhattab/hide-double-offline-indica…
Browse files Browse the repository at this point in the history
…tor-in-bank-steps

Hide the double offline indicator in bank steps
  • Loading branch information
mountiny authored Feb 19, 2024
2 parents a18fa26 + 0184467 commit 3d616b9
Show file tree
Hide file tree
Showing 4 changed files with 233 additions and 245 deletions.
87 changes: 42 additions & 45 deletions src/pages/ReimbursementAccount/BankInfo/substeps/Confirmation.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import {withOnyx} from 'react-native-onyx';
import Button from '@components/Button';
import DotIndicatorMessage from '@components/DotIndicatorMessage';
import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
import ScreenWrapper from '@components/ScreenWrapper';
import Text from '@components/Text';
import useLocalize from '@hooks/useLocalize';
import type {SubStepProps} from '@hooks/useSubStep/types';
Expand Down Expand Up @@ -46,57 +45,55 @@ function Confirmation({reimbursementAccount, reimbursementAccountDraft, onNext,
};

return (
<ScreenWrapper
testID={Confirmation.displayName}
style={[styles.pt0]}
<ScrollView
style={styles.pt0}
contentContainerStyle={styles.flexGrow1}
>
<ScrollView contentContainerStyle={styles.flexGrow1}>
<Text style={[styles.textHeadlineLineHeightXXL, styles.ph5]}>{translate('bankAccount.letsDoubleCheck')}</Text>
<Text style={[styles.mt3, styles.mb3, styles.ph5, styles.textSupporting]}>{translate('bankAccount.thisBankAccount')}</Text>
{setupType === CONST.BANK_ACCOUNT.SUBSTEP.MANUAL && (
<View style={[styles.mb5]}>
<MenuItemWithTopDescription
description={translate('bankAccount.routingNumber')}
title={values[BANK_INFO_STEP_KEYS.ROUTING_NUMBER]}
shouldShowRightIcon={!bankAccountID}
onPress={handleModifyAccountNumbers}
/>

<MenuItemWithTopDescription
description={translate('bankAccount.accountNumber')}
title={values[BANK_INFO_STEP_KEYS.ACCOUNT_NUMBER]}
shouldShowRightIcon={!bankAccountID}
onPress={handleModifyAccountNumbers}
/>
</View>
)}
{setupType === CONST.BANK_ACCOUNT.SUBSTEP.PLAID && (
<Text style={[styles.textHeadlineLineHeightXXL, styles.ph5]}>{translate('bankAccount.letsDoubleCheck')}</Text>
<Text style={[styles.mt3, styles.mb3, styles.ph5, styles.textSupporting]}>{translate('bankAccount.thisBankAccount')}</Text>
{setupType === CONST.BANK_ACCOUNT.SUBSTEP.MANUAL && (
<View style={[styles.mb5]}>
<MenuItemWithTopDescription
description={values[BANK_INFO_STEP_KEYS.BANK_NAME]}
title={`${translate('bankAccount.accountEnding')} ${(values[BANK_INFO_STEP_KEYS.ACCOUNT_NUMBER] ?? '').slice(-4)}`}
description={translate('bankAccount.routingNumber')}
title={values[BANK_INFO_STEP_KEYS.ROUTING_NUMBER]}
shouldShowRightIcon={!bankAccountID}
onPress={handleModifyAccountNumbers}
/>
)}
<View style={[styles.ph5, styles.pb5, styles.flexGrow1, styles.justifyContentEnd]}>
{error && error.length > 0 && (
<DotIndicatorMessage
textStyles={[styles.formError]}
type="error"
messages={{error}}
/>
)}
<Button
isLoading={isLoading}
isDisabled={isLoading}
success
style={[styles.w100]}
onPress={onNext}
text={translate('common.confirm')}

<MenuItemWithTopDescription
description={translate('bankAccount.accountNumber')}
title={values[BANK_INFO_STEP_KEYS.ACCOUNT_NUMBER]}
shouldShowRightIcon={!bankAccountID}
onPress={handleModifyAccountNumbers}
/>
</View>
</ScrollView>
</ScreenWrapper>
)}
{setupType === CONST.BANK_ACCOUNT.SUBSTEP.PLAID && (
<MenuItemWithTopDescription
description={values[BANK_INFO_STEP_KEYS.BANK_NAME]}
title={`${translate('bankAccount.accountEnding')} ${(values[BANK_INFO_STEP_KEYS.ACCOUNT_NUMBER] ?? '').slice(-4)}`}
shouldShowRightIcon={!bankAccountID}
onPress={handleModifyAccountNumbers}
/>
)}
<View style={[styles.ph5, styles.pb5, styles.flexGrow1, styles.justifyContentEnd]}>
{error && error.length > 0 && (
<DotIndicatorMessage
textStyles={[styles.formError]}
type="error"
messages={{error}}
/>
)}
<Button
isLoading={isLoading}
isDisabled={isLoading}
success
style={[styles.w100]}
onPress={onNext}
text={translate('common.confirm')}
/>
</View>
</ScrollView>
);
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import {withOnyx} from 'react-native-onyx';
import Button from '@components/Button';
import DotIndicatorMessage from '@components/DotIndicatorMessage';
import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
import ScreenWrapper from '@components/ScreenWrapper';
import Text from '@components/Text';
import TextLink from '@components/TextLink';
import useLocalize from '@hooks/useLocalize';
Expand Down Expand Up @@ -37,85 +36,83 @@ function ConfirmationUBO({reimbursementAccount, reimbursementAccountDraft, onNex
const error = reimbursementAccount ? ErrorUtils.getLatestErrorMessage(reimbursementAccount) : '';

return (
<ScreenWrapper
testID={ConfirmationUBO.displayName}
style={[styles.pt0]}
<ScrollView
style={styles.pt0}
contentContainerStyle={styles.flexGrow1}
>
<ScrollView contentContainerStyle={styles.flexGrow1}>
<Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mb3]}>{translate('beneficialOwnerInfoStep.letsDoubleCheck')}</Text>
<MenuItemWithTopDescription
description={translate('beneficialOwnerInfoStep.legalName')}
title={`${values.firstName} ${values.lastName}`}
shouldShowRightIcon
onPress={() => {
onMove(UBO_STEP_INDEXES.LEGAL_NAME);
}}
/>
<MenuItemWithTopDescription
description={translate('common.dob')}
title={values.dob}
shouldShowRightIcon
onPress={() => {
onMove(UBO_STEP_INDEXES.DATE_OF_BIRTH);
}}
/>
<MenuItemWithTopDescription
description={translate('beneficialOwnerInfoStep.last4SSN')}
title={values.ssnLast4}
shouldShowRightIcon
onPress={() => {
onMove(UBO_STEP_INDEXES.SSN);
}}
/>
<MenuItemWithTopDescription
description={translate('beneficialOwnerInfoStep.address')}
title={`${values.street}, ${values.city}, ${values.state} ${values.zipCode}`}
shouldShowRightIcon
onPress={() => {
onMove(UBO_STEP_INDEXES.ADDRESS);
}}
/>
<Text style={[styles.textHeadlineLineHeightXXL, styles.ph5, styles.mb3]}>{translate('beneficialOwnerInfoStep.letsDoubleCheck')}</Text>
<MenuItemWithTopDescription
description={translate('beneficialOwnerInfoStep.legalName')}
title={`${values.firstName} ${values.lastName}`}
shouldShowRightIcon
onPress={() => {
onMove(UBO_STEP_INDEXES.LEGAL_NAME);
}}
/>
<MenuItemWithTopDescription
description={translate('common.dob')}
title={values.dob}
shouldShowRightIcon
onPress={() => {
onMove(UBO_STEP_INDEXES.DATE_OF_BIRTH);
}}
/>
<MenuItemWithTopDescription
description={translate('beneficialOwnerInfoStep.last4SSN')}
title={values.ssnLast4}
shouldShowRightIcon
onPress={() => {
onMove(UBO_STEP_INDEXES.SSN);
}}
/>
<MenuItemWithTopDescription
description={translate('beneficialOwnerInfoStep.address')}
title={`${values.street}, ${values.city}, ${values.state} ${values.zipCode}`}
shouldShowRightIcon
onPress={() => {
onMove(UBO_STEP_INDEXES.ADDRESS);
}}
/>

<Text style={[styles.mt3, styles.ph5, styles.textMicroSupporting]}>
{`${translate('beneficialOwnerInfoStep.byAddingThisBankAccount')} `}
<TextLink
href={CONST.ONFIDO_FACIAL_SCAN_POLICY_URL}
style={[styles.textMicro]}
>
{translate('onfidoStep.facialScan')}
</TextLink>
{', '}
<TextLink
href={CONST.ONFIDO_PRIVACY_POLICY_URL}
style={[styles.textMicro]}
>
{translate('common.privacy')}
</TextLink>
{` ${translate('common.and')} `}
<TextLink
href={CONST.ONFIDO_TERMS_OF_SERVICE_URL}
style={[styles.textMicro]}
>
{translate('common.termsOfService')}
</TextLink>
</Text>
<View style={[styles.ph5, styles.mtAuto]}>
{error && error.length > 0 && (
<DotIndicatorMessage
textStyles={[styles.formError]}
type="error"
messages={{error}}
/>
)}
<Button
success
style={[styles.w100, styles.mt2, styles.pb5]}
onPress={onNext}
text={translate('common.confirm')}
<Text style={[styles.mt3, styles.ph5, styles.textMicroSupporting]}>
{`${translate('beneficialOwnerInfoStep.byAddingThisBankAccount')} `}
<TextLink
href={CONST.ONFIDO_FACIAL_SCAN_POLICY_URL}
style={[styles.textMicro]}
>
{translate('onfidoStep.facialScan')}
</TextLink>
{', '}
<TextLink
href={CONST.ONFIDO_PRIVACY_POLICY_URL}
style={[styles.textMicro]}
>
{translate('common.privacy')}
</TextLink>
{` ${translate('common.and')} `}
<TextLink
href={CONST.ONFIDO_TERMS_OF_SERVICE_URL}
style={[styles.textMicro]}
>
{translate('common.termsOfService')}
</TextLink>
</Text>
<View style={[styles.ph5, styles.mtAuto]}>
{error && error.length > 0 && (
<DotIndicatorMessage
textStyles={[styles.formError]}
type="error"
messages={{error}}
/>
</View>
</ScrollView>
</ScreenWrapper>
)}
<Button
success
style={[styles.w100, styles.mt2, styles.pb5]}
onPress={onNext}
text={translate('common.confirm')}
/>
</View>
</ScrollView>
);
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import Button from '@components/Button';
import DotIndicatorMessage from '@components/DotIndicatorMessage';
import * as Expensicons from '@components/Icon/Expensicons';
import MenuItem from '@components/MenuItem';
import ScreenWrapper from '@components/ScreenWrapper';
import Text from '@components/Text';
import useLocalize from '@hooks/useLocalize';
import useThemeStyles from '@hooks/useThemeStyles';
Expand Down Expand Up @@ -101,49 +100,47 @@ function CompanyOwnersListUBO({
});

return (
<ScreenWrapper
testID={CompanyOwnersListUBO.displayName}
style={[styles.pt0]}
<ScrollView
style={styles.pt0}
contentContainerStyle={[styles.flexGrow1, styles.ph0]}
>
<ScrollView contentContainerStyle={[styles.flexGrow1, styles.ph0]}>
<Text style={[styles.textHeadlineLineHeightXXL, styles.ph5]}>{translate('beneficialOwnerInfoStep.letsDoubleCheck')}</Text>
<Text style={[styles.p5, styles.textSupporting]}>{translate('beneficialOwnerInfoStep.regulationRequiresUsToVerifyTheIdentity')}</Text>
<View>
<Text style={[styles.textSupporting, styles.pv1, styles.ph5]}>{`${translate('beneficialOwnerInfoStep.owners')}:`}</Text>
{isUserUBO && (
<MenuItem
title={`${requestorData.firstName} ${requestorData.lastName}`}
description={`${requestorData.requestorAddressStreet}, ${requestorData.requestorAddressCity}, ${requestorData.requestorAddressState} ${requestorData.requestorAddressZipCode}`}
wrapperStyle={[styles.ph5]}
icon={Expensicons.FallbackAvatar}
iconWidth={40}
iconHeight={40}
interactive={false}
shouldShowRightIcon={false}
displayInDefaultIconColor
/>
)}
{extraBeneficialOwners}
</View>

<View style={[styles.ph5, styles.mtAuto]}>
{error && error.length > 0 && (
<DotIndicatorMessage
textStyles={[styles.formError]}
type="error"
messages={{error}}
/>
)}
</View>
<Button
success
isLoading={isLoading}
style={[styles.w100, styles.mt2, styles.pb5, styles.ph5]}
onPress={handleUBOsConfirmation}
text={translate('common.confirm')}
/>
</ScrollView>
</ScreenWrapper>
<Text style={[styles.textHeadlineLineHeightXXL, styles.ph5]}>{translate('beneficialOwnerInfoStep.letsDoubleCheck')}</Text>
<Text style={[styles.p5, styles.textSupporting]}>{translate('beneficialOwnerInfoStep.regulationRequiresUsToVerifyTheIdentity')}</Text>
<View>
<Text style={[styles.textSupporting, styles.pv1, styles.ph5]}>{`${translate('beneficialOwnerInfoStep.owners')}:`}</Text>
{isUserUBO && (
<MenuItem
title={`${requestorData.firstName} ${requestorData.lastName}`}
description={`${requestorData.requestorAddressStreet}, ${requestorData.requestorAddressCity}, ${requestorData.requestorAddressState} ${requestorData.requestorAddressZipCode}`}
wrapperStyle={[styles.ph5]}
icon={Expensicons.FallbackAvatar}
iconWidth={40}
iconHeight={40}
interactive={false}
shouldShowRightIcon={false}
displayInDefaultIconColor
/>
)}
{extraBeneficialOwners}
</View>

<View style={[styles.ph5, styles.mtAuto]}>
{error && error.length > 0 && (
<DotIndicatorMessage
textStyles={[styles.formError]}
type="error"
messages={{error}}
/>
)}
</View>
<Button
success
isLoading={isLoading}
style={[styles.w100, styles.mt2, styles.pb5, styles.ph5]}
onPress={handleUBOsConfirmation}
text={translate('common.confirm')}
/>
</ScrollView>
);
}

Expand Down
Loading

0 comments on commit 3d616b9

Please sign in to comment.