From 70d7da6d7ab9fe99b60b6ceafbbbfd8c45015af1 Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Mon, 26 Jul 2021 10:42:30 -1000 Subject: [PATCH 01/14] Defer non critical requests and report view to speed up android start time --- src/CONST.js | 1 + src/Expensify.js | 1 + src/ONYXKEYS.js | 3 ++ src/components/OptionsList.js | 8 ++++ .../Navigation/AppNavigator/AuthScreens.js | 22 ++++++---- src/libs/actions/App.js | 24 +++++++++++ src/libs/actions/Timing.js | 13 +++--- src/pages/home/report/ReportView.js | 43 ++++++++++++------- src/pages/home/sidebar/SidebarLinks.js | 4 ++ src/pages/home/sidebar/SidebarScreen.js | 4 ++ 10 files changed, 94 insertions(+), 29 deletions(-) diff --git a/src/CONST.js b/src/CONST.js index 1b0a49e36d18..dadb6b95fc21 100755 --- a/src/CONST.js +++ b/src/CONST.js @@ -193,6 +193,7 @@ const CONST = { HOMEPAGE_INITIAL_RENDER: 'homepage_initial_render', HOMEPAGE_REPORTS_LOADED: 'homepage_reports_loaded', SWITCH_REPORT: 'switch_report', + SIDEBAR_LOADED: 'sidebar_loaded', COLD: 'cold', REPORT_ACTION_ITEM_LAYOUT_DEBOUNCE_TIME: 1500, }, diff --git a/src/Expensify.js b/src/Expensify.js index d933be7ccc1d..0c942a9a3973 100644 --- a/src/Expensify.js +++ b/src/Expensify.js @@ -35,6 +35,7 @@ Onyx.init({ [ONYXKEYS.IOU]: { loading: false, error: false, creatingIOUTransaction: false, isRetrievingCurrency: false, }, + [ONYXKEYS.IS_SIDEBAR_LOADED]: false, }, registerStorageEventListener: (onStorageEvent) => { listenToStorageEvents(onStorageEvent); diff --git a/src/ONYXKEYS.js b/src/ONYXKEYS.js index ded87710b8e1..71b269290712 100755 --- a/src/ONYXKEYS.js +++ b/src/ONYXKEYS.js @@ -16,6 +16,9 @@ export default { // Boolean flag set whenever we are waiting for the reconnection callbacks to finish. IS_LOADING_AFTER_RECONNECT: 'isLoadingAfterReconnect', + // Boolean flag set whenever the sidebar has loaded + IS_SIDEBAR_LOADED: 'isSidebarLoaded', + NETWORK_REQUEST_QUEUE: 'networkRequestQueue', // What the active route is for our navigator. Global route that determines what views to display. diff --git a/src/components/OptionsList.js b/src/components/OptionsList.js index dbb6e968da42..efd01ea6a5f1 100644 --- a/src/components/OptionsList.js +++ b/src/components/OptionsList.js @@ -78,6 +78,9 @@ const propTypes = { /** Whether to disable the interactivity of the list's option row(s) */ disableRowInteractivity: PropTypes.bool, + + /** Callback to execute when the SectionList lays out */ + onLayout: PropTypes.func, }; const defaultProps = { @@ -99,6 +102,7 @@ const defaultProps = { showTitleTooltip: false, optionMode: undefined, disableRowInteractivity: false, + onLayout: undefined, }; class OptionsList extends Component { @@ -228,6 +232,10 @@ class OptionsList extends Component { renderItem={this.renderItem} renderSectionHeader={this.renderSectionHeader} extraData={this.props.focusedIndex} + initialNumToRender={5} + maxToRenderPerBatch={5} + windowSize={5} + onLayout={this.props.onLayout} /> ); diff --git a/src/libs/Navigation/AppNavigator/AuthScreens.js b/src/libs/Navigation/AppNavigator/AuthScreens.js index 5ba802e792bf..099960f2c44e 100644 --- a/src/libs/Navigation/AppNavigator/AuthScreens.js +++ b/src/libs/Navigation/AppNavigator/AuthScreens.js @@ -25,6 +25,7 @@ import {fetchCountryCodeByRequestIP} from '../../actions/GeoLocation'; import KeyboardShortcut from '../../KeyboardShortcut'; import Navigation from '../Navigation'; import * as User from '../../actions/User'; +import * as App from '../../actions/App'; import {setModalVisibility} from '../../actions/Modal'; import NameValuePair from '../../actions/NameValuePair'; import {getPolicySummaries, getPolicyList} from '../../actions/Policy'; @@ -151,18 +152,21 @@ class AuthScreens extends React.Component { }); // Fetch some data we need on initialization - NameValuePair.get(CONST.NVP.PRIORITY_MODE, ONYXKEYS.NVP_PRIORITY_MODE, 'default'); - NameValuePair.get(CONST.NVP.PREFERRED_LOCALE, ONYXKEYS.NVP_PREFERRED_LOCALE, 'en'); - PersonalDetails.fetchPersonalDetails(); - User.getUserDetails(); User.getBetas(); - User.getDomainInfo(); - PersonalDetails.fetchLocalCurrency(); fetchAllReports(true, true); - fetchCountryCodeByRequestIP(); - UnreadIndicatorUpdater.listenForReportChanges(); + PersonalDetails.fetchPersonalDetails(); + NameValuePair.get(CONST.NVP.PRIORITY_MODE, ONYXKEYS.NVP_PRIORITY_MODE, 'default'); - loadPoliciesBehindBeta(this.props.betas); + // Defer less critical API requests until after the sidebar loads + App.onSidebarLoaded(() => { + NameValuePair.get(CONST.NVP.PREFERRED_LOCALE, ONYXKEYS.NVP_PREFERRED_LOCALE, 'en'); + User.getUserDetails(); + User.getDomainInfo(); + PersonalDetails.fetchLocalCurrency(); + fetchCountryCodeByRequestIP(); + UnreadIndicatorUpdater.listenForReportChanges(); + loadPoliciesBehindBeta(this.props.betas); + }); // Refresh the personal details, timezone and betas every 30 minutes // There is no pusher event that sends updated personal details data yet diff --git a/src/libs/actions/App.js b/src/libs/actions/App.js index 9635948348cd..ea8afb71e9d3 100644 --- a/src/libs/actions/App.js +++ b/src/libs/actions/App.js @@ -2,6 +2,15 @@ import Onyx from 'react-native-onyx'; import ONYXKEYS from '../../ONYXKEYS'; import * as API from '../API'; +let isSidebarLoaded; +let sidebarLoadedCallback; + +Onyx.connect({ + key: ONYXKEYS.IS_SIDEBAR_LOADED, + callback: val => isSidebarLoaded = val, + initWithStoredValues: false, +}); + /** * @param {String} url */ @@ -17,7 +26,22 @@ function setLocale(locale) { Onyx.merge(ONYXKEYS.NVP_PREFERRED_LOCALE, locale); } +function onSidebarLoaded(callback) { + sidebarLoadedCallback = callback; +} + +function setSidebarLoaded() { + if (isSidebarLoaded) { + return; + } + + sidebarLoadedCallback(); + Onyx.set(ONYXKEYS.IS_SIDEBAR_LOADED, true); +} + export { setCurrentURL, setLocale, + setSidebarLoaded, + onSidebarLoaded, }; diff --git a/src/libs/actions/Timing.js b/src/libs/actions/Timing.js index 4d1eae31a36f..e995eedd481c 100644 --- a/src/libs/actions/Timing.js +++ b/src/libs/actions/Timing.js @@ -27,11 +27,14 @@ function end(eventName, secondaryName = '') { console.debug(`Timing:${grafanaEventName}`, eventTime); - Graphite_Timer({ - name: grafanaEventName, - value: eventTime, - platform: `${getPlatform()}`, - }); + // eslint-disable-next-line no-undef + if (!__DEV__) { + Graphite_Timer({ + name: grafanaEventName, + value: eventTime, + platform: `${getPlatform()}`, + }); + } delete timestampData[eventName]; } diff --git a/src/pages/home/report/ReportView.js b/src/pages/home/report/ReportView.js index 8481be201ed8..a4049f1b3f1c 100644 --- a/src/pages/home/report/ReportView.js +++ b/src/pages/home/report/ReportView.js @@ -21,29 +21,39 @@ const propTypes = { session: PropTypes.shape({ shouldShowComposeInput: PropTypes.bool, }), + + /** Used to defer rendering the report view until after the sidebar has loaded */ + isSidebarLoaded: PropTypes.bool, }; const defaultProps = { session: { shouldShowComposeInput: true, }, + isSidebarLoaded: false, }; -const ReportView = ({reportID, session}) => ( - - - - {session.shouldShowComposeInput && ( - Keyboard.dismiss()}> - addAction(reportID, text)} - reportID={reportID} - /> - - )} - - -); +const ReportView = ({reportID, session, isSidebarLoaded}) => { + if (!isSidebarLoaded) { + return null; + } + + return ( + + + + {session.shouldShowComposeInput && ( + Keyboard.dismiss()}> + addAction(reportID, text)} + reportID={reportID} + /> + + )} + + + ); +}; ReportView.propTypes = propTypes; ReportView.defaultProps = defaultProps; @@ -52,4 +62,7 @@ export default withOnyx({ session: { key: ONYXKEYS.SESSION, }, + isSidebarLoaded: { + key: ONYXKEYS.IS_SIDEBAR_LOADED, + }, })(ReportView); diff --git a/src/pages/home/sidebar/SidebarLinks.js b/src/pages/home/sidebar/SidebarLinks.js index 48a9c30b842e..fa8d8b9b26f3 100644 --- a/src/pages/home/sidebar/SidebarLinks.js +++ b/src/pages/home/sidebar/SidebarLinks.js @@ -20,6 +20,7 @@ import CONST from '../../../CONST'; import {participantPropTypes} from './optionPropTypes'; import themeColors from '../../../styles/themes/default'; import withLocalize, {withLocalizePropTypes} from '../../../components/withLocalize'; +import Timing from '../../../libs/actions/Timing'; const propTypes = { @@ -179,6 +180,9 @@ class SidebarLinks extends React.Component { showTitleTooltip disableFocusOptions={this.props.isSmallScreenWidth} optionMode={this.props.priorityMode === CONST.PRIORITY_MODE.GSD ? 'compact' : 'default'} + onLayout={() => { + Timing.end(CONST.TIMING.SIDEBAR_LOADED); + }} /> diff --git a/src/pages/home/sidebar/SidebarScreen.js b/src/pages/home/sidebar/SidebarScreen.js index fcfd60c59950..a3df1741dce7 100755 --- a/src/pages/home/sidebar/SidebarScreen.js +++ b/src/pages/home/sidebar/SidebarScreen.js @@ -47,6 +47,10 @@ class SidebarScreen extends Component { }; } + componentDidMount() { + Timing.start(CONST.TIMING.SIDEBAR_LOADED); + } + /** * Method called when a Create Menu item is selected. */ From f72f60ee7eac08e7b94cf69850134d64d59dd155 Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Mon, 26 Jul 2021 10:57:48 -1000 Subject: [PATCH 02/14] add Firebase lib --- src/libs/Firebase/index.js | 6 ++++++ src/libs/Firebase/index.native.js | 34 +++++++++++++++++++++++++++++++ 2 files changed, 40 insertions(+) create mode 100644 src/libs/Firebase/index.js create mode 100644 src/libs/Firebase/index.native.js diff --git a/src/libs/Firebase/index.js b/src/libs/Firebase/index.js new file mode 100644 index 000000000000..a8c7a34f869f --- /dev/null +++ b/src/libs/Firebase/index.js @@ -0,0 +1,6 @@ +/** Web does not use Firebase for performance tracing */ + +export default { + startTrace() {}, + stopTrace() {}, +}; diff --git a/src/libs/Firebase/index.native.js b/src/libs/Firebase/index.native.js new file mode 100644 index 000000000000..6754074931b4 --- /dev/null +++ b/src/libs/Firebase/index.native.js @@ -0,0 +1,34 @@ +import perf from '@react-native-firebase/perf'; + +const traceMap = {}; + +/** + * @param {String} customEventName + */ +function startTrace(customEventName) { + if (traceMap[customEventName]) { + console.debug('[Firebase] Trace with this name has already started'); + return; + } + + perf().startTrace(customEventName) + .then(trace => traceMap[customEventName] = trace); +} + +/** + * @param {String} customEventName + */ +function stopTrace(customEventName) { + const trace = traceMap[customEventName]; + if (!trace) { + console.debug('[Firebase] Could not find trace'); + } + + trace.stop(); + delete traceMap[customEventName]; +} + +export default { + startTrace, + stopTrace, +}; From 65abdc1c92b982389743b1e8b41a5b53584777ea Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Mon, 26 Jul 2021 11:13:56 -1000 Subject: [PATCH 03/14] Setup firebase trace --- src/libs/Firebase/index.native.js | 16 ++++++++++++++-- src/libs/actions/App.js | 3 +++ src/libs/actions/Timing.js | 17 ++++++++++------- src/pages/home/sidebar/SidebarLinks.js | 7 ++----- src/pages/home/sidebar/SidebarScreen.js | 3 ++- 5 files changed, 31 insertions(+), 15 deletions(-) diff --git a/src/libs/Firebase/index.native.js b/src/libs/Firebase/index.native.js index 6754074931b4..f779df0d47a8 100644 --- a/src/libs/Firebase/index.native.js +++ b/src/libs/Firebase/index.native.js @@ -1,4 +1,5 @@ import perf from '@react-native-firebase/perf'; +import {isDevelopment} from '../Environment/Environment'; const traceMap = {}; @@ -6,19 +7,30 @@ const traceMap = {}; * @param {String} customEventName */ function startTrace(customEventName) { + if (isDevelopment()) { + return; + } + if (traceMap[customEventName]) { console.debug('[Firebase] Trace with this name has already started'); return; } - perf().startTrace(customEventName) - .then(trace => traceMap[customEventName] = trace); + perf() + .then((trace) => { + traceMap[customEventName] = trace; + trace.startTrace(customEventName); + }); } /** * @param {String} customEventName */ function stopTrace(customEventName) { + if (isDevelopment()) { + return; + } + const trace = traceMap[customEventName]; if (!trace) { console.debug('[Firebase] Could not find trace'); diff --git a/src/libs/actions/App.js b/src/libs/actions/App.js index ea8afb71e9d3..eb53924b9bc9 100644 --- a/src/libs/actions/App.js +++ b/src/libs/actions/App.js @@ -1,6 +1,8 @@ import Onyx from 'react-native-onyx'; import ONYXKEYS from '../../ONYXKEYS'; import * as API from '../API'; +import Firebase from '../Firebase'; +import CONST from '../../CONST'; let isSidebarLoaded; let sidebarLoadedCallback; @@ -37,6 +39,7 @@ function setSidebarLoaded() { sidebarLoadedCallback(); Onyx.set(ONYXKEYS.IS_SIDEBAR_LOADED, true); + Firebase.stopTrace(CONST.TIMING.SIDEBAR_LOADED); } export { diff --git a/src/libs/actions/Timing.js b/src/libs/actions/Timing.js index e995eedd481c..a0cbae149360 100644 --- a/src/libs/actions/Timing.js +++ b/src/libs/actions/Timing.js @@ -1,5 +1,6 @@ import getPlatform from '../getPlatform'; import {Graphite_Timer} from '../API'; +import {isDevelopment} from '../Environment/Environment'; let timestampData = {}; @@ -26,17 +27,19 @@ function end(eventName, secondaryName = '') { : `expensify.cash.${eventName}`; console.debug(`Timing:${grafanaEventName}`, eventTime); + delete timestampData[eventName]; // eslint-disable-next-line no-undef - if (!__DEV__) { - Graphite_Timer({ - name: grafanaEventName, - value: eventTime, - platform: `${getPlatform()}`, - }); + if (isDevelopment()) { + // Don't create traces on dev as this will mess up the accuracy of data in release builds of the app + return; } - delete timestampData[eventName]; + Graphite_Timer({ + name: grafanaEventName, + value: eventTime, + platform: `${getPlatform()}`, + }); } } diff --git a/src/pages/home/sidebar/SidebarLinks.js b/src/pages/home/sidebar/SidebarLinks.js index fa8d8b9b26f3..d846b67e9e29 100644 --- a/src/pages/home/sidebar/SidebarLinks.js +++ b/src/pages/home/sidebar/SidebarLinks.js @@ -20,8 +20,7 @@ import CONST from '../../../CONST'; import {participantPropTypes} from './optionPropTypes'; import themeColors from '../../../styles/themes/default'; import withLocalize, {withLocalizePropTypes} from '../../../components/withLocalize'; -import Timing from '../../../libs/actions/Timing'; - +import * as App from '../../../libs/actions/App'; const propTypes = { /** Toggles the navigation menu open and closed */ @@ -180,9 +179,7 @@ class SidebarLinks extends React.Component { showTitleTooltip disableFocusOptions={this.props.isSmallScreenWidth} optionMode={this.props.priorityMode === CONST.PRIORITY_MODE.GSD ? 'compact' : 'default'} - onLayout={() => { - Timing.end(CONST.TIMING.SIDEBAR_LOADED); - }} + onLayout={App.setSidebarLoaded} /> diff --git a/src/pages/home/sidebar/SidebarScreen.js b/src/pages/home/sidebar/SidebarScreen.js index a3df1741dce7..b4f9dabeb2ed 100755 --- a/src/pages/home/sidebar/SidebarScreen.js +++ b/src/pages/home/sidebar/SidebarScreen.js @@ -23,6 +23,7 @@ import { } from '../../../components/Icon/Expensicons'; import Permissions from '../../../libs/Permissions'; import ONYXKEYS from '../../../ONYXKEYS'; +import Firebase from '../../../libs/Firebase'; const propTypes = { /** Beta features list */ @@ -48,7 +49,7 @@ class SidebarScreen extends Component { } componentDidMount() { - Timing.start(CONST.TIMING.SIDEBAR_LOADED); + Firebase.startTrace(CONST.TIMING.SIDEBAR_LOADED); } /** From cdb4c88c5be8a723998d4dff731168ac4d5473f7 Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Mon, 26 Jul 2021 11:45:09 -1000 Subject: [PATCH 04/14] fix firebase trace --- src/libs/Firebase/index.native.js | 7 ++----- src/libs/actions/App.js | 5 ++++- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/libs/Firebase/index.native.js b/src/libs/Firebase/index.native.js index f779df0d47a8..f4db4ca77961 100644 --- a/src/libs/Firebase/index.native.js +++ b/src/libs/Firebase/index.native.js @@ -16,11 +16,8 @@ function startTrace(customEventName) { return; } - perf() - .then((trace) => { - traceMap[customEventName] = trace; - trace.startTrace(customEventName); - }); + perf().startTrace(customEventName) + .then(trace => traceMap[customEventName] = trace); } /** diff --git a/src/libs/actions/App.js b/src/libs/actions/App.js index eb53924b9bc9..cb20fa05872c 100644 --- a/src/libs/actions/App.js +++ b/src/libs/actions/App.js @@ -37,7 +37,10 @@ function setSidebarLoaded() { return; } - sidebarLoadedCallback(); + if (sidebarLoadedCallback) { + sidebarLoadedCallback(); + } + Onyx.set(ONYXKEYS.IS_SIDEBAR_LOADED, true); Firebase.stopTrace(CONST.TIMING.SIDEBAR_LOADED); } From cebfaf59bf4103c9d9cb638c6fddd4449280c302 Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Mon, 26 Jul 2021 13:36:37 -1000 Subject: [PATCH 05/14] Defer more calls --- src/components/OptionsList.js | 5 +++++ src/libs/Navigation/AppNavigator/AuthScreens.js | 8 ++++---- src/pages/home/sidebar/SidebarLinks.js | 13 +++++++++++++ 3 files changed, 22 insertions(+), 4 deletions(-) diff --git a/src/components/OptionsList.js b/src/components/OptionsList.js index efd01ea6a5f1..bdcd33cf95df 100644 --- a/src/components/OptionsList.js +++ b/src/components/OptionsList.js @@ -81,6 +81,9 @@ const propTypes = { /** Callback to execute when the SectionList lays out */ onLayout: PropTypes.func, + + /** Peformance optimization used when rows have a fixed height */ + getItemLayout: PropTypes.func, }; const defaultProps = { @@ -103,6 +106,7 @@ const defaultProps = { optionMode: undefined, disableRowInteractivity: false, onLayout: undefined, + getItemLayout: undefined, }; class OptionsList extends Component { @@ -235,6 +239,7 @@ class OptionsList extends Component { initialNumToRender={5} maxToRenderPerBatch={5} windowSize={5} + getItemLayout={this.props.getItemLayout} onLayout={this.props.onLayout} /> diff --git a/src/libs/Navigation/AppNavigator/AuthScreens.js b/src/libs/Navigation/AppNavigator/AuthScreens.js index 099960f2c44e..76a9e241f5b0 100644 --- a/src/libs/Navigation/AppNavigator/AuthScreens.js +++ b/src/libs/Navigation/AppNavigator/AuthScreens.js @@ -151,14 +151,14 @@ class AuthScreens extends React.Component { User.subscribeToUserEvents(); }); - // Fetch some data we need on initialization - User.getBetas(); + // Fetch main data we need on initialization for the LHN fetchAllReports(true, true); - PersonalDetails.fetchPersonalDetails(); - NameValuePair.get(CONST.NVP.PRIORITY_MODE, ONYXKEYS.NVP_PRIORITY_MODE, 'default'); // Defer less critical API requests until after the sidebar loads App.onSidebarLoaded(() => { + User.getBetas(); + PersonalDetails.fetchPersonalDetails(); + NameValuePair.get(CONST.NVP.PRIORITY_MODE, ONYXKEYS.NVP_PRIORITY_MODE, 'default'); NameValuePair.get(CONST.NVP.PREFERRED_LOCALE, ONYXKEYS.NVP_PREFERRED_LOCALE, 'en'); User.getUserDetails(); User.getDomainInfo(); diff --git a/src/pages/home/sidebar/SidebarLinks.js b/src/pages/home/sidebar/SidebarLinks.js index d846b67e9e29..d99f142b1cc4 100644 --- a/src/pages/home/sidebar/SidebarLinks.js +++ b/src/pages/home/sidebar/SidebarLinks.js @@ -94,6 +94,18 @@ const defaultProps = { }; class SidebarLinks extends React.Component { + constructor(props) { + super(props); + this.getItemLayout = this.getItemLayout.bind(this); + } + + getItemLayout(data, index) { + const length = this.props.priorityMode === CONST.PRIORITY_MODE.GSD ? 52 : 64; + return ( + {length, offset: length * index, index} + ); + } + showSearchPage() { Navigation.navigate(ROUTES.SEARCH); } @@ -180,6 +192,7 @@ class SidebarLinks extends React.Component { disableFocusOptions={this.props.isSmallScreenWidth} optionMode={this.props.priorityMode === CONST.PRIORITY_MODE.GSD ? 'compact' : 'default'} onLayout={App.setSidebarLoaded} + getItemLayout={this.getItemLayout} /> From 1bda2b74c31f89df6292032f0dd0893c9f4b2a07 Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Mon, 26 Jul 2021 14:26:48 -1000 Subject: [PATCH 06/14] hmm --- src/libs/Firebase/index.native.js | 8 ++++ .../Navigation/AppNavigator/AuthScreens.js | 6 +-- src/pages/home/ReportScreen.js | 13 +++++- src/pages/home/report/ReportView.js | 43 +++++++------------ src/pages/home/sidebar/SidebarLinks.js | 11 +++-- 5 files changed, 45 insertions(+), 36 deletions(-) diff --git a/src/libs/Firebase/index.native.js b/src/libs/Firebase/index.native.js index f4db4ca77961..abe34e68c302 100644 --- a/src/libs/Firebase/index.native.js +++ b/src/libs/Firebase/index.native.js @@ -3,10 +3,15 @@ import {isDevelopment} from '../Environment/Environment'; const traceMap = {}; +let start; +let end; + /** * @param {String} customEventName */ function startTrace(customEventName) { + start = global.performance.now(); + if (isDevelopment()) { return; } @@ -24,6 +29,9 @@ function startTrace(customEventName) { * @param {String} customEventName */ function stopTrace(customEventName) { + end = global.performance.now(); + console.debug('sidebar_loaded in ', end - start, ' ms'); + if (isDevelopment()) { return; } diff --git a/src/libs/Navigation/AppNavigator/AuthScreens.js b/src/libs/Navigation/AppNavigator/AuthScreens.js index 76a9e241f5b0..9b6c0fbb5716 100644 --- a/src/libs/Navigation/AppNavigator/AuthScreens.js +++ b/src/libs/Navigation/AppNavigator/AuthScreens.js @@ -152,13 +152,13 @@ class AuthScreens extends React.Component { }); // Fetch main data we need on initialization for the LHN + User.getBetas(); fetchAllReports(true, true); + PersonalDetails.fetchPersonalDetails(); + NameValuePair.get(CONST.NVP.PRIORITY_MODE, ONYXKEYS.NVP_PRIORITY_MODE, 'default'); // Defer less critical API requests until after the sidebar loads App.onSidebarLoaded(() => { - User.getBetas(); - PersonalDetails.fetchPersonalDetails(); - NameValuePair.get(CONST.NVP.PRIORITY_MODE, ONYXKEYS.NVP_PRIORITY_MODE, 'default'); NameValuePair.get(CONST.NVP.PREFERRED_LOCALE, ONYXKEYS.NVP_PREFERRED_LOCALE, 'en'); User.getUserDetails(); User.getDomainInfo(); diff --git a/src/pages/home/ReportScreen.js b/src/pages/home/ReportScreen.js index ae87bc4b6921..ad66c0e839a4 100644 --- a/src/pages/home/ReportScreen.js +++ b/src/pages/home/ReportScreen.js @@ -1,4 +1,5 @@ import React from 'react'; +import {withOnyx} from 'react-native-onyx'; import PropTypes from 'prop-types'; import styles from '../../styles/styles'; import ReportView from './report/ReportView'; @@ -8,6 +9,7 @@ import Navigation from '../../libs/Navigation/Navigation'; import ROUTES from '../../ROUTES'; import FullScreenLoadingIndicator from '../../components/FullscreenLoadingIndicator'; import {updateCurrentlyViewedReportID} from '../../libs/actions/Report'; +import ONYXKEYS from '../../ONYXKEYS'; const propTypes = { /** Navigation route context info provided by react navigation */ @@ -84,6 +86,11 @@ class ReportScreen extends React.Component { } render() { + return null; + if (!this.props.isSidebarLoaded) { + return null; + } + return ( { - if (!isSidebarLoaded) { - return null; - } - - return ( - - - - {session.shouldShowComposeInput && ( - Keyboard.dismiss()}> - addAction(reportID, text)} - reportID={reportID} - /> - - )} - - - ); -}; +const ReportView = ({reportID, session}) => ( + + + + {session.shouldShowComposeInput && ( + Keyboard.dismiss()}> + addAction(reportID, text)} + reportID={reportID} + /> + + )} + + +); ReportView.propTypes = propTypes; ReportView.defaultProps = defaultProps; @@ -62,7 +52,4 @@ export default withOnyx({ session: { key: ONYXKEYS.SESSION, }, - isSidebarLoaded: { - key: ONYXKEYS.IS_SIDEBAR_LOADED, - }, })(ReportView); diff --git a/src/pages/home/sidebar/SidebarLinks.js b/src/pages/home/sidebar/SidebarLinks.js index d99f142b1cc4..52af728d02ed 100644 --- a/src/pages/home/sidebar/SidebarLinks.js +++ b/src/pages/home/sidebar/SidebarLinks.js @@ -97,6 +97,12 @@ class SidebarLinks extends React.Component { constructor(props) { super(props); this.getItemLayout = this.getItemLayout.bind(this); + this.onSelectRow = this.onSelectRow.bind(this); + } + + onSelectRow(option) { + Navigation.navigate(ROUTES.getReportRoute(option.reportID)); + this.props.onLinkClick(); } getItemLayout(data, index) { @@ -182,10 +188,7 @@ class SidebarLinks extends React.Component { focusedIndex={_.findIndex(recentReports, ( option => option.reportID === activeReportID ))} - onSelectRow={(option) => { - Navigation.navigate(ROUTES.getReportRoute(option.reportID)); - this.props.onLinkClick(); - }} + onSelectRow={this.onSelectRow} optionBackgroundColor={themeColors.sidebar} hideSectionHeaders showTitleTooltip From feba29a1a1e31e9e40b34abe6a63eed4302ac185 Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Mon, 26 Jul 2021 15:08:36 -1000 Subject: [PATCH 07/14] optimize sidebar links --- src/pages/home/ReportScreen.js | 10 +++++++++- src/pages/home/sidebar/SidebarLinks.js | 4 ++++ 2 files changed, 13 insertions(+), 1 deletion(-) diff --git a/src/pages/home/ReportScreen.js b/src/pages/home/ReportScreen.js index ad66c0e839a4..dfe7cea28c1b 100644 --- a/src/pages/home/ReportScreen.js +++ b/src/pages/home/ReportScreen.js @@ -20,6 +20,13 @@ const propTypes = { reportID: PropTypes.string, }).isRequired, }).isRequired, + + /** Tells us if the sidebar has rendered */ + isSidebarLoaded: PropTypes.bool, +}; + +const defaultProps = { + isSidebarLoaded: false, }; class ReportScreen extends React.Component { @@ -86,7 +93,6 @@ class ReportScreen extends React.Component { } render() { - return null; if (!this.props.isSidebarLoaded) { return null; } @@ -107,6 +113,8 @@ class ReportScreen extends React.Component { } ReportScreen.propTypes = propTypes; +ReportScreen.defaultProps = defaultProps; + export default withOnyx({ isSidebarLoaded: { key: ONYXKEYS.IS_SIDEBAR_LOADED, diff --git a/src/pages/home/sidebar/SidebarLinks.js b/src/pages/home/sidebar/SidebarLinks.js index 52af728d02ed..e0de12b3d3e3 100644 --- a/src/pages/home/sidebar/SidebarLinks.js +++ b/src/pages/home/sidebar/SidebarLinks.js @@ -100,6 +100,10 @@ class SidebarLinks extends React.Component { this.onSelectRow = this.onSelectRow.bind(this); } + shouldComponentUpdate(prevProps) { + return _.isEqual(prevProps, this.props); + } + onSelectRow(option) { Navigation.navigate(ROUTES.getReportRoute(option.reportID)); this.props.onLinkClick(); From 44847b7db596983feffb67647c9f935439770bab Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Mon, 26 Jul 2021 15:25:49 -1000 Subject: [PATCH 08/14] remove some logs --- src/libs/Firebase/index.native.js | 8 -------- src/libs/NetworkConnection.js | 4 ---- src/libs/Pusher/pusher.js | 1 - src/libs/PusherConnectionManager.js | 10 ---------- 4 files changed, 23 deletions(-) diff --git a/src/libs/Firebase/index.native.js b/src/libs/Firebase/index.native.js index abe34e68c302..f4db4ca77961 100644 --- a/src/libs/Firebase/index.native.js +++ b/src/libs/Firebase/index.native.js @@ -3,15 +3,10 @@ import {isDevelopment} from '../Environment/Environment'; const traceMap = {}; -let start; -let end; - /** * @param {String} customEventName */ function startTrace(customEventName) { - start = global.performance.now(); - if (isDevelopment()) { return; } @@ -29,9 +24,6 @@ function startTrace(customEventName) { * @param {String} customEventName */ function stopTrace(customEventName) { - end = global.performance.now(); - console.debug('sidebar_loaded in ', end - start, ' ms'); - if (isDevelopment()) { return; } diff --git a/src/libs/NetworkConnection.js b/src/libs/NetworkConnection.js index cb104b18d868..6fcc4b767248 100644 --- a/src/libs/NetworkConnection.js +++ b/src/libs/NetworkConnection.js @@ -49,8 +49,6 @@ function setOfflineStatus(isCurrentlyOffline) { * `disconnected` event which takes about 10-15 seconds to emit. */ function listenForReconnect() { - logInfo('[NetworkConnection] listenForReconnect called', true); - unsubscribeFromAppState = AppStateMonitor.addBecameActiveListener(() => { triggerReconnectionCallbacks('app became active'); }); @@ -58,7 +56,6 @@ function listenForReconnect() { // Subscribe to the state change event via NetInfo so we can update // whether a user has internet connectivity or not. unsubscribeFromNetInfo = NetInfo.addEventListener((state) => { - logInfo(`[NetworkConnection] NetInfo isConnected: ${state && state.isConnected}`); setOfflineStatus(!state.isConnected); }); } @@ -67,7 +64,6 @@ function listenForReconnect() { * Tear down the event listeners when we are finished with them. */ function stopListeningForReconnect() { - logInfo('[NetworkConnection] stopListeningForReconnect called', true); if (unsubscribeFromNetInfo) { unsubscribeFromNetInfo(); unsubscribeFromNetInfo = undefined; diff --git a/src/libs/Pusher/pusher.js b/src/libs/Pusher/pusher.js index e64644c1441d..1afbd7db49e3 100644 --- a/src/libs/Pusher/pusher.js +++ b/src/libs/Pusher/pusher.js @@ -193,7 +193,6 @@ function subscribe( most likely has been called before Pusher.init()`); } - console.debug('[Pusher] Attempting to subscribe to channel', true, {channelName, eventName}); let channel = getChannel(channelName); if (!channel || !channel.subscribed) { diff --git a/src/libs/PusherConnectionManager.js b/src/libs/PusherConnectionManager.js index 164efb40d7b3..74d74359590b 100644 --- a/src/libs/PusherConnectionManager.js +++ b/src/libs/PusherConnectionManager.js @@ -7,7 +7,6 @@ import Log from './Log'; // reconnect each time when we only need to reconnect once. This way, if an authToken is expired and we try to // subscribe to a bunch of channels at once we will only reauthenticate and force reconnect Pusher once. const reauthenticate = _.throttle(() => { - Log.info('[Pusher] Re-authenticating and then reconnecting', true); API.reauthenticate('Push_Authenticate') .then(() => Pusher.reconnect()) .catch(() => { @@ -27,8 +26,6 @@ function init() { */ Pusher.registerCustomAuthorizer(channel => ({ authorize: (socketID, callback) => { - Log.info('[PusherConnectionManager] Attempting to authorize Pusher', true); - API.Push_Authenticate({ socket_id: socketID, channel_name: channel.name, @@ -44,7 +41,6 @@ function init() { return; } - Log.info('[PusherConnectionManager] Pusher authenticated successfully', true); callback(null, data); }) .catch((error) => { @@ -66,12 +62,6 @@ function init() { Log.info('[PusherConnectionManager] error event', true, {error: data}); reauthenticate(); break; - case 'connected': - Log.info('[PusherConnectionManager] connected event', true); - break; - case 'disconnected': - Log.info('[PusherConnectionManager] disconnected event', true); - break; default: break; } From c3e6c4d2461f7e30f09f60bdd2fba621e285a1ec Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Mon, 26 Jul 2021 15:49:04 -1000 Subject: [PATCH 09/14] Use viewability to determine that the sidebar has rendered items on screen --- src/Expensify.js | 9 ++++++++- src/components/OptionsList.js | 12 +++++++++++- 2 files changed, 19 insertions(+), 2 deletions(-) diff --git a/src/Expensify.js b/src/Expensify.js index 0c942a9a3973..b6b4a9bd20f5 100644 --- a/src/Expensify.js +++ b/src/Expensify.js @@ -70,6 +70,9 @@ const propTypes = { /** Whether the initial data needed to render the app is ready */ initialReportDataLoaded: PropTypes.bool, + + /** Tells us if the sidebar has rendered */ + isSidebarLoaded: PropTypes.bool, }; const defaultProps = { @@ -80,6 +83,7 @@ const defaultProps = { }, updateAvailable: false, initialReportDataLoaded: false, + isSidebarLoaded: false, }; class Expensify extends PureComponent { @@ -135,7 +139,7 @@ class Expensify extends PureComponent { } } - if (this.getAuthToken() && this.props.initialReportDataLoaded) { + if (this.getAuthToken() && this.props.initialReportDataLoaded && this.props.isSidebarLoaded) { BootSplash.getVisibilityStatus() .then((value) => { if (value !== 'visible') { @@ -196,4 +200,7 @@ export default withOnyx({ initialReportDataLoaded: { key: ONYXKEYS.INITIAL_REPORT_DATA_LOADED, }, + isSidebarLoaded: { + key: ONYXKEYS.IS_SIDEBAR_LOADED, + }, })(Expensify); diff --git a/src/components/OptionsList.js b/src/components/OptionsList.js index bdcd33cf95df..38d8d2c86099 100644 --- a/src/components/OptionsList.js +++ b/src/components/OptionsList.js @@ -117,6 +117,8 @@ class OptionsList extends Component { this.renderSectionHeader = this.renderSectionHeader.bind(this); this.extractKey = this.extractKey.bind(this); this.onScrollToIndexFailed = this.onScrollToIndexFailed.bind(this); + this.viewabilityConfig = {viewAreaCoveragePercentThreshold: 95}; + this.didLayout = false; } shouldComponentUpdate(nextProps) { @@ -240,7 +242,15 @@ class OptionsList extends Component { maxToRenderPerBatch={5} windowSize={5} getItemLayout={this.props.getItemLayout} - onLayout={this.props.onLayout} + viewabilityConfig={this.viewabilityConfig} + onViewableItemsChanged={() => { + if (this.didLayout) { + return; + } + + this.didLayout = true; + this.props.onLayout(); + }} /> ); From a058756f88d1f6de73a15ec3706a3a2f93984690 Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Tue, 27 Jul 2021 14:52:46 -1000 Subject: [PATCH 10/14] undo logs --- src/libs/Firebase/index.native.js | 11 +++++++++-- src/libs/NetworkConnection.js | 4 ++++ src/libs/PusherConnectionManager.js | 10 ++++++++++ 3 files changed, 23 insertions(+), 2 deletions(-) diff --git a/src/libs/Firebase/index.native.js b/src/libs/Firebase/index.native.js index f4db4ca77961..b86e091c7178 100644 --- a/src/libs/Firebase/index.native.js +++ b/src/libs/Firebase/index.native.js @@ -1,18 +1,21 @@ import perf from '@react-native-firebase/perf'; import {isDevelopment} from '../Environment/Environment'; +import Log from '../Log'; const traceMap = {}; +let start, stop; + /** * @param {String} customEventName */ function startTrace(customEventName) { + start = global.performance.now(); if (isDevelopment()) { return; } if (traceMap[customEventName]) { - console.debug('[Firebase] Trace with this name has already started'); return; } @@ -24,16 +27,20 @@ function startTrace(customEventName) { * @param {String} customEventName */ function stopTrace(customEventName) { + stop = global.performance.now(); + if (isDevelopment()) { return; } const trace = traceMap[customEventName]; if (!trace) { - console.debug('[Firebase] Could not find trace'); + return; } trace.stop(); + + Log.info(`@marcaaron sidebar_loaded took: ${stop - start} ms`, true); delete traceMap[customEventName]; } diff --git a/src/libs/NetworkConnection.js b/src/libs/NetworkConnection.js index 6fcc4b767248..cb104b18d868 100644 --- a/src/libs/NetworkConnection.js +++ b/src/libs/NetworkConnection.js @@ -49,6 +49,8 @@ function setOfflineStatus(isCurrentlyOffline) { * `disconnected` event which takes about 10-15 seconds to emit. */ function listenForReconnect() { + logInfo('[NetworkConnection] listenForReconnect called', true); + unsubscribeFromAppState = AppStateMonitor.addBecameActiveListener(() => { triggerReconnectionCallbacks('app became active'); }); @@ -56,6 +58,7 @@ function listenForReconnect() { // Subscribe to the state change event via NetInfo so we can update // whether a user has internet connectivity or not. unsubscribeFromNetInfo = NetInfo.addEventListener((state) => { + logInfo(`[NetworkConnection] NetInfo isConnected: ${state && state.isConnected}`); setOfflineStatus(!state.isConnected); }); } @@ -64,6 +67,7 @@ function listenForReconnect() { * Tear down the event listeners when we are finished with them. */ function stopListeningForReconnect() { + logInfo('[NetworkConnection] stopListeningForReconnect called', true); if (unsubscribeFromNetInfo) { unsubscribeFromNetInfo(); unsubscribeFromNetInfo = undefined; diff --git a/src/libs/PusherConnectionManager.js b/src/libs/PusherConnectionManager.js index 74d74359590b..164efb40d7b3 100644 --- a/src/libs/PusherConnectionManager.js +++ b/src/libs/PusherConnectionManager.js @@ -7,6 +7,7 @@ import Log from './Log'; // reconnect each time when we only need to reconnect once. This way, if an authToken is expired and we try to // subscribe to a bunch of channels at once we will only reauthenticate and force reconnect Pusher once. const reauthenticate = _.throttle(() => { + Log.info('[Pusher] Re-authenticating and then reconnecting', true); API.reauthenticate('Push_Authenticate') .then(() => Pusher.reconnect()) .catch(() => { @@ -26,6 +27,8 @@ function init() { */ Pusher.registerCustomAuthorizer(channel => ({ authorize: (socketID, callback) => { + Log.info('[PusherConnectionManager] Attempting to authorize Pusher', true); + API.Push_Authenticate({ socket_id: socketID, channel_name: channel.name, @@ -41,6 +44,7 @@ function init() { return; } + Log.info('[PusherConnectionManager] Pusher authenticated successfully', true); callback(null, data); }) .catch((error) => { @@ -62,6 +66,12 @@ function init() { Log.info('[PusherConnectionManager] error event', true, {error: data}); reauthenticate(); break; + case 'connected': + Log.info('[PusherConnectionManager] connected event', true); + break; + case 'disconnected': + Log.info('[PusherConnectionManager] disconnected event', true); + break; default: break; } From 2fad2584b55ac4799c6f84de148205d8043f84bf Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Tue, 27 Jul 2021 14:53:38 -1000 Subject: [PATCH 11/14] fix logs --- src/libs/Pusher/pusher.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/libs/Pusher/pusher.js b/src/libs/Pusher/pusher.js index 1afbd7db49e3..e64644c1441d 100644 --- a/src/libs/Pusher/pusher.js +++ b/src/libs/Pusher/pusher.js @@ -193,6 +193,7 @@ function subscribe( most likely has been called before Pusher.init()`); } + console.debug('[Pusher] Attempting to subscribe to channel', true, {channelName, eventName}); let channel = getChannel(channelName); if (!channel || !channel.subscribed) { From f4c28b9ec5b35711020b566ea44a2b7c9f230c45 Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Tue, 27 Jul 2021 16:47:01 -1000 Subject: [PATCH 12/14] Add log line to uncomment --- src/components/OptionsList.js | 5 ---- src/libs/Firebase/index.native.js | 20 ++++++++----- .../Navigation/AppNavigator/AuthScreens.js | 23 +++++++-------- src/libs/actions/App.js | 10 ------- src/pages/home/sidebar/SidebarLinks.js | 28 +++---------------- 5 files changed, 27 insertions(+), 59 deletions(-) diff --git a/src/components/OptionsList.js b/src/components/OptionsList.js index 38d8d2c86099..cfb25b7e5e19 100644 --- a/src/components/OptionsList.js +++ b/src/components/OptionsList.js @@ -81,9 +81,6 @@ const propTypes = { /** Callback to execute when the SectionList lays out */ onLayout: PropTypes.func, - - /** Peformance optimization used when rows have a fixed height */ - getItemLayout: PropTypes.func, }; const defaultProps = { @@ -106,7 +103,6 @@ const defaultProps = { optionMode: undefined, disableRowInteractivity: false, onLayout: undefined, - getItemLayout: undefined, }; class OptionsList extends Component { @@ -241,7 +237,6 @@ class OptionsList extends Component { initialNumToRender={5} maxToRenderPerBatch={5} windowSize={5} - getItemLayout={this.props.getItemLayout} viewabilityConfig={this.viewabilityConfig} onViewableItemsChanged={() => { if (this.didLayout) { diff --git a/src/libs/Firebase/index.native.js b/src/libs/Firebase/index.native.js index b86e091c7178..af627091a0ae 100644 --- a/src/libs/Firebase/index.native.js +++ b/src/libs/Firebase/index.native.js @@ -1,16 +1,15 @@ +/* eslint-disable no-unused-vars */ import perf from '@react-native-firebase/perf'; import {isDevelopment} from '../Environment/Environment'; import Log from '../Log'; const traceMap = {}; -let start, stop; - /** * @param {String} customEventName */ function startTrace(customEventName) { - start = global.performance.now(); + const start = global.performance.now(); if (isDevelopment()) { return; } @@ -20,27 +19,34 @@ function startTrace(customEventName) { } perf().startTrace(customEventName) - .then(trace => traceMap[customEventName] = trace); + .then((trace) => { + traceMap[customEventName] = { + trace, + start, + }; + }); } /** * @param {String} customEventName */ function stopTrace(customEventName) { - stop = global.performance.now(); + const stop = global.performance.now(); if (isDevelopment()) { return; } - const trace = traceMap[customEventName]; + const {trace, start} = traceMap[customEventName]; if (!trace) { return; } trace.stop(); - Log.info(`@marcaaron sidebar_loaded took: ${stop - start} ms`, true); + // Uncomment to inspect logs on release builds + // Log.info(`sidebar_loaded: ${stop - start} ms`, true); + delete traceMap[customEventName]; } diff --git a/src/libs/Navigation/AppNavigator/AuthScreens.js b/src/libs/Navigation/AppNavigator/AuthScreens.js index 9b6c0fbb5716..92b9a31c2e02 100644 --- a/src/libs/Navigation/AppNavigator/AuthScreens.js +++ b/src/libs/Navigation/AppNavigator/AuthScreens.js @@ -151,22 +151,19 @@ class AuthScreens extends React.Component { User.subscribeToUserEvents(); }); - // Fetch main data we need on initialization for the LHN + // Fetch some data we need on initialization + NameValuePair.get(CONST.NVP.PRIORITY_MODE, ONYXKEYS.NVP_PRIORITY_MODE, 'default'); + NameValuePair.get(CONST.NVP.PREFERRED_LOCALE, ONYXKEYS.NVP_PREFERRED_LOCALE, 'en'); + PersonalDetails.fetchPersonalDetails(); + User.getUserDetails(); User.getBetas(); + User.getDomainInfo(); + PersonalDetails.fetchLocalCurrency(); fetchAllReports(true, true); - PersonalDetails.fetchPersonalDetails(); - NameValuePair.get(CONST.NVP.PRIORITY_MODE, ONYXKEYS.NVP_PRIORITY_MODE, 'default'); + fetchCountryCodeByRequestIP(); + UnreadIndicatorUpdater.listenForReportChanges(); - // Defer less critical API requests until after the sidebar loads - App.onSidebarLoaded(() => { - NameValuePair.get(CONST.NVP.PREFERRED_LOCALE, ONYXKEYS.NVP_PREFERRED_LOCALE, 'en'); - User.getUserDetails(); - User.getDomainInfo(); - PersonalDetails.fetchLocalCurrency(); - fetchCountryCodeByRequestIP(); - UnreadIndicatorUpdater.listenForReportChanges(); - loadPoliciesBehindBeta(this.props.betas); - }); + loadPoliciesBehindBeta(this.props.betas); // Refresh the personal details, timezone and betas every 30 minutes // There is no pusher event that sends updated personal details data yet diff --git a/src/libs/actions/App.js b/src/libs/actions/App.js index cb20fa05872c..e3b339fdc7ab 100644 --- a/src/libs/actions/App.js +++ b/src/libs/actions/App.js @@ -5,7 +5,6 @@ import Firebase from '../Firebase'; import CONST from '../../CONST'; let isSidebarLoaded; -let sidebarLoadedCallback; Onyx.connect({ key: ONYXKEYS.IS_SIDEBAR_LOADED, @@ -28,19 +27,11 @@ function setLocale(locale) { Onyx.merge(ONYXKEYS.NVP_PREFERRED_LOCALE, locale); } -function onSidebarLoaded(callback) { - sidebarLoadedCallback = callback; -} - function setSidebarLoaded() { if (isSidebarLoaded) { return; } - if (sidebarLoadedCallback) { - sidebarLoadedCallback(); - } - Onyx.set(ONYXKEYS.IS_SIDEBAR_LOADED, true); Firebase.stopTrace(CONST.TIMING.SIDEBAR_LOADED); } @@ -49,5 +40,4 @@ export { setCurrentURL, setLocale, setSidebarLoaded, - onSidebarLoaded, }; diff --git a/src/pages/home/sidebar/SidebarLinks.js b/src/pages/home/sidebar/SidebarLinks.js index e0de12b3d3e3..d846b67e9e29 100644 --- a/src/pages/home/sidebar/SidebarLinks.js +++ b/src/pages/home/sidebar/SidebarLinks.js @@ -94,28 +94,6 @@ const defaultProps = { }; class SidebarLinks extends React.Component { - constructor(props) { - super(props); - this.getItemLayout = this.getItemLayout.bind(this); - this.onSelectRow = this.onSelectRow.bind(this); - } - - shouldComponentUpdate(prevProps) { - return _.isEqual(prevProps, this.props); - } - - onSelectRow(option) { - Navigation.navigate(ROUTES.getReportRoute(option.reportID)); - this.props.onLinkClick(); - } - - getItemLayout(data, index) { - const length = this.props.priorityMode === CONST.PRIORITY_MODE.GSD ? 52 : 64; - return ( - {length, offset: length * index, index} - ); - } - showSearchPage() { Navigation.navigate(ROUTES.SEARCH); } @@ -192,14 +170,16 @@ class SidebarLinks extends React.Component { focusedIndex={_.findIndex(recentReports, ( option => option.reportID === activeReportID ))} - onSelectRow={this.onSelectRow} + onSelectRow={(option) => { + Navigation.navigate(ROUTES.getReportRoute(option.reportID)); + this.props.onLinkClick(); + }} optionBackgroundColor={themeColors.sidebar} hideSectionHeaders showTitleTooltip disableFocusOptions={this.props.isSmallScreenWidth} optionMode={this.props.priorityMode === CONST.PRIORITY_MODE.GSD ? 'compact' : 'default'} onLayout={App.setSidebarLoaded} - getItemLayout={this.getItemLayout} /> From 8a623c6e3804e7652b08ec8428b8bb0b5cf776e8 Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Tue, 27 Jul 2021 16:49:25 -1000 Subject: [PATCH 13/14] remove unused import --- src/libs/Navigation/AppNavigator/AuthScreens.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/libs/Navigation/AppNavigator/AuthScreens.js b/src/libs/Navigation/AppNavigator/AuthScreens.js index 92b9a31c2e02..5ba802e792bf 100644 --- a/src/libs/Navigation/AppNavigator/AuthScreens.js +++ b/src/libs/Navigation/AppNavigator/AuthScreens.js @@ -25,7 +25,6 @@ import {fetchCountryCodeByRequestIP} from '../../actions/GeoLocation'; import KeyboardShortcut from '../../KeyboardShortcut'; import Navigation from '../Navigation'; import * as User from '../../actions/User'; -import * as App from '../../actions/App'; import {setModalVisibility} from '../../actions/Modal'; import NameValuePair from '../../actions/NameValuePair'; import {getPolicySummaries, getPolicyList} from '../../actions/Policy'; From c687d63142df2eafa862257a54c5e3e270ce40ff Mon Sep 17 00:00:00 2001 From: Marc Glasser Date: Tue, 27 Jul 2021 19:07:22 -1000 Subject: [PATCH 14/14] add mock for rn firebase --- __mocks__/@react-native-firebase/perf.js | 1 + 1 file changed, 1 insertion(+) create mode 100644 __mocks__/@react-native-firebase/perf.js diff --git a/__mocks__/@react-native-firebase/perf.js b/__mocks__/@react-native-firebase/perf.js new file mode 100644 index 000000000000..2d1ec238274a --- /dev/null +++ b/__mocks__/@react-native-firebase/perf.js @@ -0,0 +1 @@ +export default () => {};