Hide fix form alert for single form input

src/components/AddPaymentCard/PaymentCardChangeCurrencyForm.tsx

@@ -84,6 +84,7 @@ function PaymentCardChangeCurrencyForm({changeBillingCurrency, isSecurityCodeReq
                 submitButtonText={translate('common.save')}
                 scrollContextEnabled
                 style={[styles.mh5, styles.flexGrow1]}
+                shouldHideFixErrorsAlert
             >
                 <PaymentCardCurrencyHeader />
                 <>

src/components/SubStepForms/DateOfBirthStep.tsx

@@ -84,6 +84,7 @@ function DateOfBirthStep<TFormID extends keyof OnyxFormValuesMapping>({
             style={[styles.mh5, styles.flexGrow2, styles.justifyContentBetween]}
             submitButtonStyles={[styles.mb0]}
             enabledWhenOffline
+            shouldHideFixErrorsAlert
         >
             <Text style={[styles.textHeadlineLineHeightXXL, styles.mb5]}>{formTitle}</Text>
             <InputWrapper

src/components/SubStepForms/SingleFieldStep.tsx

@@ -78,6 +78,7 @@ function SingleFieldStep<TFormID extends keyof OnyxFormValuesMapping>({
             style={[styles.mh5, styles.flexGrow1]}
             submitButtonStyles={[styles.mb0]}
             enabledWhenOffline={enabledWhenOffline}
+            shouldHideFixErrorsAlert
         >
             <View>
                 <Text style={[styles.textHeadlineLineHeightXXL]}>{formTitle}</Text>

src/components/SubStepForms/YesNoStep.tsx

@@ -58,6 +58,7 @@ function YesNoStep({title, description, defaultValue, onSelectedValue, submitBut
             style={[styles.mh5, styles.flexGrow1]}
             submitButtonStyles={submitButtonStyles}
             isLoading={reimbursementAccount?.isSavingCorpayOnboardingBeneficialOwnersFields}
+            shouldHideFixErrorsAlert
         >
             <Text style={[styles.textHeadlineLineHeightXXL]}>{title}</Text>
             <Text style={[styles.pv3, styles.textSupporting]}>{description}</Text>

src/components/TextPicker/TextSelectorModal.tsx

@@ -123,6 +123,7 @@ function TextSelectorModal({
                     submitButtonText={translate('common.save')}
                     style={[styles.mh5, styles.flex1]}
                     enabledWhenOffline
+                    shouldHideFixErrorsAlert
                 >
                     <View style={styles.pb4}>{!!subtitle && <Text style={[styles.sidebarLinkText, styles.optionAlternateText]}>{subtitle}</Text>}</View>
                     <InputWrapper

src/pages/AddPersonalBankAccountPage.tsx

@@ -107,6 +107,7 @@ function AddPersonalBankAccountPage() {
                             onSubmit={submitBankAccountForm}
                             validate={validatePlaidSelection}
                             style={[styles.mh5, styles.flex1]}
+                            shouldHideFixErrorsAlert
                         >
                             <InputWrapper
                                 inputID={INPUT_IDS.BANK_INFO_STEP.SELECTED_PLAID_ACCOUNT_ID}

src/pages/EditReportFieldDate.tsx

@@ -51,6 +51,7 @@ function EditReportFieldDatePage({fieldName, isRequired, onSubmit, fieldValue, f
             validate={validate}
             submitButtonText={translate('common.save')}
             enabledWhenOffline
+            shouldHideFixErrorsAlert
         >
             <View style={styles.mb4}>
                 <InputWrapper

src/pages/EditReportFieldText.tsx

@@ -51,6 +51,7 @@ function EditReportFieldTextPage({fieldName, onSubmit, fieldValue, isRequired, f
             validate={validate}
             submitButtonText={translate('common.save')}
             enabledWhenOffline
+            shouldHideFixErrorsAlert
         >
             <View style={styles.mb4}>
                 <InputWrapper

src/pages/EnablePayments/AddBankAccount/substeps/PlaidStep.tsx

@@ -1,35 +1,24 @@
 import {useIsFocused} from '@react-navigation/native';
 import React, {useCallback, useEffect} from 'react';
-import type {OnyxEntry} from 'react-native-onyx';
-import {withOnyx} from 'react-native-onyx';
+import {useOnyx} from 'react-native-onyx';
 import AddPlaidBankAccount from '@components/AddPlaidBankAccount';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import useLocalize from '@hooks/useLocalize';
 import type {SubStepProps} from '@hooks/useSubStep/types';
 import useThemeStyles from '@hooks/useThemeStyles';
-import * as BankAccounts from '@userActions/BankAccounts';
+import {clearPersonalBankAccountSetupType, updateAddPersonalBankAccountDraft, validatePlaidSelection} from '@userActions/BankAccounts';
 import ONYXKEYS from '@src/ONYXKEYS';
-import type {PersonalBankAccountForm} from '@src/types/form';
 import INPUT_IDS from '@src/types/form/PersonalBankAccountForm';
-import type {PlaidData} from '@src/types/onyx';
-
-type PlaidOnyxProps = {
-    /** The draft values of the bank account being setup */
-    personalBankAccountDraft: OnyxEntry<PersonalBankAccountForm>;
-
-    /** Contains plaid data */
-    plaidData: OnyxEntry<PlaidData>;
-};
-
-type PlaidStepProps = PlaidOnyxProps & SubStepProps;
 
 const BANK_INFO_STEP_KEYS = INPUT_IDS.BANK_INFO_STEP;
 
-function PlaidStep({personalBankAccountDraft, onNext, plaidData}: PlaidStepProps) {
+function PlaidStep({onNext}: SubStepProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
     const isFocused = useIsFocused();
+    const [personalBankAccountDraft] = useOnyx(ONYXKEYS.FORMS.PERSONAL_BANK_ACCOUNT_FORM_DRAFT);
+    const [plaidData] = useOnyx(ONYXKEYS.PLAID_DATA);
     const selectedPlaidAccountID = personalBankAccountDraft?.[BANK_INFO_STEP_KEYS.PLAID_ACCOUNT_ID] ?? '';
 
     const handleNextPress = useCallback(() => {
@@ -47,38 +36,39 @@ function PlaidStep({personalBankAccountDraft, onNext, plaidData}: PlaidStepProps
             [BANK_INFO_STEP_KEYS.PLAID_ACCESS_TOKEN]: plaidData?.[BANK_INFO_STEP_KEYS.PLAID_ACCESS_TOKEN] ?? '',
         };
 
-        BankAccounts.updateAddPersonalBankAccountDraft(bankAccountData);
+        updateAddPersonalBankAccountDraft(bankAccountData);
         onNext();
     }, [onNext, personalBankAccountDraft, plaidData]);
 
     const handleSelectPlaidAccount = (plaidAccountID: string) => {
-        BankAccounts.updateAddPersonalBankAccountDraft({plaidAccountID});
+        updateAddPersonalBankAccountDraft({plaidAccountID});
     };
 
     useEffect(() => {
         const plaidBankAccounts = plaidData?.bankAccounts ?? [];
         if (isFocused || plaidBankAccounts.length) {
             return;
         }
-        BankAccounts.clearPersonalBankAccountSetupType();
+        clearPersonalBankAccountSetupType();
     }, [isFocused, plaidData]);
 
     return (
         <FormProvider
             formID={ONYXKEYS.FORMS.PERSONAL_BANK_ACCOUNT_FORM}
-            validate={BankAccounts.validatePlaidSelection}
+            validate={validatePlaidSelection}
             onSubmit={handleNextPress}
             scrollContextEnabled
             submitButtonText={translate('common.next')}
             style={[styles.mh5, styles.flexGrow1]}
             isSubmitButtonVisible={(plaidData?.bankAccounts ?? []).length > 0}
+            shouldHideFixErrorsAlert
         >
             <InputWrapper
                 InputComponent={AddPlaidBankAccount}
                 text={translate('walletPage.chooseAccountBody')}
                 onSelect={handleSelectPlaidAccount}
                 plaidData={plaidData}
-                onExitPlaid={BankAccounts.clearPersonalBankAccountSetupType}
+                onExitPlaid={clearPersonalBankAccountSetupType}
                 allowDebit
                 isDisplayedInWalletFlow
                 selectedPlaidAccountID={selectedPlaidAccountID}
@@ -91,11 +81,4 @@ function PlaidStep({personalBankAccountDraft, onNext, plaidData}: PlaidStepProps
 
 PlaidStep.displayName = 'PlaidStep';
 
-export default withOnyx<PlaidStepProps, PlaidOnyxProps>({
-    personalBankAccountDraft: {
-        key: ONYXKEYS.FORMS.PERSONAL_BANK_ACCOUNT_FORM_DRAFT,
-    },
-    plaidData: {
-        key: ONYXKEYS.PLAID_DATA,
-    },
-})(PlaidStep);
+export default PlaidStep;

src/pages/GroupChatNameEditPage.tsx

@@ -91,6 +91,7 @@ function GroupChatNameEditPage({report}: GroupChatNameEditPageProps) {
                 validate={validate}
                 style={[styles.mh5, styles.flex1]}
                 enabledWhenOffline
+                shouldHideFixErrorsAlert
             >
                 <InputWrapper
                     InputComponent={TextInput}

src/pages/PrivateNotes/PrivateNotesEditPage.tsx

@@ -135,6 +135,7 @@ function PrivateNotesEditPage({route, report, accountID}: PrivateNotesEditPagePr
                 style={[styles.flexGrow1, styles.ph5]}
                 submitButtonText={translate('common.save')}
                 enabledWhenOffline
+                shouldHideFixErrorsAlert
             >
                 <Text style={[styles.mb5]}>
                     {translate(

src/pages/ReimbursementAccount/NonUSD/BankInfo/subSteps/AccountHolderDetails.tsx

@@ -123,6 +123,7 @@ function AccountHolderDetails({onNext, isEditing, corpayFields}: BankInfoSubStep
             validate={validate}
             onSubmit={handleSubmit}
             style={[styles.mh5, styles.flexGrow1]}
+            shouldHideFixErrorsAlert={(accountHolderDetailsFields?.length ?? 0) <= 1}
         >
             <View>
                 <Text style={[styles.textHeadlineLineHeightXXL, styles.mb6]}>{translate('bankInfoStep.whatAreYour')}</Text>

src/pages/ReimbursementAccount/NonUSD/BankInfo/subSteps/BankAccountDetails.tsx

@@ -100,6 +100,7 @@ function BankAccountDetails({onNext, isEditing, corpayFields}: BankInfoSubStepPr
             validate={validate}
             style={[styles.mh5, styles.flexGrow1]}
             isSubmitDisabled={!inputs}
+            shouldHideFixErrorsAlert={(bankAccountDetailsFields?.length ?? 0) <= 1}
         >
             <>
                 <Text style={[styles.textHeadlineLineHeightXXL, styles.mb6]}>{translate('bankInfoStep.whatAreYour')}</Text>

src/pages/ReimbursementAccount/NonUSD/BeneficialOwnerInfo/BeneficialOwnerDetailsFormSubSteps/Documents.tsx

@@ -87,6 +87,14 @@ function Documents({onNext, isEditing, ownerBeingModifiedID}: DocumentsProps) {
         shouldSaveDraft: isEditing,
     });
 
+    const testForShouldHideFixErrorsAlert =
+        [
+            isDocumentNeededStatus.isProofOfOwnershipNeeded,
+            isDocumentNeededStatus.isCopyOfIDNeeded,
+            isDocumentNeededStatus.isProofOfAddressNeeded,
+            isDocumentNeededStatus.isCodiceFiscaleNeeded,
+        ].filter(Boolean).length <= 1;
+
     return (
         <FormProvider
             formID={ONYXKEYS.FORMS.REIMBURSEMENT_ACCOUNT_FORM}
@@ -95,6 +103,7 @@ function Documents({onNext, isEditing, ownerBeingModifiedID}: DocumentsProps) {
             onSubmit={handleSubmit}
             style={[styles.mh5, styles.flexGrow1]}
             submitButtonStyles={[styles.mb0]}
+            shouldHideFixErrorsAlert={testForShouldHideFixErrorsAlert}
         >
             <Text style={[styles.textHeadlineLineHeightXXL, styles.mb5]}>{translate('ownershipInfoStep.uploadDocuments')}</Text>
             <Text style={[styles.textSupporting, styles.mb5]}>{translate('ownershipInfoStep.pleaseUpload')}</Text>

src/pages/ReimbursementAccount/NonUSD/BusinessInfo/subSteps/AverageReimbursement.tsx

@@ -58,6 +58,7 @@ function AverageReimbursement({onNext, isEditing}: AverageReimbursementProps) {
             validate={validate}
             style={[styles.flexGrow1]}
             submitButtonStyles={[styles.mh5]}
+            shouldHideFixErrorsAlert
         >
             <Text style={[styles.textHeadlineLineHeightXXL, styles.mh5, styles.mb3]}>{translate('businessInfoStep.whatsYourExpectedAverageReimbursements')}</Text>
             <InputWrapper

src/pages/ReimbursementAccount/NonUSD/BusinessInfo/subSteps/IncorporationLocation.tsx

@@ -81,6 +81,7 @@ function IncorporationLocation({onNext, isEditing}: IncorporationLocationProps)
             validate={validate}
             style={[styles.flexGrow1]}
             submitButtonStyles={[styles.mh5]}
+            shouldHideFixErrorsAlert={!shouldGatherState}
         >
             <Text style={[styles.textHeadlineLineHeightXXL, styles.mh5, styles.mb3]}>{translate('businessInfoStep.whereWasTheBusinessIncorporated')}</Text>
             {shouldGatherState && (

src/pages/ReimbursementAccount/NonUSD/BusinessInfo/subSteps/PaymentVolume.tsx

@@ -58,6 +58,7 @@ function PaymentVolume({onNext, isEditing}: PaymentVolumeProps) {
             validate={validate}
             style={[styles.flexGrow1]}
             submitButtonStyles={[styles.mh5]}
+            shouldHideFixErrorsAlert
         >
             <Text style={[styles.textHeadlineLineHeightXXL, styles.mh5, styles.mb3]}>{translate('businessInfoStep.whatsTheBusinessAnnualPayment')}</Text>
             <InputWrapper

src/pages/ReimbursementAccount/NonUSD/BusinessInfo/subSteps/RegistrationNumber.tsx

@@ -60,6 +60,7 @@ function RegistrationNumber({onNext, isEditing}: RegistrationNumberProps) {
             onSubmit={handleSubmit}
             validate={validate}
             style={[styles.mh5, styles.flexGrow1]}
+            shouldHideFixErrorsAlert
         >
             <Text style={[styles.textHeadlineLineHeightXXL]}>{translate('businessInfoStep.whatsTheBusinessRegistrationNumber')}</Text>
             <InputWrapper

src/pages/ReimbursementAccount/NonUSD/Country/subSteps/Confirmation.tsx

@@ -101,6 +101,7 @@ function Confirmation({onNext}: SubStepProps) {
                         style={[styles.flexGrow1]}
                         submitButtonStyles={[styles.mh5, styles.pb0, styles.mbn1]}
                         isSubmitDisabled={disableSubmit}
+                        shouldHideFixErrorsAlert
                     >
                         <InputWrapper
                             InputComponent={PushRowWithModal}

src/pages/ReimbursementAccount/NonUSD/SignerInfo/EnterEmail.tsx

@@ -7,8 +7,9 @@ import type {FormInputErrors, FormOnyxValues} from '@components/Form/types';
 import Text from '@components/Text';
 import TextInput from '@components/TextInput';
 import useLocalize from '@hooks/useLocalize';
+import usePolicy from '@hooks/usePolicy';
 import useThemeStyles from '@hooks/useThemeStyles';
-import * as ValidationUtils from '@libs/ValidationUtils';
+import {getFieldRequiredErrors} from '@libs/ValidationUtils';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import INPUT_IDS from '@src/types/form/ReimbursementAccountForm';
@@ -28,14 +29,14 @@ function EnterEmail({onSubmit, isUserDirector}: EnterEmailProps) {
     const styles = useThemeStyles();
 
     const [reimbursementAccount] = useOnyx(ONYXKEYS.REIMBURSEMENT_ACCOUNT);
-    const policyID = reimbursementAccount?.achData?.policyID ?? '-1';
-    const [policy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`);
+    const policyID = reimbursementAccount?.achData?.policyID;
+    const policy = usePolicy(policyID);
     const currency = policy?.outputCurrency ?? '';
     const shouldGatherBothEmails = currency === CONST.CURRENCY.AUD && !isUserDirector;
 
     const validate = useCallback(
         (values: FormOnyxValues<typeof ONYXKEYS.FORMS.REIMBURSEMENT_ACCOUNT_FORM>): FormInputErrors<typeof ONYXKEYS.FORMS.REIMBURSEMENT_ACCOUNT_FORM> => {
-            const errors = ValidationUtils.getFieldRequiredErrors(values, shouldGatherBothEmails ? [SIGNER_EMAIL, SECOND_SIGNER_EMAIL] : [SIGNER_EMAIL]);
+            const errors = getFieldRequiredErrors(values, shouldGatherBothEmails ? [SIGNER_EMAIL, SECOND_SIGNER_EMAIL] : [SIGNER_EMAIL]);
             if (values[SIGNER_EMAIL] && !Str.isValidEmail(values[SIGNER_EMAIL])) {
                 errors[SIGNER_EMAIL] = translate('bankAccount.error.email');
             }
@@ -56,6 +57,7 @@ function EnterEmail({onSubmit, isUserDirector}: EnterEmailProps) {
             onSubmit={onSubmit}
             validate={validate}
             style={[styles.mh5, styles.flexGrow1]}
+            shouldHideFixErrorsAlert={!shouldGatherBothEmails}
         >
             <Text style={[styles.textHeadlineLineHeightXXL]}>{translate(shouldGatherBothEmails ? 'signerInfoStep.enterTwoEmails' : 'signerInfoStep.enterOneEmail')}</Text>
             {!shouldGatherBothEmails && <Text style={[styles.pv3, styles.textSupporting]}>{translate('signerInfoStep.regulationRequiresOneMoreDirector')}</Text>}

src/pages/ReimbursementAccount/NonUSD/SignerInfo/subSteps/UploadDocuments.tsx

@@ -83,6 +83,7 @@ function UploadDocuments({onNext, isEditing}: UploadDocumentsProps) {
             onSubmit={handleSubmit}
             validate={validate}
             style={[styles.mh5, styles.flex1]}
+            shouldHideFixErrorsAlert
         >
             <View>
                 <Text style={[styles.textHeadlineLineHeightXXL, styles.mb6]}>{translate('signerInfoStep.uploadID')}</Text>

src/pages/ReimbursementAccount/USD/BankInfo/subSteps/Plaid.tsx

@@ -9,6 +9,7 @@ import type {SubStepProps} from '@hooks/useSubStep/types';
 import useThemeStyles from '@hooks/useThemeStyles';
 import {setBankAccountSubStep, validatePlaidSelection} from '@userActions/BankAccounts';
 import {updateReimbursementAccountDraft} from '@userActions/ReimbursementAccount';
+import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import INPUT_IDS from '@src/types/form/ReimbursementAccountForm';
 
@@ -47,7 +48,7 @@ function Plaid({onNext, setUSDBankAccountStep}: PlaidProps) {
         onNext(bankAccountData);
     }, [plaidData, reimbursementAccountDraft, onNext]);
 
-    const bankAccountID = Number(reimbursementAccount?.achData?.bankAccountID ?? '-1');
+    const bankAccountID = reimbursementAccount?.achData?.bankAccountID ?? CONST.DEFAULT_NUMBER_ID;
 
     useEffect(() => {
         const plaidBankAccounts = plaidData?.bankAccounts ?? [];
@@ -72,6 +73,7 @@ function Plaid({onNext, setUSDBankAccountStep}: PlaidProps) {
             submitButtonText={translate('common.next')}
             style={[styles.mh5, styles.flexGrow1]}
             isSubmitButtonVisible={(plaidData?.bankAccounts ?? []).length > 0}
+            shouldHideFixErrorsAlert
         >
             <InputWrapper
                 InputComponent={AddPlaidBankAccount}

src/pages/ReimbursementAccount/USD/BusinessInfo/subSteps/ConfirmationBusiness.tsx

@@ -12,7 +12,7 @@ import TextLink from '@components/TextLink';
 import useLocalize from '@hooks/useLocalize';
 import type {SubStepProps} from '@hooks/useSubStep/types';
 import useThemeStyles from '@hooks/useThemeStyles';
-import * as ValidationUtils from '@libs/ValidationUtils';
+import {getFieldRequiredErrors} from '@libs/ValidationUtils';
 import getSubStepValues from '@pages/ReimbursementAccount/utils/getSubStepValues';
 import CONST from '@src/CONST';
 import type {TranslationPaths} from '@src/languages/types';
@@ -44,7 +44,7 @@ function ConfirmationBusiness({onNext, onMove}: SubStepProps) {
 
     const validate = useCallback(
         (values: FormOnyxValues<typeof ONYXKEYS.FORMS.REIMBURSEMENT_ACCOUNT_FORM>): FormInputErrors<typeof ONYXKEYS.FORMS.REIMBURSEMENT_ACCOUNT_FORM> => {
-            const errors = ValidationUtils.getFieldRequiredErrors(values, [BUSINESS_INFO_STEP_KEYS.HAS_NO_CONNECTION_TO_CANNABIS]);
+            const errors = getFieldRequiredErrors(values, [BUSINESS_INFO_STEP_KEYS.HAS_NO_CONNECTION_TO_CANNABIS]);
 
             if (!values.hasNoConnectionToCannabis) {
                 errors.hasNoConnectionToCannabis = translate('bankAccount.error.restrictedBusiness');
@@ -136,6 +136,7 @@ function ConfirmationBusiness({onNext, onMove}: SubStepProps) {
                 submitButtonText={translate('common.confirm')}
                 style={[styles.mh5, styles.flexGrow1]}
                 enabledWhenOffline={false}
+                shouldHideFixErrorsAlert
             >
                 <InputWrapper
                     InputComponent={CheckboxWithLabel}