diff --git a/src/components/AccountSwitcher.tsx b/src/components/AccountSwitcher.tsx index 149856430d8a5..834cf97e5d36b 100644 --- a/src/components/AccountSwitcher.tsx +++ b/src/components/AccountSwitcher.tsx @@ -12,7 +12,6 @@ import useWindowDimensions from '@hooks/useWindowDimensions'; import {clearDelegatorErrors, connect, disconnect} from '@libs/actions/Delegate'; import {close} from '@libs/actions/Modal'; import {getLatestError} from '@libs/ErrorUtils'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import {getPersonalDetailByEmail} from '@libs/PersonalDetailsUtils'; import TextWithEmojiFragment from '@pages/home/report/comment/TextWithEmojiFragment'; import variables from '@styles/variables'; @@ -41,7 +40,7 @@ function AccountSwitcher({isScreenFocused}: AccountSwitcherProps) { const currentUserPersonalDetails = useCurrentUserPersonalDetails(); const styles = useThemeStyles(); const theme = useTheme(); - const {translate} = useLocalize(); + const {translate, formatPhoneNumber} = useLocalize(); const {isOffline} = useNetwork(); const {shouldUseNarrowLayout} = useResponsiveLayout(); const [account] = useOnyx(ONYXKEYS.ACCOUNT, {canBeMissing: true}); diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/MentionUserRenderer.tsx b/src/components/HTMLEngineProvider/HTMLRenderers/MentionUserRenderer.tsx index 027e735e6b80d..d42e55a326838 100644 --- a/src/components/HTMLEngineProvider/HTMLRenderers/MentionUserRenderer.tsx +++ b/src/components/HTMLEngineProvider/HTMLRenderers/MentionUserRenderer.tsx @@ -11,10 +11,10 @@ import Text from '@components/Text'; import UserDetailsTooltip from '@components/UserDetailsTooltip'; import withCurrentUserPersonalDetails from '@components/withCurrentUserPersonalDetails'; import type {WithCurrentUserPersonalDetailsProps} from '@components/withCurrentUserPersonalDetails'; +import useLocalize from '@hooks/useLocalize'; import useOnyx from '@hooks/useOnyx'; import useStyleUtils from '@hooks/useStyleUtils'; import useThemeStyles from '@hooks/useThemeStyles'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import Navigation from '@libs/Navigation/Navigation'; import {getAccountIDsByLogins, getDisplayNameOrDefault, getShortMentionIfFound} from '@libs/PersonalDetailsUtils'; import {isArchivedNonExpenseReport} from '@libs/ReportUtils'; @@ -30,6 +30,7 @@ type MentionUserRendererProps = WithCurrentUserPersonalDetailsProps & CustomRend function MentionUserRenderer({style, tnode, TDefaultRenderer, currentUserPersonalDetails, ...defaultRendererProps}: MentionUserRendererProps) { const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); + const {formatPhoneNumber} = useLocalize(); const htmlAttribAccountID = tnode.attributes.accountid; const [personalDetails] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, {canBeMissing: true}); const htmlAttributeAccountID = tnode.attributes.accountid; diff --git a/src/components/LocaleContextProvider.tsx b/src/components/LocaleContextProvider.tsx index d17bd09c55d03..4ef2453a60052 100644 --- a/src/components/LocaleContextProvider.tsx +++ b/src/components/LocaleContextProvider.tsx @@ -3,7 +3,7 @@ import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails' import useOnyx from '@hooks/useOnyx'; import DateUtils from '@libs/DateUtils'; import {fromLocaleDigit as fromLocaleDigitLocaleDigitUtils, toLocaleDigit as toLocaleDigitLocaleDigitUtils, toLocaleOrdinal as toLocaleOrdinalLocaleDigitUtils} from '@libs/LocaleDigitUtils'; -import {formatPhoneNumber as formatPhoneNumberLocalePhoneNumber} from '@libs/LocalePhoneNumber'; +import {formatPhoneNumberWithCountryCode} from '@libs/LocalePhoneNumber'; import {translate as translateLocalize} from '@libs/Localize'; import {format} from '@libs/NumberFormatUtils'; import IntlStore from '@src/languages/IntlStore'; @@ -72,6 +72,7 @@ const COLLATOR_OPTIONS: Intl.CollatorOptions = {usage: 'sort', sensitivity: 'var function LocaleContextProvider({children}: LocaleContextProviderProps) { const currentUserPersonalDetails = useCurrentUserPersonalDetails(); const [areTranslationsLoading = true] = useOnyx(ONYXKEYS.ARE_TRANSLATIONS_LOADING, {initWithStoredValues: false, canBeMissing: true}); + const [countryCodeByIP = 1] = useOnyx(ONYXKEYS.COUNTRY_CODE, {canBeMissing: true}); const [currentLocale, setCurrentLocale] = useState(() => IntlStore.getCurrentLocale()); useEffect(() => { @@ -114,7 +115,7 @@ function LocaleContextProvider({children}: LocaleContextProviderProps) { [currentLocale, selectedTimezone], ); - const formatPhoneNumber = useMemo(() => (phoneNumber) => formatPhoneNumberLocalePhoneNumber(phoneNumber), []); + const formatPhoneNumber = useMemo(() => (phoneNumber) => formatPhoneNumberWithCountryCode(phoneNumber, countryCodeByIP), [countryCodeByIP]); const toLocaleDigit = useMemo(() => (digit) => toLocaleDigitLocaleDigitUtils(currentLocale, digit), [currentLocale]); diff --git a/src/components/SelectionList/Search/CardListItemHeader.tsx b/src/components/SelectionList/Search/CardListItemHeader.tsx index d440d295b576a..7061ca31e46bb 100644 --- a/src/components/SelectionList/Search/CardListItemHeader.tsx +++ b/src/components/SelectionList/Search/CardListItemHeader.tsx @@ -11,7 +11,6 @@ import useTheme from '@hooks/useTheme'; import useThemeIllustrations from '@hooks/useThemeIllustrations'; import useThemeStyles from '@hooks/useThemeStyles'; import {getCardFeedIcon} from '@libs/CardUtils'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import {getDisplayNameOrDefault} from '@libs/PersonalDetailsUtils'; import variables from '@styles/variables'; import CONST from '@src/CONST'; @@ -39,10 +38,10 @@ function CardListItemHeader({card: cardItem, onCheckboxP const theme = useTheme(); const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); - const {translate} = useLocalize(); + const {translate, formatPhoneNumber} = useLocalize(); const illustrations = useThemeIllustrations(); - const formattedDisplayName = useMemo(() => formatPhoneNumber(getDisplayNameOrDefault(cardItem)), [cardItem]); + const formattedDisplayName = useMemo(() => formatPhoneNumber(getDisplayNameOrDefault(cardItem)), [cardItem, formatPhoneNumber]); const [memberAvatar, cardIcon] = useMemo(() => { const avatar: Icon = { diff --git a/src/components/SelectionList/Search/MemberListItemHeader.tsx b/src/components/SelectionList/Search/MemberListItemHeader.tsx index b33177d1855d4..941853fdd528b 100644 --- a/src/components/SelectionList/Search/MemberListItemHeader.tsx +++ b/src/components/SelectionList/Search/MemberListItemHeader.tsx @@ -7,7 +7,6 @@ import TextWithTooltip from '@components/TextWithTooltip'; import UserDetailsTooltip from '@components/UserDetailsTooltip'; import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import {getDisplayNameOrDefault} from '@libs/PersonalDetailsUtils'; import CONST from '@src/CONST'; @@ -27,9 +26,12 @@ type MemberListItemHeaderProps = { function MemberListItemHeader({member: memberItem, onCheckboxPress, isDisabled, canSelectMultiple}: MemberListItemHeaderProps) { const styles = useThemeStyles(); - const {translate} = useLocalize(); + const {translate, formatPhoneNumber} = useLocalize(); - const [formattedDisplayName, formattedLogin] = useMemo(() => [formatPhoneNumber(getDisplayNameOrDefault(memberItem)), formatPhoneNumber(memberItem.login ?? '')], [memberItem]); + const [formattedDisplayName, formattedLogin] = useMemo( + () => [formatPhoneNumber(getDisplayNameOrDefault(memberItem)), formatPhoneNumber(memberItem.login ?? '')], + [memberItem, formatPhoneNumber], + ); // s77rt add total cell, action cell and collapse/expand button diff --git a/src/components/UserDetailsTooltip/BaseUserDetailsTooltip/index.tsx b/src/components/UserDetailsTooltip/BaseUserDetailsTooltip/index.tsx index fbb6d01264d36..380149c1235d8 100644 --- a/src/components/UserDetailsTooltip/BaseUserDetailsTooltip/index.tsx +++ b/src/components/UserDetailsTooltip/BaseUserDetailsTooltip/index.tsx @@ -10,14 +10,13 @@ import useLocalize from '@hooks/useLocalize'; import useOnyx from '@hooks/useOnyx'; import useThemeStyles from '@hooks/useThemeStyles'; import {isAnonymousUser} from '@libs/actions/Session'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import {getUserDetailTooltipText} from '@libs/ReportUtils'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; function BaseUserDetailsTooltip({accountID, fallbackUserDetails, icon, delegateAccountID, shiftHorizontal, children}: UserDetailsTooltipProps) { const styles = useThemeStyles(); - const {translate} = useLocalize(); + const {translate, formatPhoneNumber} = useLocalize(); const personalDetails = usePersonalDetails(); const [session] = useOnyx(ONYXKEYS.SESSION, {canBeMissing: true}); const isCurrentUserAnonymous = session?.accountID === accountID && isAnonymousUser(session); diff --git a/src/pages/home/report/PureReportActionItem.tsx b/src/pages/home/report/PureReportActionItem.tsx index cb4af099ff569..3bd50f3bb21c3 100644 --- a/src/pages/home/report/PureReportActionItem.tsx +++ b/src/pages/home/report/PureReportActionItem.tsx @@ -51,7 +51,6 @@ import type {OnyxDataWithErrors} from '@libs/ErrorUtils'; import {getLatestErrorMessageField, isReceiptError} from '@libs/ErrorUtils'; import focusComposerWithDelay from '@libs/focusComposerWithDelay'; import {isReportMessageAttachment} from '@libs/isReportMessageAttachment'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import Navigation from '@libs/Navigation/Navigation'; import Permissions from '@libs/Permissions'; import {getDisplayNameOrDefault} from '@libs/PersonalDetailsUtils'; @@ -425,7 +424,7 @@ function PureReportActionItem({ shouldShowBorder, }: PureReportActionItemProps) { const actionSheetAwareScrollViewContext = useContext(ActionSheetAwareScrollView.ActionSheetAwareScrollViewContext); - const {translate, datetimeToCalendarTime} = useLocalize(); + const {translate, datetimeToCalendarTime, formatPhoneNumber} = useLocalize(); const {shouldUseNarrowLayout} = useResponsiveLayout(); const reportID = report?.reportID ?? action?.reportID; const theme = useTheme(); diff --git a/src/pages/media/AttachmentModalScreen/routes/ProfileAvatarModalContent.tsx b/src/pages/media/AttachmentModalScreen/routes/ProfileAvatarModalContent.tsx index ef2c2182af516..0e94e91de5ee9 100644 --- a/src/pages/media/AttachmentModalScreen/routes/ProfileAvatarModalContent.tsx +++ b/src/pages/media/AttachmentModalScreen/routes/ProfileAvatarModalContent.tsx @@ -1,7 +1,7 @@ import React, {useEffect, useMemo} from 'react'; +import useLocalize from '@hooks/useLocalize'; import useOnyx from '@hooks/useOnyx'; import {openPublicProfilePage} from '@libs/actions/PersonalDetails'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import {getDisplayNameOrDefault} from '@libs/PersonalDetailsUtils'; import {getFullSizeAvatar} from '@libs/UserUtils'; import {isValidAccountRoute} from '@libs/ValidationUtils'; @@ -13,14 +13,13 @@ import ONYXKEYS from '@src/ONYXKEYS'; function ProfileAvatarModalContent({navigation, route}: AttachmentModalScreenProps) { const {accountID = CONST.DEFAULT_NUMBER_ID} = route.params; - + const {formatPhoneNumber} = useLocalize(); const [personalDetails] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, {canBeMissing: false}); const personalDetail = personalDetails?.[accountID]; const [personalDetailsMetadata] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_METADATA, {canBeMissing: false}); const avatarURL = personalDetail?.avatar ?? ''; const displayName = getDisplayNameOrDefault(personalDetail); const [isLoadingApp = true] = useOnyx(ONYXKEYS.IS_LOADING_APP, {canBeMissing: true}); - useEffect(() => { if (!isValidAccountRoute(accountID)) { return; @@ -38,7 +37,7 @@ function ProfileAvatarModalContent({navigation, route}: AttachmentModalScreenPro shouldShowNotFoundPage: !avatarURL, maybeIcon: true, }) satisfies Partial, - [accountID, avatarURL, displayName, isLoadingApp, personalDetail, personalDetailsMetadata], + [accountID, avatarURL, displayName, isLoadingApp, personalDetail, personalDetailsMetadata, formatPhoneNumber], ); return ( diff --git a/src/pages/settings/Profile/ProfileAvatar.tsx b/src/pages/settings/Profile/ProfileAvatar.tsx index 34327a2e98b73..fbfd9b2b02f40 100644 --- a/src/pages/settings/Profile/ProfileAvatar.tsx +++ b/src/pages/settings/Profile/ProfileAvatar.tsx @@ -1,7 +1,7 @@ import React, {useEffect} from 'react'; import AttachmentModal from '@components/AttachmentModal'; +import useLocalize from '@hooks/useLocalize'; import useOnyx from '@hooks/useOnyx'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import Navigation from '@libs/Navigation/Navigation'; import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types'; import type {AuthScreensParamList} from '@libs/Navigation/types'; @@ -24,7 +24,7 @@ function ProfileAvatar({route}: ProfileAvatarProps) { const accountID = Number(route.params.accountID ?? CONST.DEFAULT_NUMBER_ID); const isLoading = personalDetailsMetadata?.[accountID]?.isLoading ?? (isLoadingApp && !Object.keys(personalDetail ?? {}).length); const displayName = getDisplayNameOrDefault(personalDetail); - + const {formatPhoneNumber} = useLocalize(); useEffect(() => { if (!isValidAccountRoute(Number(accountID)) ?? !!avatarURL) { return; diff --git a/src/pages/settings/Profile/ProfilePage.tsx b/src/pages/settings/Profile/ProfilePage.tsx index 7c4184d049913..d2b3b05d54afc 100755 --- a/src/pages/settings/Profile/ProfilePage.tsx +++ b/src/pages/settings/Profile/ProfilePage.tsx @@ -23,7 +23,6 @@ import useScrollEnabled from '@hooks/useScrollEnabled'; import useStyleUtils from '@hooks/useStyleUtils'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import Navigation from '@libs/Navigation/Navigation'; import type {PlatformStackRouteProp} from '@libs/Navigation/PlatformStackNavigation/types'; import type {SettingsSplitNavigatorParamList} from '@libs/Navigation/types'; @@ -41,7 +40,7 @@ function ProfilePage() { const theme = useTheme(); const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); - const {translate} = useLocalize(); + const {translate, formatPhoneNumber} = useLocalize(); const {shouldUseNarrowLayout} = useResponsiveLayout(); const {safeAreaPaddingBottomStyle} = useSafeAreaPaddings(); const scrollEnabled = useScrollEnabled(); @@ -50,7 +49,6 @@ function ProfilePage() { const currentUserPersonalDetails = useCurrentUserPersonalDetails(); const route = useRoute>(); const [isLoadingApp] = useOnyx(ONYXKEYS.IS_LOADING_APP, {canBeMissing: false}); - const getPronouns = (): string => { const pronounsKey = currentUserPersonalDetails?.pronouns?.replace(CONST.PRONOUNS.PREFIX, '') ?? ''; return pronounsKey ? translate(`pronouns.${pronounsKey}` as TranslationPaths) : translate('profilePage.selectYourPronouns'); diff --git a/src/pages/settings/Security/AddDelegate/ConfirmDelegatePage.tsx b/src/pages/settings/Security/AddDelegate/ConfirmDelegatePage.tsx index ec4c275a7f0ac..bdd9b735b61bc 100644 --- a/src/pages/settings/Security/AddDelegate/ConfirmDelegatePage.tsx +++ b/src/pages/settings/Security/AddDelegate/ConfirmDelegatePage.tsx @@ -12,7 +12,6 @@ import useBeforeRemove from '@hooks/useBeforeRemove'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; import useThemeStyles from '@hooks/useThemeStyles'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import {useCustomHistoryParam} from '@libs/Navigation/AppNavigator/customHistory'; import Navigation from '@libs/Navigation/Navigation'; import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types'; @@ -26,14 +25,13 @@ import DelegateMagicCodeModal from './DelegateMagicCodeModal'; type ConfirmDelegatePageProps = PlatformStackScreenProps; function ConfirmDelegatePage({route}: ConfirmDelegatePageProps) { - const {translate} = useLocalize(); + const {translate, formatPhoneNumber} = useLocalize(); const styles = useThemeStyles(); const login = route.params.login; const role = route.params.role as ValueOf; const {isOffline} = useNetwork(); const [shouldDisableModalAnimation, setShouldDisableModalAnimation] = useState(true); - const [isValidateCodeActionModalVisible, setIsValidateCodeActionModalVisible] = useCustomHistoryParam(); const [shouldShowLoading, setShouldShowLoading] = useState(isValidateCodeActionModalVisible ?? false); diff --git a/src/pages/settings/Security/SecuritySettingsPage.tsx b/src/pages/settings/Security/SecuritySettingsPage.tsx index 5765a69e6e569..3ec9239379683 100644 --- a/src/pages/settings/Security/SecuritySettingsPage.tsx +++ b/src/pages/settings/Security/SecuritySettingsPage.tsx @@ -32,7 +32,6 @@ import useWindowDimensions from '@hooks/useWindowDimensions'; import {clearDelegateErrorsByField, openSecuritySettingsPage, removeDelegate} from '@libs/actions/Delegate'; import {getLatestError} from '@libs/ErrorUtils'; import getClickedTargetLocation from '@libs/getClickedTargetLocation'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import Navigation from '@libs/Navigation/Navigation'; import {getPersonalDetailByEmail} from '@libs/PersonalDetailsUtils'; import type {AnchorPosition} from '@styles/index'; @@ -56,12 +55,11 @@ type BaseMenuItemType = { function SecuritySettingsPage() { const styles = useThemeStyles(); - const {translate} = useLocalize(); + const {translate, formatPhoneNumber} = useLocalize(); const waitForNavigate = useWaitForNavigation(); const {shouldUseNarrowLayout} = useResponsiveLayout(); const {windowWidth} = useWindowDimensions(); const personalDetails = usePersonalDetails(); - const [account] = useOnyx(ONYXKEYS.ACCOUNT, {canBeMissing: true}); const currentUserPersonalDetails = useCurrentUserPersonalDetails(); const [privateSubscription] = useOnyx(ONYXKEYS.NVP_PRIVATE_SUBSCRIPTION, {canBeMissing: true}); diff --git a/src/pages/tasks/NewTaskPage.tsx b/src/pages/tasks/NewTaskPage.tsx index 391750de3717c..3e2808292ea1a 100644 --- a/src/pages/tasks/NewTaskPage.tsx +++ b/src/pages/tasks/NewTaskPage.tsx @@ -15,7 +15,6 @@ import useSafeAreaPaddings from '@hooks/useSafeAreaPaddings'; import useThemeStyles from '@hooks/useThemeStyles'; import blurActiveElement from '@libs/Accessibility/blurActiveElement'; import {createTaskAndNavigate, dismissModalAndClearOutTaskInfo, getAssignee, getShareDestination, setShareDestinationValue} from '@libs/actions/Task'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import Navigation from '@libs/Navigation/Navigation'; import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types'; import type {NewTaskNavigatorParamList} from '@libs/Navigation/types'; @@ -34,7 +33,7 @@ function NewTaskPage({route}: NewTaskPageProps) { const [reports] = useOnyx(ONYXKEYS.COLLECTION.REPORT, {canBeMissing: true}); const [personalDetails] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, {canBeMissing: false}); const styles = useThemeStyles(); - const {translate} = useLocalize(); + const {translate, formatPhoneNumber} = useLocalize(); const assignee = useMemo(() => getAssignee(task?.assigneeAccountID ?? CONST.DEFAULT_NUMBER_ID, personalDetails), [task?.assigneeAccountID, personalDetails]); const assigneeTooltipDetails = getDisplayNamesWithTooltips(getPersonalDetailsForAccountIDs(task?.assigneeAccountID ? [task.assigneeAccountID] : [], personalDetails), false); const shareDestination = useMemo( diff --git a/src/pages/workspace/WorkspaceMembersPage.tsx b/src/pages/workspace/WorkspaceMembersPage.tsx index 3c702ec0542c9..abdc93026994d 100644 --- a/src/pages/workspace/WorkspaceMembersPage.tsx +++ b/src/pages/workspace/WorkspaceMembersPage.tsx @@ -45,7 +45,6 @@ import { } from '@libs/actions/Policy/Member'; import {removeApprovalWorkflow as removeApprovalWorkflowAction, updateApprovalWorkflow} from '@libs/actions/Workflow'; import {canUseTouchScreen} from '@libs/DeviceCapabilities'; -import {formatPhoneNumber as formatPhoneNumberUtil} from '@libs/LocalePhoneNumber'; import Log from '@libs/Log'; import Navigation from '@libs/Navigation/Navigation'; import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types'; @@ -111,7 +110,6 @@ function WorkspaceMembersPage({personalDetails, route, policy}: WorkspaceMembers const prevPersonalDetails = usePrevious(personalDetails); const {translate, formatPhoneNumber} = useLocalize(); const {isAccountLocked, showLockedAccountModal} = useContext(LockedAccountContext); - const filterEmployees = useCallback( (employee?: PolicyEmployee) => { if (!employee?.email) { @@ -165,14 +163,14 @@ function WorkspaceMembersPage({personalDetails, route, policy}: WorkspaceMembers if (!approverAccountID) { return translate('workspace.people.removeMembersPrompt', { count: selectedEmployees.length, - memberName: formatPhoneNumberUtil(getPersonalDetailsByIDs({accountIDs: selectedEmployees, currentUserAccountID}).at(0)?.displayName ?? ''), + memberName: formatPhoneNumber(getPersonalDetailsByIDs({accountIDs: selectedEmployees, currentUserAccountID}).at(0)?.displayName ?? ''), }); } return translate('workspace.people.removeMembersWarningPrompt', { memberName: getDisplayNameForParticipant({accountID: approverAccountID}), ownerName: getDisplayNameForParticipant({accountID: policy?.ownerAccountID}), }); - }, [selectedEmployees, translate, policy, currentUserAccountID]); + }, [selectedEmployees, translate, policy, currentUserAccountID, formatPhoneNumber]); /** * Get filtered personalDetails list with current employeeList */ diff --git a/src/pages/workspace/companyCards/assignCard/AssigneeStep.tsx b/src/pages/workspace/companyCards/assignCard/AssigneeStep.tsx index 42c302f98143b..23096bedd24ec 100644 --- a/src/pages/workspace/companyCards/assignCard/AssigneeStep.tsx +++ b/src/pages/workspace/companyCards/assignCard/AssigneeStep.tsx @@ -16,7 +16,6 @@ import useNetwork from '@hooks/useNetwork'; import useOnyx from '@hooks/useOnyx'; import useThemeStyles from '@hooks/useThemeStyles'; import {getDefaultCardName, getFilteredCardList, hasOnlyOneCardToAssign} from '@libs/CardUtils'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import {getHeaderMessage, getSearchValueForPhoneOrEmail, sortAlphabetically} from '@libs/OptionsListUtils'; import {getPersonalDetailByEmail} from '@libs/PersonalDetailsUtils'; import {isDeletedPolicyEmployee} from '@libs/PolicyUtils'; @@ -39,7 +38,7 @@ type AssigneeStepProps = { }; function AssigneeStep({policy, feed}: AssigneeStepProps) { - const {translate} = useLocalize(); + const {translate, formatPhoneNumber} = useLocalize(); const styles = useThemeStyles(); const {isOffline} = useNetwork(); const [assignCard] = useOnyx(ONYXKEYS.ASSIGN_CARD, {canBeMissing: true}); @@ -141,7 +140,7 @@ function AssigneeStep({policy, feed}: AssigneeStepProps) { membersList = sortAlphabetically(membersList, 'text'); return membersList; - }, [isOffline, policy?.employeeList, selectedMember]); + }, [isOffline, policy?.employeeList, selectedMember, formatPhoneNumber]); const sections = useMemo(() => { if (!debouncedSearchTerm) { diff --git a/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx b/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx index 26db8f748638d..701ce32219953 100644 --- a/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx +++ b/src/pages/workspace/expensifyCard/issueNew/AssigneeStep.tsx @@ -11,7 +11,6 @@ import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; import useOnyx from '@hooks/useOnyx'; import useThemeStyles from '@hooks/useThemeStyles'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import {getHeaderMessage, getSearchValueForPhoneOrEmail, sortAlphabetically} from '@libs/OptionsListUtils'; import {getPersonalDetailByEmail, getUserNameByEmail} from '@libs/PersonalDetailsUtils'; import {isDeletedPolicyEmployee} from '@libs/PolicyUtils'; @@ -31,7 +30,7 @@ type AssigneeStepProps = { }; function AssigneeStep({policy}: AssigneeStepProps) { - const {translate} = useLocalize(); + const {translate, formatPhoneNumber} = useLocalize(); const styles = useThemeStyles(); const {isOffline} = useNetwork(); const policyID = policy?.id; @@ -103,7 +102,7 @@ function AssigneeStep({policy}: AssigneeStepProps) { membersList = sortAlphabetically(membersList, 'text'); return membersList; - }, [isOffline, policy?.employeeList]); + }, [isOffline, policy?.employeeList, formatPhoneNumber]); const sections = useMemo(() => { if (!debouncedSearchTerm) { diff --git a/src/pages/workspace/workflows/WorkspaceWorkflowsPayerPage.tsx b/src/pages/workspace/workflows/WorkspaceWorkflowsPayerPage.tsx index 1095f4dad122b..379aef8bc4e0a 100644 --- a/src/pages/workspace/workflows/WorkspaceWorkflowsPayerPage.tsx +++ b/src/pages/workspace/workflows/WorkspaceWorkflowsPayerPage.tsx @@ -11,7 +11,6 @@ import type {ListItem, Section} from '@components/SelectionList/types'; import UserListItem from '@components/SelectionList/UserListItem'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; -import {formatPhoneNumber} from '@libs/LocalePhoneNumber'; import Log from '@libs/Log'; import Navigation from '@libs/Navigation/Navigation'; import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types'; @@ -41,7 +40,7 @@ type MemberOption = Omit & {accountID: number}; type MembersSection = SectionListData>; function WorkspaceWorkflowsPayerPage({route, policy, personalDetails, isLoadingReportData = true}: WorkspaceWorkflowsPayerPageProps) { - const {translate} = useLocalize(); + const {translate, formatPhoneNumber} = useLocalize(); const policyName = policy?.name ?? ''; const {isOffline} = useNetwork(); @@ -105,7 +104,7 @@ function WorkspaceWorkflowsPayerPage({route, policy, personalDetails, isLoadingR } }); return [policyAdminDetails, authorizedPayerDetails]; - }, [personalDetails, policy?.employeeList, translate, policy?.achAccount?.reimburser, isDeletedPolicyEmployee, policy?.owner, policy?.pendingFields?.reimburser]); + }, [personalDetails, policy?.employeeList, translate, policy?.achAccount?.reimburser, isDeletedPolicyEmployee, policy?.owner, policy?.pendingFields?.reimburser, formatPhoneNumber]); const sections: MembersSection[] = useMemo(() => { const sectionsArray: MembersSection[] = [];