From b45851bb0e73dedbe04874098b760187b31445ec Mon Sep 17 00:00:00 2001 From: Yauheni Pasiukevich Date: Mon, 4 Mar 2024 16:32:25 +0100 Subject: [PATCH] fix typings after merge --- src/components/AddressForm.tsx | 10 ++++---- src/components/Form/types.ts | 4 ++- src/libs/Navigation/types.ts | 3 ++- .../Profile/PersonalDetails/AddressPage.tsx | 25 +++++++++++-------- src/types/form/HomeAddressForm.ts | 3 ++- 5 files changed, 27 insertions(+), 18 deletions(-) diff --git a/src/components/AddressForm.tsx b/src/components/AddressForm.tsx index f4c3d1981e83..626da4cfd5d4 100644 --- a/src/components/AddressForm.tsx +++ b/src/components/AddressForm.tsx @@ -44,10 +44,10 @@ type AddressFormProps = { zip?: string; /** Callback which is executed when the user changes address, city or state */ - onAddressChanged?: (value: unknown, key: string) => void; + onAddressChanged?: (value: unknown, key: unknown) => void; /** Callback which is executed when the user submits his address changes */ - onSubmit: () => void; + onSubmit: (values: FormOnyxValues) => void; /** Whether or not should the form data should be saved as draft */ shouldSaveDraft?: boolean; @@ -56,7 +56,7 @@ type AddressFormProps = { submitButtonText?: string; /** A unique Onyx key identifying the form */ - formID: typeof ONYXKEYS.FORMS.GET_PHYSICAL_CARD_FORM; + formID: typeof ONYXKEYS.FORMS.GET_PHYSICAL_CARD_FORM | typeof ONYXKEYS.FORMS.HOME_ADDRESS_FORM; }; function AddressForm({ @@ -88,7 +88,7 @@ function AddressForm({ * @returns - An object containing the errors for each inputID */ - const validator = useCallback((values: FormOnyxValues): Errors => { + const validator = useCallback((values: FormOnyxValues): Errors => { const errors: Errors & { zipPostCode?: string | string[]; } = {}; @@ -147,7 +147,7 @@ function AddressForm({ InputComponent={AddressSearch} inputID={INPUT_IDS.ADDRESS_LINE_1} label={translate('common.addressLine', {lineNumber: 1})} - onValueChange={(data: unknown, key: string) => { + onValueChange={(data: unknown, key: unknown) => { onAddressChanged(data, key); // This enforces the country selector to use the country from address instead of the country from URL Navigation.setParams({country: undefined}); diff --git a/src/components/Form/types.ts b/src/components/Form/types.ts index b300c73533b6..33d127308449 100644 --- a/src/components/Form/types.ts +++ b/src/components/Form/types.ts @@ -16,6 +16,7 @@ import type TextInput from '@components/TextInput'; import type ValuePicker from '@components/ValuePicker'; import type {MaybePhraseKey} from '@libs/Localize'; import type BusinessTypePicker from '@pages/ReimbursementAccount/BusinessInfo/substeps/TypeBusiness/BusinessTypePicker'; +import type {Country} from '@src/CONST'; import type {OnyxFormKey, OnyxValues} from '@src/ONYXKEYS'; import type {BaseForm} from '@src/types/form/Form'; @@ -42,11 +43,12 @@ type ValidInputs = | typeof DatePicker | typeof RadioButtons; -type ValueTypeKey = 'string' | 'boolean' | 'date'; +type ValueTypeKey = 'string' | 'boolean' | 'date' | 'country'; type ValueTypeMap = { string: string; boolean: boolean; date: Date; + country: Country | ''; }; type FormValue = ValueOf; diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts index a1e558869ebe..3d9bc25bb19d 100644 --- a/src/libs/Navigation/types.ts +++ b/src/libs/Navigation/types.ts @@ -12,6 +12,7 @@ import type { } from '@react-navigation/native'; import type {ValueOf} from 'type-fest'; import type CONST from '@src/CONST'; +import type {Country} from '@src/CONST'; import type NAVIGATORS from '@src/NAVIGATORS'; import type {HybridAppRoute, Route as Routes} from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; @@ -107,7 +108,7 @@ type SettingsNavigatorParamList = { [SCREENS.SETTINGS.PROFILE.LEGAL_NAME]: undefined; [SCREENS.SETTINGS.PROFILE.DATE_OF_BIRTH]: undefined; [SCREENS.SETTINGS.PROFILE.ADDRESS]: { - country?: string; + country?: Country | ''; }; [SCREENS.SETTINGS.PROFILE.ADDRESS_COUNTRY]: { backTo?: Routes; diff --git a/src/pages/settings/Profile/PersonalDetails/AddressPage.tsx b/src/pages/settings/Profile/PersonalDetails/AddressPage.tsx index adc721ea0ea1..d85dae9d3abb 100644 --- a/src/pages/settings/Profile/PersonalDetails/AddressPage.tsx +++ b/src/pages/settings/Profile/PersonalDetails/AddressPage.tsx @@ -12,6 +12,8 @@ import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import type {SettingsNavigatorParamList} from '@libs/Navigation/types'; import * as PersonalDetails from '@userActions/PersonalDetails'; +import type {FormOnyxValues} from '@src/components/Form/types'; +import type {Country} from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import type SCREENS from '@src/SCREENS'; import type {PrivatePersonalDetails} from '@src/types/onyx'; @@ -28,7 +30,7 @@ type AddressPageProps = StackScreenProps) { PersonalDetails.updateAddress( values.addressLine1?.trim() ?? '', values.addressLine2?.trim() ?? '', @@ -62,29 +64,32 @@ function AddressPage({privatePersonalDetails, route}: AddressPageProps) { setZipcode(address.zip); }, [address]); - const handleAddressChange = useCallback((value: string, key: keyof Address) => { - if (key !== 'country' && key !== 'state' && key !== 'city' && key !== 'zipPostCode') { + const handleAddressChange = useCallback((value: unknown, key: unknown) => { + const countryValue = value as Country | ''; + const addressKey = key as keyof Address; + + if (addressKey !== 'country' && addressKey !== 'state' && addressKey !== 'city' && addressKey !== 'zipPostCode') { return; } - if (key === 'country') { - setCurrentCountry(value); + if (addressKey === 'country') { + setCurrentCountry(countryValue); setState(''); setCity(''); setZipcode(''); return; } - if (key === 'state') { - setState(value); + if (addressKey === 'state') { + setState(countryValue); setCity(''); setZipcode(''); return; } - if (key === 'city') { - setCity(value); + if (addressKey === 'city') { + setCity(countryValue); setZipcode(''); return; } - setZipcode(value); + setZipcode(countryValue); }, []); useEffect(() => { diff --git a/src/types/form/HomeAddressForm.ts b/src/types/form/HomeAddressForm.ts index 6d9ef8580078..7117e9de3b64 100644 --- a/src/types/form/HomeAddressForm.ts +++ b/src/types/form/HomeAddressForm.ts @@ -1,4 +1,5 @@ import type {ValueOf} from 'type-fest'; +import type {Country} from '@src/CONST'; import type Form from './Form'; const INPUT_IDS = { @@ -17,7 +18,7 @@ type HomeAddressForm = Form< { [INPUT_IDS.ADDRESS_LINE_1]: string; [INPUT_IDS.ADDRESS_LINE_2]: string; - [INPUT_IDS.COUNTRY]: string; + [INPUT_IDS.COUNTRY]: Country | ''; [INPUT_IDS.STATE]: string; [INPUT_IDS.CITY]: string; [INPUT_IDS.ZIP_POST_CODE]: string;