From bc5a0482a1d43b3caefe1188bbb3f5348af9d3cb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Muzyk?= Date: Tue, 8 Apr 2025 15:43:37 +0200 Subject: [PATCH 1/2] feat: Update region field to dropdown --- .../subSteps/AccountHolderDetails.tsx | 7 ++++- .../BankInfo/subSteps/BankAccountDetails.tsx | 7 ++++- .../NonUSD/utils/getInputForValueSet.tsx | 29 +++++++++++++++++++ .../utils/mapToPushRowWithModalListOptions.ts | 18 ++++++++++++ src/types/onyx/CorpayFields.ts | 2 ++ 5 files changed, 61 insertions(+), 2 deletions(-) create mode 100644 src/pages/ReimbursementAccount/NonUSD/utils/getInputForValueSet.tsx create mode 100644 src/pages/ReimbursementAccount/NonUSD/utils/mapToPushRowWithModalListOptions.ts diff --git a/src/pages/ReimbursementAccount/NonUSD/BankInfo/subSteps/AccountHolderDetails.tsx b/src/pages/ReimbursementAccount/NonUSD/BankInfo/subSteps/AccountHolderDetails.tsx index 2c1fe3274a2e9..6529bad009356 100644 --- a/src/pages/ReimbursementAccount/NonUSD/BankInfo/subSteps/AccountHolderDetails.tsx +++ b/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 ( ); }); - }, [accountHolderDetailsFields, styles.mb6, styles.mhn5, defaultValues, isEditing, defaultBankAccountCountry, translate]); + }, [accountHolderDetailsFields, styles, defaultValues, isEditing, defaultBankAccountCountry, translate]); return ( { return bankAccountDetailsFields?.map((field) => { + if (field.valueSet !== undefined) { + return getInputForValueSet(field, String(defaultValues[field.id as keyof typeof defaultValues]), isEditing, styles); + } + return ( ); }); - }, [bankAccountDetailsFields, styles.mb6, isEditing, defaultValues]); + }, [bankAccountDetailsFields, styles, isEditing, defaultValues]); return ( + + + ); +} + +export default getInputForValueSet; diff --git a/src/pages/ReimbursementAccount/NonUSD/utils/mapToPushRowWithModalListOptions.ts b/src/pages/ReimbursementAccount/NonUSD/utils/mapToPushRowWithModalListOptions.ts new file mode 100644 index 0000000000000..45d0afc2995b9 --- /dev/null +++ b/src/pages/ReimbursementAccount/NonUSD/utils/mapToPushRowWithModalListOptions.ts @@ -0,0 +1,18 @@ +import {Str} from 'expensify-common'; + +type ValueToMap = { + code?: string; + id?: string; + text?: string; +}; + +function mapToPushRowWithModalListOptions(values: ValueToMap[]): Record { + return values.reduce((acc, curr) => { + if (curr.code && curr.text) { + acc[curr.code] = Str.recapitalize(curr.text); + } + return acc; + }, {} as Record); +} + +export default mapToPushRowWithModalListOptions; diff --git a/src/types/onyx/CorpayFields.ts b/src/types/onyx/CorpayFields.ts index 2fa2961c41d2e..cee67c2de835b 100644 --- a/src/types/onyx/CorpayFields.ts +++ b/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<{ From a60c271a3a779acee6321243b47f8a906d9650c9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Muzyk?= Date: Wed, 9 Apr 2025 12:53:39 +0200 Subject: [PATCH 2/2] rearrange utils --- .../NonUSD/utils/getInputForValueSet.tsx | 17 ++++++++++++++++- .../utils/mapToPushRowWithModalListOptions.ts | 18 ------------------ 2 files changed, 16 insertions(+), 19 deletions(-) delete mode 100644 src/pages/ReimbursementAccount/NonUSD/utils/mapToPushRowWithModalListOptions.ts diff --git a/src/pages/ReimbursementAccount/NonUSD/utils/getInputForValueSet.tsx b/src/pages/ReimbursementAccount/NonUSD/utils/getInputForValueSet.tsx index bb7e86cfd2d15..1d55e4bb1c2d5 100644 --- a/src/pages/ReimbursementAccount/NonUSD/utils/getInputForValueSet.tsx +++ b/src/pages/ReimbursementAccount/NonUSD/utils/getInputForValueSet.tsx @@ -1,10 +1,25 @@ +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'; -import mapToPushRowWithModalListOptions from './mapToPushRowWithModalListOptions'; + +type ValueToMap = { + code?: string; + id?: string; + text?: string; +}; + +function mapToPushRowWithModalListOptions(values: ValueToMap[]): Record { + return values.reduce((acc, curr) => { + if (curr.code && curr.text) { + acc[curr.code] = Str.recapitalize(curr.text); + } + return acc; + }, {} as Record); +} function getInputForValueSet(field: CorpayFormField, defaultValue: string, isEditing: boolean, styles: ThemeStyles) { return ( diff --git a/src/pages/ReimbursementAccount/NonUSD/utils/mapToPushRowWithModalListOptions.ts b/src/pages/ReimbursementAccount/NonUSD/utils/mapToPushRowWithModalListOptions.ts deleted file mode 100644 index 45d0afc2995b9..0000000000000 --- a/src/pages/ReimbursementAccount/NonUSD/utils/mapToPushRowWithModalListOptions.ts +++ /dev/null @@ -1,18 +0,0 @@ -import {Str} from 'expensify-common'; - -type ValueToMap = { - code?: string; - id?: string; - text?: string; -}; - -function mapToPushRowWithModalListOptions(values: ValueToMap[]): Record { - return values.reduce((acc, curr) => { - if (curr.code && curr.text) { - acc[curr.code] = Str.recapitalize(curr.text); - } - return acc; - }, {} as Record); -} - -export default mapToPushRowWithModalListOptions;