diff --git a/src/pages/ReimbursementAccount/BankInfo/substeps/Manual.tsx b/src/pages/ReimbursementAccount/BankInfo/substeps/Manual.tsx
index c6086b856262..dcee4756f81a 100644
--- a/src/pages/ReimbursementAccount/BankInfo/substeps/Manual.tsx
+++ b/src/pages/ReimbursementAccount/BankInfo/substeps/Manual.tsx
@@ -65,7 +65,7 @@ function Manual({reimbursementAccount, onNext}: ManualProps) {
const shouldDisableInputs = Boolean(reimbursementAccount?.achData?.[bankInfoStepKeys.BANK_ACCOUNT_ID] ?? '');
return (
- // @ts-expect-error TODO: Remove this once Form (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript.
+ // @ts-expect-error TODO: Remove this once FormProvider (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript.
-
+
);
}
diff --git a/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerCheckUBO.tsx b/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerCheckUBO.tsx
index d4a08c05caa9..79cdd4d1dd06 100644
--- a/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerCheckUBO.tsx
+++ b/src/pages/ReimbursementAccount/BeneficialOwnerInfo/substeps/BeneficialOwnerCheckUBO.tsx
@@ -47,7 +47,7 @@ function BeneficialOwnerCheckUBO({title, onSelectedValue, defaultValue}: Benefic
testID={BeneficialOwnerCheckUBO.displayName}
style={[styles.pt0]}
>
- {/* @ts-expect-error TODO: Remove this once Form (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript. */}
+ {/* @ts-expect-error TODO: Remove this once FormProvider (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript. */}
ValidationUtils.getFieldRequiredErrors(values, [firstNameInputID, lastNameInputID]);
return (
- // @ts-expect-error TODO: Remove this once Form (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript
+ // @ts-expect-error TODO: Remove this once FormProvider (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript
- {/* @ts-expect-error TODO: Remove this once Form (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript */}
+ {/* @ts-expect-error TODO: Remove this once FormProvider (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript */}
{translate('businessInfoStep.pleaseSelectTheStateYourCompanyWasIncorporatedIn')}
-
-
+
);
}
diff --git a/src/pages/ReimbursementAccount/BusinessInfo/substeps/NameBusiness.tsx b/src/pages/ReimbursementAccount/BusinessInfo/substeps/NameBusiness.tsx
index 974416c5ace1..f35010b3c224 100644
--- a/src/pages/ReimbursementAccount/BusinessInfo/substeps/NameBusiness.tsx
+++ b/src/pages/ReimbursementAccount/BusinessInfo/substeps/NameBusiness.tsx
@@ -38,7 +38,7 @@ function NameBusiness({reimbursementAccount, onNext, isEditing}: NameBusinessPro
const shouldDisableCompanyName = Boolean(bankAccountID && defaultCompanyName);
return (
- // @ts-expect-error TODO: Remove this once Form (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript
+ // @ts-expect-error TODO: Remove this once FormProvider (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript
{translate('businessInfoStep.selectYourCompanysType')}
- ({
@@ -53,11 +57,10 @@ function TypeBusiness({reimbursementAccount, onNext, isEditing}: TypeBusinessPro
label: translate(`businessInfoStep.incorporationType.${key as IncorporationType}`),
}))}
placeholder={{value: '', label: '-'}}
- // @ts-expect-error TODO: Remove this once Picker (https://github.com/Expensify/App/issues/25091) is migrated to TypeScript
defaultValue={defaultIncorporationType}
shouldSaveDraft
/>
-
+
);
}
diff --git a/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx b/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx
index 4c0e0cd01ba3..f33d3da79476 100644
--- a/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx
+++ b/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx
@@ -59,7 +59,7 @@ function WebsiteBusiness({reimbursementAccount, user, session, onNext, isEditing
}, [defaultCompanyWebsite]);
return (
- // @ts-expect-error TODO: Remove this once Form (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript
+ // @ts-expect-error TODO: Remove this once FormProvider (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript
{translate('completeVerificationStep.confirmAgreements')}
- {/* @ts-expect-error TODO: Remove this once Form (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript. */}
+ {/* @ts-expect-error TODO: Remove this once FormProvider (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript. */}
;
+};
- /* Onyx Props */
- user: userPropTypes,
+type EnableBankAccountProps = EnableBankAccountOnyxProps & {
+ /** Bank account currently in setup */
+ reimbursementAccount: ReimbursementAccount;
/** Method to trigger when pressing back button of the header */
- onBackButtonPress: PropTypes.func.isRequired,
-};
-
-const defaultProps = {
- user: {},
+ onBackButtonPress: () => void;
};
-function EnableBankAccount({reimbursementAccount, user, onBackButtonPress}) {
+function EnableBankAccount({reimbursementAccount, user, onBackButtonPress}: EnableBankAccountProps) {
const styles = useThemeStyles();
const {translate} = useLocalize();
- const achData = lodashGet(reimbursementAccount, 'achData', {});
+ const achData = reimbursementAccount?.achData ?? {};
const {icon, iconSize} = getBankIcon({bankName: achData.bankName, styles});
- const isUsingExpensifyCard = user.isUsingExpensifyCard;
+ const isUsingExpensifyCard = user?.isUsingExpensifyCard;
const formattedBankAccountNumber = achData.accountNumber ? `${translate('paymentMethodList.accountLastFour')} ${achData.accountNumber.slice(-4)}` : '';
- const bankName = achData.addressName;
- const errors = lodashGet(reimbursementAccount, 'errors', {});
- const pendingAction = lodashGet(reimbursementAccount, 'pendingAction', null);
- const shouldShowResetModal = lodashGet(reimbursementAccount, 'shouldShowResetModal', false);
+ const bankAccountOwnerName = achData.addressName;
+ const errors = reimbursementAccount?.errors ?? {};
+ const pendingAction = reimbursementAccount?.pendingAction;
+ const shouldShowResetModal = reimbursementAccount?.shouldShowResetModal ?? false;
return (
- {Boolean(user.isCheckingDomain) && {translate('workspace.card.checkingDomain')}}
+ {Boolean(user?.isCheckingDomain) && {translate('workspace.card.checkingDomain')}}
{shouldShowResetModal && }
@@ -120,10 +116,8 @@ function EnableBankAccount({reimbursementAccount, user, onBackButtonPress}) {
}
EnableBankAccount.displayName = 'EnableStep';
-EnableBankAccount.propTypes = propTypes;
-EnableBankAccount.defaultProps = defaultProps;
-export default withOnyx({
+export default withOnyx({
user: {
key: ONYXKEYS.USER,
},
diff --git a/src/pages/ReimbursementAccount/PersonalInfo/substeps/Address.tsx b/src/pages/ReimbursementAccount/PersonalInfo/substeps/Address.tsx
index 443fb86c9190..593dc6e9ab4a 100644
--- a/src/pages/ReimbursementAccount/PersonalInfo/substeps/Address.tsx
+++ b/src/pages/ReimbursementAccount/PersonalInfo/substeps/Address.tsx
@@ -66,7 +66,7 @@ function Address({reimbursementAccount, onNext, isEditing}: AddressProps) {
};
return (
- // @ts-expect-error TODO: Remove this once Form (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript.
+ // @ts-expect-error TODO: Remove this once FormProvider (https://github.com/Expensify/App/issues/31972) is migrated to TypeScript.
interactiveStepHeaderStepText: {
fontSize: variables.fontSizeLabel,
- fontFamily: fontFamily.EXP_NEUE_BOLD,
- fontWeight: fontWeightBold,
+ fontFamily: FontUtils.fontFamily.platform.EXP_NEUE,
+ fontWeight: FontUtils.fontWeight.bold,
},
interactiveStepHeaderCompletedStepButton: {
@@ -4206,7 +4206,7 @@ const styles = (theme: ThemeColors) =>
},
confirmBankInfoText: {
fontSize: variables.fontSizeNormal,
- fontFamily: fontFamily.EXP_NEUE,
+ fontFamily: FontUtils.fontFamily.platform.EXP_NEUE,
color: theme.text,
},
confirmBankInfoCompanyIcon: {
@@ -4223,7 +4223,7 @@ const styles = (theme: ThemeColors) =>
borderRadius: 50,
},
confirmBankInfoNumber: {
- fontFamily: fontFamily.MONOSPACE,
+ fontFamily: FontUtils.fontFamily.platform.MONOSPACE,
fontSize: variables.fontSizeNormal,
lineHeight: variables.lineHeightXLarge,
color: theme.text,
diff --git a/src/types/onyx/ReimbursementAccount.ts b/src/types/onyx/ReimbursementAccount.ts
index 8cd653065071..dff0b201457c 100644
--- a/src/types/onyx/ReimbursementAccount.ts
+++ b/src/types/onyx/ReimbursementAccount.ts
@@ -1,5 +1,6 @@
import type {ValueOf} from 'type-fest';
import type CONST from '@src/CONST';
+import type {BankName} from './Bank';
import type * as OnyxCommon from './OnyxCommon';
import type {BeneficialOwnersStepDraftProps, CompanyStepProps, RequestorStepProps} from './ReimbursementAccountDraft';
@@ -25,6 +26,12 @@ type ACHData = {
/** Bank account number */
accountNumber?: string;
+
+ /** Bank account name */
+ bankName?: BankName;
+
+ /** Bank account owner name */
+ addressName?: string;
} & BeneficialOwnersStepDraftProps &
CompanyStepProps &
RequestorStepProps;
@@ -55,6 +62,9 @@ type ReimbursementAccount = {
draftStep?: BankAccountStep;
pendingAction?: OnyxCommon.PendingAction;
+
+ /** Should display modal to reset data */
+ shouldShowResetModal?: boolean;
};
export default ReimbursementAccount;