[Part 29] Remove Onyx.connect from LocalePhoneNumber

src/components/AvatarWithDisplayName.tsx

@@ -213,7 +213,7 @@ function AvatarWithDisplayName({
     const title = getReportName(report, getReportNameFromNames(derivedReportNames, report?.reportID));
     const isParentReportArchived = useReportIsArchived(report?.parentReportID);
     const subtitle = getChatRoomSubtitle(report, policy, conciergeReportID, translate, true, isReportArchived);
-    const parentNavigationSubtitleData = getParentNavigationSubtitle(report, policy, conciergeReportID, translate, derivedParentReportName, isParentReportArchived);
+    const parentNavigationSubtitleData = getParentNavigationSubtitle(report, policy, conciergeReportID, translate, formatPhoneNumber, derivedParentReportName, isParentReportArchived);
     const isMoneyRequestOrReport = isMoneyRequestReport(report) || isMoneyRequest(report) || isTrackExpenseReport(report) || isInvoiceReport(report);
     const ownerPersonalDetails = getPersonalDetailsForAccountIDs(report?.ownerAccountID ? [report.ownerAccountID] : [], personalDetails);
     const displayNamesWithTooltips = getDisplayNamesWithTooltips(Object.values(ownerPersonalDetails), false, localeCompare, formatPhoneNumber, translate);

src/components/KYCWall/BaseKYCWall.tsx

@@ -88,7 +88,7 @@ function KYCWall({
     );
     const [doesSubmitterPersonalDetailExist] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, {selector: doesSubmitterPersonalDetailExistSelector});
 
-    const {translate} = useLocalize();
+    const {translate, formatPhoneNumber} = useLocalize();
     const {getCurrencyDecimals} = useCurrencyListActions();
     const currentUserDetails = useCurrentUserPersonalDetails();
     const currentUserAccountID = currentUserDetails.accountID;
@@ -222,6 +222,7 @@ function KYCWall({
                             reportActionsList: filteredReportActions,
                             doesEmployeePersonalDetailExist: doesSubmitterPersonalDetailExist ?? false,
                             getCurrencyDecimals,
+                            formatPhoneNumber,
                         }) ?? {};
                     if (policyID && iouReport?.policyID) {
                         savePreferredPaymentMethod(iouReport.policyID, policyID, CONST.LAST_PAYMENT_METHOD.IOU, lastPaymentMethod?.[iouReport?.policyID]);
@@ -290,6 +291,7 @@ function KYCWall({
             conciergeChat,
             localCurrency,
             getCurrencyDecimals,
+            formatPhoneNumber,
         ],
     );
 

src/components/MoneyReportHeaderActions/MoneyReportHeaderSecondaryActions.tsx

@@ -98,7 +98,7 @@ function MoneyReportHeaderSecondaryActionsInner({reportID, primaryAction, isRepo
     const {isPaidAnimationRunning, isApprovedAnimationRunning, startAnimation, startApprovedAnimation, startSubmittingAnimation} = usePaymentAnimationsContext();
     const {openHoldMenu, openPDFDownload, openHoldEducational, openRejectModal} = useMoneyReportHeaderModals();
 
-    const {translate, localeCompare} = useLocalize();
+    const {translate, localeCompare, formatPhoneNumber} = useLocalize();
     const isInSidePanel = useIsInSidePanel();
     const kycWallRef = useContext(KYCWallContext);
 
@@ -219,6 +219,7 @@ function MoneyReportHeaderSecondaryActionsInner({reportID, primaryAction, isRepo
                 chatReportActions: getChatReportActions(payAsBusiness),
                 delegateAccountID,
                 isTrackIntentUser,
+                formatPhoneNumber,
             });
         } else {
             startAnimation();
@@ -246,6 +247,7 @@ function MoneyReportHeaderSecondaryActionsInner({reportID, primaryAction, isRepo
                 delegateAccountID,
                 isTrackIntentUser,
                 conciergeChat,
+                formatPhoneNumber,
             });
             if (currentSearchQueryJSON && !isOffline) {
                 search({
@@ -433,6 +435,7 @@ function MoneyReportHeaderSecondaryActionsInner({reportID, primaryAction, isRepo
         const runPaymentSelection = () =>
             selectPaymentType({
                 getCurrencyDecimals,
+                formatPhoneNumber,
                 event,
                 iouPaymentType,
                 triggerKYCFlow,

src/components/MoneyReportHeaderPrimaryAction/PayPrimaryAction.tsx

@@ -49,7 +49,7 @@ type PayPrimaryActionProps = {
 function PayPrimaryAction({reportID, chatReportID}: PayPrimaryActionProps) {
     const {isPaidAnimationRunning, isApprovedAnimationRunning, stopAnimation, startAnimation, startApprovedAnimation} = usePaymentAnimationsContext();
     const {isOffline} = useNetwork();
-    const {translate} = useLocalize();
+    const {translate, formatPhoneNumber} = useLocalize();
     const {accountID, email, login: currentUserLogin, localCurrencyCode} = useCurrentUserPersonalDetails();
     const delegateAccountID = useDelegateAccountID();
     const {isDelegateAccessRestricted} = useDelegateNoAccessState();
@@ -164,6 +164,7 @@ function PayPrimaryAction({reportID, chatReportID}: PayPrimaryActionProps) {
                 chatReportActions: getChatReportActions(payAsBusiness),
                 delegateAccountID,
                 isTrackIntentUser,
+                formatPhoneNumber,
             });
         } else {
             startAnimation();
@@ -189,6 +190,7 @@ function PayPrimaryAction({reportID, chatReportID}: PayPrimaryActionProps) {
                 delegateAccountID,
                 isTrackIntentUser,
                 conciergeChat,
+                formatPhoneNumber,
             });
             if (currentSearchQueryJSON && !isOffline) {
                 search({

src/components/MoneyReportHeaderPrimaryAction/SubmitPrimaryAction.tsx

@@ -69,7 +69,7 @@ function SubmitPrimaryAction({reportID}: SubmitPrimaryActionProps) {
 
 function SubmitPrimaryActionContent({reportID}: SubmitPrimaryActionProps) {
     const {isSubmittingAnimationRunning, stopAnimation, startSubmittingAnimation} = usePaymentAnimationsContext();
-    const {translate} = useLocalize();
+    const {translate, formatPhoneNumber} = useLocalize();
     const {getCurrencyDecimals} = useCurrencyListActions();
     const {isOffline} = useNetwork();
     const {accountID, email} = useCurrentUserPersonalDetails();
@@ -195,6 +195,7 @@ function SubmitPrimaryActionContent({reportID}: SubmitPrimaryActionProps) {
                 // Submit via PDF submits the report to the submitter (self); the backend keys off this to generate the PDF.
                 managerEmail: shouldExportToPDF ? email : undefined,
                 isTrackIntentUser,
+                formatPhoneNumber,
             });
             if (currentSearchQueryJSON && !isOffline) {
                 search({

src/components/MoneyReportHeaderPrimaryAction/useConfirmApproval.ts

@@ -4,6 +4,7 @@ import {useMoneyReportHeaderModals} from '@components/MoneyReportHeaderModalsCon
 import {useCurrencyListActions} from '@hooks/useCurrencyList';
 import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails';
 import useDelegateAccountID from '@hooks/useDelegateAccountID';
+import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import usePermissions from '@hooks/usePermissions';
 import useTransactionsAndViolationsForReport from '@hooks/useTransactionsAndViolationsForReport';
@@ -25,6 +26,7 @@ function useConfirmApproval(reportID: string | undefined, startApprovedAnimation
     const {accountID, email} = useCurrentUserPersonalDetails();
     const {getCurrencyDecimals} = useCurrencyListActions();
     const {isBetaEnabled} = usePermissions();
+    const {formatPhoneNumber} = useLocalize();
     const {isDelegateAccessRestricted} = useDelegateNoAccessState();
     const {showDelegateNoAccessModal} = useDelegateNoAccessActions();
     const {openHoldMenu} = useMoneyReportHeaderModals();
@@ -76,6 +78,7 @@ function useConfirmApproval(reportID: string | undefined, startApprovedAnimation
                 delegateEmail,
                 delegateAccountID,
                 isTrackIntentUser,
+                formatPhoneNumber,
             });
         }
     };

src/components/Navigation/QuickCreationActionsBar/index.tsx

@@ -41,7 +41,7 @@ import {View} from 'react-native';
 
 function QuickCreationActionsBar() {
     const styles = useThemeStyles();
-    const {translate} = useLocalize();
+    const {translate, formatPhoneNumber} = useLocalize();
     const icons = useMemoizedLazyExpensifyIcons(['ReceiptPlus', 'DocumentPlus', 'LocationAdd', 'LuggageWithLinesPlus']);
 
     const [session] = useOnyx(ONYXKEYS.SESSION);
@@ -99,25 +99,27 @@ function QuickCreationActionsBar() {
                 return;
             }
 
-            const {reportID: createdReportID} = createNewReport(
-                currentUserPersonalDetails,
-                hasViolations,
+            const {reportID: createdReportID} = createNewReport({
+                ownerPersonalDetails: currentUserPersonalDetails,
+                hasViolationsParam: hasViolations,
                 isASAPSubmitBetaEnabled,
-                defaultChatEnabledPolicy,
-                allBetas,
+                policy: defaultChatEnabledPolicy,
+                betas: allBetas,
                 isTrackIntentUser,
                 getCurrencyDecimals,
-                false,
+                shouldNotifyNewAction: false,
+                formatPhoneNumber,
                 shouldDismissEmptyReportsConfirmation,
-            );
+                options: {},
+            });
             // Navigate to the Reports page first so getCreateReportRoute() resolves against
             // the Search/Reports fullscreen context before opening the created report modal.
             Navigation.navigate(getReportsRootRoute());
             Navigation.setNavigationActionToMicrotaskQueue(() => {
                 Navigation.navigate(getCreateReportRoute({reportID: createdReportID}));
             });
         },
-        [currentUserPersonalDetails, hasViolations, defaultChatEnabledPolicy, isASAPSubmitBetaEnabled, allBetas, isTrackIntentUser, getCurrencyDecimals],
+        [currentUserPersonalDetails, hasViolations, defaultChatEnabledPolicy, isASAPSubmitBetaEnabled, allBetas, isTrackIntentUser, getCurrencyDecimals, formatPhoneNumber],
     );
 
     const {openCreateReportConfirmation} = useCreateEmptyReportConfirmation({

src/components/ReportActionItem/MoneyRequestReportPreview/PayActionButton.tsx

@@ -47,7 +47,7 @@ import useReportPreviewActionButtonData from './useReportPreviewActionButtonData
 
 function PayActionButton() {
     const {isOffline} = useNetwork();
-    const {translate} = useLocalize();
+    const {translate, formatPhoneNumber} = useLocalize();
     const currentUserDetails = useCurrentUserPersonalDetails();
     const currentUserAccountID = currentUserDetails.accountID;
     const currentUserEmail = currentUserDetails.email ?? '';
@@ -122,6 +122,7 @@ function PayActionButton() {
                     chatReportActions: getChatReportActions(payAsBusiness),
                     delegateAccountID,
                     isTrackIntentUser,
+                    formatPhoneNumber,
                 });
             } else {
                 payMoneyRequest({
@@ -146,6 +147,7 @@ function PayActionButton() {
                     delegateAccountID,
                     isTrackIntentUser,
                     conciergeChat,
+                    formatPhoneNumber,
                 });
             }
         }

src/components/ReportActionItem/MoneyRequestReportPreview/SubmitActionButton.tsx

@@ -50,7 +50,7 @@ function SubmitActionButton() {
 }
 
 function SubmitActionButtonContent() {
-    const {translate} = useLocalize();
+    const {translate, formatPhoneNumber} = useLocalize();
     const {getCurrencyDecimals} = useCurrencyListActions();
     const {showConfirmModal} = useConfirmModal();
     const currentUserDetails = useCurrentUserPersonalDetails();
@@ -132,6 +132,7 @@ function SubmitActionButtonContent() {
                 delegateAccountID,
                 submitterLogin,
                 isTrackIntentUser,
+                formatPhoneNumber,
             });
         });
     };

src/components/ReportActionItem/MoneyRequestReportPreview/useConfirmApproveReportAction.ts

@@ -6,6 +6,7 @@ import {useDelegateNoAccessActions, useDelegateNoAccessState} from '@components/
 
 import {useCurrencyListActions} from '@hooks/useCurrencyList';
 import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails';
+import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import usePermissions from '@hooks/usePermissions';
 
@@ -26,6 +27,7 @@ import {useReportPreviewActions, useReportPreviewActionState} from './MoneyReque
 function useConfirmApproveReportAction(actionButtonData: ReturnType<typeof useReportPreviewActionButtonData>, transactions: Transaction[], hasViolations: boolean) {
     const currentUserDetails = useCurrentUserPersonalDetails();
     const {getCurrencyDecimals} = useCurrencyListActions();
+    const {formatPhoneNumber} = useLocalize();
     const {isBetaEnabled} = usePermissions();
     const {isDelegateAccessRestricted} = useDelegateNoAccessState();
     const {showDelegateNoAccessModal} = useDelegateNoAccessActions();
@@ -60,6 +62,7 @@ function useConfirmApproveReportAction(actionButtonData: ReturnType<typeof useRe
                 delegateEmail,
                 delegateAccountID,
                 isTrackIntentUser,
+                formatPhoneNumber,
             });
         }
     };

src/components/Search/SearchList/ListItem/ActionCell/PayActionCell.tsx

@@ -4,6 +4,7 @@ import SettlementButton from '@components/SettlementButton';
 import type {PaymentActionParams} from '@components/SettlementButton/types';
 
 import {useCurrencyListActions} from '@hooks/useCurrencyList';
+import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
 import useOnyx from '@hooks/useOnyx';
 import {getParticipantsInvoiceReport} from '@hooks/useParticipantsInvoiceReport';
@@ -41,6 +42,7 @@ type PayActionCellProps = {
 
 function PayActionCell({isLoading, policyID, reportID, hash, amount, shouldDisablePointerEvents, chatReport}: PayActionCellProps) {
     const styles = useThemeStyles();
+    const {formatPhoneNumber} = useLocalize();
     const {getCurrencyDecimals, convertToDisplayString} = useCurrencyListActions();
     const {isOffline} = useNetwork();
     const {isDelegateAccessRestricted} = useDelegateNoAccessState();
@@ -143,6 +145,7 @@ function PayActionCell({isLoading, policyID, reportID, hash, amount, shouldDisab
                 chatReportActions,
                 delegateAccountID,
                 isTrackIntentUser,
+                formatPhoneNumber,
             });
             return;
         }
@@ -180,6 +183,7 @@ function PayActionCell({isLoading, policyID, reportID, hash, amount, shouldDisab
             delegateAccountID,
             isTrackIntentUser,
             conciergeChat,
+            formatPhoneNumber,
         });
     };
 

src/components/Search/SearchList/ListItem/ExpenseReportListItem.tsx

@@ -106,7 +106,7 @@ function ExpenseReportListItemInner<TItem extends ListItem>({
      * by its own key only while it has none.
      */
     const {isSelectAllChecked: isSelected, isIndeterminate} = useGroupCheckboxState({groupKey: item.keyForList, groupTransactions: reportItem.transactions ?? []});
-    const {translate, dateFnsLocale} = useLocalize();
+    const {translate, dateFnsLocale, formatPhoneNumber} = useLocalize();
     const {getCurrencyDecimals, convertToDisplayString} = useCurrencyListActions();
     const {isLargeScreenWidth} = useResponsiveLayout();
     const {currentSearchHash, currentSearchKey} = useSearchQueryContext();
@@ -306,6 +306,7 @@ function ExpenseReportListItemInner<TItem extends ListItem>({
             // every row on unrelated violation changes.
             allViolations: liveViolationsForSnapshotTransactions,
             conciergeChat,
+            formatPhoneNumber,
         });
     }, [
         currentSearchHash,
@@ -349,6 +350,7 @@ function ExpenseReportListItemInner<TItem extends ListItem>({
         isTrackIntentUser,
         liveViolationsForSnapshotTransactions,
         conciergeChat,
+        formatPhoneNumber,
     ]);
 
     const handleSelectionButtonPress = useCallback(() => {

src/components/Search/SearchList/ListItem/ReportListItemHeader.tsx

@@ -292,7 +292,7 @@ function ReportListItemHeaderInner<TItem extends ListItem>({
         });
     const {isDelegateAccessRestricted} = useDelegateNoAccessState();
     const {showDelegateNoAccessModal} = useDelegateNoAccessActions();
-    const {translate} = useLocalize();
+    const {translate, formatPhoneNumber} = useLocalize();
     const {getCurrencyDecimals} = useCurrencyListActions();
     const {showConfirmModal} = useConfirmModal();
     const {isSelected} = useRowSelection(reportItem.keyForList);
@@ -340,6 +340,7 @@ function ReportListItemHeaderInner<TItem extends ListItem>({
             isTrackIntentUser,
             allViolations,
             conciergeChat,
+            formatPhoneNumber,
         });
     };
     return !isLargeScreenWidth ? (

src/components/Search/SearchList/ListItem/TransactionListItem/index.tsx

@@ -201,7 +201,7 @@ function TransactionListItemInner<TItem extends ListItem>({
 
     const {isDelegateAccessRestricted} = useDelegateNoAccessState();
     const {showDelegateNoAccessModal} = useDelegateNoAccessActions();
-    const {translate} = useLocalize();
+    const {translate, formatPhoneNumber} = useLocalize();
     const {getCurrencyDecimals} = useCurrencyListActions();
     const {showConfirmModal} = useConfirmModal();
     const openReportSubmitToPopover = useOpenReportSubmitToPopover();
@@ -246,6 +246,7 @@ function TransactionListItemInner<TItem extends ListItem>({
             isTrackIntentUser,
             allViolations,
             conciergeChat,
+            formatPhoneNumber,
         });
     };
 

src/components/Search/SearchPageHeader/SearchActionsBarCreateButton.tsx

@@ -40,7 +40,7 @@ import {View} from 'react-native';
 
 function SearchActionsBarCreateButton() {
     const styles = useThemeStyles();
-    const {translate} = useLocalize();
+    const {translate, formatPhoneNumber} = useLocalize();
     const expensifyIcons = useMemoizedLazyExpensifyIcons(['Plus', 'Location', 'Document', 'Receipt', 'Coins', 'Cash', 'Transfer', 'MoneyCircle']);
 
     const createButtonRef = useRef<View>(null);
@@ -82,17 +82,19 @@ function SearchActionsBarCreateButton() {
                 return;
             }
 
-            const {reportID: createdReportID} = createNewReport(
-                currentUserPersonalDetails,
-                hasViolations,
+            const {reportID: createdReportID} = createNewReport({
+                ownerPersonalDetails: currentUserPersonalDetails,
+                hasViolationsParam: hasViolations,
                 isASAPSubmitBetaEnabled,
-                defaultChatEnabledPolicy,
-                allBetas,
+                policy: defaultChatEnabledPolicy,
+                betas: allBetas,
                 isTrackIntentUser,
                 getCurrencyDecimals,
-                false,
+                shouldNotifyNewAction: false,
+                formatPhoneNumber,
                 shouldDismissEmptyReportsConfirmation,
-            );
+                options: {},
+            });
             Navigation.setNavigationActionToMicrotaskQueue(() => {
                 Navigation.navigate(
                     isSearchTopmostFullScreenRoute()
@@ -101,7 +103,7 @@ function SearchActionsBarCreateButton() {
                 );
             });
         },
-        [currentUserPersonalDetails, hasViolations, defaultChatEnabledPolicy, isASAPSubmitBetaEnabled, allBetas, isTrackIntentUser, getCurrencyDecimals],
+        [currentUserPersonalDetails, hasViolations, defaultChatEnabledPolicy, isASAPSubmitBetaEnabled, allBetas, isTrackIntentUser, getCurrencyDecimals, formatPhoneNumber],
     );
 
     const {openCreateReportConfirmation} = useCreateEmptyReportConfirmation({