From 3437d1f3f99b5d0bb62d476e6ad3d270afb5fe8a Mon Sep 17 00:00:00 2001 From: Tomasz Misiukiewicz Date: Wed, 8 Nov 2023 12:26:20 +0100 Subject: [PATCH 1/5] correctly pass transactions to lhn --- src/components/LHNOptionsList/LHNOptionsList.js | 13 +++++++------ src/components/LHNOptionsList/OptionRowLHNData.js | 8 ++------ 2 files changed, 9 insertions(+), 12 deletions(-) diff --git a/src/components/LHNOptionsList/LHNOptionsList.js b/src/components/LHNOptionsList/LHNOptionsList.js index 0c5383054d04e..924eefd302f07 100644 --- a/src/components/LHNOptionsList/LHNOptionsList.js +++ b/src/components/LHNOptionsList/LHNOptionsList.js @@ -135,14 +135,15 @@ function LHNOptionsList({ const renderItem = useCallback( ({item: reportID}) => { const itemFullReport = reports[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`] || {}; - const itemReportActions = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`]; - const itemParentReportActions = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${itemFullReport.parentReportID}`]; - const itemPolicy = policy[`${ONYXKEYS.COLLECTION.POLICY}${itemFullReport.policyID}`]; - const itemTransaction = `${ONYXKEYS.COLLECTION.TRANSACTION}${lodashGet( + const itemReportActions = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`] || {}; + const itemParentReportActions = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${itemFullReport.parentReportID}`] || {}; + const itemPolicy = policy[`${ONYXKEYS.COLLECTION.POLICY}${itemFullReport.policyID}`] || {}; + const itemTransactions = lodashGet( itemParentReportActions, [itemFullReport.parentReportActionID, 'originalMessage', 'IOUTransactionID'], '', - )}`; + ) + const transactionsList = itemTransactions ? transactions[`${ONYXKEYS.COLLECTION.TRANSACTION}${itemTransactions}`] : transactions; const itemComment = draftComments[`${ONYXKEYS.COLLECTION.REPORT_DRAFT_COMMENT}${reportID}`] || ''; const participantsPersonalDetails = OptionsListUtils.getPersonalDetailsForAccountIDs(itemFullReport.participantAccountIDs, personalDetails); return ( @@ -153,7 +154,7 @@ function LHNOptionsList({ parentReportActions={itemParentReportActions} policy={itemPolicy} personalDetails={participantsPersonalDetails} - transaction={itemTransaction} + transaction={transactionsList} receiptTransactions={transactions} viewMode={optionMode} isFocused={!shouldDisableFocusOptions && reportID === currentReportID} diff --git a/src/components/LHNOptionsList/OptionRowLHNData.js b/src/components/LHNOptionsList/OptionRowLHNData.js index ca579d175cac3..f94ff41f969dd 100644 --- a/src/components/LHNOptionsList/OptionRowLHNData.js +++ b/src/components/LHNOptionsList/OptionRowLHNData.js @@ -38,9 +38,6 @@ const propTypes = { /** The actions from the parent report */ parentReportActions: PropTypes.objectOf(PropTypes.shape(reportActionPropTypes)), - /** The transaction from the parent report action */ - transactionID: PropTypes.string, - ...basePropTypes, }; @@ -50,7 +47,6 @@ const defaultProps = { fullReport: {}, policy: {}, parentReportActions: {}, - transactionID: undefined, preferredLocale: CONST.LOCALES.DEFAULT, ...baseDefaultProps, }; @@ -71,7 +67,7 @@ function OptionRowLHNData({ policy, receiptTransactions, parentReportActions, - transactionID, + transaction, ...propsToForward }) { const reportID = propsToForward.reportID; @@ -97,7 +93,7 @@ function OptionRowLHNData({ // Listen parentReportAction to update title of thread report when parentReportAction changed // Listen to transaction to update title of transaction report when transaction changed // eslint-disable-next-line react-hooks/exhaustive-deps - }, [fullReport, linkedTransaction, reportActions, personalDetails, preferredLocale, policy, parentReportAction, transactionID]); + }, [fullReport, linkedTransaction, reportActions, personalDetails, preferredLocale, policy, parentReportAction, transaction]); useEffect(() => { if (!optionItem || optionItem.hasDraftComment || !comment || comment.length <= 0 || isFocused) { From 92e72deb8b6f162ea02b4b0ecf4357455f1f4596 Mon Sep 17 00:00:00 2001 From: Tomasz Misiukiewicz Date: Wed, 8 Nov 2023 12:26:21 +0100 Subject: [PATCH 2/5] update types --- .../LHNOptionsList/LHNOptionsList.js | 18 +++++------------- 1 file changed, 5 insertions(+), 13 deletions(-) diff --git a/src/components/LHNOptionsList/LHNOptionsList.js b/src/components/LHNOptionsList/LHNOptionsList.js index 924eefd302f07..67cd80ba6cd41 100644 --- a/src/components/LHNOptionsList/LHNOptionsList.js +++ b/src/components/LHNOptionsList/LHNOptionsList.js @@ -5,6 +5,7 @@ import {FlatList, View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import participantPropTypes from '@components/participantPropTypes'; +import transactionPropTypes from '@components/transactionPropTypes'; import withCurrentReportID, {withCurrentReportIDDefaultProps, withCurrentReportIDPropTypes} from '@components/withCurrentReportID'; import compose from '@libs/compose'; import * as OptionsListUtils from '@libs/OptionsListUtils'; @@ -51,7 +52,7 @@ const propTypes = { reports: PropTypes.objectOf(reportPropTypes), /** Array of report actions for this report */ - reportActions: PropTypes.objectOf(PropTypes.shape(reportActionPropTypes)), + reportActions: PropTypes.shape(reportActionPropTypes), /** Indicates which locale the user currently has selected */ preferredLocale: PropTypes.string, @@ -60,12 +61,7 @@ const propTypes = { personalDetails: PropTypes.objectOf(participantPropTypes), /** The transaction from the parent report action */ - transactions: PropTypes.objectOf( - PropTypes.shape({ - /** The ID of the transaction */ - transactionID: PropTypes.string, - }), - ), + transactions: transactionPropTypes, /** List of draft comments */ draftComments: PropTypes.objectOf(PropTypes.string), ...withCurrentReportIDPropTypes, @@ -135,14 +131,10 @@ function LHNOptionsList({ const renderItem = useCallback( ({item: reportID}) => { const itemFullReport = reports[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`] || {}; - const itemReportActions = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`] || {}; + const itemReportActions = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`]; const itemParentReportActions = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${itemFullReport.parentReportID}`] || {}; const itemPolicy = policy[`${ONYXKEYS.COLLECTION.POLICY}${itemFullReport.policyID}`] || {}; - const itemTransactions = lodashGet( - itemParentReportActions, - [itemFullReport.parentReportActionID, 'originalMessage', 'IOUTransactionID'], - '', - ) + const itemTransactions = lodashGet(itemParentReportActions, [itemFullReport.parentReportActionID, 'originalMessage', 'IOUTransactionID'], ''); const transactionsList = itemTransactions ? transactions[`${ONYXKEYS.COLLECTION.TRANSACTION}${itemTransactions}`] : transactions; const itemComment = draftComments[`${ONYXKEYS.COLLECTION.REPORT_DRAFT_COMMENT}${reportID}`] || ''; const participantsPersonalDetails = OptionsListUtils.getPersonalDetailsForAccountIDs(itemFullReport.participantAccountIDs, personalDetails); From f55cbc07ddef2dc2ad977aa71ce8aad8c2ac322b Mon Sep 17 00:00:00 2001 From: Tomasz Misiukiewicz Date: Wed, 8 Nov 2023 12:26:21 +0100 Subject: [PATCH 3/5] update transactions --- src/components/LHNOptionsList/LHNOptionsList.js | 14 +++++++------- src/components/LHNOptionsList/OptionRowLHNData.js | 8 ++++++-- 2 files changed, 13 insertions(+), 9 deletions(-) diff --git a/src/components/LHNOptionsList/LHNOptionsList.js b/src/components/LHNOptionsList/LHNOptionsList.js index 67cd80ba6cd41..98b33f365bdf0 100644 --- a/src/components/LHNOptionsList/LHNOptionsList.js +++ b/src/components/LHNOptionsList/LHNOptionsList.js @@ -52,7 +52,7 @@ const propTypes = { reports: PropTypes.objectOf(reportPropTypes), /** Array of report actions for this report */ - reportActions: PropTypes.shape(reportActionPropTypes), + reportActions: PropTypes.objectOf(PropTypes.shape(reportActionPropTypes)), /** Indicates which locale the user currently has selected */ preferredLocale: PropTypes.string, @@ -61,7 +61,7 @@ const propTypes = { personalDetails: PropTypes.objectOf(participantPropTypes), /** The transaction from the parent report action */ - transactions: transactionPropTypes, + transactions: PropTypes.objectOf(transactionPropTypes), /** List of draft comments */ draftComments: PropTypes.objectOf(PropTypes.string), ...withCurrentReportIDPropTypes, @@ -132,21 +132,21 @@ function LHNOptionsList({ ({item: reportID}) => { const itemFullReport = reports[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`] || {}; const itemReportActions = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`]; - const itemParentReportActions = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${itemFullReport.parentReportID}`] || {}; + const itemParentReportAction = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${itemFullReport.parentReportID}`] || {}; const itemPolicy = policy[`${ONYXKEYS.COLLECTION.POLICY}${itemFullReport.policyID}`] || {}; - const itemTransactions = lodashGet(itemParentReportActions, [itemFullReport.parentReportActionID, 'originalMessage', 'IOUTransactionID'], ''); - const transactionsList = itemTransactions ? transactions[`${ONYXKEYS.COLLECTION.TRANSACTION}${itemTransactions}`] : transactions; + const transactionID = lodashGet(itemParentReportAction, [itemFullReport.parentReportActionID, 'originalMessage', 'IOUTransactionID'], ''); const itemComment = draftComments[`${ONYXKEYS.COLLECTION.REPORT_DRAFT_COMMENT}${reportID}`] || ''; const participantsPersonalDetails = OptionsListUtils.getPersonalDetailsForAccountIDs(itemFullReport.participantAccountIDs, personalDetails); + return ( { if (!optionItem || optionItem.hasDraftComment || !comment || comment.length <= 0 || isFocused) { From dacaba02b320d6c2fc392b459607a8ac3be80bce Mon Sep 17 00:00:00 2001 From: Tomasz Misiukiewicz Date: Wed, 8 Nov 2023 12:26:22 +0100 Subject: [PATCH 4/5] update parentReportAction prop --- src/components/LHNOptionsList/LHNOptionsList.js | 7 ++++--- src/components/LHNOptionsList/OptionRowLHNData.js | 10 ++++------ 2 files changed, 8 insertions(+), 9 deletions(-) diff --git a/src/components/LHNOptionsList/LHNOptionsList.js b/src/components/LHNOptionsList/LHNOptionsList.js index 98b33f365bdf0..dd656b11f6db0 100644 --- a/src/components/LHNOptionsList/LHNOptionsList.js +++ b/src/components/LHNOptionsList/LHNOptionsList.js @@ -132,9 +132,10 @@ function LHNOptionsList({ ({item: reportID}) => { const itemFullReport = reports[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`] || {}; const itemReportActions = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`]; - const itemParentReportAction = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${itemFullReport.parentReportID}`] || {}; + const itemParentReportActions = reportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${itemFullReport.parentReportID}`] || {}; + const itemParentReportAction = itemParentReportActions[itemFullReport.parentReportActionID] || {}; const itemPolicy = policy[`${ONYXKEYS.COLLECTION.POLICY}${itemFullReport.policyID}`] || {}; - const transactionID = lodashGet(itemParentReportAction, [itemFullReport.parentReportActionID, 'originalMessage', 'IOUTransactionID'], ''); + const transactionID = lodashGet(itemParentReportAction, ['originalMessage', 'IOUTransactionID'], ''); const itemComment = draftComments[`${ONYXKEYS.COLLECTION.REPORT_DRAFT_COMMENT}${reportID}`] || ''; const participantsPersonalDetails = OptionsListUtils.getPersonalDetailsForAccountIDs(itemFullReport.participantAccountIDs, personalDetails); @@ -143,7 +144,7 @@ function LHNOptionsList({ reportID={reportID} fullReport={itemFullReport} reportActions={itemReportActions} - parentReportActions={itemParentReportAction} + parentReportAction={itemParentReportAction} policy={itemPolicy} personalDetails={participantsPersonalDetails} transactionID={transactionID} diff --git a/src/components/LHNOptionsList/OptionRowLHNData.js b/src/components/LHNOptionsList/OptionRowLHNData.js index feb764d16524a..d6b4cb92019f3 100644 --- a/src/components/LHNOptionsList/OptionRowLHNData.js +++ b/src/components/LHNOptionsList/OptionRowLHNData.js @@ -35,8 +35,8 @@ const propTypes = { avatar: PropTypes.string, }), - /** The actions from the parent report */ - parentReportActions: PropTypes.objectOf(PropTypes.shape(reportActionPropTypes)), + /** The action from the parent report */ + parentReportAction: PropTypes.shape(reportActionPropTypes), /** ID of the transaction assigned to report */ transactionID: PropTypes.string, @@ -49,7 +49,7 @@ const defaultProps = { personalDetails: {}, fullReport: {}, policy: {}, - parentReportActions: {}, + parentReportAction: {}, transactionID: '', preferredLocale: CONST.LOCALES.DEFAULT, ...baseDefaultProps, @@ -70,15 +70,13 @@ function OptionRowLHNData({ comment, policy, receiptTransactions, - parentReportActions, + parentReportAction, transactionID, ...propsToForward }) { const reportID = propsToForward.reportID; - const parentReportAction = parentReportActions[fullReport.parentReportActionID]; const optionItemRef = useRef(); - const linkedTransaction = useMemo(() => { const sortedReportActions = ReportActionsUtils.getSortedReportActionsForDisplay(reportActions); const lastReportAction = _.first(sortedReportActions); From 46d0739f245cc18af047c039f98d70c39f52dc6a Mon Sep 17 00:00:00 2001 From: Tomasz Misiukiewicz Date: Wed, 8 Nov 2023 13:20:23 +0100 Subject: [PATCH 5/5] revert transaction dependency removal --- src/components/LHNOptionsList/LHNOptionsList.js | 3 ++- src/components/LHNOptionsList/OptionRowLHNData.js | 11 ++++++----- 2 files changed, 8 insertions(+), 6 deletions(-) diff --git a/src/components/LHNOptionsList/LHNOptionsList.js b/src/components/LHNOptionsList/LHNOptionsList.js index dd656b11f6db0..ef1954aeb9480 100644 --- a/src/components/LHNOptionsList/LHNOptionsList.js +++ b/src/components/LHNOptionsList/LHNOptionsList.js @@ -136,6 +136,7 @@ function LHNOptionsList({ const itemParentReportAction = itemParentReportActions[itemFullReport.parentReportActionID] || {}; const itemPolicy = policy[`${ONYXKEYS.COLLECTION.POLICY}${itemFullReport.policyID}`] || {}; const transactionID = lodashGet(itemParentReportAction, ['originalMessage', 'IOUTransactionID'], ''); + const itemTransaction = transactionID ? transactions[`${ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`] : {}; const itemComment = draftComments[`${ONYXKEYS.COLLECTION.REPORT_DRAFT_COMMENT}${reportID}`] || ''; const participantsPersonalDetails = OptionsListUtils.getPersonalDetailsForAccountIDs(itemFullReport.participantAccountIDs, personalDetails); @@ -147,7 +148,7 @@ function LHNOptionsList({ parentReportAction={itemParentReportAction} policy={itemPolicy} personalDetails={participantsPersonalDetails} - transactionID={transactionID} + transaction={itemTransaction} receiptTransactions={transactions} viewMode={optionMode} isFocused={!shouldDisableFocusOptions && reportID === currentReportID} diff --git a/src/components/LHNOptionsList/OptionRowLHNData.js b/src/components/LHNOptionsList/OptionRowLHNData.js index d6b4cb92019f3..e11bfc3cab98d 100644 --- a/src/components/LHNOptionsList/OptionRowLHNData.js +++ b/src/components/LHNOptionsList/OptionRowLHNData.js @@ -3,6 +3,7 @@ import PropTypes from 'prop-types'; import React, {useEffect, useMemo, useRef} from 'react'; import _ from 'underscore'; import participantPropTypes from '@components/participantPropTypes'; +import transactionPropTypes from '@components/transactionPropTypes'; import * as ReportActionsUtils from '@libs/ReportActionsUtils'; import SidebarUtils from '@libs/SidebarUtils'; import * as TransactionUtils from '@libs/TransactionUtils'; @@ -38,8 +39,8 @@ const propTypes = { /** The action from the parent report */ parentReportAction: PropTypes.shape(reportActionPropTypes), - /** ID of the transaction assigned to report */ - transactionID: PropTypes.string, + /** The transaction from the parent report action */ + transaction: transactionPropTypes, ...basePropTypes, }; @@ -50,7 +51,7 @@ const defaultProps = { fullReport: {}, policy: {}, parentReportAction: {}, - transactionID: '', + transaction: {}, preferredLocale: CONST.LOCALES.DEFAULT, ...baseDefaultProps, }; @@ -71,7 +72,7 @@ function OptionRowLHNData({ policy, receiptTransactions, parentReportAction, - transactionID, + transaction, ...propsToForward }) { const reportID = propsToForward.reportID; @@ -95,7 +96,7 @@ function OptionRowLHNData({ // Listen parentReportAction to update title of thread report when parentReportAction changed // Listen to transaction to update title of transaction report when transaction changed // eslint-disable-next-line react-hooks/exhaustive-deps - }, [fullReport, linkedTransaction, reportActions, personalDetails, preferredLocale, policy, parentReportAction, transactionID]); + }, [fullReport, linkedTransaction, reportActions, personalDetails, preferredLocale, policy, parentReportAction, transaction]); useEffect(() => { if (!optionItem || optionItem.hasDraftComment || !comment || comment.length <= 0 || isFocused) {