Skip to content

Commit a91f433

Browse files
authored
Merge pull request Expensify#65644 from Pujan92/fix/63635-onyx-lift-money-view
Fix/63635 onyx lift money report view
2 parents 667cbc9 + f2d2da9 commit a91f433

5 files changed

Lines changed: 44 additions & 13 deletions

File tree

src/components/OnyxProvider.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@ const [PreferredThemeProvider, PreferredThemeContext] = createOnyxContext(ONYXKE
1313
const [FrequentlyUsedEmojisProvider, , useFrequentlyUsedEmojis] = createOnyxContext(ONYXKEYS.FREQUENTLY_USED_EMOJIS);
1414
const [PreferredEmojiSkinToneProvider, PreferredEmojiSkinToneContext] = createOnyxContext(ONYXKEYS.PREFERRED_EMOJI_SKIN_TONE);
1515
const [SessionProvider, , useSession] = createOnyxContext(ONYXKEYS.SESSION);
16+
const [PolicyCategoriesProvider, , usePolicyCategories] = createOnyxContext(ONYXKEYS.COLLECTION.POLICY_CATEGORIES);
17+
const [PolicyTagsProvider, , usePolicyTags] = createOnyxContext(ONYXKEYS.COLLECTION.POLICY_TAGS);
1618
const [ReportTransactionsAndViolationsProvider, , useAllReportsTransactionsAndViolations] = createOnyxContext(ONYXKEYS.DERIVED.REPORT_TRANSACTIONS_AND_VIOLATIONS);
1719

1820
type OnyxProviderProps = {
@@ -32,6 +34,8 @@ function OnyxProvider(props: OnyxProviderProps) {
3234
FrequentlyUsedEmojisProvider,
3335
PreferredEmojiSkinToneProvider,
3436
SessionProvider,
37+
PolicyCategoriesProvider,
38+
PolicyTagsProvider,
3539
ReportTransactionsAndViolationsProvider,
3640
]}
3741
>
@@ -54,5 +58,7 @@ export {
5458
PreferredEmojiSkinToneContext,
5559
useBlockedFromConcierge,
5660
useSession,
61+
usePolicyCategories,
62+
usePolicyTags,
5763
useAllReportsTransactionsAndViolations,
5864
};

src/components/ReportActionItem/MoneyRequestView.tsx

Lines changed: 16 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
import mapValues from 'lodash/mapValues';
22
import React, {useCallback, useMemo, useState} from 'react';
33
import {View} from 'react-native';
4-
import type {OnyxEntry} from 'react-native-onyx';
4+
import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
55
import ConfirmModal from '@components/ConfirmModal';
66
import * as Expensicons from '@components/Icon/Expensicons';
77
import MenuItem from '@components/MenuItem';
88
import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
99
import OfflineWithFeedback from '@components/OfflineWithFeedback';
10+
import {usePolicyCategories, usePolicyTags} from '@components/OnyxProvider';
1011
import ReceiptAudit, {ReceiptAuditMessages} from '@components/ReceiptAudit';
1112
import ReceiptEmptyState from '@components/ReceiptEmptyState';
1213
import Switch from '@components/Switch';
@@ -81,9 +82,15 @@ import type {TransactionPendingFieldsKey} from '@src/types/onyx/Transaction';
8182
import ReportActionItemImage from './ReportActionItemImage';
8283

8384
type MoneyRequestViewProps = {
85+
/** All the data of the report collection */
86+
allReports: OnyxCollection<OnyxTypes.Report>;
87+
8488
/** The report currently being looked at */
8589
report: OnyxEntry<OnyxTypes.Report>;
8690

91+
/** Policy that the report belongs to */
92+
policy: OnyxEntry<OnyxTypes.Policy>;
93+
8794
/** Whether we should display the animated banner above the component */
8895
shouldShowAnimatedBackground: boolean;
8996

@@ -108,24 +115,22 @@ const receiptImageViolationNames: OnyxTypes.ViolationName[] = [
108115

109116
const receiptFieldViolationNames: OnyxTypes.ViolationName[] = [CONST.VIOLATIONS.MODIFIED_AMOUNT, CONST.VIOLATIONS.MODIFIED_DATE];
110117

111-
function MoneyRequestView({report, shouldShowAnimatedBackground, readonly = false, updatedTransaction, isFromReviewDuplicates = false}: MoneyRequestViewProps) {
118+
function MoneyRequestView({allReports, report, policy, shouldShowAnimatedBackground, readonly = false, updatedTransaction, isFromReviewDuplicates = false}: MoneyRequestViewProps) {
112119
const styles = useThemeStyles();
113120
const {isOffline} = useNetwork();
114121
const {translate, toLocaleDigit} = useLocalize();
115122
const {shouldUseNarrowLayout} = useResponsiveLayout();
116123
const {getReportRHPActiveRoute} = useActiveRoute();
117124
const parentReportID = report?.parentReportID;
118125
const policyID = report?.policyID;
119-
const [parentReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${parentReportID}`, {canBeMissing: true});
120-
const [chatReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${parentReport?.parentReportID}`, {
121-
selector: (chatReportValue) => chatReportValue && {reportID: chatReportValue.reportID, errorFields: chatReportValue.errorFields},
122-
canBeMissing: true,
123-
});
124-
const [policy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, {canBeMissing: true});
125-
const [policyCategories] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${policyID}`, {canBeMissing: true});
126-
const [transactionReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${updatedTransaction?.reportID}`, {canBeMissing: true});
126+
const parentReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${parentReportID}`];
127+
const chatReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${parentReport?.parentReportID}`];
128+
const allPolicyCategories = usePolicyCategories();
129+
const policyCategories = allPolicyCategories?.[`${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${policyID}`];
130+
const transactionReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${updatedTransaction?.reportID}`];
127131
const targetPolicyID = updatedTransaction?.reportID ? transactionReport?.policyID : policyID;
128-
const [policyTagList] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${targetPolicyID}`, {canBeMissing: true});
132+
const allPolicyTags = usePolicyTags();
133+
const policyTagList = allPolicyTags?.[`${ONYXKEYS.COLLECTION.POLICY_TAGS}${targetPolicyID}`];
129134
const [cardList] = useOnyx(ONYXKEYS.CARD_LIST, {canBeMissing: true});
130135
const [parentReportActions] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${parentReportID}`, {
131136
canEvict: false,

src/pages/TransactionDuplicate/Confirmation.tsx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@ function Confirmation() {
4141
const [reviewDuplicates, reviewDuplicatesResult] = useOnyx(ONYXKEYS.REVIEW_DUPLICATES, {canBeMissing: true});
4242
const newTransaction = useMemo(() => TransactionUtils.buildNewTransactionAfterReviewingDuplicates(reviewDuplicates), [reviewDuplicates]);
4343
const transactionID = TransactionUtils.getTransactionID(route.params.threadReportID);
44+
const [allReports] = useOnyx(ONYXKEYS.COLLECTION.REPORT, {canBeMissing: false});
4445
const [transaction] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`, {canBeMissing: true});
4546
const [transactionViolations] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS}${transactionID}`, {
4647
canBeMissing: false,
@@ -66,6 +67,7 @@ function Confirmation() {
6667
selector: (allTransactions) => reviewDuplicates?.duplicates.map((id) => allTransactions?.[`${ONYXKEYS.COLLECTION.TRANSACTION}${id}`]),
6768
canBeMissing: true,
6869
});
70+
const [policy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${report?.policyID}`, {canBeMissing: true});
6971
const transactionsMergeParams = useMemo(
7072
() => TransactionUtils.buildMergeDuplicatesParams(reviewDuplicates, duplicates ?? [], newTransaction),
7173
[duplicates, reviewDuplicates, newTransaction],
@@ -138,7 +140,9 @@ function Confirmation() {
138140
{/* We need that provider here because MoneyRequestView component requires that */}
139141
<ShowContextMenuContext.Provider value={contextValue}>
140142
<MoneyRequestView
143+
allReports={allReports}
141144
report={report}
145+
policy={policy}
142146
shouldShowAnimatedBackground={false}
143147
readonly
144148
isFromReviewDuplicates

src/pages/home/report/PureReportActionItem.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1376,6 +1376,7 @@ function PureReportActionItem({
13761376
return (
13771377
<ReportActionItemContentCreated
13781378
contextValue={contextValue}
1379+
allReports={allReports}
13791380
parentReportAction={parentReportAction}
13801381
parentReport={parentReport}
13811382
transactionID={transactionID}

src/pages/home/report/ReportActionItemContentCreated.tsx

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import {deepEqual} from 'fast-equals';
22
import React, {memo, useMemo} from 'react';
33
import {View} from 'react-native';
4-
import type {OnyxEntry} from 'react-native-onyx';
4+
import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
55
import OfflineWithFeedback from '@components/OfflineWithFeedback';
66
import RenderHTML from '@components/RenderHTML';
77
import MoneyReportView from '@components/ReportActionItem/MoneyReportView';
@@ -28,6 +28,9 @@ import ReportActionItemCreated from './ReportActionItemCreated';
2828
import ReportActionItemSingle from './ReportActionItemSingle';
2929

3030
type ReportActionItemContentCreatedProps = {
31+
/** All the data of the report collection */
32+
allReports: OnyxCollection<OnyxTypes.Report>;
33+
3134
/** The context value containing the report and action data, along with the show context menu props */
3235
contextValue: ShowContextMenuContextProps;
3336

@@ -47,7 +50,15 @@ type ReportActionItemContentCreatedProps = {
4750
shouldHideThreadDividerLine: boolean;
4851
};
4952

50-
function ReportActionItemContentCreated({contextValue, parentReport, parentReportAction, transactionID, draftMessage, shouldHideThreadDividerLine}: ReportActionItemContentCreatedProps) {
53+
function ReportActionItemContentCreated({
54+
contextValue,
55+
allReports,
56+
parentReport,
57+
parentReportAction,
58+
transactionID,
59+
draftMessage,
60+
shouldHideThreadDividerLine,
61+
}: ReportActionItemContentCreatedProps) {
5162
const styles = useThemeStyles();
5263
const {translate} = useLocalize();
5364
const {report, action, transactionThreadReport} = contextValue;
@@ -108,7 +119,9 @@ function ReportActionItemContentCreated({contextValue, parentReport, parentRepor
108119
<ShowContextMenuContext.Provider value={contextMenuValue}>
109120
<View>
110121
<MoneyRequestView
122+
allReports={allReports}
111123
report={report}
124+
policy={policy}
112125
shouldShowAnimatedBackground
113126
/>
114127
{renderThreadDivider}
@@ -168,7 +181,9 @@ function ReportActionItemContentCreated({contextValue, parentReport, parentRepor
168181
<ShowContextMenuContext.Provider value={contextMenuValue}>
169182
<View>
170183
<MoneyRequestView
184+
allReports={allReports}
171185
report={transactionThreadReport}
186+
policy={policy}
172187
shouldShowAnimatedBackground={false}
173188
/>
174189
{renderThreadDivider}

0 commit comments

Comments
 (0)