Skip to content

Commit 825ddb2

Browse files
authored
Merge pull request Expensify#74175 from allgandalf/fix-66327-p-6
[Part 6]: Remove usage of Onyx.connect for ONYXKEYS.COUNTRY_CODE
2 parents 3a1237a + 552568f commit 825ddb2

16 files changed

Lines changed: 291 additions & 146 deletions

File tree

src/components/ReportActionAvatars/useReportActionAvatars.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import type {OnyxEntry} from 'react-native-onyx';
22
import type {ValueOf} from 'type-fest';
33
import {FallbackAvatar} from '@components/Icon/Expensicons';
44
import {usePersonalDetails} from '@components/OnyxListItemProvider';
5+
import useLocalize from '@hooks/useLocalize';
56
import useOnyx from '@hooks/useOnyx';
67
import usePolicy from '@hooks/usePolicy';
78
import useReportIsArchived from '@hooks/useReportIsArchived';
@@ -51,6 +52,7 @@ function useReportActionAvatars({
5152
}) {
5253
/* Get avatar type */
5354
const allPersonalDetails = usePersonalDetails();
55+
const {formatPhoneNumber} = useLocalize();
5456
const [personalDetailsFromSnapshot] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, {
5557
canBeMissing: true,
5658
});
@@ -202,7 +204,7 @@ function useReportActionAvatars({
202204
const accountID = reportPreviewSenderID || (actorAccountID ?? CONST.DEFAULT_NUMBER_ID);
203205
const {avatar, fallbackIcon, login} = personalDetails?.[delegatePersonalDetails ? delegatePersonalDetails.accountID : accountID] ?? {};
204206

205-
const defaultDisplayName = getDisplayNameForParticipant({accountID, personalDetailsData: personalDetails}) ?? '';
207+
const defaultDisplayName = getDisplayNameForParticipant({accountID, personalDetailsData: personalDetails, formatPhoneNumber}) ?? '';
206208
const invoiceReport = [iouReport, chatReport, reportChatReport].find((susReport) => isInvoiceReport(susReport) || susReport?.chatType === CONST.REPORT.TYPE.INVOICE);
207209
const isNestedInInvoiceReport = !!invoiceReport && !isChatThread(report);
208210
const isInvoiceReportActor = isAInvoiceReport && (!actorAccountID || displayAllActors || isAReportPreviewAction);

src/components/ReportActionItem/MoneyRequestReportPreview/MoneyRequestReportPreviewContent.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -138,7 +138,7 @@ function MoneyRequestReportPreviewContent({
138138
const theme = useTheme();
139139
const styles = useThemeStyles();
140140
const StyleUtils = useStyleUtils();
141-
const {translate} = useLocalize();
141+
const {translate, formatPhoneNumber} = useLocalize();
142142
const {isOffline} = useNetwork();
143143
const {areStrictPolicyRulesEnabled} = useStrictPolicyRules();
144144
const {shouldUseNarrowLayout} = useResponsiveLayout();
@@ -290,7 +290,7 @@ function MoneyRequestReportPreviewContent({
290290
} else if (isInvoiceRoom) {
291291
payerOrApproverName = getInvoicePayerName(chatReport, invoiceReceiverPolicy, invoiceReceiverPersonalDetail);
292292
} else {
293-
payerOrApproverName = getDisplayNameForParticipant({accountID: managerID, shouldUseShortForm: true});
293+
payerOrApproverName = getDisplayNameForParticipant({accountID: managerID, shouldUseShortForm: true, formatPhoneNumber});
294294
}
295295

296296
if (isApproved) {
@@ -301,7 +301,7 @@ function MoneyRequestReportPreviewContent({
301301
paymentVerb = 'iou.payerPaid';
302302
} else if (hasNonReimbursableTransactions) {
303303
paymentVerb = 'iou.payerSpent';
304-
payerOrApproverName = getDisplayNameForParticipant({accountID: chatReport?.ownerAccountID, shouldUseShortForm: true});
304+
payerOrApproverName = getDisplayNameForParticipant({accountID: chatReport?.ownerAccountID, shouldUseShortForm: true, formatPhoneNumber});
305305
}
306306
return translate(paymentVerb, {payer: payerOrApproverName});
307307
}, [
@@ -323,6 +323,7 @@ function MoneyRequestReportPreviewContent({
323323
invoiceReceiverPolicy,
324324
invoiceReceiverPersonalDetail,
325325
managerID,
326+
formatPhoneNumber,
326327
]);
327328

328329
/*

src/components/ReportActionItem/TaskView.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ type TaskViewProps = {
4444
};
4545

4646
function TaskView({report, parentReport, action}: TaskViewProps) {
47-
const {translate, localeCompare} = useLocalize();
47+
const {translate, localeCompare, formatPhoneNumber} = useLocalize();
4848
const styles = useThemeStyles();
4949
const StyleUtils = useStyleUtils();
5050
const currentUserPersonalDetails = useCurrentUserPersonalDetails();
@@ -178,7 +178,7 @@ function TaskView({report, parentReport, action}: TaskViewProps) {
178178
{report?.managerID ? (
179179
<MenuItem
180180
label={translate('task.assignee')}
181-
title={getDisplayNameForParticipant({accountID: report.managerID})}
181+
title={getDisplayNameForParticipant({accountID: report.managerID, formatPhoneNumber})}
182182
iconAccountID={report.managerID}
183183
iconType={CONST.ICON_TYPE_AVATAR}
184184
avatarSize={CONST.AVATAR_SIZE.SMALLER}

src/components/Search/SearchFiltersParticipantsSelector.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ type SearchFiltersParticipantsSelectorProps = {
4040
};
4141

4242
function SearchFiltersParticipantsSelector({initialAccountIDs, onFiltersUpdate}: SearchFiltersParticipantsSelectorProps) {
43-
const {translate} = useLocalize();
43+
const {translate, formatPhoneNumber} = useLocalize();
4444
const personalDetails = usePersonalDetails();
4545
const {didScreenTransitionEnd} = useScreenWrapperTransitionStatus();
4646
const {options, areOptionsInitialized} = useOptionsList({
@@ -127,6 +127,7 @@ function SearchFiltersParticipantsSelector({initialAccountIDs, onFiltersUpdate}:
127127
accountID: chatOptions.currentUserOption.accountID,
128128
shouldAddCurrentUserPostfix: true,
129129
personalDetailsData: personalDetails,
130+
formatPhoneNumber,
130131
});
131132
chatOptions.currentUserOption.text = formattedName;
132133

@@ -158,7 +159,7 @@ function SearchFiltersParticipantsSelector({initialAccountIDs, onFiltersUpdate}:
158159
sections: newSections,
159160
headerMessage: message,
160161
};
161-
}, [areOptionsInitialized, cleanSearchTerm, selectedOptions, chatOptions, personalDetails, reportAttributesDerived, translate]);
162+
}, [areOptionsInitialized, cleanSearchTerm, selectedOptions, chatOptions, personalDetails, reportAttributesDerived, translate, formatPhoneNumber]);
162163

163164
const resetChanges = useCallback(() => {
164165
setSelectedOptions([]);

src/components/SelectionListWithSections/Search/UserSelectionListItem.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import BaseListItem from '@components/SelectionListWithSections/BaseListItem';
99
import type {ListItem, UserSelectionListItemProps} from '@components/SelectionListWithSections/types';
1010
import TextWithTooltip from '@components/TextWithTooltip';
1111
import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails';
12+
import useLocalize from '@hooks/useLocalize';
1213
import useStyleUtils from '@hooks/useStyleUtils';
1314
import useTheme from '@hooks/useTheme';
1415
import useThemeStyles from '@hooks/useThemeStyles';
@@ -36,7 +37,7 @@ function UserSelectionListItem<TItem extends ListItem>({
3637
const theme = useTheme();
3738
const StyleUtils = useStyleUtils();
3839
const currentUserPersonalDetails = useCurrentUserPersonalDetails();
39-
40+
const {formatPhoneNumber} = useLocalize();
4041
const handleCheckboxPress = useCallback(() => {
4142
if (onCheckboxPress) {
4243
onCheckboxPress(item);
@@ -60,8 +61,9 @@ function UserSelectionListItem<TItem extends ListItem>({
6061
const userDisplayName = useMemo(() => {
6162
return getDisplayNameForParticipant({
6263
accountID: item.accountID ?? CONST.DEFAULT_NUMBER_ID,
64+
formatPhoneNumber,
6365
});
64-
}, [item.accountID]);
66+
}, [formatPhoneNumber, item.accountID]);
6567

6668
return (
6769
<BaseListItem

src/libs/NextStepUtils.ts

Lines changed: 17 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import type {Message} from '@src/types/onyx/ReportNextStepDeprecated';
1212
import type DeepValueOf from '@src/types/utils/DeepValueOf';
1313
import DateUtils from './DateUtils';
1414
import EmailUtils from './EmailUtils';
15+
import {formatPhoneNumber as formatPhoneNumberPhoneUtils} from './LocalePhoneNumber';
1516
import Permissions from './Permissions';
1617
import {getLoginsByAccountIDs, getPersonalDetailsByIDs} from './PersonalDetailsUtils';
1718
import {getApprovalWorkflow, getCorrectedAutoReportingFrequency, getReimburserAccountID} from './PolicyUtils';
@@ -76,7 +77,7 @@ Onyx.connect({
7677
});
7778

7879
function buildNextStepMessage(nextStep: ReportNextStep, translate: LocaleContextProps['translate']): string {
79-
const actor = getDisplayNameForParticipant({accountID: nextStep.actorAccountID});
80+
const actor = getDisplayNameForParticipant({accountID: nextStep.actorAccountID, formatPhoneNumber: formatPhoneNumberPhoneUtils});
8081

8182
let actorType: ValueOf<typeof CONST.NEXT_STEP.ACTOR_TYPE>;
8283
if (nextStep.actorAccountID === currentUserAccountID) {
@@ -320,7 +321,7 @@ function parseMessage(messages: Message[] | undefined) {
320321
function getNextApproverDisplayName(report: OnyxEntry<Report>, isUnapprove?: boolean) {
321322
const approverAccountID = getNextApproverAccountID(report, isUnapprove);
322323

323-
return getDisplayNameForParticipant({accountID: approverAccountID}) ?? getPersonalDetailsForAccountID(approverAccountID).login;
324+
return getDisplayNameForParticipant({accountID: approverAccountID, formatPhoneNumber: formatPhoneNumberPhoneUtils}) ?? getPersonalDetailsForAccountID(approverAccountID).login;
324325
}
325326

326327
function buildOptimisticNextStepForPreventSelfApprovalsEnabled() {
@@ -410,8 +411,12 @@ function buildNextStep(
410411
(report.unheldNonReimbursableTotal !== 0 && report.unheldNonReimbursableTotal !== undefined));
411412
const {reimbursableSpend} = getMoneyRequestSpendBreakdown(report);
412413

413-
const ownerDisplayName = ownerPersonalDetails?.displayName ?? ownerPersonalDetails?.login ?? getDisplayNameForParticipant({accountID: ownerAccountID});
414-
const policyOwnerDisplayName = policyOwnerPersonalDetails?.displayName ?? policyOwnerPersonalDetails?.login ?? getDisplayNameForParticipant({accountID: policy.ownerAccountID});
414+
const ownerDisplayName =
415+
ownerPersonalDetails?.displayName ?? ownerPersonalDetails?.login ?? getDisplayNameForParticipant({accountID: ownerAccountID, formatPhoneNumber: formatPhoneNumberPhoneUtils});
416+
const policyOwnerDisplayName =
417+
policyOwnerPersonalDetails?.displayName ??
418+
policyOwnerPersonalDetails?.login ??
419+
getDisplayNameForParticipant({accountID: policy.ownerAccountID, formatPhoneNumber: formatPhoneNumberPhoneUtils});
415420
const nextApproverDisplayName = getNextApproverDisplayName(report, isUnapprove);
416421
const approverAccountID = getNextApproverAccountID(report, isUnapprove);
417422
const approvers = getLoginsByAccountIDs([approverAccountID ?? CONST.DEFAULT_NUMBER_ID]);
@@ -720,7 +725,7 @@ function buildNextStep(
720725
} else if (reimburserAccountID === -1) {
721726
payerMessage = {text: 'an admin'};
722727
} else {
723-
payerMessage = {text: getDisplayNameForParticipant({accountID: reimburserAccountID}), type: 'strong'};
728+
payerMessage = {text: getDisplayNameForParticipant({accountID: reimburserAccountID, formatPhoneNumber: formatPhoneNumberPhoneUtils}), type: 'strong'};
724729
}
725730

726731
optimisticNextStep = {
@@ -782,8 +787,12 @@ function buildNextStepNew(params: BuildNextStepNewParams): ReportNextStepDepreca
782787
(report.unheldNonReimbursableTotal !== 0 && report.unheldNonReimbursableTotal !== undefined));
783788
const {reimbursableSpend} = getMoneyRequestSpendBreakdown(report);
784789

785-
const ownerDisplayName = ownerPersonalDetails?.displayName ?? ownerPersonalDetails?.login ?? getDisplayNameForParticipant({accountID: ownerAccountID});
786-
const policyOwnerDisplayName = policyOwnerPersonalDetails?.displayName ?? policyOwnerPersonalDetails?.login ?? getDisplayNameForParticipant({accountID: policy?.ownerAccountID});
790+
const ownerDisplayName =
791+
ownerPersonalDetails?.displayName ?? ownerPersonalDetails?.login ?? getDisplayNameForParticipant({accountID: ownerAccountID, formatPhoneNumber: formatPhoneNumberPhoneUtils});
792+
const policyOwnerDisplayName =
793+
policyOwnerPersonalDetails?.displayName ??
794+
policyOwnerPersonalDetails?.login ??
795+
getDisplayNameForParticipant({accountID: policy?.ownerAccountID, formatPhoneNumber: formatPhoneNumberPhoneUtils});
787796
const nextApproverDisplayName = getNextApproverDisplayName(report, isUnapprove);
788797
const approverAccountID = getNextApproverAccountID(report, isUnapprove);
789798
const approvers = getLoginsByAccountIDs([approverAccountID ?? CONST.DEFAULT_NUMBER_ID]);
@@ -1092,7 +1101,7 @@ function buildNextStepNew(params: BuildNextStepNewParams): ReportNextStepDepreca
10921101
} else if (reimburserAccountID === -1) {
10931102
payerMessage = {text: 'an admin'};
10941103
} else {
1095-
payerMessage = {text: getDisplayNameForParticipant({accountID: reimburserAccountID}), type: 'strong'};
1104+
payerMessage = {text: getDisplayNameForParticipant({accountID: reimburserAccountID, formatPhoneNumber: formatPhoneNumberPhoneUtils}), type: 'strong'};
10961105
}
10971106

10981107
optimisticNextStep = {

src/libs/OptionsListUtils/index.ts

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import type {LocaleContextProps} from '@components/LocaleContextProvider';
1111
import {getEnabledCategoriesCount} from '@libs/CategoryUtils';
1212
import filterArrayByMatch from '@libs/filterArrayByMatch';
1313
import {isReportMessageAttachment} from '@libs/isReportMessageAttachment';
14-
import {formatPhoneNumber} from '@libs/LocalePhoneNumber';
14+
import {formatPhoneNumber as formatPhoneNumberPhoneUtils} from '@libs/LocalePhoneNumber';
1515
// eslint-disable-next-line @typescript-eslint/no-deprecated
1616
import {translateLocal} from '@libs/Localize';
1717
import {appendCountryCode, getPhoneNumberWithoutSpecialChars} from '@libs/LoginUtils';
@@ -364,7 +364,7 @@ function getParticipantsOption(participant: OptionData | Participant, personalDe
364364
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
365365
const login = detail?.login || participant.login || '';
366366
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
367-
const displayName = participant?.displayName || formatPhoneNumber(getDisplayNameOrDefault(detail, login || participant.text));
367+
const displayName = participant?.displayName || formatPhoneNumberPhoneUtils(getDisplayNameOrDefault(detail, login || participant.text));
368368

369369
return {
370370
keyForList: String(detail?.accountID ?? login),
@@ -375,7 +375,7 @@ function getParticipantsOption(participant: OptionData | Participant, personalDe
375375
firstName: (detail?.firstName || participant.firstName) ?? '',
376376
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
377377
lastName: (detail?.lastName || participant.lastName) ?? '',
378-
alternateText: formatPhoneNumber(login) || displayName,
378+
alternateText: formatPhoneNumberPhoneUtils(login) || displayName,
379379
icons: [
380380
{
381381
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
@@ -426,7 +426,7 @@ function getLastActorDisplayName(lastActorDetails: Partial<PersonalDetails> | nu
426426

427427
return lastActorDetails.accountID !== currentUserAccountID
428428
? // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
429-
lastActorDetails.firstName || formatPhoneNumber(getDisplayNameOrDefault(lastActorDetails))
429+
lastActorDetails.firstName || formatPhoneNumberPhoneUtils(getDisplayNameOrDefault(lastActorDetails))
430430
: // eslint-disable-next-line @typescript-eslint/no-deprecated
431431
translateLocal('common.you');
432432
}
@@ -508,7 +508,7 @@ function getAlternateText(
508508

509509
return showChatPreviewLine && formattedLastMessageText
510510
? formattedLastMessageTextWithPrefix
511-
: formatPhoneNumber(option.participantsList && option.participantsList.length > 0 ? (option.participantsList.at(0)?.login ?? '') : '');
511+
: formatPhoneNumberPhoneUtils(option.participantsList && option.participantsList.length > 0 ? (option.participantsList.at(0)?.login ?? '') : '');
512512
}
513513

514514
/**
@@ -629,7 +629,7 @@ function getLastMessageTextForReport({
629629
case CONST.REPORT.ARCHIVE_REASON.POLICY_DELETED: {
630630
// eslint-disable-next-line @typescript-eslint/no-deprecated
631631
lastMessageTextFromReport = translateLocal(`reportArchiveReasons.${archiveReason}`, {
632-
displayName: formatPhoneNumber(getDisplayNameOrDefault(lastActorDetails)),
632+
displayName: formatPhoneNumberPhoneUtils(getDisplayNameOrDefault(lastActorDetails)),
633633
policyName: getPolicyName({report, policy}),
634634
});
635635
break;
@@ -915,13 +915,15 @@ function createOption(
915915
showPersonalDetails && personalDetail?.login
916916
? personalDetail.login
917917
: getAlternateText(result, {showChatPreviewLine, forcePolicyNamePreview}, !!result.private_isArchived, lastActorDetails);
918-
reportName = showPersonalDetails ? getDisplayNameForParticipant({accountID: accountIDs.at(0)}) || formatPhoneNumber(personalDetail?.login ?? '') : getReportName(report);
918+
reportName = showPersonalDetails
919+
? getDisplayNameForParticipant({accountID: accountIDs.at(0), formatPhoneNumber: formatPhoneNumberPhoneUtils}) || formatPhoneNumberPhoneUtils(personalDetail?.login ?? '')
920+
: getReportName(report);
919921
} else {
920922
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
921-
reportName = getDisplayNameForParticipant({accountID: accountIDs.at(0)}) || formatPhoneNumber(personalDetail?.login ?? '');
923+
reportName = getDisplayNameForParticipant({accountID: accountIDs.at(0), formatPhoneNumber: formatPhoneNumberPhoneUtils}) || formatPhoneNumberPhoneUtils(personalDetail?.login ?? '');
922924
result.keyForList = String(accountIDs.at(0));
923925

924-
result.alternateText = formatPhoneNumber(personalDetails?.[accountIDs[0]]?.login ?? '');
926+
result.alternateText = formatPhoneNumberPhoneUtils(personalDetails?.[accountIDs[0]]?.login ?? '');
925927
}
926928

927929
// Set core display properties that are used in SearchOption context
@@ -2228,8 +2230,8 @@ function getSearchOptions({
22282230
function getIOUConfirmationOptionsFromPayeePersonalDetail(personalDetail: OnyxEntry<PersonalDetails>, amountText?: string): PayeePersonalDetails {
22292231
const login = personalDetail?.login ?? '';
22302232
return {
2231-
text: formatPhoneNumber(getDisplayNameOrDefault(personalDetail, login)),
2232-
alternateText: formatPhoneNumber(login || getDisplayNameOrDefault(personalDetail, '', false)),
2233+
text: formatPhoneNumberPhoneUtils(getDisplayNameOrDefault(personalDetail, login)),
2234+
alternateText: formatPhoneNumberPhoneUtils(login || getDisplayNameOrDefault(personalDetail, '', false)),
22332235
icons: [
22342236
{
22352237
source: personalDetail?.avatar ?? FallbackAvatar,

0 commit comments

Comments
 (0)