From 34e3fa2f97813edc026078498fa04ad4c49f7b13 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Fri, 3 Nov 2023 11:35:16 -0600 Subject: [PATCH 1/8] Remove sideloading of Onyx data for attachment modal --- .../attachmentCarouselPropTypes.js | 13 ++++++++ .../extractAttachmentsFromReport.js | 7 ++-- .../Attachments/AttachmentCarousel/index.js | 33 ++++++++++++++----- .../AttachmentCarousel/index.native.js | 31 +++++++++++++---- 4 files changed, 66 insertions(+), 18 deletions(-) diff --git a/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js b/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js index 8048773de42c..ae1c6f4d8f25 100644 --- a/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js +++ b/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js @@ -1,4 +1,5 @@ import PropTypes from 'prop-types'; +import transactionPropTypes from '@components/transactionPropTypes'; import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; import reportPropTypes from '@pages/reportPropTypes'; @@ -20,11 +21,23 @@ const propTypes = { /** The report currently being looked at */ report: reportPropTypes.isRequired, + + /** The parent of `report` */ + parentReport: reportPropTypes, + + /** The specific action that links to the parent report */ + parentReportActions: PropTypes.shape(reportActionPropTypes), + + /** The transaction attached to the parent report action */ + transaction: transactionPropTypes, }; const defaultProps = { source: '', reportActions: {}, + parentReport: {}, + parentReportActions: {}, + transaction: {}, onNavigate: () => {}, onClose: () => {}, setDownloadButtonVisibility: () => {}, diff --git a/src/components/Attachments/AttachmentCarousel/extractAttachmentsFromReport.js b/src/components/Attachments/AttachmentCarousel/extractAttachmentsFromReport.js index 6f0dd335c2bb..6caf70c025cd 100644 --- a/src/components/Attachments/AttachmentCarousel/extractAttachmentsFromReport.js +++ b/src/components/Attachments/AttachmentCarousel/extractAttachmentsFromReport.js @@ -10,11 +10,13 @@ import CONST from '@src/CONST'; /** * Constructs the initial component state from report actions * @param {Object} report + * @param {Object} parentReportAction * @param {Array} reportActions + * @param {Object} transaction * @returns {Array} */ -function extractAttachmentsFromReport(report, reportActions) { - const actions = [ReportActionsUtils.getParentReportAction(report), ...ReportActionsUtils.getSortedReportActions(_.values(reportActions))]; +function extractAttachmentsFromReport(report, parentReportAction, reportActions, transaction) { + const actions = [parentReportAction, ...ReportActionsUtils.getSortedReportActions(_.values(reportActions))]; const attachments = []; const htmlParser = new HtmlParser({ @@ -51,7 +53,6 @@ function extractAttachmentsFromReport(report, reportActions) { return; } - const transaction = TransactionUtils.getTransaction(transactionID); if (TransactionUtils.hasReceipt(transaction)) { const {image} = ReceiptUtils.getThumbnailAndImageURIs(transaction); const isLocalFile = typeof image === 'string' && (image.startsWith('blob:') || image.startsWith('file:')); diff --git a/src/components/Attachments/AttachmentCarousel/index.js b/src/components/Attachments/AttachmentCarousel/index.js index ad907707b9a7..f34d08ec6a22 100644 --- a/src/components/Attachments/AttachmentCarousel/index.js +++ b/src/components/Attachments/AttachmentCarousel/index.js @@ -1,3 +1,4 @@ +import lodashGet from 'lodash/get'; import React, {useCallback, useEffect, useRef, useState} from 'react'; import {FlatList, Keyboard, PixelRatio, View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; @@ -9,7 +10,6 @@ import withWindowDimensions from '@components/withWindowDimensions'; import compose from '@libs/compose'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import Navigation from '@libs/Navigation/Navigation'; -import * as ReportActionsUtils from '@libs/ReportActionsUtils'; import styles from '@styles/styles'; import variables from '@styles/variables'; import ONYXKEYS from '@src/ONYXKEYS'; @@ -27,7 +27,7 @@ const viewabilityConfig = { itemVisiblePercentThreshold: 95, }; -function AttachmentCarousel({report, reportActions, source, onNavigate, setDownloadButtonVisibility, translate}) { +function AttachmentCarousel({report, reportActions, parentReportActions, source, onNavigate, setDownloadButtonVisibility, translate, transaction}) { const scrollRef = useRef(null); const canUseTouchScreen = DeviceCapabilities.canUseTouchScreen(); @@ -42,17 +42,16 @@ function AttachmentCarousel({report, reportActions, source, onNavigate, setDownl const compareImage = useCallback( (attachment) => { if (attachment.isReceipt && isReceipt) { - const action = ReportActionsUtils.getParentReportAction(report); - const transactionID = _.get(action, ['originalMessage', 'IOUTransactionID']); - return attachment.transactionID === transactionID; + return attachment.transactionID === transaction.transactionID; } return attachment.source === source; }, - [source, report, isReceipt], + [source, isReceipt, transaction], ); useEffect(() => { - const attachmentsFromReport = extractAttachmentsFromReport(report, reportActions); + const parentReportAction = parentReportActions[report.parentReportActionID]; + const attachmentsFromReport = extractAttachmentsFromReport(report, parentReportAction, reportActions, transaction); const initialPage = _.findIndex(attachmentsFromReport, compareImage); @@ -72,7 +71,7 @@ function AttachmentCarousel({report, reportActions, source, onNavigate, setDownl } } // eslint-disable-next-line react-hooks/exhaustive-deps - }, [reportActions, compareImage]); + }, [reportActions, parentReportActions, compareImage]); /** * Updates the page state when the user navigates between attachments @@ -224,11 +223,29 @@ AttachmentCarousel.propTypes = propTypes; AttachmentCarousel.defaultProps = defaultProps; export default compose( + // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file withOnyx({ reportActions: { key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report.reportID}`, canEvict: false, }, + parentReport: { + key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT}${report ? report.parentReportID : '0'}`, + }, + parentReportActions: { + key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report ? report.parentReportID : '0'}`, + canEvict: false, + }, + }), + + // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file + withOnyx({ + transaction: { + key: ({report, parentReportActions}) => { + const parentReportAction = lodashGet(parentReportActions, [report.parentReportActionID]); + return `${ONYXKEYS.COLLECTION.TRANSACTION}${lodashGet(parentReportAction, 'originalMessage.IOUTransactionID', 0)}`; + }, + }, }), withLocalize, withWindowDimensions, diff --git a/src/components/Attachments/AttachmentCarousel/index.native.js b/src/components/Attachments/AttachmentCarousel/index.native.js index 7088a5c7057c..cdd302f17db2 100644 --- a/src/components/Attachments/AttachmentCarousel/index.native.js +++ b/src/components/Attachments/AttachmentCarousel/index.native.js @@ -1,3 +1,4 @@ +import lodashGet from 'lodash/get'; import React, {useCallback, useEffect, useRef, useState} from 'react'; import {Keyboard, PixelRatio, View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; @@ -7,7 +8,6 @@ import * as Illustrations from '@components/Icon/Illustrations'; import withLocalize from '@components/withLocalize'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import * as ReportActionsUtils from '@libs/ReportActionsUtils'; import styles from '@styles/styles'; import variables from '@styles/variables'; import ONYXKEYS from '@src/ONYXKEYS'; @@ -18,7 +18,7 @@ import extractAttachmentsFromReport from './extractAttachmentsFromReport'; import AttachmentCarouselPager from './Pager'; import useCarouselArrows from './useCarouselArrows'; -function AttachmentCarousel({report, reportActions, source, onNavigate, onClose, setDownloadButtonVisibility, translate}) { +function AttachmentCarousel({report, reportActions, parentReportActions, source, onNavigate, setDownloadButtonVisibility, translate, transaction, onClose}) { const pagerRef = useRef(null); const [containerDimensions, setContainerDimensions] = useState({width: 0, height: 0}); @@ -32,17 +32,16 @@ function AttachmentCarousel({report, reportActions, source, onNavigate, onClose, const compareImage = useCallback( (attachment) => { if (attachment.isReceipt && isReceipt) { - const action = ReportActionsUtils.getParentReportAction(report); - const transactionID = _.get(action, ['originalMessage', 'IOUTransactionID']); - return attachment.transactionID === transactionID; + return attachment.transactionID === transaction.transactionID; } return attachment.source === source; }, - [source, report, isReceipt], + [source, isReceipt, transaction], ); useEffect(() => { - const attachmentsFromReport = extractAttachmentsFromReport(report, reportActions); + const parentReportAction = parentReportActions[report.parentReportActionID]; + const attachmentsFromReport = extractAttachmentsFromReport(report, parentReportAction, reportActions, transaction); const initialPage = _.findIndex(attachmentsFromReport, compareImage); @@ -171,11 +170,29 @@ AttachmentCarousel.propTypes = propTypes; AttachmentCarousel.defaultProps = defaultProps; export default compose( + // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file withOnyx({ reportActions: { key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report.reportID}`, canEvict: false, }, + parentReport: { + key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT}${report ? report.parentReportID : '0'}`, + }, + parentReportActions: { + key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report ? report.parentReportID : '0'}`, + canEvict: false, + }, + }), + + // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file + withOnyx({ + transaction: { + key: ({report, parentReportActions}) => { + const parentReportAction = lodashGet(parentReportActions, [report.parentReportActionID]); + return `${ONYXKEYS.COLLECTION.TRANSACTION}${lodashGet(parentReportAction, 'originalMessage.IOUTransactionID', 0)}`; + }, + }, }), withLocalize, )(AttachmentCarousel); From d0b5968e58d1f7b7a6dc50fc79f93a5a8df58a36 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Tue, 7 Nov 2023 08:30:32 -0700 Subject: [PATCH 2/8] Remove nested withOnyx --- src/components/Attachments/AttachmentCarousel/index.js | 4 ---- .../Attachments/AttachmentCarousel/index.native.js | 5 ----- 2 files changed, 9 deletions(-) diff --git a/src/components/Attachments/AttachmentCarousel/index.js b/src/components/Attachments/AttachmentCarousel/index.js index 584d7c43fe53..08086926437c 100644 --- a/src/components/Attachments/AttachmentCarousel/index.js +++ b/src/components/Attachments/AttachmentCarousel/index.js @@ -238,10 +238,6 @@ export default compose( key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report ? report.parentReportID : '0'}`, canEvict: false, }, - }), - - // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file - withOnyx({ transaction: { key: ({report, parentReportActions}) => { const parentReportAction = lodashGet(parentReportActions, [report.parentReportActionID]); diff --git a/src/components/Attachments/AttachmentCarousel/index.native.js b/src/components/Attachments/AttachmentCarousel/index.native.js index 557f57e0f739..29c6fc8b9338 100644 --- a/src/components/Attachments/AttachmentCarousel/index.native.js +++ b/src/components/Attachments/AttachmentCarousel/index.native.js @@ -171,7 +171,6 @@ AttachmentCarousel.defaultProps = defaultProps; AttachmentCarousel.displayName = 'AttachmentCarousel'; export default compose( - // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file withOnyx({ reportActions: { key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report.reportID}`, @@ -184,10 +183,6 @@ export default compose( key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report ? report.parentReportID : '0'}`, canEvict: false, }, - }), - - // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file - withOnyx({ transaction: { key: ({report, parentReportActions}) => { const parentReportAction = lodashGet(parentReportActions, [report.parentReportActionID]); From 00d73e272df6708a64feeab35870f79ce45efb52 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Tue, 7 Nov 2023 08:34:03 -0700 Subject: [PATCH 3/8] Update comment to be accurate --- .../AttachmentCarousel/attachmentCarouselPropTypes.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js b/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js index ae1c6f4d8f25..171b79628aed 100644 --- a/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js +++ b/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js @@ -25,7 +25,7 @@ const propTypes = { /** The parent of `report` */ parentReport: reportPropTypes, - /** The specific action that links to the parent report */ + /** The report actions of the parent report */ parentReportActions: PropTypes.shape(reportActionPropTypes), /** The transaction attached to the parent report action */ From efcfe079c6b4ff31f39e49d979ccaee584625ed5 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Wed, 8 Nov 2023 11:13:28 -0700 Subject: [PATCH 4/8] Fix proptypes, remove unused parameter --- .../AttachmentCarousel/attachmentCarouselPropTypes.js | 4 ++-- .../AttachmentCarousel/extractAttachmentsFromReport.js | 5 ++--- src/components/Attachments/AttachmentCarousel/index.js | 3 +-- .../Attachments/AttachmentCarousel/index.native.js | 2 +- 4 files changed, 6 insertions(+), 8 deletions(-) diff --git a/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js b/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js index 171b79628aed..7543e8d9c099 100644 --- a/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js +++ b/src/components/Attachments/AttachmentCarousel/attachmentCarouselPropTypes.js @@ -17,7 +17,7 @@ const propTypes = { setDownloadButtonVisibility: PropTypes.func, /** Object of report actions for this report */ - reportActions: PropTypes.shape(reportActionPropTypes), + reportActions: PropTypes.objectOf(PropTypes.shape(reportActionPropTypes)), /** The report currently being looked at */ report: reportPropTypes.isRequired, @@ -26,7 +26,7 @@ const propTypes = { parentReport: reportPropTypes, /** The report actions of the parent report */ - parentReportActions: PropTypes.shape(reportActionPropTypes), + parentReportActions: PropTypes.objectOf(PropTypes.shape(reportActionPropTypes)), /** The transaction attached to the parent report action */ transaction: transactionPropTypes, diff --git a/src/components/Attachments/AttachmentCarousel/extractAttachmentsFromReport.js b/src/components/Attachments/AttachmentCarousel/extractAttachmentsFromReport.js index 6caf70c025cd..28af6b511641 100644 --- a/src/components/Attachments/AttachmentCarousel/extractAttachmentsFromReport.js +++ b/src/components/Attachments/AttachmentCarousel/extractAttachmentsFromReport.js @@ -9,13 +9,12 @@ import CONST from '@src/CONST'; /** * Constructs the initial component state from report actions - * @param {Object} report * @param {Object} parentReportAction - * @param {Array} reportActions + * @param {Object} reportActions * @param {Object} transaction * @returns {Array} */ -function extractAttachmentsFromReport(report, parentReportAction, reportActions, transaction) { +function extractAttachmentsFromReport(parentReportAction, reportActions, transaction) { const actions = [parentReportAction, ...ReportActionsUtils.getSortedReportActions(_.values(reportActions))]; const attachments = []; diff --git a/src/components/Attachments/AttachmentCarousel/index.js b/src/components/Attachments/AttachmentCarousel/index.js index 08086926437c..819146f48712 100644 --- a/src/components/Attachments/AttachmentCarousel/index.js +++ b/src/components/Attachments/AttachmentCarousel/index.js @@ -51,7 +51,7 @@ function AttachmentCarousel({report, reportActions, parentReportActions, source, useEffect(() => { const parentReportAction = parentReportActions[report.parentReportActionID]; - const attachmentsFromReport = extractAttachmentsFromReport(report, parentReportAction, reportActions, transaction); + const attachmentsFromReport = extractAttachmentsFromReport(parentReportAction, reportActions, transaction); const initialPage = _.findIndex(attachmentsFromReport, compareImage); @@ -225,7 +225,6 @@ AttachmentCarousel.defaultProps = defaultProps; AttachmentCarousel.displayName = 'AttachmentCarousel'; export default compose( - // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file withOnyx({ reportActions: { key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report.reportID}`, diff --git a/src/components/Attachments/AttachmentCarousel/index.native.js b/src/components/Attachments/AttachmentCarousel/index.native.js index 29c6fc8b9338..5409ec3e83bc 100644 --- a/src/components/Attachments/AttachmentCarousel/index.native.js +++ b/src/components/Attachments/AttachmentCarousel/index.native.js @@ -41,7 +41,7 @@ function AttachmentCarousel({report, reportActions, parentReportActions, source, useEffect(() => { const parentReportAction = parentReportActions[report.parentReportActionID]; - const attachmentsFromReport = extractAttachmentsFromReport(report, parentReportAction, reportActions, transaction); + const attachmentsFromReport = extractAttachmentsFromReport(parentReportAction, reportActions, transaction); const initialPage = _.findIndex(attachmentsFromReport, compareImage); From 285f16f9ddb10c715f5a65a3f55b8af7723d6455 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Thu, 9 Nov 2023 14:29:50 -0700 Subject: [PATCH 5/8] Improve accuracy of attachment header title --- src/components/AttachmentModal.js | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/components/AttachmentModal.js b/src/components/AttachmentModal.js index 8231dd7c4fe2..3bce628077dc 100755 --- a/src/components/AttachmentModal.js +++ b/src/components/AttachmentModal.js @@ -117,7 +117,7 @@ function AttachmentModal(props) { const [isAttachmentInvalid, setIsAttachmentInvalid] = useState(false); const [isDeleteReceiptConfirmModalVisible, setIsDeleteReceiptConfirmModalVisible] = useState(false); const [isAuthTokenRequired, setIsAuthTokenRequired] = useState(props.isAuthTokenRequired); - const [isAttachmentReceipt, setIsAttachmentReceipt] = useState(false); + const [isAttachmentReceipt, setIsAttachmentReceipt] = useState(null); const [attachmentInvalidReasonTitle, setAttachmentInvalidReasonTitle] = useState(''); const [attachmentInvalidReason, setAttachmentInvalidReason] = useState(null); const [source, setSource] = useState(props.source); @@ -393,6 +393,11 @@ function AttachmentModal(props) { // eslint-disable-next-line react-hooks/exhaustive-deps }, [isAttachmentReceipt, props.parentReport, props.parentReportActions, props.policy, props.transaction]); + let headerTitle = props.headerTitle; + if (!_.isNull(isAttachmentReceipt)) { + headerTitle = translate(isAttachmentReceipt ? 'common.receipt' : 'common.attachment'); + } + return ( <> {props.isSmallScreenWidth && } downloadAttachment(source)} From 2e403d05457d4e821baee326b763b379e403b802 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Thu, 9 Nov 2023 15:12:38 -0700 Subject: [PATCH 6/8] Don't show the buttons until the file type is known --- src/components/AttachmentModal.js | 20 +++++++++++++------- 1 file changed, 13 insertions(+), 7 deletions(-) diff --git a/src/components/AttachmentModal.js b/src/components/AttachmentModal.js index 3bce628077dc..890053522674 100755 --- a/src/components/AttachmentModal.js +++ b/src/components/AttachmentModal.js @@ -124,7 +124,7 @@ function AttachmentModal(props) { const [modalType, setModalType] = useState(CONST.MODAL.MODAL_TYPE.CENTERED_UNSWIPEABLE); const [isConfirmButtonDisabled, setIsConfirmButtonDisabled] = useState(false); const [confirmButtonFadeAnimation] = useState(() => new Animated.Value(1)); - const [shouldShowDownloadButton, setShouldShowDownloadButton] = React.useState(true); + const [isDownloadButtonReadyToBeShown, setIsDownloadButtonReadyToBeShown] = React.useState(true); const {windowWidth} = useWindowDimensions(); const [file, setFile] = useState( @@ -173,13 +173,13 @@ function AttachmentModal(props) { ); const setDownloadButtonVisibility = useCallback( - (shouldShowButton) => { - if (shouldShowDownloadButton === shouldShowButton) { + (isButtonVisible) => { + if (isDownloadButtonReadyToBeShown === isButtonVisible) { return; } - setShouldShowDownloadButton(shouldShowButton); + setIsDownloadButtonReadyToBeShown(isButtonVisible); }, - [shouldShowDownloadButton], + [isDownloadButtonReadyToBeShown], ); /** @@ -393,9 +393,15 @@ function AttachmentModal(props) { // eslint-disable-next-line react-hooks/exhaustive-deps }, [isAttachmentReceipt, props.parentReport, props.parentReportActions, props.policy, props.transaction]); + // There are a few things that shouldn't be set until we absolutely know if the file is a receipt or an attachment. + // isAttachmentReceipt will be null until its certain what the file is, in which case it will then be true|false. let headerTitle = props.headerTitle; + let shouldShowDownloadButton = false; + let shouldShowThreeDotsButton = false; if (!_.isNull(isAttachmentReceipt)) { headerTitle = translate(isAttachmentReceipt ? 'common.receipt' : 'common.attachment'); + shouldShowDownloadButton = props.allowDownload && isDownloadButtonReadyToBeShown && !isAttachmentReceipt && !isOffline; + shouldShowThreeDotsButton = isAttachmentReceipt && isModalOpen; } return ( @@ -424,13 +430,13 @@ function AttachmentModal(props) { downloadAttachment(source)} shouldShowCloseButton={!props.isSmallScreenWidth} shouldShowBackButton={props.isSmallScreenWidth} onBackButtonPress={closeModal} onCloseButtonPress={closeModal} - shouldShowThreeDotsButton={isAttachmentReceipt && isModalOpen} + shouldShowThreeDotsButton={shouldShowThreeDotsButton} threeDotsAnchorPosition={styles.threeDotsPopoverOffsetAttachmentModal(windowWidth)} threeDotsMenuItems={threeDotsMenuItems} shouldOverlay From e5edd859442d3b54d0a39ac6ab5ef6fc0a5028f2 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Mon, 13 Nov 2023 08:58:30 -0700 Subject: [PATCH 7/8] Use multiple withOnyx --- src/components/Attachments/AttachmentCarousel/index.js | 2 ++ src/components/Attachments/AttachmentCarousel/index.native.js | 2 ++ 2 files changed, 4 insertions(+) diff --git a/src/components/Attachments/AttachmentCarousel/index.js b/src/components/Attachments/AttachmentCarousel/index.js index 819146f48712..6435017cca82 100644 --- a/src/components/Attachments/AttachmentCarousel/index.js +++ b/src/components/Attachments/AttachmentCarousel/index.js @@ -237,6 +237,8 @@ export default compose( key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report ? report.parentReportID : '0'}`, canEvict: false, }, + }), + withOnyx({ transaction: { key: ({report, parentReportActions}) => { const parentReportAction = lodashGet(parentReportActions, [report.parentReportActionID]); diff --git a/src/components/Attachments/AttachmentCarousel/index.native.js b/src/components/Attachments/AttachmentCarousel/index.native.js index 5409ec3e83bc..5190fef7101e 100644 --- a/src/components/Attachments/AttachmentCarousel/index.native.js +++ b/src/components/Attachments/AttachmentCarousel/index.native.js @@ -183,6 +183,8 @@ export default compose( key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report ? report.parentReportID : '0'}`, canEvict: false, }, + }), + withOnyx({ transaction: { key: ({report, parentReportActions}) => { const parentReportAction = lodashGet(parentReportActions, [report.parentReportActionID]); From 00879f5cdad4dd70cb1a9c22bc2ad05042d61805 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Mon, 13 Nov 2023 10:58:37 -0700 Subject: [PATCH 8/8] disable eslint for multiple onyx --- src/components/Attachments/AttachmentCarousel/index.js | 2 ++ src/components/Attachments/AttachmentCarousel/index.native.js | 2 ++ 2 files changed, 4 insertions(+) diff --git a/src/components/Attachments/AttachmentCarousel/index.js b/src/components/Attachments/AttachmentCarousel/index.js index 6435017cca82..c489f554edd4 100644 --- a/src/components/Attachments/AttachmentCarousel/index.js +++ b/src/components/Attachments/AttachmentCarousel/index.js @@ -225,6 +225,7 @@ AttachmentCarousel.defaultProps = defaultProps; AttachmentCarousel.displayName = 'AttachmentCarousel'; export default compose( + // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file withOnyx({ reportActions: { key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report.reportID}`, @@ -238,6 +239,7 @@ export default compose( canEvict: false, }, }), + // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file withOnyx({ transaction: { key: ({report, parentReportActions}) => { diff --git a/src/components/Attachments/AttachmentCarousel/index.native.js b/src/components/Attachments/AttachmentCarousel/index.native.js index 5190fef7101e..1527b027db8d 100644 --- a/src/components/Attachments/AttachmentCarousel/index.native.js +++ b/src/components/Attachments/AttachmentCarousel/index.native.js @@ -171,6 +171,7 @@ AttachmentCarousel.defaultProps = defaultProps; AttachmentCarousel.displayName = 'AttachmentCarousel'; export default compose( + // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file withOnyx({ reportActions: { key: ({report}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report.reportID}`, @@ -184,6 +185,7 @@ export default compose( canEvict: false, }, }), + // eslint-disable-next-line rulesdir/no-multiple-onyx-in-file withOnyx({ transaction: { key: ({report, parentReportActions}) => {