From c69d1f6cf6915073b9f2686caf3139ae89e8d682 Mon Sep 17 00:00:00 2001 From: Pujan Date: Thu, 26 Jun 2025 12:16:49 +0530 Subject: [PATCH 01/12] remove useOnyx for chat and iou report in MoneyRequestReportPreview --- .../ReportActionItem/MoneyRequestReportPreview/index.tsx | 6 +++--- .../ReportActionItem/MoneyRequestReportPreview/types.ts | 5 ++++- src/pages/home/report/PureReportActionItem.tsx | 5 +++++ src/pages/home/report/ReportActionItem.tsx | 1 + tests/ui/MoneyRequestReportPreview.test.tsx | 4 +++- 5 files changed, 16 insertions(+), 5 deletions(-) diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx index d69a803aa864..f6b6b30be007 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx @@ -22,6 +22,7 @@ import MoneyRequestReportPreviewContent from './MoneyRequestReportPreviewContent import type {MoneyRequestReportPreviewProps} from './types'; function MoneyRequestReportPreview({ + allReports, iouReportID, policyID, chatReportID, @@ -40,7 +41,7 @@ function MoneyRequestReportPreview({ const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); const {shouldUseNarrowLayout} = useResponsiveLayout(); - const [chatReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`, {canBeMissing: true}); + const chatReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`]; const [invoiceReceiverPolicy] = useOnyx( `${ONYXKEYS.COLLECTION.POLICY}${chatReport?.invoiceReceiver && 'policyID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.policyID : undefined}`, {canBeMissing: true}, @@ -50,7 +51,7 @@ function MoneyRequestReportPreview({ personalDetails?.[chatReport?.invoiceReceiver && 'accountID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.accountID : CONST.DEFAULT_NUMBER_ID], canBeMissing: true, }); - const [iouReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${iouReportID}`, {canBeMissing: true}); + const iouReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${iouReportID}`]; const {transactions: reportTransactions, violations} = transactionsAndViolationsByReport[iouReportID ?? CONST.DEFAULT_NUMBER_ID] ?? {}; const {isOffline} = useNetwork(); const filteredTransactions = Object.values(reportTransactions ?? {}).filter((transaction) => isOffline || transaction?.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE); @@ -66,7 +67,6 @@ function MoneyRequestReportPreview({ () => StyleUtils.getMoneyRequestReportPreviewStyle(shouldUseNarrowLayout, transactions.length, currentWidth, currentWrapperWidth), [StyleUtils, currentWidth, currentWrapperWidth, shouldUseNarrowLayout, transactions.length], ); - const shouldShowIOUData = useMemo(() => { if (!isIOUReport(iouReport) && action.childType !== CONST.REPORT.TYPE.IOU) { return false; diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts b/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts index 6cd1ec21eed0..e15b3342cb23 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts @@ -18,6 +18,9 @@ type MoneyRequestReportPreviewStyleType = { }; type MoneyRequestReportPreviewProps = { + /** All the data of the report collection */ + allReports: OnyxCollection; + /** The report's policyID, used for Onyx subscription */ policyID: string | undefined; @@ -73,7 +76,7 @@ type MoneyRequestReportPreviewContentOnyxProps = { }; type MoneyRequestReportPreviewContentProps = MoneyRequestReportPreviewContentOnyxProps & - Omit & { + Omit & { /** Extra styles passed used by MoneyRequestReportPreviewContent */ reportPreviewStyles: MoneyRequestReportPreviewStyleType; diff --git a/src/pages/home/report/PureReportActionItem.tsx b/src/pages/home/report/PureReportActionItem.tsx index 065cf7cc6bcd..bac44afc92b2 100644 --- a/src/pages/home/report/PureReportActionItem.tsx +++ b/src/pages/home/report/PureReportActionItem.tsx @@ -185,6 +185,9 @@ import ReportAttachmentsContext from './ReportAttachmentsContext'; import TripSummary from './TripSummary'; type PureReportActionItemProps = { + /** All the data of the report collection */ + allReports: OnyxCollection; + /** Report for this action */ report: OnyxEntry; @@ -375,6 +378,7 @@ const isEmptyHTML = ({props: {html}}: T): boolean = * Instead, pass all Onyx read/write operations as props. */ function PureReportActionItem({ + allReports, action, report, policy, @@ -919,6 +923,7 @@ function PureReportActionItem({ } else if (action.actionName === CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW) { children = ( { await waitForBatchedUpdatesWithAct(); setCurrentWidth(); await Onyx.mergeCollection(ONYXKEYS.COLLECTION.TRANSACTION, mockOnyxTransactions).then(waitForBatchedUpdates); - await Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT}${mockChatReport.iouReportID}`, mockChatReport).then(waitForBatchedUpdates); const {reportName: moneyRequestReportPreviewName = ''} = mockChatReport; for (const transaction of arrayOfTransactions) { const {transactionDisplayAmount, transactionHeaderText} = getTransactionDisplayAmountAndHeaderText(transaction); From 7788b4ffc242a9345faca1d37e2e53e09c88ce63 Mon Sep 17 00:00:00 2001 From: Pujan Date: Thu, 26 Jun 2025 13:52:04 +0530 Subject: [PATCH 02/12] remove useOnyx for chatReport and iouReport in MoneyRequestAction --- src/components/ReportActionItem/MoneyRequestAction.tsx | 9 +++++++-- src/pages/home/report/PureReportActionItem.tsx | 1 + 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/src/components/ReportActionItem/MoneyRequestAction.tsx b/src/components/ReportActionItem/MoneyRequestAction.tsx index 8726c1987cd5..eb2fa221ec86 100644 --- a/src/components/ReportActionItem/MoneyRequestAction.tsx +++ b/src/components/ReportActionItem/MoneyRequestAction.tsx @@ -34,9 +34,13 @@ import ROUTES from '@src/ROUTES'; import SCREENS from '@src/SCREENS'; import type * as OnyxTypes from '@src/types/onyx'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; +import type {OnyxCollection} from 'react-native-onyx'; import TransactionPreview from './TransactionPreview'; type MoneyRequestActionProps = { + /** All the data of the report collection */ + allReports: OnyxCollection; + /** All the data of the action */ action: OnyxTypes.ReportAction; @@ -72,6 +76,7 @@ type MoneyRequestActionProps = { }; function MoneyRequestAction({ + allReports, action, chatReportID, requestReportID, @@ -84,8 +89,8 @@ function MoneyRequestAction({ isWhisper = false, shouldDisplayContextMenu = true, }: MoneyRequestActionProps) { - const [chatReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`, {canBeMissing: true}); - const [iouReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${requestReportID}`, {canBeMissing: true}); + const chatReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`]; + const iouReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${requestReportID}`]; const [reportActions] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${chatReportID}`, {canEvict: false, canBeMissing: true}); const StyleUtils = useStyleUtils(); const styles = useThemeStyles(); diff --git a/src/pages/home/report/PureReportActionItem.tsx b/src/pages/home/report/PureReportActionItem.tsx index bac44afc92b2..38df0d42f6dd 100644 --- a/src/pages/home/report/PureReportActionItem.tsx +++ b/src/pages/home/report/PureReportActionItem.tsx @@ -855,6 +855,7 @@ function PureReportActionItem({ const iouReportID = moneyRequestOriginalMessage?.IOUReportID?.toString(); children = ( Date: Thu, 26 Jun 2025 16:05:02 +0530 Subject: [PATCH 03/12] remove useOnyx for policy in MoneyRequestReportPreview --- .../MoneyRequestReportActionsList.tsx | 2 ++ .../ReportActionItem/MoneyRequestReportPreview/index.tsx | 6 ++---- .../ReportActionItem/MoneyRequestReportPreview/types.ts | 3 +++ .../Debug/ReportAction/DebugReportActionCreatePage.tsx | 2 ++ .../Debug/ReportAction/DebugReportActionPreview.tsx | 2 ++ .../TransactionDuplicate/DuplicateTransactionItem.tsx | 7 +++++-- .../TransactionDuplicate/DuplicateTransactionsList.tsx | 4 +++- src/pages/home/report/PureReportActionItem.tsx | 9 +++++---- src/pages/home/report/ReportActionItem.tsx | 8 ++++++-- src/pages/home/report/ReportActionItemParentAction.tsx | 5 +++++ src/pages/home/report/ReportActionsList.tsx | 3 +++ src/pages/home/report/ReportActionsListItemRenderer.tsx | 8 +++++++- 12 files changed, 45 insertions(+), 14 deletions(-) diff --git a/src/components/MoneyRequestReportView/MoneyRequestReportActionsList.tsx b/src/components/MoneyRequestReportView/MoneyRequestReportActionsList.tsx index 1b8336089824..99d10bec03e2 100644 --- a/src/components/MoneyRequestReportView/MoneyRequestReportActionsList.tsx +++ b/src/components/MoneyRequestReportView/MoneyRequestReportActionsList.tsx @@ -133,6 +133,7 @@ function MoneyRequestReportActionsList({ const linkedReportActionID = route?.params?.reportActionID; const [allReports] = useOnyx(ONYXKEYS.COLLECTION.REPORT, {canBeMissing: false}); + const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY, {canBeMissing: false}); const [parentReportAction] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${getNonEmptyStringOnyxID(report?.parentReportID)}`, { canEvict: false, canBeMissing: true, @@ -472,6 +473,7 @@ function MoneyRequestReportActionsList({ return ( personalDetails?.[chatReport?.invoiceReceiver && 'accountID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.accountID : CONST.DEFAULT_NUMBER_ID], diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts b/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts index e15b3342cb23..6b6613211529 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts @@ -21,6 +21,9 @@ type MoneyRequestReportPreviewProps = { /** All the data of the report collection */ allReports: OnyxCollection; + /** All the data of the policy collection */ + policies?: OnyxCollection; + /** The report's policyID, used for Onyx subscription */ policyID: string | undefined; diff --git a/src/pages/Debug/ReportAction/DebugReportActionCreatePage.tsx b/src/pages/Debug/ReportAction/DebugReportActionCreatePage.tsx index 7e7c8853dce0..149ee1e8ffcc 100644 --- a/src/pages/Debug/ReportAction/DebugReportActionCreatePage.tsx +++ b/src/pages/Debug/ReportAction/DebugReportActionCreatePage.tsx @@ -47,6 +47,7 @@ function DebugReportActionCreatePage({ const {translate} = useLocalize(); const styles = useThemeStyles(); const [allReports] = useOnyx(ONYXKEYS.COLLECTION.REPORT, {canBeMissing: false}); + const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY, {canBeMissing: false}); const [session] = useOnyx(ONYXKEYS.SESSION, {canBeMissing: false}); const [personalDetailsList] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, {canBeMissing: false}); const [draftReportAction, setDraftReportAction] = useState(() => getInitialReportAction(reportID, session, personalDetailsList)); @@ -108,6 +109,7 @@ function DebugReportActionCreatePage({ {!error ? ( ; index: number; allReports: OnyxCollection; + /** All the data of the policy collection */ + policies?: OnyxCollection; }; -function DuplicateTransactionItem({transaction, index, allReports}: DuplicateTransactionItemProps) { +function DuplicateTransactionItem({transaction, index, allReports, policies}: DuplicateTransactionItemProps) { const styles = useThemeStyles(); const report = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${transaction?.reportID}`]; const [reportActions] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report?.reportID}`, {canBeMissing: false}); @@ -34,6 +36,7 @@ function DuplicateTransactionItem({transaction, index, allReports}: DuplicateTra >) => ( @@ -29,9 +30,10 @@ function DuplicateTransactionsList({transactions}: DuplicateTransactionsListProp transaction={item} index={index} allReports={allReports} + policies={policies} /> ), - [allReports], + [allReports, policies], ); return ( diff --git a/src/pages/home/report/PureReportActionItem.tsx b/src/pages/home/report/PureReportActionItem.tsx index 38df0d42f6dd..1e374d58a589 100644 --- a/src/pages/home/report/PureReportActionItem.tsx +++ b/src/pages/home/report/PureReportActionItem.tsx @@ -188,6 +188,9 @@ type PureReportActionItemProps = { /** All the data of the report collection */ allReports: OnyxCollection; + /** All the data of the policy collection */ + policies?: OnyxCollection; + /** Report for this action */ report: OnyxEntry; @@ -359,9 +362,6 @@ type PureReportActionItemProps = { /** User payment card ID */ userBillingFundID?: number; - /** Policies */ - policies?: OnyxCollection; - /** Whether to show border for MoneyRequestReportPreviewContent */ shouldShowBorder?: boolean; }; @@ -379,6 +379,7 @@ const isEmptyHTML = ({props: {html}}: T): boolean = */ function PureReportActionItem({ allReports, + policies, action, report, policy, @@ -428,7 +429,6 @@ function PureReportActionItem({ clearAllRelatedReportActionErrors = () => {}, dismissTrackExpenseActionableWhisper = () => {}, userBillingFundID, - policies, shouldShowBorder, }: PureReportActionItemProps) { const actionSheetAwareScrollViewContext = useContext(ActionSheetAwareScrollView.ActionSheetAwareScrollViewContext); @@ -925,6 +925,7 @@ function PureReportActionItem({ children = ( ; + /** All the data of the policy collection */ + policies: OnyxCollection; + /** Whether to show the draft message or not */ shouldShowDraftMessage?: boolean; @@ -43,7 +46,7 @@ type ReportActionItemProps = Omit>; }; -function ReportActionItem({allReports, action, report, transactions, shouldShowDraftMessage = true, ...props}: ReportActionItemProps) { +function ReportActionItem({allReports, policies, action, report, transactions, shouldShowDraftMessage = true, ...props}: ReportActionItemProps) { const reportID = report?.reportID; const originalMessage = getOriginalMessage(action); // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing @@ -90,6 +93,7 @@ function ReportActionItem({allReports, action, report, transactions, shouldShowD // eslint-disable-next-line react/jsx-props-no-spreading {...props} allReports={allReports} + policies={policies} action={action} report={report} policy={policy} diff --git a/src/pages/home/report/ReportActionItemParentAction.tsx b/src/pages/home/report/ReportActionItemParentAction.tsx index 1d1e720a77a0..2bb972cedd4f 100644 --- a/src/pages/home/report/ReportActionItemParentAction.tsx +++ b/src/pages/home/report/ReportActionItemParentAction.tsx @@ -27,6 +27,9 @@ type ReportActionItemParentActionProps = { /** All the data of the report collection */ allReports: OnyxCollection; + /** All the data of the policy collection */ + policies: OnyxCollection; + /** Flag to show, hide the thread divider line */ shouldHideThreadDividerLine?: boolean; @@ -64,6 +67,7 @@ type ReportActionItemParentActionProps = { function ReportActionItemParentAction({ allReports, + policies, report, transactionThreadReport, reportActions, @@ -142,6 +146,7 @@ function ReportActionItemParentAction({ )} navigateToLinkedReportAction(ancestor, isInNarrowPaneModal, canUserPerformWriteAction, isOffline) diff --git a/src/pages/home/report/ReportActionsList.tsx b/src/pages/home/report/ReportActionsList.tsx index 35d4ba034b5c..d1b17bdf9420 100644 --- a/src/pages/home/report/ReportActionsList.tsx +++ b/src/pages/home/report/ReportActionsList.tsx @@ -170,6 +170,7 @@ function ReportActionsList({ const isFocused = useIsFocused(); const [allReports] = useOnyx(ONYXKEYS.COLLECTION.REPORT, {canBeMissing: false}); + const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY, {canBeMissing: false}); const [transactions] = useOnyx(ONYXKEYS.COLLECTION.TRANSACTION, {canBeMissing: true}); const [reportNameValuePairs] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_NAME_VALUE_PAIRS}${report?.reportID}`, {canBeMissing: true}); const [accountID] = useOnyx(ONYXKEYS.SESSION, {selector: (session) => session?.accountID, canBeMissing: true}); @@ -583,6 +584,7 @@ function ReportActionsList({ return ( ; + /** All the data of the policy collection */ + policies: OnyxCollection; + /** All the data of the action item */ reportAction: ReportAction; @@ -65,6 +68,7 @@ type ReportActionsListItemRendererProps = { function ReportActionsListItemRenderer({ allReports, + policies, reportAction, reportActions = [], transactions, @@ -160,6 +164,7 @@ function ReportActionsListItemRenderer({ return ( Date: Thu, 26 Jun 2025 17:03:22 +0530 Subject: [PATCH 04/12] removed useOnyx from MoneyRequestReportPreview --- .../ReportActionItem/MoneyRequestReportPreview/index.tsx | 9 +++------ .../ReportActionItem/MoneyRequestReportPreview/types.ts | 6 +++--- src/libs/ReportUtils.ts | 2 +- .../TransactionDuplicate/DuplicateTransactionItem.tsx | 2 +- src/pages/home/report/PureReportActionItem.tsx | 2 +- tests/ui/MoneyRequestReportPreview.test.tsx | 1 + 6 files changed, 10 insertions(+), 12 deletions(-) diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx index b0c542aa8abe..cbb0313e491e 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx @@ -1,6 +1,5 @@ import React, {useCallback, useMemo, useState} from 'react'; import type {LayoutChangeEvent, ListRenderItem} from 'react-native'; -import {useOnyx} from 'react-native-onyx'; import TransactionPreview from '@components/ReportActionItem/TransactionPreview'; import useNetwork from '@hooks/useNetwork'; import usePolicy from '@hooks/usePolicy'; @@ -18,6 +17,7 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type {Transaction} from '@src/types/onyx'; +import {usePersonalDetails} from '@components/OnyxProvider'; import MoneyRequestReportPreviewContent from './MoneyRequestReportPreviewContent'; import type {MoneyRequestReportPreviewProps} from './types'; @@ -42,13 +42,10 @@ function MoneyRequestReportPreview({ const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); const {shouldUseNarrowLayout} = useResponsiveLayout(); + const personalDetailsList = usePersonalDetails(); const chatReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`]; const invoiceReceiverPolicy = policies?.[`${ONYXKEYS.COLLECTION.POLICY}${chatReport?.invoiceReceiver && 'policyID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.policyID : undefined}`]; - const [invoiceReceiverPersonalDetail] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, { - selector: (personalDetails) => - personalDetails?.[chatReport?.invoiceReceiver && 'accountID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.accountID : CONST.DEFAULT_NUMBER_ID], - canBeMissing: true, - }); + const invoiceReceiverPersonalDetail = personalDetailsList?.[`${chatReport?.invoiceReceiver && 'accountID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.accountID : CONST.DEFAULT_NUMBER_ID}`]; const iouReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${iouReportID}`]; const {transactions: reportTransactions, violations} = transactionsAndViolationsByReport[iouReportID ?? CONST.DEFAULT_NUMBER_ID] ?? {}; const {isOffline} = useNetwork(); diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts b/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts index 6b6613211529..836525fb7662 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/types.ts @@ -22,7 +22,7 @@ type MoneyRequestReportPreviewProps = { allReports: OnyxCollection; /** All the data of the policy collection */ - policies?: OnyxCollection; + policies: OnyxCollection; /** The report's policyID, used for Onyx subscription */ policyID: string | undefined; @@ -74,12 +74,12 @@ type MoneyRequestReportPreviewContentOnyxProps = { transactions: Transaction[]; violations: OnyxCollection; policy: OnyxEntry; - invoiceReceiverPersonalDetail: OnyxEntry; + invoiceReceiverPersonalDetail: OnyxEntry | null; lastTransactionViolations: TransactionViolations; }; type MoneyRequestReportPreviewContentProps = MoneyRequestReportPreviewContentOnyxProps & - Omit & { + Omit & { /** Extra styles passed used by MoneyRequestReportPreviewContent */ reportPreviewStyles: MoneyRequestReportPreviewStyleType; diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts index 7b474d7e222e..9c1ec50be58e 100644 --- a/src/libs/ReportUtils.ts +++ b/src/libs/ReportUtils.ts @@ -4812,7 +4812,7 @@ function getAdminRoomInvitedParticipants(parentReportAction: OnyxEntry, invoiceReceiverPolicy?: OnyxEntry | SearchPolicy, invoiceReceiverPersonalDetail?: PersonalDetails): string { +function getInvoicePayerName(report: OnyxEntry, invoiceReceiverPolicy?: OnyxEntry | SearchPolicy, invoiceReceiverPersonalDetail?: PersonalDetails | null): string { const invoiceReceiver = report?.invoiceReceiver; const isIndividual = invoiceReceiver?.type === CONST.REPORT.INVOICE_RECEIVER_TYPE.INDIVIDUAL; diff --git a/src/pages/TransactionDuplicate/DuplicateTransactionItem.tsx b/src/pages/TransactionDuplicate/DuplicateTransactionItem.tsx index 5e7fc7b9f7f4..8c935084e426 100644 --- a/src/pages/TransactionDuplicate/DuplicateTransactionItem.tsx +++ b/src/pages/TransactionDuplicate/DuplicateTransactionItem.tsx @@ -14,7 +14,7 @@ type DuplicateTransactionItemProps = { index: number; allReports: OnyxCollection; /** All the data of the policy collection */ - policies?: OnyxCollection; + policies: OnyxCollection; }; function DuplicateTransactionItem({transaction, index, allReports, policies}: DuplicateTransactionItemProps) { diff --git a/src/pages/home/report/PureReportActionItem.tsx b/src/pages/home/report/PureReportActionItem.tsx index 1e374d58a589..fa33e3548b66 100644 --- a/src/pages/home/report/PureReportActionItem.tsx +++ b/src/pages/home/report/PureReportActionItem.tsx @@ -189,7 +189,7 @@ type PureReportActionItemProps = { allReports: OnyxCollection; /** All the data of the policy collection */ - policies?: OnyxCollection; + policies: OnyxCollection; /** Report for this action */ report: OnyxEntry; diff --git a/tests/ui/MoneyRequestReportPreview.test.tsx b/tests/ui/MoneyRequestReportPreview.test.tsx index 6312ea50e92b..6d8ea9a2b63d 100644 --- a/tests/ui/MoneyRequestReportPreview.test.tsx +++ b/tests/ui/MoneyRequestReportPreview.test.tsx @@ -65,6 +65,7 @@ const renderPage = ({isWhisper = false, isHovered = false, contextMenuAnchor = n allReports={{ [`${ONYXKEYS.COLLECTION.REPORT}${mockChatReport.iouReportID}`]: mockChatReport, }} + policies={{}} policyID={mockChatReport.policyID} action={mockAction} iouReportID={mockChatReport.iouReportID} From 94384caa4ded78fa5f8aecba3a886e3462daa90c Mon Sep 17 00:00:00 2001 From: Pujan Date: Thu, 26 Jun 2025 18:16:33 +0530 Subject: [PATCH 05/12] used allReports for TransactionPreview --- src/components/ReportActionItem/MoneyRequestAction.tsx | 1 + .../ReportActionItem/MoneyRequestReportPreview/index.tsx | 1 + src/components/ReportActionItem/TransactionPreview/index.tsx | 5 +++-- src/components/ReportActionItem/TransactionPreview/types.ts | 5 ++++- src/pages/home/report/PureReportActionItem.tsx | 1 + 5 files changed, 10 insertions(+), 3 deletions(-) diff --git a/src/components/ReportActionItem/MoneyRequestAction.tsx b/src/components/ReportActionItem/MoneyRequestAction.tsx index eb2fa221ec86..c3390743014f 100644 --- a/src/components/ReportActionItem/MoneyRequestAction.tsx +++ b/src/components/ReportActionItem/MoneyRequestAction.tsx @@ -175,6 +175,7 @@ function MoneyRequestAction({ const TransactionPreviewComponent = ( = ({item}) => ( >(); - const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${route.params?.threadReportID}`, {canBeMissing: true}); + const report = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${route.params?.threadReportID}`]; const isMoneyRequestAction = isMoneyRequestActionReportActionsUtils(action); const transactionID = transactionIDFromProps ?? (isMoneyRequestAction ? getOriginalMessage(action)?.IOUTransactionID : null); const [transaction] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`, {canBeMissing: true}); diff --git a/src/components/ReportActionItem/TransactionPreview/types.ts b/src/components/ReportActionItem/TransactionPreview/types.ts index f2f911d26995..5ee7725780bc 100644 --- a/src/components/ReportActionItem/TransactionPreview/types.ts +++ b/src/components/ReportActionItem/TransactionPreview/types.ts @@ -1,5 +1,5 @@ import type {GestureResponderEvent, StyleProp, ViewStyle} from 'react-native'; -import type {OnyxEntry} from 'react-native-onyx'; +import type {OnyxCollection, OnyxEntry} from 'react-native-onyx'; import type {ContextMenuAnchor} from '@pages/home/report/ContextMenu/ReportActionContextMenu'; import type {PersonalDetailsList, Report, ReportAction, Transaction, TransactionViolations} from '@src/types/onyx'; import type {Errors} from '@src/types/onyx/OnyxCommon'; @@ -11,6 +11,9 @@ type TransactionPreviewStyleType = { }; type TransactionPreviewProps = { + /** All the data of the report collection */ + allReports: OnyxCollection; + /** The active IOUReport, used for Onyx subscription */ iouReportID: string | undefined; diff --git a/src/pages/home/report/PureReportActionItem.tsx b/src/pages/home/report/PureReportActionItem.tsx index fa33e3548b66..147008826596 100644 --- a/src/pages/home/report/PureReportActionItem.tsx +++ b/src/pages/home/report/PureReportActionItem.tsx @@ -876,6 +876,7 @@ function PureReportActionItem({ children = ( Date: Thu, 26 Jun 2025 21:36:56 +0530 Subject: [PATCH 06/12] used context for session and personalDetails in TransactionPreview --- .../ReportActionItem/TransactionPreview/index.tsx | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/components/ReportActionItem/TransactionPreview/index.tsx b/src/components/ReportActionItem/TransactionPreview/index.tsx index 58a16a2953ea..6d9f05430ec7 100644 --- a/src/components/ReportActionItem/TransactionPreview/index.tsx +++ b/src/components/ReportActionItem/TransactionPreview/index.tsx @@ -22,6 +22,7 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import SCREENS from '@src/SCREENS'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; +import {usePersonalDetails, useSession} from '@components/OnyxProvider'; import TransactionPreviewContent from './TransactionPreviewContent'; import type {TransactionPreviewProps} from './types'; @@ -50,9 +51,9 @@ function TransactionPreview(props: TransactionPreviewProps) { const [transaction] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`, {canBeMissing: true}); const violations = useTransactionViolations(transaction?.transactionID); const [walletTerms] = useOnyx(ONYXKEYS.WALLET_TERMS, {canBeMissing: true}); - const [session] = useOnyx(ONYXKEYS.SESSION, {canBeMissing: true}); - const [chatReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`, {canBeMissing: true}); - const [personalDetails] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST, {canBeMissing: true}); + const session = useSession(); + const chatReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`]; + const personalDetails = usePersonalDetails(); // Get transaction violations for given transaction id from onyx, find duplicated transactions violations and get duplicates const allDuplicates = useMemo(() => violations?.find((violation) => violation.name === CONST.VIOLATIONS.DUPLICATED_TRANSACTION)?.data?.duplicates ?? [], [violations]); From 7acae973d8c2bdfe67e52c6e265f6d7170b8f9ef Mon Sep 17 00:00:00 2001 From: Pujan Date: Thu, 26 Jun 2025 22:37:43 +0530 Subject: [PATCH 07/12] lint and prettier fix --- .../MoneyRequestReportActionsList.tsx | 1 + src/components/ReportActionItem/MoneyRequestAction.tsx | 2 +- .../ReportActionItem/MoneyRequestReportPreview/index.tsx | 8 +++++--- .../ReportActionItem/TransactionPreview/index.tsx | 2 +- tests/ui/MoneyRequestReportPreview.test.tsx | 2 +- 5 files changed, 9 insertions(+), 6 deletions(-) diff --git a/src/components/MoneyRequestReportView/MoneyRequestReportActionsList.tsx b/src/components/MoneyRequestReportView/MoneyRequestReportActionsList.tsx index 99d10bec03e2..f385504d2ebb 100644 --- a/src/components/MoneyRequestReportView/MoneyRequestReportActionsList.tsx +++ b/src/components/MoneyRequestReportView/MoneyRequestReportActionsList.tsx @@ -504,6 +504,7 @@ function MoneyRequestReportActionsList({ linkedReportActionID, transactionsAndViolationsByReport, allReports, + policies, ], ); diff --git a/src/components/ReportActionItem/MoneyRequestAction.tsx b/src/components/ReportActionItem/MoneyRequestAction.tsx index c3390743014f..1c057615dd1f 100644 --- a/src/components/ReportActionItem/MoneyRequestAction.tsx +++ b/src/components/ReportActionItem/MoneyRequestAction.tsx @@ -3,6 +3,7 @@ import lodashIsEmpty from 'lodash/isEmpty'; import React, {useMemo, useState} from 'react'; import type {LayoutChangeEvent, StyleProp, ViewStyle} from 'react-native'; import {ActivityIndicator, View} from 'react-native'; +import type {OnyxCollection} from 'react-native-onyx'; import RenderHTML from '@components/RenderHTML'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; @@ -34,7 +35,6 @@ import ROUTES from '@src/ROUTES'; import SCREENS from '@src/SCREENS'; import type * as OnyxTypes from '@src/types/onyx'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; -import type {OnyxCollection} from 'react-native-onyx'; import TransactionPreview from './TransactionPreview'; type MoneyRequestActionProps = { diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx index f7fd0dcb1bd3..05f28b1c9d4f 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx @@ -1,5 +1,6 @@ import React, {useCallback, useMemo, useState} from 'react'; import type {LayoutChangeEvent, ListRenderItem} from 'react-native'; +import {usePersonalDetails} from '@components/OnyxProvider'; import TransactionPreview from '@components/ReportActionItem/TransactionPreview'; import useNetwork from '@hooks/useNetwork'; import usePolicy from '@hooks/usePolicy'; @@ -17,7 +18,6 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type {Transaction} from '@src/types/onyx'; -import {usePersonalDetails} from '@components/OnyxProvider'; import MoneyRequestReportPreviewContent from './MoneyRequestReportPreviewContent'; import type {MoneyRequestReportPreviewProps} from './types'; @@ -44,8 +44,10 @@ function MoneyRequestReportPreview({ const {shouldUseNarrowLayout} = useResponsiveLayout(); const personalDetailsList = usePersonalDetails(); const chatReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`]; - const invoiceReceiverPolicy = policies?.[`${ONYXKEYS.COLLECTION.POLICY}${chatReport?.invoiceReceiver && 'policyID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.policyID : undefined}`]; - const invoiceReceiverPersonalDetail = personalDetailsList?.[`${chatReport?.invoiceReceiver && 'accountID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.accountID : CONST.DEFAULT_NUMBER_ID}`]; + const invoiceReceiverPolicy = + policies?.[`${ONYXKEYS.COLLECTION.POLICY}${chatReport?.invoiceReceiver && 'policyID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.policyID : undefined}`]; + const invoiceReceiverPersonalDetail = + personalDetailsList?.[`${chatReport?.invoiceReceiver && 'accountID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.accountID : CONST.DEFAULT_NUMBER_ID}`]; const iouReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${iouReportID}`]; const {transactions: reportTransactions, violations} = transactionsAndViolationsByReport[iouReportID ?? CONST.DEFAULT_NUMBER_ID] ?? {}; const {isOffline} = useNetwork(); diff --git a/src/components/ReportActionItem/TransactionPreview/index.tsx b/src/components/ReportActionItem/TransactionPreview/index.tsx index 6d9f05430ec7..5fb0a2bd0315 100644 --- a/src/components/ReportActionItem/TransactionPreview/index.tsx +++ b/src/components/ReportActionItem/TransactionPreview/index.tsx @@ -1,6 +1,7 @@ import {useRoute} from '@react-navigation/native'; import React, {useCallback, useMemo} from 'react'; import type {GestureResponderEvent} from 'react-native'; +import {usePersonalDetails, useSession} from '@components/OnyxProvider'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import {showContextMenuForReport} from '@components/ShowContextMenuContext'; import useLocalize from '@hooks/useLocalize'; @@ -22,7 +23,6 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import SCREENS from '@src/SCREENS'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; -import {usePersonalDetails, useSession} from '@components/OnyxProvider'; import TransactionPreviewContent from './TransactionPreviewContent'; import type {TransactionPreviewProps} from './types'; diff --git a/tests/ui/MoneyRequestReportPreview.test.tsx b/tests/ui/MoneyRequestReportPreview.test.tsx index 6d8ea9a2b63d..de1132b3919c 100644 --- a/tests/ui/MoneyRequestReportPreview.test.tsx +++ b/tests/ui/MoneyRequestReportPreview.test.tsx @@ -63,7 +63,7 @@ const renderPage = ({isWhisper = false, isHovered = false, contextMenuAnchor = n Date: Thu, 26 Jun 2025 23:42:02 +0530 Subject: [PATCH 08/12] lint fix --- .../ReportActionItem/MoneyRequestReportPreview/index.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx index 05f28b1c9d4f..df9fefe87a07 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx @@ -46,6 +46,7 @@ function MoneyRequestReportPreview({ const chatReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`]; const invoiceReceiverPolicy = policies?.[`${ONYXKEYS.COLLECTION.POLICY}${chatReport?.invoiceReceiver && 'policyID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.policyID : undefined}`]; + // eslint-disable-next-line rulesdir/no-default-id-values const invoiceReceiverPersonalDetail = personalDetailsList?.[`${chatReport?.invoiceReceiver && 'accountID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.accountID : CONST.DEFAULT_NUMBER_ID}`]; const iouReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${iouReportID}`]; From b9a307e0bfcf811b5a94c92ecd96c4641d6c5d6a Mon Sep 17 00:00:00 2001 From: Pujan Date: Thu, 26 Jun 2025 23:45:35 +0530 Subject: [PATCH 09/12] lint fix --- .../ReportActionItem/MoneyRequestReportPreview/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx index df9fefe87a07..3e3f52d2b557 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx @@ -46,8 +46,8 @@ function MoneyRequestReportPreview({ const chatReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`]; const invoiceReceiverPolicy = policies?.[`${ONYXKEYS.COLLECTION.POLICY}${chatReport?.invoiceReceiver && 'policyID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.policyID : undefined}`]; - // eslint-disable-next-line rulesdir/no-default-id-values const invoiceReceiverPersonalDetail = + // eslint-disable-next-line rulesdir/no-default-id-values personalDetailsList?.[`${chatReport?.invoiceReceiver && 'accountID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.accountID : CONST.DEFAULT_NUMBER_ID}`]; const iouReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${iouReportID}`]; const {transactions: reportTransactions, violations} = transactionsAndViolationsByReport[iouReportID ?? CONST.DEFAULT_NUMBER_ID] ?? {}; From 13afc3e82a7d3c3d3d5c0e51544ba597d1e3b8d4 Mon Sep 17 00:00:00 2001 From: Pujan Date: Tue, 1 Jul 2025 16:56:15 +0530 Subject: [PATCH 10/12] policies canBeMissing to true --- src/pages/home/report/ReportActionsList.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/report/ReportActionsList.tsx b/src/pages/home/report/ReportActionsList.tsx index 2e6e7ef3ca1f..133a9f924bfe 100644 --- a/src/pages/home/report/ReportActionsList.tsx +++ b/src/pages/home/report/ReportActionsList.tsx @@ -167,7 +167,7 @@ function ReportActionsList({ const isFocused = useIsFocused(); const [allReports] = useOnyx(ONYXKEYS.COLLECTION.REPORT, {canBeMissing: false}); - const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY, {canBeMissing: false}); + const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY, {canBeMissing: true}); const [transactions] = useOnyx(ONYXKEYS.COLLECTION.TRANSACTION, {canBeMissing: true}); const [accountID] = useOnyx(ONYXKEYS.SESSION, {selector: (session) => session?.accountID, canBeMissing: true}); const participantsContext = useContext(PersonalDetailsContext); From 5a5d15c141e4da0ce35b5585f3719a47c9be98d4 Mon Sep 17 00:00:00 2001 From: Pujan Date: Wed, 2 Jul 2025 11:37:22 +0530 Subject: [PATCH 11/12] prettier fix --- src/components/ReportActionItem/MoneyRequestAction.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ReportActionItem/MoneyRequestAction.tsx b/src/components/ReportActionItem/MoneyRequestAction.tsx index c66128399101..d768d5bc9784 100644 --- a/src/components/ReportActionItem/MoneyRequestAction.tsx +++ b/src/components/ReportActionItem/MoneyRequestAction.tsx @@ -1,8 +1,8 @@ import {useRoute} from '@react-navigation/native'; import lodashIsEmpty from 'lodash/isEmpty'; -import type {OnyxCollection} from 'react-native-onyx'; import React, {useMemo} from 'react'; import type {StyleProp, ViewStyle} from 'react-native'; +import type {OnyxCollection} from 'react-native-onyx'; import RenderHTML from '@components/RenderHTML'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; From d0b0d76f255decd6b807c6b74342b8ae23ccefde Mon Sep 17 00:00:00 2001 From: Pujan Date: Wed, 2 Jul 2025 11:58:20 +0530 Subject: [PATCH 12/12] condition update --- .../ReportActionItem/MoneyRequestReportPreview/index.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx index ccbfd124e7af..267c35d99156 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/index.tsx @@ -45,9 +45,7 @@ function MoneyRequestReportPreview({ const chatReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`]; const invoiceReceiverPolicy = policies?.[`${ONYXKEYS.COLLECTION.POLICY}${chatReport?.invoiceReceiver && 'policyID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.policyID : undefined}`]; - const invoiceReceiverPersonalDetail = - // eslint-disable-next-line rulesdir/no-default-id-values - personalDetailsList?.[`${chatReport?.invoiceReceiver && 'accountID' in chatReport.invoiceReceiver ? chatReport.invoiceReceiver.accountID : CONST.DEFAULT_NUMBER_ID}`]; + const invoiceReceiverPersonalDetail = chatReport?.invoiceReceiver && 'accountID' in chatReport.invoiceReceiver ? personalDetailsList?.[chatReport.invoiceReceiver.accountID] : null; const [iouReport, transactions, violations] = useReportWithTransactionsAndViolations(iouReportID); const policy = usePolicy(policyID); const lastTransaction = transactions?.at(0);