Sync newly returned report objects from commands

src/libs/actions/IOU.js

@@ -5,7 +5,7 @@ import CONST from '../../CONST';
 import ONYXKEYS from '../../ONYXKEYS';
 import ROUTES from '../../ROUTES';
 import * as API from '../API';
-import {getSimplifiedIOUReport, fetchChatReportsByIDs, fetchIOUReportByIDAndUpdateChatReport} from './Report';
+import {getSimplifiedIOUReport, syncChatAndIOUReports} from './Report';
 import Navigation from '../Navigation/Navigation';
 
 /**
@@ -144,14 +144,15 @@ function rejectTransaction({
             if (response.jsonCode !== 200) {
                 throw new Error(`${response.code} ${response.message}`);
             }
-            fetchChatReportsByIDs([chatReportID]);
-
-            // If an iouReport is open (has an IOU, but is not yet paid) then we sync the chatReport's 'iouReportID'
-            // field in Onyx, simplifying IOU data retrieval and reducing necessary API calls when displaying IOU
-            // components. If we didn't sync the reportIDs, the transaction would still be shown to users as rejectable
-            // The iouReport being fetched here must be open, because only an open iouReoport can be paid. Therefore,
-            // we should also sync the chatReport after fetching the iouReport.
-            fetchIOUReportByIDAndUpdateChatReport(reportID, chatReportID);
+
+            // Save the updated chat and iou reports sent back in the response
+            // NOTE: since the API doesn't handle syncing chat reports with IOU reports,
+            // we also need to set the iouReportID and hasOutstandingIOU fields of the chatReport in Onyx manually
+            // If we didn't sync the reportIDs, the paid IOU would still be shown to users as unpaid. The
+            // iouReport being fetched here must be open, because only an open iouReport can be paid.
+            const chatReportStuff = response.reports[chatReportID];
+            const iouReportStuff = response.reports[reportID];
+            syncChatAndIOUReports(chatReportStuff, iouReportStuff);
         })
         .catch(error => console.error(`Error rejecting transaction: ${error}`));
 }
@@ -204,14 +205,15 @@ function payIOUReport({
             if (response.jsonCode !== 200) {
                 throw new Error(response.message);
             }
-            fetchChatReportsByIDs([chatReportID]);
-
-            // If an iouReport is open (has an IOU, but is not yet paid) then we sync the chatReport's 'iouReportID'
-            // field in Onyx, simplifying IOU data retrieval and reducing necessary API calls when displaying IOU
-            // components. If we didn't sync the reportIDs, the paid IOU would still be shown to users as unpaid. The
-            // iouReport being fetched here must be open, because only an open iouReoport can be paid.
-            // Therefore, we should also sync the chatReport after fetching the iouReport.
-            fetchIOUReportByIDAndUpdateChatReport(reportID, chatReportID);
+
+            // Save the updated chat and iou reports sent back in the response
+            // NOTE: since the API doesn't handle syncing chat reports with IOU reports,
+            // we also need to set the iouReportID and hasOutstandingIOU fields of the chatReport in Onyx manually
+            // If we didn't sync the reportIDs, the paid IOU would still be shown to users as unpaid. The
+            // iouReport being fetched here must be open, because only an open iouReport can be paid.
+            const chatReportStuff = response.reports[chatReportID];
+            const iouReportStuff = response.reports[reportID];
+            syncChatAndIOUReports(chatReportStuff, iouReportStuff);
 
             // Once we have successfully paid the IOU we will transfer the user to their platform of choice if they have
             // selected something other than a manual settlement or Expensify Wallet e.g. Venmo or PayPal.me

src/libs/actions/Report.js

@@ -1266,6 +1266,28 @@ function saveReportActionDraft(reportID, reportActionID, draftMessage) {
     Onyx.set(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS_DRAFTS}${reportID}_${reportActionID}`, draftMessage);
 }
 
+/**
+ * Syncs up a chat report and an IOU report in Onyx after an IOU transaction has been made
+ * and they've both been updated in the back-end.
+ * @param {Object} chatReportStuff
+ * @param {Object} iouReportStuff
+ */
+function syncChatAndIOUReports(chatReportStuff, iouReportStuff) {
+    const iouReportData = {};
+    const chatReportData = {};
+    const chatReportKey = `${ONYXKEYS.COLLECTION.REPORT}${chatReportStuff.reportID}`;
+    const iouReportKey = `${ONYXKEYS.COLLECTION.REPORT_IOUS}${iouReportStuff.reportID}`;
+
+    chatReportData[chatReportKey] = getSimplifiedReportObject(chatReportStuff);
+    chatReportData[chatReportKey].iouReportID = iouReportStuff.reportID;
+    chatReportData[chatReportKey].hasOutstandingIOU = iouReportStuff.stateNum
+        === CONST.REPORT.STATE_NUM.PROCESSING && iouReportStuff.total !== 0;
+    iouReportData[iouReportKey] = getSimplifiedIOUReport(iouReportStuff, chatReportStuff.reportID);
+
+    Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT_IOUS, iouReportData);
+    Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT, chatReportData);
+}
+
 export {
     fetchAllReports,
     fetchActions,
@@ -1287,4 +1309,6 @@ export {
     saveReportActionDraft,
     deleteReportComment,
     getSimplifiedIOUReport,
+    getSimplifiedReportObject,
+    syncChatAndIOUReports,
 };