[NO QA] feat: Update region field to PushRowWithModal

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

@@ -12,6 +12,7 @@ import useReimbursementAccountStepFormSubmit from '@hooks/useReimbursementAccoun
 import useThemeStyles from '@hooks/useThemeStyles';
 import type {BankInfoSubStepProps} from '@pages/ReimbursementAccount/NonUSD/BankInfo/types';
 import {getBankInfoStepValues} from '@pages/ReimbursementAccount/NonUSD/utils/getBankInfoStepValues';
+import getInputForValueSet from '@pages/ReimbursementAccount/NonUSD/utils/getInputForValueSet';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type {ReimbursementAccountForm} from '@src/types/form/ReimbursementAccountForm';
@@ -79,6 +80,10 @@ function AccountHolderDetails({onNext, isEditing, corpayFields}: BankInfoSubStep
 
     const inputs = useMemo(() => {
         return accountHolderDetailsFields?.map((field) => {
+            if (field.valueSet !== undefined) {
+                return getInputForValueSet(field, String(defaultValues[field.id as keyof typeof defaultValues]), isEditing, styles);
+            }
+
             if (field.id === ACCOUNT_HOLDER_COUNTRY) {
                 return (
                     <View
@@ -116,7 +121,7 @@ function AccountHolderDetails({onNext, isEditing, corpayFields}: BankInfoSubStep
                 </View>
             );
         });
-    }, [accountHolderDetailsFields, styles.mb6, styles.mhn5, defaultValues, isEditing, defaultBankAccountCountry, translate]);
+    }, [accountHolderDetailsFields, styles, defaultValues, isEditing, defaultBankAccountCountry, translate]);
 
     return (
         <FormProvider

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

@@ -12,6 +12,7 @@ import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import type {BankInfoSubStepProps} from '@pages/ReimbursementAccount/NonUSD/BankInfo/types';
 import {getBankInfoStepValues} from '@pages/ReimbursementAccount/NonUSD/utils/getBankInfoStepValues';
+import getInputForValueSet from '@pages/ReimbursementAccount/NonUSD/utils/getInputForValueSet';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type {ReimbursementAccountForm} from '@src/types/form';
@@ -76,6 +77,10 @@ function BankAccountDetails({onNext, isEditing, corpayFields}: BankInfoSubStepPr
 
     const inputs = useMemo(() => {
         return bankAccountDetailsFields?.map((field) => {
+            if (field.valueSet !== undefined) {
+                return getInputForValueSet(field, String(defaultValues[field.id as keyof typeof defaultValues]), isEditing, styles);
+            }
+
             return (
                 <View
                     style={styles.mb6}
@@ -93,7 +98,7 @@ function BankAccountDetails({onNext, isEditing, corpayFields}: BankInfoSubStepPr
                 </View>
             );
         });
-    }, [bankAccountDetailsFields, styles.mb6, isEditing, defaultValues]);
+    }, [bankAccountDetailsFields, styles, isEditing, defaultValues]);
 
     return (
         <FormProvider

src/pages/ReimbursementAccount/NonUSD/utils/getInputForValueSet.tsx

@@ -0,0 +1,44 @@
+import {Str} from 'expensify-common';
+import React from 'react';
+import {View} from 'react-native';
+import InputWrapper from '@components/Form/InputWrapper';
+import PushRowWithModal from '@components/PushRowWithModal';
+import type {ThemeStyles} from '@src/styles';
+import type {CorpayFormField} from '@src/types/onyx';
+
+type ValueToMap = {
+    code?: string;
+    id?: string;
+    text?: string;
+};
+
+function mapToPushRowWithModalListOptions(values: ValueToMap[]): Record<string, string> {
+    return values.reduce((acc, curr) => {
+        if (curr.code && curr.text) {
+            acc[curr.code] = Str.recapitalize(curr.text);
+        }
+        return acc;
+    }, {} as Record<string, string>);
+}
+
+function getInputForValueSet(field: CorpayFormField, defaultValue: string, isEditing: boolean, styles: ThemeStyles) {
+    return (
+        <View
+            style={[styles.mb6, styles.mhn5]}
+            key={field.id}
+        >
+            <InputWrapper
+                InputComponent={PushRowWithModal}
+                optionsList={field.valueSet ? mapToPushRowWithModalListOptions(field.valueSet) : {}}
+                description={field.label}
+                shouldSaveDraft={!isEditing}
+                defaultValue={String(defaultValue) ?? ''}
+                modalHeaderTitle={field.label}
+                searchInputTitle={field.label}
+                inputID={field.id}
+            />
+        </View>
+    );
+}
+
+export default getInputForValueSet;

src/types/onyx/CorpayFields.ts

@@ -27,6 +27,8 @@ type CorpayFormField = {
         id: string;
         /** Label for the form field value */
         text: string;
+        /** Value */
+        code: string;
     }>;
     /** Contains possible list of values for dropdown field (only for Canada region fields) */
     links?: Array<{