Merge pull request #10051 from Expensify/cmartins-refactorFetchAllRep…

…orts

Refactor fetchAllReports in App init

package.json

@@ -93,7 +93,7 @@
     "react-native-image-picker": "^4.7.3",
     "react-native-image-size": "git+https://github.com/Expensify/react-native-image-size#6b5ab5110dc3ed554f8eafbc38d7d87c17147972",
     "react-native-modal": "^13.0.0",
-    "react-native-onyx": "1.0.12",
+    "react-native-onyx": "1.0.13",
     "react-native-pdf": "^6.6.2",
     "react-native-performance": "^2.0.0",
     "react-native-permissions": "^3.0.1",

src/Expensify.js

@@ -47,9 +47,6 @@ const propTypes = {
     /** Whether a new update is available and ready to install. */
     updateAvailable: PropTypes.bool,
 
-    /** Whether the initial data needed to render the app is ready */
-    initialReportDataLoaded: PropTypes.bool,
-
     /** Tells us if the sidebar has rendered */
     isSidebarLoaded: PropTypes.bool,
 
@@ -72,7 +69,6 @@ const defaultProps = {
         accountID: null,
     },
     updateAvailable: false,
-    initialReportDataLoaded: false,
     isSidebarLoaded: false,
     screenShareRequest: null,
 };
@@ -123,8 +119,7 @@ class Expensify extends PureComponent {
         }
 
         if (this.state.isNavigationReady && this.state.isSplashShown) {
-            const authStackReady = this.props.initialReportDataLoaded && this.props.isSidebarLoaded;
-            const shouldHideSplash = !this.isAuthenticated() || authStackReady;
+            const shouldHideSplash = !this.isAuthenticated() || this.props.isSidebarLoaded;
 
             if (shouldHideSplash) {
                 BootSplash.hide();
@@ -223,9 +218,6 @@ export default compose(
             key: ONYXKEYS.UPDATE_AVAILABLE,
             initWithStoredValues: false,
         },
-        initialReportDataLoaded: {
-            key: ONYXKEYS.INITIAL_REPORT_DATA_LOADED,
-        },
         isSidebarLoaded: {
             key: ONYXKEYS.IS_SIDEBAR_LOADED,
         },

src/ONYXKEYS.js

@@ -12,10 +12,6 @@ export default {
     // which tab is the leader, and which ones are the followers
     ACTIVE_CLIENTS: 'activeClients',
 
-    // A key that is set while we are still waiting for the initial round of reports to load. Once set it should not be
-    // false unless we sign out. If there are reports in storage when the app inits this will be `true`.
-    INITIAL_REPORT_DATA_LOADED: 'initialReportDataLoaded',
-
     // Boolean flag set whenever we are waiting for the reconnection callbacks to finish.
     IS_LOADING_AFTER_RECONNECT: 'isLoadingAfterReconnect',
 

src/libs/Navigation/AppNavigator/AuthScreens.js

@@ -116,7 +116,7 @@ class AuthScreens extends React.Component {
         // Listen for report changes and fetch some data we need on initialization
         UnreadIndicatorUpdater.listenForReportChanges();
         App.getAppData();
-        App.openApp(this.props.allPolicies);
+        App.openApp();
 
         App.fixAccountAndReloadData();
         Timing.end(CONST.TIMING.HOMEPAGE_INITIAL_RENDER);
@@ -327,8 +327,5 @@ export default compose(
         session: {
             key: ONYXKEYS.SESSION,
         },
-        allPolicies: {
-            key: ONYXKEYS.COLLECTION.POLICY,
-        },
     }),
 )(AuthScreens);

src/libs/actions/App.js

@@ -11,7 +11,6 @@ import CONST from '../../CONST';
 import Log from '../Log';
 import Performance from '../Performance';
 import Timing from './Timing';
-import * as Report from './Report';
 import * as BankAccounts from './BankAccounts';
 import * as Policy from './Policy';
 import NetworkConnection from '../NetworkConnection';
@@ -48,15 +47,12 @@ Onyx.connect({
     },
 });
 
-const allPolicies = {};
+let policyIDList = [];
 Onyx.connect({
     key: ONYXKEYS.COLLECTION.POLICY,
-    callback: (val, key) => {
-        if (!val || !key) {
-            return;
-        }
-
-        allPolicies[key] = {...allPolicies[key], ...val};
+    waitForCollectionCallback: true,
+    callback: (policies) => {
+        policyIDList = _.compact(_.pluck(policies, 'id'));
     },
 });
 
@@ -105,46 +101,54 @@ AppState.addEventListener('change', (nextAppState) => {
 
 /**
  * Fetches data needed for app initialization
- * @returns {Promise}
  */
 function getAppData() {
     BankAccounts.fetchUserWallet();
-
-    // We should update the syncing indicator when personal details and reports are both done fetching.
-    return Promise.all([
-        Report.fetchAllReports(true),
-    ]);
-}
-
-/**
- * Gets a comma separated list of locally stored policy ids
- *
- * @param {Array} policies
- * @return {String}
- */
-function getPolicyIDList(policies) {
-    return _.chain(policies)
-        .filter(Boolean)
-        .map(policy => policy.id)
-        .join(',');
 }
 
 /**
  * Fetches data needed for app initialization
- * @param {Array} policies
  */
-function openApp(policies) {
-    API.read('OpenApp', {
-        policyIDList: getPolicyIDList(policies),
+function openApp() {
+    API.read('OpenApp', {policyIDList}, {
+        optimisticData: [{
+            onyxMethod: CONST.ONYX.METHOD.MERGE,
+            key: ONYXKEYS.IS_LOADING_REPORT_DATA,
+            value: true,
+        }],
+        successData: [{
+            onyxMethod: CONST.ONYX.METHOD.MERGE,
+            key: ONYXKEYS.IS_LOADING_REPORT_DATA,
+            value: false,
+        }],
+        failureData: [{
+            onyxMethod: CONST.ONYX.METHOD.MERGE,
+            key: ONYXKEYS.IS_LOADING_REPORT_DATA,
+            value: false,
+        }],
     });
 }
 
 /**
  * Refreshes data when the app reconnects
  */
 function reconnectApp() {
-    API.read('ReconnectApp', {
-        policyIDList: getPolicyIDList(allPolicies),
+    API.read('ReconnectApp', {policyIDList}, {
+        optimisticData: [{
+            onyxMethod: CONST.ONYX.METHOD.MERGE,
+            key: ONYXKEYS.IS_LOADING_REPORT_DATA,
+            value: true,
+        }],
+        successData: [{
+            onyxMethod: CONST.ONYX.METHOD.MERGE,
+            key: ONYXKEYS.IS_LOADING_REPORT_DATA,
+            value: false,
+        }],
+        failureData: [{
+            onyxMethod: CONST.ONYX.METHOD.MERGE,
+            key: ONYXKEYS.IS_LOADING_REPORT_DATA,
+            value: false,
+        }],
     });
 }
 

src/libs/actions/Report.js

@@ -712,7 +712,6 @@ function fetchAllReports(
             return fetchOrCreateChatReport([currentUserEmail, CONST.EMAIL.CONCIERGE], false);
         })
         .then((returnedReports) => {
-            Onyx.set(ONYXKEYS.INITIAL_REPORT_DATA_LOADED, true);
             Onyx.set(ONYXKEYS.IS_LOADING_REPORT_DATA, false);
 
             // If at this point the user still doesn't have a Concierge report, create it for them.

src/pages/home/sidebar/SidebarLinks.js

@@ -80,9 +80,6 @@ const propTypes = {
     /** The chat priority mode */
     priorityMode: PropTypes.string,
 
-    /** Whether we have the necessary report data to load the sidebar */
-    initialReportDataLoaded: PropTypes.bool,
-
     // Whether we are syncing app data
     isSyncingData: PropTypes.bool,
 
@@ -98,7 +95,6 @@ const defaultProps = {
     },
     currentlyViewedReportID: '',
     priorityMode: CONST.PRIORITY_MODE.DEFAULT,
-    initialReportDataLoaded: false,
     isSyncingData: false,
 };
 
@@ -258,7 +254,7 @@ class SidebarLinks extends React.Component {
 
     render() {
         // Wait until the reports and personalDetails are actually loaded before displaying the LHN
-        if (!this.props.initialReportDataLoaded || _.isEmpty(this.props.personalDetails)) {
+        if (_.isEmpty(this.props.personalDetails)) {
             return null;
         }
 
@@ -358,9 +354,6 @@ export default compose(
         priorityMode: {
             key: ONYXKEYS.NVP_PRIORITY_MODE,
         },
-        initialReportDataLoaded: {
-            key: ONYXKEYS.INITIAL_REPORT_DATA_LOADED,
-        },
         isSyncingData: {
             key: ONYXKEYS.IS_LOADING_AFTER_RECONNECT,
             initWithStoredValues: false,