diff --git a/src/components/ReportActionItem/MoneyRequestPreview.js b/src/components/ReportActionItem/MoneyRequestPreview.js index 65372c2599551..9c533f18ea7ee 100644 --- a/src/components/ReportActionItem/MoneyRequestPreview.js +++ b/src/components/ReportActionItem/MoneyRequestPreview.js @@ -254,7 +254,7 @@ function MoneyRequestPreview(props) { )} - {requestMerchant && ( + {!_.isEmpty(requestMerchant) && ( {requestMerchant} diff --git a/src/components/ReportActionItem/ReportActionItemImages.js b/src/components/ReportActionItem/ReportActionItemImages.js index a5dcc0ccaea2d..138412fed37b4 100644 --- a/src/components/ReportActionItem/ReportActionItemImages.js +++ b/src/components/ReportActionItem/ReportActionItemImages.js @@ -35,6 +35,15 @@ const defaultProps = { isHovered: false, }; +/** + * This component displays a row of images in a report action item like a card, such + * as report previews or money request previews which contain receipt images. The maximum of images + * shown in this row is dictated by the size prop, which, if not passed, is just the number of images. + * Otherwise, if size is passed and the number of images is over size, we show a small overlay on the + * last image of how many additional images there are. If passed, total prop can be used to change how this + * additional number when subtracted from size. + */ + function ReportActionItemImages({images, size, total, isHovered}) { const numberOfShownImages = size || images.length; const shownImages = images.slice(0, size); diff --git a/src/components/ReportActionItem/ReportPreview.js b/src/components/ReportActionItem/ReportPreview.js index 21d45c10c8a27..18ca7e7cf2c2a 100644 --- a/src/components/ReportActionItem/ReportPreview.js +++ b/src/components/ReportActionItem/ReportPreview.js @@ -105,10 +105,10 @@ function ReportPreview(props) { const numberOfRequests = ReportActionUtils.getNumberOfMoneyRequests(props.action); const moneyRequestComment = lodashGet(props.action, 'childLastMoneyRequestComment', ''); - const transactionsWithReceipts = ReportUtils.getTransactionsWithReceipts(props.iouReport); + const transactionsWithReceipts = ReportUtils.getTransactionsWithReceipts(props.iouReportID); const numberOfScanningReceipts = _.filter(transactionsWithReceipts, (transaction) => TransactionUtils.isReceiptBeingScanned(transaction)).length; const hasReceipts = transactionsWithReceipts.length > 0; - const isScanning = hasReceipts && ReportUtils.areAllRequestsBeingSmartScanned(props.iouReport, props.action); + const isScanning = hasReceipts && ReportUtils.areAllRequestsBeingSmartScanned(props.iouReportID, props.action); const lastThreeTransactionsWithReceipts = ReportUtils.getReportPreviewDisplayTransactions(props.action); const hasOnlyOneReceiptRequest = numberOfRequests === 1 && hasReceipts; diff --git a/src/libs/ReportUtils.js b/src/libs/ReportUtils.js index 224b195c3d991..82f19d4ae3702 100644 --- a/src/libs/ReportUtils.js +++ b/src/libs/ReportUtils.js @@ -1252,12 +1252,11 @@ function getTransactionDetails(transaction) { /** * Gets all transactions on an IOU report with a receipt * - * @param {Object|null} iouReport + * @param {Object|null} iouReportID * @returns {[Object]} */ -function getTransactionsWithReceipts(iouReport) { - const reportID = lodashGet(iouReport, 'reportID'); - const reportActions = ReportActionsUtils.getAllReportActions(reportID); +function getTransactionsWithReceipts(iouReportID) { + const reportActions = ReportActionsUtils.getAllReportActions(iouReportID); return _.reduce( reportActions, (transactions, action) => { @@ -1280,17 +1279,17 @@ function getTransactionsWithReceipts(iouReport) { * or as soon as one receipt request is done scanning, we have at least one * "ready" money request, and we remove this indicator to show the partial report total. * - * @param {Object|null} iouReport + * @param {Object|null} iouReportID * @param {Object|null} reportPreviewAction the preview action associated with the IOU report * @returns {Boolean} */ -function areAllRequestsBeingSmartScanned(iouReport, reportPreviewAction) { - const transactions = getTransactionsWithReceipts(iouReport); +function areAllRequestsBeingSmartScanned(iouReportID, reportPreviewAction) { + const transactionsWithReceipts = getTransactionsWithReceipts(iouReportID); // If we have more requests than requests with receipts, we have some manual requests - if (ReportActionsUtils.getNumberOfMoneyRequests(reportPreviewAction) > transactions.length) { + if (ReportActionsUtils.getNumberOfMoneyRequests(reportPreviewAction) > transactionsWithReceipts.length) { return false; } - return _.all(transactions, (transaction) => TransactionUtils.isReceiptBeingScanned(transaction)); + return _.all(transactionsWithReceipts, (transaction) => TransactionUtils.isReceiptBeingScanned(transaction)); } /** diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js index e1071a2ad5a19..267b3eced25f0 100644 --- a/src/libs/actions/IOU.js +++ b/src/libs/actions/IOU.js @@ -426,6 +426,8 @@ function getMoneyRequestInformation(report, participant, comment, amount, curren optimisticTransaction.transactionID, '', iouReport.reportID, + false, + false, receiptObject, );