From f525a3e623cc18dd753ebf64b9a8896104e795d5 Mon Sep 17 00:00:00 2001 From: Bernhard Owen Josephus Date: Wed, 7 Aug 2024 14:43:21 +0800 Subject: [PATCH 1/6] fix website step is skipped --- src/components/Form/FormProvider.tsx | 8 ++++++-- .../ReimbursementAccount/resetFreePlanBankAccount.ts | 2 +- .../BusinessInfo/substeps/WebsiteBusiness.tsx | 6 +----- .../utils/getInitialSubstepForBusinessInfo.ts | 3 ++- 4 files changed, 10 insertions(+), 9 deletions(-) diff --git a/src/components/Form/FormProvider.tsx b/src/components/Form/FormProvider.tsx index 793154d95b02..a424d7f82731 100644 --- a/src/components/Form/FormProvider.tsx +++ b/src/components/Form/FormProvider.tsx @@ -17,7 +17,7 @@ import {isEmptyObject} from '@src/types/utils/EmptyObject'; import type {RegisterInput} from './FormContext'; import FormContext from './FormContext'; import FormWrapper from './FormWrapper'; -import type {FormInputErrors, FormOnyxValues, FormProps, FormRef, InputComponentBaseProps, InputRefs, ValueTypeKey} from './types'; +import type {FormInputErrors, FormOnyxValues, FormProps, FormRef, FormValue, InputComponentBaseProps, InputRefs, ValueTypeKey} from './types'; // In order to prevent Checkbox focus loss when the user are focusing a TextInput and proceeds to toggle a CheckBox in web and mobile web. // 200ms delay was chosen as a result of empirical testing. @@ -40,6 +40,10 @@ function getInitialValueByType(valueType?: ValueTypeKey): InitialDefaultValue { } } +function isEmptyValue(value: FormValue) { + return value === undefined || value === ''; +}; + type FormProviderOnyxProps = { /** Contains the form state that must be accessed outside the component */ formState: OnyxEntry
; @@ -249,7 +253,7 @@ function FormProvider( } else if (inputProps.shouldUseDefaultValue && inputProps.defaultValue !== undefined && inputValues[inputID] === undefined) { // We force the form to set the input value from the defaultValue props if there is a saved valid value inputValues[inputID] = inputProps.defaultValue; - } else if (inputValues[inputID] === undefined) { + } else if (isEmptyValue(inputValues[inputID])) { // We want to initialize the input value if it's undefined inputValues[inputID] = inputProps.defaultValue ?? getInitialValueByType(inputProps.valueType); } diff --git a/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts b/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts index f8d887fec47a..869a6a3164fe 100644 --- a/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts +++ b/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts @@ -98,7 +98,7 @@ function resetFreePlanBankAccount(bankAccountID: number | undefined, session: On [INPUT_IDS.BUSINESS_INFO_STEP.STATE]: '', [INPUT_IDS.BUSINESS_INFO_STEP.ZIP_CODE]: '', [INPUT_IDS.BUSINESS_INFO_STEP.COMPANY_PHONE]: '', - [INPUT_IDS.BUSINESS_INFO_STEP.COMPANY_WEBSITE]: getDefaultCompanyWebsite(session, user), + [INPUT_IDS.BUSINESS_INFO_STEP.COMPANY_WEBSITE]: '', [INPUT_IDS.BUSINESS_INFO_STEP.COMPANY_TAX_ID]: '', [INPUT_IDS.BUSINESS_INFO_STEP.INCORPORATION_TYPE]: '', [INPUT_IDS.BUSINESS_INFO_STEP.INCORPORATION_DATE]: '', diff --git a/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx b/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx index 541e47f6cb10..f5c78e0ce4bf 100644 --- a/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx +++ b/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx @@ -39,7 +39,7 @@ function WebsiteBusiness({reimbursementAccount, user, session, onNext, isEditing const styles = useThemeStyles(); const defaultWebsiteExample = useMemo(() => getDefaultCompanyWebsite(session, user), [session, user]); - const defaultCompanyWebsite = reimbursementAccount?.achData?.website ?? defaultWebsiteExample; + const defaultCompanyWebsite = reimbursementAccount?.achData?.website || defaultWebsiteExample; const validate = useCallback( (values: FormOnyxValues): FormInputErrors => { @@ -59,10 +59,6 @@ function WebsiteBusiness({reimbursementAccount, user, session, onNext, isEditing shouldSaveDraft: isEditing, }); - useEffect(() => { - BankAccounts.addBusinessWebsiteForDraft(defaultCompanyWebsite); - }, [defaultCompanyWebsite]); - return ( Date: Wed, 7 Aug 2024 15:01:59 +0800 Subject: [PATCH 2/6] only checks for undefined --- src/components/Form/FormProvider.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/src/components/Form/FormProvider.tsx b/src/components/Form/FormProvider.tsx index a424d7f82731..793154d95b02 100644 --- a/src/components/Form/FormProvider.tsx +++ b/src/components/Form/FormProvider.tsx @@ -17,7 +17,7 @@ import {isEmptyObject} from '@src/types/utils/EmptyObject'; import type {RegisterInput} from './FormContext'; import FormContext from './FormContext'; import FormWrapper from './FormWrapper'; -import type {FormInputErrors, FormOnyxValues, FormProps, FormRef, FormValue, InputComponentBaseProps, InputRefs, ValueTypeKey} from './types'; +import type {FormInputErrors, FormOnyxValues, FormProps, FormRef, InputComponentBaseProps, InputRefs, ValueTypeKey} from './types'; // In order to prevent Checkbox focus loss when the user are focusing a TextInput and proceeds to toggle a CheckBox in web and mobile web. // 200ms delay was chosen as a result of empirical testing. @@ -40,10 +40,6 @@ function getInitialValueByType(valueType?: ValueTypeKey): InitialDefaultValue { } } -function isEmptyValue(value: FormValue) { - return value === undefined || value === ''; -}; - type FormProviderOnyxProps = { /** Contains the form state that must be accessed outside the component */ formState: OnyxEntry; @@ -253,7 +249,7 @@ function FormProvider( } else if (inputProps.shouldUseDefaultValue && inputProps.defaultValue !== undefined && inputValues[inputID] === undefined) { // We force the form to set the input value from the defaultValue props if there is a saved valid value inputValues[inputID] = inputProps.defaultValue; - } else if (isEmptyValue(inputValues[inputID])) { + } else if (inputValues[inputID] === undefined) { // We want to initialize the input value if it's undefined inputValues[inputID] = inputProps.defaultValue ?? getInitialValueByType(inputProps.valueType); } From 297c05a725d56bbe3744f798fdf15cf77b209d1a Mon Sep 17 00:00:00 2001 From: Bernhard Owen Josephus Date: Wed, 7 Aug 2024 15:02:09 +0800 Subject: [PATCH 3/6] reset website to undefined --- .../actions/ReimbursementAccount/resetFreePlanBankAccount.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts b/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts index 869a6a3164fe..b72dc93be6be 100644 --- a/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts +++ b/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts @@ -98,7 +98,7 @@ function resetFreePlanBankAccount(bankAccountID: number | undefined, session: On [INPUT_IDS.BUSINESS_INFO_STEP.STATE]: '', [INPUT_IDS.BUSINESS_INFO_STEP.ZIP_CODE]: '', [INPUT_IDS.BUSINESS_INFO_STEP.COMPANY_PHONE]: '', - [INPUT_IDS.BUSINESS_INFO_STEP.COMPANY_WEBSITE]: '', + [INPUT_IDS.BUSINESS_INFO_STEP.COMPANY_WEBSITE]: undefined, [INPUT_IDS.BUSINESS_INFO_STEP.COMPANY_TAX_ID]: '', [INPUT_IDS.BUSINESS_INFO_STEP.INCORPORATION_TYPE]: '', [INPUT_IDS.BUSINESS_INFO_STEP.INCORPORATION_DATE]: '', From 0628d37e17702a0f3583444478dd025461416ee8 Mon Sep 17 00:00:00 2001 From: Bernhard Owen Josephus Date: Wed, 7 Aug 2024 15:08:29 +0800 Subject: [PATCH 4/6] linter --- .../ReimbursementAccount/resetFreePlanBankAccount.ts | 3 +-- .../BusinessInfo/substeps/WebsiteBusiness.tsx | 4 ++-- src/pages/workspace/WorkspaceResetBankAccountModal.tsx | 10 ++-------- 3 files changed, 5 insertions(+), 12 deletions(-) diff --git a/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts b/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts index b72dc93be6be..5bb51f22d64a 100644 --- a/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts +++ b/src/libs/actions/ReimbursementAccount/resetFreePlanBankAccount.ts @@ -2,7 +2,6 @@ import type {OnyxCollection, OnyxEntry} from 'react-native-onyx'; import Onyx from 'react-native-onyx'; import * as API from '@libs/API'; import {WRITE_COMMANDS} from '@libs/API/types'; -import {getDefaultCompanyWebsite} from '@libs/BankAccountUtils'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import INPUT_IDS from '@src/types/form/ReimbursementAccountForm'; @@ -18,7 +17,7 @@ Onyx.connect({ /** * Reset user's reimbursement account. This will delete the bank account. */ -function resetFreePlanBankAccount(bankAccountID: number | undefined, session: OnyxEntry, policyID: string, user: OnyxEntry) { +function resetFreePlanBankAccount(bankAccountID: number | undefined, session: OnyxEntry, policyID: string) { if (!bankAccountID) { throw new Error('Missing bankAccountID when attempting to reset free plan bank account'); } diff --git a/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx b/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx index f5c78e0ce4bf..97c420c5fc0a 100644 --- a/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx +++ b/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx @@ -1,4 +1,4 @@ -import React, {useCallback, useEffect, useMemo} from 'react'; +import React, {useCallback, useMemo} from 'react'; import type {OnyxEntry} from 'react-native-onyx'; import {withOnyx} from 'react-native-onyx'; import FormProvider from '@components/Form/FormProvider'; @@ -12,7 +12,6 @@ import type {SubStepProps} from '@hooks/useSubStep/types'; import useThemeStyles from '@hooks/useThemeStyles'; import {getDefaultCompanyWebsite} from '@libs/BankAccountUtils'; import * as ValidationUtils from '@libs/ValidationUtils'; -import * as BankAccounts from '@userActions/BankAccounts'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import INPUT_IDS from '@src/types/form/ReimbursementAccountForm'; @@ -39,6 +38,7 @@ function WebsiteBusiness({reimbursementAccount, user, session, onNext, isEditing const styles = useThemeStyles(); const defaultWebsiteExample = useMemo(() => getDefaultCompanyWebsite(session, user), [session, user]); + // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing const defaultCompanyWebsite = reimbursementAccount?.achData?.website || defaultWebsiteExample; const validate = useCallback( diff --git a/src/pages/workspace/WorkspaceResetBankAccountModal.tsx b/src/pages/workspace/WorkspaceResetBankAccountModal.tsx index 81f341999200..5856c71d0a43 100644 --- a/src/pages/workspace/WorkspaceResetBankAccountModal.tsx +++ b/src/pages/workspace/WorkspaceResetBankAccountModal.tsx @@ -13,9 +13,6 @@ import type * as OnyxTypes from '@src/types/onyx'; type WorkspaceResetBankAccountModalOnyxProps = { /** Session info for the currently logged in user. */ session: OnyxEntry; - - /** The user's data */ - user: OnyxEntry; }; type WorkspaceResetBankAccountModalProps = WorkspaceResetBankAccountModalOnyxProps & { @@ -23,7 +20,7 @@ type WorkspaceResetBankAccountModalProps = WorkspaceResetBankAccountModalOnyxPro reimbursementAccount: OnyxEntry; }; -function WorkspaceResetBankAccountModal({reimbursementAccount, session, user}: WorkspaceResetBankAccountModalProps) { +function WorkspaceResetBankAccountModal({reimbursementAccount, session}: WorkspaceResetBankAccountModalProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); const achData = reimbursementAccount?.achData; @@ -49,7 +46,7 @@ function WorkspaceResetBankAccountModal({reimbursementAccount, session, user}: W } danger onCancel={BankAccounts.cancelResetFreePlanBankAccount} - onConfirm={() => BankAccounts.resetFreePlanBankAccount(bankAccountID, session, achData?.policyID ?? '-1', user)} + onConfirm={() => BankAccounts.resetFreePlanBankAccount(bankAccountID, session, achData?.policyID ?? '-1')} shouldShowCancelButton isVisible /> @@ -62,7 +59,4 @@ export default withOnyx Date: Wed, 7 Aug 2024 16:34:09 +0800 Subject: [PATCH 5/6] remove unnecessary checks --- .../utils/getInitialSubstepForBusinessInfo.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/ReimbursementAccount/utils/getInitialSubstepForBusinessInfo.ts b/src/pages/ReimbursementAccount/utils/getInitialSubstepForBusinessInfo.ts index bbac56d3536b..099eacaa690f 100644 --- a/src/pages/ReimbursementAccount/utils/getInitialSubstepForBusinessInfo.ts +++ b/src/pages/ReimbursementAccount/utils/getInitialSubstepForBusinessInfo.ts @@ -16,7 +16,7 @@ function getInitialSubstepForBusinessInfo(data: CompanyStepProps): number { return 1; } - if (data[businessInfoStepKeys.COMPANY_WEBSITE] === '' || !ValidationUtils.isValidWebsite(data[businessInfoStepKeys.COMPANY_WEBSITE])) { + if (!ValidationUtils.isValidWebsite(data[businessInfoStepKeys.COMPANY_WEBSITE])) { return 2; } From e4f06160ab026c256ae44fafc7a30a11d8419626 Mon Sep 17 00:00:00 2001 From: Bernhard Owen Josephus Date: Thu, 8 Aug 2024 23:37:29 +0800 Subject: [PATCH 6/6] use ?? back --- .../BusinessInfo/substeps/WebsiteBusiness.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx b/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx index 97c420c5fc0a..a425c776f63d 100644 --- a/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx +++ b/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx @@ -38,8 +38,7 @@ function WebsiteBusiness({reimbursementAccount, user, session, onNext, isEditing const styles = useThemeStyles(); const defaultWebsiteExample = useMemo(() => getDefaultCompanyWebsite(session, user), [session, user]); - // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing - const defaultCompanyWebsite = reimbursementAccount?.achData?.website || defaultWebsiteExample; + const defaultCompanyWebsite = reimbursementAccount?.achData?.website ?? defaultWebsiteExample; const validate = useCallback( (values: FormOnyxValues): FormInputErrors => {