diff --git a/package-lock.json b/package-lock.json index 832c46ac06f8..25ef52da8975 100644 --- a/package-lock.json +++ b/package-lock.json @@ -51,7 +51,7 @@ "date-fns-tz": "^3.2.0", "dom-serializer": "^0.2.2", "domhandler": "^4.3.0", - "expensify-common": "2.0.101", + "expensify-common": "2.0.103", "expo": "51.0.31", "expo-av": "14.0.7", "expo-image": "1.12.15", @@ -24154,9 +24154,9 @@ } }, "node_modules/expensify-common": { - "version": "2.0.101", - "resolved": "https://registry.npmjs.org/expensify-common/-/expensify-common-2.0.101.tgz", - "integrity": "sha512-5TStDQGsXGJjdk64PBhEdXz/3H6QDlgoanEWI076okL5un4Qd2sSRfxHRiH61foHGsswXJFIZBHK3sysKDOJ4A==", + "version": "2.0.103", + "resolved": "https://registry.npmjs.org/expensify-common/-/expensify-common-2.0.103.tgz", + "integrity": "sha512-Q42bUK6TeB87qN4MEBDlhNH1qQqUXY+tJKCZTt01Zv+lcn7KemudOCt7GNoEwfR7LLWsWuec7Vb5x45rQJNC2A==", "license": "MIT", "dependencies": { "awesome-phonenumber": "^5.4.0", diff --git a/package.json b/package.json index 0778eba5fd9c..6768c740614a 100644 --- a/package.json +++ b/package.json @@ -108,7 +108,7 @@ "date-fns-tz": "^3.2.0", "dom-serializer": "^0.2.2", "domhandler": "^4.3.0", - "expensify-common": "2.0.101", + "expensify-common": "2.0.103", "expo": "51.0.31", "expo-av": "14.0.7", "expo-image": "1.12.15", diff --git a/src/CONST.ts b/src/CONST.ts index 8a1e9cfbf67c..09a66b87c21e 100755 --- a/src/CONST.ts +++ b/src/CONST.ts @@ -477,6 +477,7 @@ const CONST = { OLD_DOT_ANDROID: 'https://play.google.com/store/apps/details?id=org.me.mobiexpensifyg&hl=en_US&pli=1', OLD_DOT_IOS: 'https://apps.apple.com/us/app/expensify-expense-tracker/id471713959', }, + COMPANY_WEBSITE_DEFAULT_SCHEME: 'http', DATE: { SQL_DATE_TIME: 'YYYY-MM-DD HH:mm:ss', FNS_FORMAT_STRING: 'yyyy-MM-dd', diff --git a/src/libs/BankAccountUtils.ts b/src/libs/BankAccountUtils.ts index c781ccab3f33..89bcf96c642f 100644 --- a/src/libs/BankAccountUtils.ts +++ b/src/libs/BankAccountUtils.ts @@ -3,7 +3,7 @@ import type {OnyxEntry} from 'react-native-onyx'; import type * as OnyxTypes from '@src/types/onyx'; function getDefaultCompanyWebsite(session: OnyxEntry, user: OnyxEntry): string { - return user?.isFromPublicDomain ? 'https://' : `https://www.${Str.extractEmailDomain(session?.email ?? '')}`; + return user?.isFromPublicDomain ? '' : `https://www.${Str.extractEmailDomain(session?.email ?? '')}`; } function getLastFourDigits(bankAccountNumber: string): string { diff --git a/src/pages/ReimbursementAccount/BusinessInfo/BusinessInfo.tsx b/src/pages/ReimbursementAccount/BusinessInfo/BusinessInfo.tsx index 0a94e22cde1f..7f45de42122b 100644 --- a/src/pages/ReimbursementAccount/BusinessInfo/BusinessInfo.tsx +++ b/src/pages/ReimbursementAccount/BusinessInfo/BusinessInfo.tsx @@ -1,3 +1,4 @@ +import {Str} from 'expensify-common'; import lodashPick from 'lodash/pick'; import React, {useCallback, useMemo} from 'react'; import {useOnyx} from 'react-native-onyx'; @@ -60,6 +61,7 @@ function BusinessInfo({onBackButtonPress}: BusinessInfoProps) { const submit = useCallback( (isConfirmPage: boolean) => { + const companyWebsite = Str.sanitizeURL(values.website, CONST.COMPANY_WEBSITE_DEFAULT_SCHEME); BankAccounts.updateCompanyInformationForBankAccount( Number(reimbursementAccount?.achData?.bankAccountID ?? '-1'), { @@ -67,7 +69,7 @@ function BusinessInfo({onBackButtonPress}: BusinessInfoProps) { ...getBankAccountFields(['routingNumber', 'accountNumber', 'bankName', 'plaidAccountID', 'plaidAccessToken', 'isSavings']), companyTaxID: values.companyTaxID?.replace(CONST.REGEX.NON_NUMERIC, ''), companyPhone: parsePhoneNumber(values.companyPhone ?? '', {regionCode: CONST.COUNTRY.US}).number?.significant, - website: ValidationUtils.isValidWebsite(values.website) ? values.website : undefined, + website: ValidationUtils.isValidWebsite(companyWebsite) ? companyWebsite : undefined, }, policyID, isConfirmPage, diff --git a/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx b/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx index 3d8fcd944f4f..5ef5e7c75c8d 100644 --- a/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx +++ b/src/pages/ReimbursementAccount/BusinessInfo/substeps/WebsiteBusiness.tsx @@ -1,3 +1,4 @@ +import {Str} from 'expensify-common'; import React, {useCallback, useMemo} from 'react'; import {useOnyx} from 'react-native-onyx'; import FormProvider from '@components/Form/FormProvider'; @@ -33,7 +34,7 @@ function WebsiteBusiness({onNext, isEditing}: SubStepProps) { (values: FormOnyxValues): FormInputErrors => { const errors = ValidationUtils.getFieldRequiredErrors(values, STEP_FIELDS); - if (values.website && !ValidationUtils.isValidWebsite(values.website)) { + if (values.website && !ValidationUtils.isValidWebsite(Str.sanitizeURL(values.website, CONST.COMPANY_WEBSITE_DEFAULT_SCHEME))) { errors.website = translate('bankAccount.error.website'); } @@ -44,7 +45,8 @@ function WebsiteBusiness({onNext, isEditing}: SubStepProps) { const handleSubmit = useReimbursementAccountStepFormSubmit({ fieldIds: STEP_FIELDS, onNext: (values) => { - BankAccounts.addBusinessWebsiteForDraft((values as {website: string})?.website); + const website = Str.sanitizeURL((values as {website: string})?.website, CONST.COMPANY_WEBSITE_DEFAULT_SCHEME); + BankAccounts.addBusinessWebsiteForDraft(website); onNext(); }, shouldSaveDraft: true, diff --git a/src/pages/ReimbursementAccount/utils/getInitialSubstepForBusinessInfo.ts b/src/pages/ReimbursementAccount/utils/getInitialSubstepForBusinessInfo.ts index 099eacaa690f..7173455afd05 100644 --- a/src/pages/ReimbursementAccount/utils/getInitialSubstepForBusinessInfo.ts +++ b/src/pages/ReimbursementAccount/utils/getInitialSubstepForBusinessInfo.ts @@ -1,4 +1,6 @@ +import {Str} from 'expensify-common'; import * as ValidationUtils from '@libs/ValidationUtils'; +import CONST from '@src/CONST'; import INPUT_IDS from '@src/types/form/ReimbursementAccountForm'; import type {CompanyStepProps} from '@src/types/form/ReimbursementAccountForm'; @@ -16,7 +18,7 @@ function getInitialSubstepForBusinessInfo(data: CompanyStepProps): number { return 1; } - if (!ValidationUtils.isValidWebsite(data[businessInfoStepKeys.COMPANY_WEBSITE])) { + if (!ValidationUtils.isValidWebsite(Str.sanitizeURL(data[businessInfoStepKeys.COMPANY_WEBSITE], CONST.COMPANY_WEBSITE_DEFAULT_SCHEME))) { return 2; } diff --git a/src/pages/iou/request/step/IOURequestStepCompanyInfo.tsx b/src/pages/iou/request/step/IOURequestStepCompanyInfo.tsx index d53940a4cfcb..1c2f14dbbb2b 100644 --- a/src/pages/iou/request/step/IOURequestStepCompanyInfo.tsx +++ b/src/pages/iou/request/step/IOURequestStepCompanyInfo.tsx @@ -1,5 +1,5 @@ import {Str} from 'expensify-common'; -import React, {useCallback} from 'react'; +import React, {useCallback, useMemo} from 'react'; import {useOnyx} from 'react-native-onyx'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; @@ -11,6 +11,7 @@ import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails' import useLocalize from '@hooks/useLocalize'; import usePolicy from '@hooks/usePolicy'; import useThemeStyles from '@hooks/useThemeStyles'; +import {getDefaultCompanyWebsite} from '@libs/BankAccountUtils'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import playSound, {SOUNDS} from '@libs/Sound'; import * as Url from '@libs/Url'; @@ -37,6 +38,9 @@ function IOURequestStepCompanyInfo({route, report, transaction}: IOURequestStepC const {translate} = useLocalize(); const {inputCallbackRef} = useAutoFocusInput(); const currentUserPersonalDetails = useCurrentUserPersonalDetails(); + const [session] = useOnyx(ONYXKEYS.SESSION); + const [user] = useOnyx(ONYXKEYS.USER); + const defaultWebsiteExample = useMemo(() => getDefaultCompanyWebsite(session, user), [session, user]); const policy = usePolicy(IOU.getIOURequestPolicyID(transaction, report)); const [policyCategories] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${IOU.getIOURequestPolicyID(transaction, report)}`); @@ -47,9 +51,9 @@ function IOURequestStepCompanyInfo({route, report, transaction}: IOURequestStepC const validate = useCallback( (values: FormOnyxValues): FormInputErrors => { const errors = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.COMPANY_NAME, INPUT_IDS.COMPANY_WEBSITE]); - if (values.companyWebsite) { - if (!ValidationUtils.isValidWebsite(values.companyWebsite)) { + const companyWebsite = Str.sanitizeURL(values.companyWebsite, CONST.COMPANY_WEBSITE_DEFAULT_SCHEME); + if (!ValidationUtils.isValidWebsite(companyWebsite)) { errors.companyWebsite = translate('bankAccount.error.website'); } else { const domain = Url.extractUrlDomain(values.companyWebsite); @@ -68,8 +72,9 @@ function IOURequestStepCompanyInfo({route, report, transaction}: IOURequestStepC ); const submit = (values: FormOnyxValues) => { + const companyWebsite = Str.sanitizeURL(values.companyWebsite, CONST.COMPANY_WEBSITE_DEFAULT_SCHEME); playSound(SOUNDS.DONE); - IOU.sendInvoice(currentUserPersonalDetails.accountID, transaction, report, undefined, policy, policyTags, policyCategories, values.companyName, values.companyWebsite); + IOU.sendInvoice(currentUserPersonalDetails.accountID, transaction, report, undefined, policy, policyTags, policyCategories, values.companyName, companyWebsite); }; return ( @@ -107,6 +112,7 @@ function IOURequestStepCompanyInfo({route, report, transaction}: IOURequestStepC accessibilityLabel={translate('iou.yourCompanyWebsite')} role={CONST.ROLE.PRESENTATION} hint={translate('iou.yourCompanyWebsiteNote')} + defaultValue={defaultWebsiteExample} /> diff --git a/src/pages/workspace/invoices/WorkspaceInvoicingDetailsWebsite.tsx b/src/pages/workspace/invoices/WorkspaceInvoicingDetailsWebsite.tsx index cd2f559da3fa..e9c5d8e35187 100644 --- a/src/pages/workspace/invoices/WorkspaceInvoicingDetailsWebsite.tsx +++ b/src/pages/workspace/invoices/WorkspaceInvoicingDetailsWebsite.tsx @@ -1,6 +1,6 @@ import type {StackScreenProps} from '@react-navigation/stack'; import {Str} from 'expensify-common'; -import React from 'react'; +import React, {useMemo} from 'react'; import {useOnyx} from 'react-native-onyx'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; @@ -11,6 +11,7 @@ import TextInput from '@components/TextInput'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; +import {getDefaultCompanyWebsite} from '@libs/BankAccountUtils'; import * as Url from '@libs/Url'; import * as ValidationUtils from '@libs/ValidationUtils'; import Navigation from '@navigation/Navigation'; @@ -31,10 +32,14 @@ function WorkspaceInvoicingDetailsWebsite({route}: WorkspaceInvoicingDetailsWebs const {inputCallbackRef} = useAutoFocusInput(); const styles = useThemeStyles(); const [policy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`); + const [session] = useOnyx(ONYXKEYS.SESSION); + const [user] = useOnyx(ONYXKEYS.USER); + const defaultWebsiteExample = useMemo(() => getDefaultCompanyWebsite(session, user), [session, user]); // eslint-disable-next-line @typescript-eslint/no-unused-vars const submit = (values: FormOnyxValues) => { - Policy.updateInvoiceCompanyWebsite(policyID, values[INPUT_IDS.COMPANY_WEBSITE]); + const companyWebsite = Str.sanitizeURL(values[INPUT_IDS.COMPANY_WEBSITE], CONST.COMPANY_WEBSITE_DEFAULT_SCHEME); + Policy.updateInvoiceCompanyWebsite(policyID, companyWebsite); Navigation.goBack(); }; @@ -44,7 +49,7 @@ function WorkspaceInvoicingDetailsWebsite({route}: WorkspaceInvoicingDetailsWebs const errors = ValidationUtils.getFieldRequiredErrors(values, [INPUT_IDS.COMPANY_WEBSITE]); if (values.companyWebsite) { - if (!ValidationUtils.isValidWebsite(values.companyWebsite)) { + if (!ValidationUtils.isValidWebsite(Str.sanitizeURL(values.companyWebsite, CONST.COMPANY_WEBSITE_DEFAULT_SCHEME))) { errors.companyWebsite = translate('bankAccount.error.website'); } else { const domain = Url.extractUrlDomain(values.companyWebsite); @@ -86,7 +91,7 @@ function WorkspaceInvoicingDetailsWebsite({route}: WorkspaceInvoicingDetailsWebs label={translate('workspace.invoices.companyWebsite')} accessibilityLabel={translate('workspace.invoices.companyWebsite')} role={CONST.ROLE.PRESENTATION} - defaultValue={policy?.invoice?.companyWebsite} + defaultValue={policy?.invoice?.companyWebsite ?? defaultWebsiteExample} ref={inputCallbackRef} inputMode={CONST.INPUT_MODE.URL} />