Skip to content

Commit ff38b08

Browse files
authored
Merge pull request #89430 from shubham1206agra/refactor-convertToDisplayString-11
2 parents 29ddc6d + e4c61a7 commit ff38b08

9 files changed

Lines changed: 65 additions & 42 deletions

File tree

src/components/ApprovalWorkflowSection.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import {Str} from 'expensify-common';
22
import React from 'react';
33
import {View} from 'react-native';
4+
import {useCurrencyListActions} from '@hooks/useCurrencyList';
45
import {useMemoizedLazyExpensifyIcons} from '@hooks/useLazyAsset';
56
import useLocalize from '@hooks/useLocalize';
67
import usePersonalDetailsByEmail from '@hooks/usePersonalDetailsByEmail';
@@ -34,6 +35,7 @@ function ApprovalWorkflowSection({approvalWorkflow, onPress, currency = CONST.CU
3435
const styles = useThemeStyles();
3536
const theme = useTheme();
3637
const {translate, toLocaleOrdinal, localeCompare} = useLocalize();
38+
const {convertToDisplayString} = useCurrencyListActions();
3739
const {shouldUseNarrowLayout} = useResponsiveLayout();
3840
const personalDetailsByEmail = usePersonalDetailsByEmail();
3941

@@ -130,7 +132,7 @@ function ApprovalWorkflowSection({approvalWorkflow, onPress, currency = CONST.CU
130132
/>
131133
</View>
132134
}
133-
helperText={getApprovalLimitDescription({approver, currency, translate, personalDetailsByEmail})}
135+
helperText={getApprovalLimitDescription({approver, currency, translate, convertToDisplayString, personalDetailsByEmail})}
134136
helperTextStyle={styles.workflowApprovalLimitText}
135137
sentryLabel={CONST.SENTRY_LABEL.WORKSPACE.WORKFLOWS.APPROVAL_SECTION_APPROVER}
136138
/>

src/libs/MergeTransactionUtils.ts

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import ONYXKEYS from '@src/ONYXKEYS';
99
import type {MergeTransaction, Policy, Report, SearchResults, Transaction} from '@src/types/onyx';
1010
import type {Attendee} from '@src/types/onyx/IOU';
1111
import SafeString from '@src/utils/SafeString';
12-
import {convertToBackendAmount, convertToDisplayString} from './CurrencyUtils';
12+
import {convertToBackendAmount} from './CurrencyUtils';
1313
import Parser from './Parser';
1414
import {getCommaSeparatedTagNameWithSanitizedColons} from './PolicyUtils';
1515
import {constructReceiptSourceFromFilename} from './ReceiptUtils';
@@ -503,6 +503,7 @@ function getDisplayValue(
503503
transaction: Transaction,
504504
policy: Policy | undefined,
505505
translate: LocaleContextProps['translate'],
506+
convertToDisplayString: CurrencyListActionsContextType['convertToDisplayString'],
506507
localeCompare: LocaleContextProps['localeCompare'],
507508
reports?: Array<OnyxEntry<Report>>,
508509
): string {
@@ -561,6 +562,7 @@ function buildMergeFieldsData(
561562
targetTransactionPolicy: Policy | undefined,
562563
sourceTransactionPolicy: Policy | undefined,
563564
translate: LocaleContextProps['translate'],
565+
convertToDisplayString: CurrencyListActionsContextType['convertToDisplayString'],
564566
localeCompare: LocaleContextProps['localeCompare'],
565567
reports: Array<OnyxEntry<Report>> = [],
566568
): MergeFieldData[] {
@@ -576,12 +578,12 @@ function buildMergeFieldsData(
576578
const options: MergeFieldOption[] = [
577579
{
578580
transaction: targetTransaction,
579-
displayValue: getDisplayValue(field, targetTransaction, targetTransactionPolicy, translate, localeCompare, reports),
581+
displayValue: getDisplayValue(field, targetTransaction, targetTransactionPolicy, translate, convertToDisplayString, localeCompare, reports),
580582
isSelected: selectedTransactionId === targetTransaction.transactionID,
581583
},
582584
{
583585
transaction: sourceTransaction,
584-
displayValue: getDisplayValue(field, sourceTransaction, sourceTransactionPolicy, translate, localeCompare, reports),
586+
displayValue: getDisplayValue(field, sourceTransaction, sourceTransactionPolicy, translate, convertToDisplayString, localeCompare, reports),
585587
isSelected: selectedTransactionId === sourceTransaction.transactionID,
586588
},
587589
];

src/libs/WorkflowUtils.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import {Str} from 'expensify-common';
22
import type {OnyxEntry} from 'react-native-onyx';
33
import type {ValueOf} from 'type-fest';
44
import type {LocaleContextProps} from '@components/LocaleContextProvider';
5+
import type {CurrencyListActionsContextType} from '@hooks/useCurrencyList';
56
import CONST from '@src/CONST';
67
import type {BankAccountList} from '@src/types/onyx';
78
import type {ApprovalWorkflowOnyx, Approver, Member} from '@src/types/onyx/ApprovalWorkflow';
@@ -12,7 +13,6 @@ import type Policy from '@src/types/onyx/Policy';
1213
import type PolicyEmployee from '@src/types/onyx/PolicyEmployee';
1314
import type {PolicyEmployeeList} from '@src/types/onyx/PolicyEmployee';
1415
import {isBankAccountPartiallySetup} from './BankAccountUtils';
15-
import {convertToDisplayString} from './CurrencyUtils';
1616
import {getDefaultApprover, isExpensifyTeam, shouldFilterExpensifyTeam} from './PolicyUtils';
1717

1818
const INITIAL_APPROVAL_WORKFLOW: ApprovalWorkflowOnyx = {
@@ -627,13 +627,14 @@ type GetApprovalLimitDescriptionParams = {
627627
approver: Approver | undefined;
628628
currency: string;
629629
translate: LocaleContextProps['translate'];
630+
convertToDisplayString: CurrencyListActionsContextType['convertToDisplayString'];
630631
personalDetailsByEmail: PersonalDetailsList | undefined;
631632
};
632633

633634
/**
634635
* Get the approval limit description for an approver (e.g., "Reports above $1,000 forward to John Doe")
635636
*/
636-
function getApprovalLimitDescription({approver, currency, translate, personalDetailsByEmail}: GetApprovalLimitDescriptionParams): string | undefined {
637+
function getApprovalLimitDescription({approver, currency, translate, convertToDisplayString, personalDetailsByEmail}: GetApprovalLimitDescriptionParams): string | undefined {
637638
if (approver?.approvalLimit == null || !approver?.overLimitForwardsTo) {
638639
return undefined;
639640
}

src/libs/WorkspacesSettingsUtils.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
import type {OnyxEntry} from 'react-native-onyx';
22
import type {ValueOf} from 'type-fest';
33
import type {LocaleContextProps} from '@components/LocaleContextProvider';
4+
import type {CurrencyListActionsContextType} from '@hooks/useCurrencyList';
45
import CONST from '@src/CONST';
56
import type {TranslationPaths} from '@src/languages/types';
67
import type {Policy, ReportAttributesDerivedValue} from '@src/types/onyx';
78
import type {CompanyAddress, Unit} from '@src/types/onyx/Policy';
8-
import {convertToDisplayString} from './CurrencyUtils';
99

1010
type BrickRoad = ValueOf<typeof CONST.BRICK_ROAD_INDICATOR_STATUS> | undefined;
1111

@@ -82,6 +82,7 @@ function getUnitTranslationKey(unit: Unit): TranslationPaths {
8282
function getOwnershipChecksDisplayText(
8383
error: ValueOf<typeof CONST.POLICY.OWNERSHIP_ERRORS>,
8484
translate: LocaleContextProps['translate'],
85+
convertToDisplayString: CurrencyListActionsContextType['convertToDisplayString'],
8586
policy: OnyxEntry<Policy>,
8687
accountLogin: string | undefined,
8788
) {

src/pages/TransactionMerge/DetailsReviewPage.tsx

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ type DetailsReviewPageProps = PlatformStackScreenProps<MergeTransactionNavigator
4343
function DetailsReviewPage({route}: DetailsReviewPageProps) {
4444
const {translate, localeCompare} = useLocalize();
4545
const styles = useThemeStyles();
46-
const {getCurrencyDecimals} = useCurrencyListActions();
46+
const {getCurrencyDecimals, convertToDisplayString} = useCurrencyListActions();
4747
const {transactionID, isOnSearch, backTo} = route.params;
4848

4949
const [mergeTransaction, mergeTransactionMetadata] = useOnyx(`${ONYXKEYS.COLLECTION.MERGE_TRANSACTION}${getNonEmptyStringOnyxID(transactionID)}`);
@@ -150,10 +150,18 @@ function DetailsReviewPage({route}: DetailsReviewPageProps) {
150150
// Build merge fields array with all necessary information
151151
const mergeFields = useMemo(
152152
() =>
153-
buildMergeFieldsData(conflictFields, targetTransaction, sourceTransaction, mergeTransaction, targetTransactionPolicy, sourceTransactionPolicy, translate, localeCompare, [
154-
targetTransactionReport,
155-
sourceTransactionReport,
156-
]),
153+
buildMergeFieldsData(
154+
conflictFields,
155+
targetTransaction,
156+
sourceTransaction,
157+
mergeTransaction,
158+
targetTransactionPolicy,
159+
sourceTransactionPolicy,
160+
translate,
161+
convertToDisplayString,
162+
localeCompare,
163+
[targetTransactionReport, sourceTransactionReport],
164+
),
157165
[
158166
conflictFields,
159167
targetTransaction,
@@ -164,6 +172,7 @@ function DetailsReviewPage({route}: DetailsReviewPageProps) {
164172
targetTransactionPolicy,
165173
sourceTransactionPolicy,
166174
translate,
175+
convertToDisplayString,
167176
localeCompare,
168177
],
169178
);

src/pages/workspace/members/WorkspaceOwnerChangeCheck.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import type {ValueOf} from 'type-fest';
55
import Button from '@components/Button';
66
import {usePersonalDetails} from '@components/OnyxListItemProvider';
77
import Text from '@components/Text';
8+
import {useCurrencyListActions} from '@hooks/useCurrencyList';
89
import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails';
910
import useLocalize from '@hooks/useLocalize';
1011
import useThemeStyles from '@hooks/useThemeStyles';
@@ -29,6 +30,7 @@ type WorkspaceOwnerChangeCheckProps = {
2930
function WorkspaceOwnerChangeCheck({policy, accountID, error}: WorkspaceOwnerChangeCheckProps) {
3031
const styles = useThemeStyles();
3132
const {translate} = useLocalize();
33+
const {convertToDisplayString} = useCurrencyListActions();
3234
const currentUserPersonalDetails = useCurrentUserPersonalDetails();
3335
const [displayTexts, setDisplayTexts] = useState({
3436
title: '',
@@ -46,9 +48,9 @@ function WorkspaceOwnerChangeCheck({policy, accountID, error}: WorkspaceOwnerCha
4648
return;
4749
}
4850

49-
const texts = getOwnershipChecksDisplayText(error, translate, policy, userPersonalDetails?.login);
51+
const texts = getOwnershipChecksDisplayText(error, translate, convertToDisplayString, policy, userPersonalDetails?.login);
5052
setDisplayTexts(texts);
51-
}, [error, userPersonalDetails?.login, policy, translate]);
53+
}, [error, userPersonalDetails?.login, policy, translate, convertToDisplayString]);
5254

5355
useEffect(() => {
5456
updateDisplayTexts();

src/pages/workspace/workflows/approvals/ApprovalWorkflowEditor.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import ScrollView from '@components/ScrollView';
1212
import Text from '@components/Text';
1313
import UserPill from '@components/UserPill';
1414
import UserPills from '@components/UserPills';
15+
import {useCurrencyListActions} from '@hooks/useCurrencyList';
1516
import {useMemoizedLazyExpensifyIcons} from '@hooks/useLazyAsset';
1617
import useLocalize from '@hooks/useLocalize';
1718
import usePersonalDetailsByEmail from '@hooks/usePersonalDetailsByEmail';
@@ -47,6 +48,7 @@ function ApprovalWorkflowEditor({approvalWorkflow, removeApprovalWorkflow, polic
4748
const icons = useMemoizedLazyExpensifyIcons(['Trashcan']);
4849
const styles = useThemeStyles();
4950
const {translate, toLocaleOrdinal, localeCompare} = useLocalize();
51+
const {convertToDisplayString} = useCurrencyListActions();
5052
const personalDetailsByEmail = usePersonalDetailsByEmail();
5153
const approverCount = approvalWorkflow.approvers.length;
5254
const currency = policy?.outputCurrency ?? CONST.CURRENCY.USD;
@@ -173,7 +175,7 @@ function ApprovalWorkflowEditor({approvalWorkflow, removeApprovalWorkflow, polic
173175
{approvalWorkflow.approvers.map((approver, approverIndex) => {
174176
const errorText = approverErrorMessage(approver, approverIndex);
175177
const isApproverInMultipleWorkflows = !errorText && approvalWorkflow.usedApproverEmails.some((approverEmail) => approverEmail === approver?.email);
176-
const limitDescription = getApprovalLimitDescription({approver, currency, translate, personalDetailsByEmail});
178+
const limitDescription = getApprovalLimitDescription({approver, currency, translate, convertToDisplayString, personalDetailsByEmail});
177179
const hintText = [isApproverInMultipleWorkflows ? translate('workflowsPage.approverInMultipleWorkflows') : undefined, limitDescription].filter(Boolean).join('\n');
178180

179181
return (

tests/unit/MergeTransactionUtilsTest.ts

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import Onyx from 'react-native-onyx';
2+
import {convertToDisplayString} from '@libs/CurrencyUtils';
23
import {
34
areTransactionsEligibleForMerge,
45
buildMergedTransactionData,
@@ -825,7 +826,7 @@ describe('MergeTransactionUtils', () => {
825826
};
826827

827828
// When we get display value for merchant
828-
const result = getDisplayValue('merchant', transaction, undefined, translateLocal, mockLocaleCompare);
829+
const result = getDisplayValue('merchant', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
829830

830831
// Then it should return empty string
831832
expect(result).toBe('');
@@ -840,8 +841,8 @@ describe('MergeTransactionUtils', () => {
840841
};
841842

842843
// When we get display values for boolean fields
843-
const reimbursableResult = getDisplayValue('reimbursable', transaction, undefined, translateLocal, mockLocaleCompare);
844-
const billableResult = getDisplayValue('billable', transaction, undefined, translateLocal, mockLocaleCompare);
844+
const reimbursableResult = getDisplayValue('reimbursable', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
845+
const billableResult = getDisplayValue('billable', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
845846

846847
// Then it should return translated Yes/No values
847848
expect(reimbursableResult).toBe('common.yes');
@@ -857,7 +858,7 @@ describe('MergeTransactionUtils', () => {
857858
};
858859

859860
// When we get display value for amount
860-
const result = getDisplayValue('amount', transaction, undefined, translateLocal, mockLocaleCompare);
861+
const result = getDisplayValue('amount', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
861862

862863
// Then it should return formatted currency string
863864
expect(result).toBe('$10.00');
@@ -873,7 +874,7 @@ describe('MergeTransactionUtils', () => {
873874
};
874875

875876
// When we get display value for description
876-
const result = getDisplayValue('description', transaction, undefined, translateLocal, mockLocaleCompare);
877+
const result = getDisplayValue('description', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
877878

878879
// Then it should return cleaned text without HTML and with spaces instead of line breaks
879880
expect(result).toBe('This is a test description with line breaks and more text');
@@ -887,7 +888,7 @@ describe('MergeTransactionUtils', () => {
887888
};
888889

889890
// When we get display value for tag
890-
const result = getDisplayValue('tag', transaction, undefined, translateLocal, mockLocaleCompare);
891+
const result = getDisplayValue('tag', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
891892

892893
// Then it should return sanitized tag names separated by commas
893894
expect(result).toBe('Department, Engineering, Frontend');
@@ -904,7 +905,7 @@ describe('MergeTransactionUtils', () => {
904905
],
905906
},
906907
};
907-
const result = getDisplayValue('attendees', transaction, undefined, translateLocal, mockLocaleCompare);
908+
const result = getDisplayValue('attendees', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
908909

909910
expect(result).toBe('Test User 1, Test User 2');
910911
});
@@ -919,8 +920,8 @@ describe('MergeTransactionUtils', () => {
919920
};
920921

921922
// When we get display values for string fields
922-
const merchantResult = getDisplayValue('merchant', transaction, undefined, translateLocal, mockLocaleCompare);
923-
const categoryResult = getDisplayValue('category', transaction, undefined, translateLocal, mockLocaleCompare);
923+
const merchantResult = getDisplayValue('merchant', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
924+
const categoryResult = getDisplayValue('category', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
924925

925926
// Then it should return the string values
926927
expect(merchantResult).toBe('Starbucks Coffee');
@@ -935,7 +936,7 @@ describe('MergeTransactionUtils', () => {
935936
};
936937

937938
// When we get display value for reportID
938-
const result = getDisplayValue('reportID', transaction, undefined, translateLocal, mockLocaleCompare);
939+
const result = getDisplayValue('reportID', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
939940

940941
// Then it should return translated "None"
941942
expect(result).toBe('common.none');
@@ -950,7 +951,7 @@ describe('MergeTransactionUtils', () => {
950951
};
951952

952953
// When we get display value for reportID
953-
const result = getDisplayValue('reportID', transaction, undefined, translateLocal, mockLocaleCompare);
954+
const result = getDisplayValue('reportID', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
954955

955956
// Then it should return the reportName
956957
expect(result).toBe('Test Report Name');
@@ -976,7 +977,7 @@ describe('MergeTransactionUtils', () => {
976977
};
977978

978979
// When we get display value for reportID
979-
const result = getDisplayValue('reportID', transaction, undefined, translateLocal, mockLocaleCompare);
980+
const result = getDisplayValue('reportID', transaction, undefined, translateLocal, convertToDisplayString, mockLocaleCompare);
980981

981982
// Then it should return the report's name from Onyx
982983
expect(result).toBe(report.reportName);

0 commit comments

Comments
 (0)