Skip to content

Commit

Permalink
Merge pull request Expensify#24204 from tienifr/fix/23735
Browse files Browse the repository at this point in the history
Fix: 23735 Web - App displays single report in LHN for some time on login with that report link
  • Loading branch information
aldo-expensify authored Aug 11, 2023
2 parents 60c4d1d + 2358228 commit ed2c287
Show file tree
Hide file tree
Showing 5 changed files with 82 additions and 11 deletions.
42 changes: 39 additions & 3 deletions src/pages/home/sidebar/SidebarLinks.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import React from 'react';
import {View} from 'react-native';
import _ from 'underscore';
import PropTypes from 'prop-types';
import {withOnyx} from 'react-native-onyx';
import styles from '../../../styles/styles';
import * as StyleUtils from '../../../styles/StyleUtils';
import ONYXKEYS from '../../../ONYXKEYS';
Expand Down Expand Up @@ -36,6 +37,8 @@ import KeyboardShortcut from '../../../libs/KeyboardShortcut';
import onyxSubscribe from '../../../libs/onyxSubscribe';
import personalDetailsPropType from '../../personalDetailsPropType';
import * as ReportActionContextMenu from '../report/ContextMenu/ReportActionContextMenu';
import withCurrentReportID from '../../../components/withCurrentReportID';
import OptionRowLHNData from '../../../components/LHNOptionsList/OptionRowLHNData';

const basePropTypes = {
/** Toggles the navigation menu open and closed */
Expand All @@ -59,6 +62,15 @@ const propTypes = {

priorityMode: PropTypes.oneOf(_.values(CONST.PRIORITY_MODE)),

/** The top most report id */
currentReportID: PropTypes.string,

/* Onyx Props */
report: PropTypes.shape({
/** reportID (only present when there is a matching report) */
reportID: PropTypes.string,
}),

...withLocalizePropTypes,
};

Expand All @@ -67,6 +79,8 @@ const defaultProps = {
avatar: '',
},
priorityMode: CONST.PRIORITY_MODE.DEFAULT,
currentReportID: '',
report: {},
};

class SidebarLinks extends React.PureComponent {
Expand Down Expand Up @@ -161,6 +175,8 @@ class SidebarLinks extends React.PureComponent {
}

render() {
const viewMode = this.props.priorityMode === CONST.PRIORITY_MODE.GSD ? CONST.OPTION_MODE.COMPACT : CONST.OPTION_MODE.DEFAULT;

return (
<View style={[styles.flex1, styles.h100]}>
<View
Expand Down Expand Up @@ -213,14 +229,24 @@ class SidebarLinks extends React.PureComponent {
</PressableWithoutFeedback>
</View>
{this.props.isLoading ? (
<OptionsListSkeletonView shouldAnimate />
<>
{lodashGet(this.props.report, 'reportID') && (
<OptionRowLHNData
reportID={this.props.currentReportID}
viewMode={viewMode}
shouldDisableFocusOptions={this.props.isSmallScreenWidth}
onSelectRow={this.showReportPage}
/>
)}
<OptionsListSkeletonView shouldAnimate />
</>
) : (
<LHNOptionsList
contentContainerStyles={[styles.sidebarListContainer, {paddingBottom: StyleUtils.getSafeAreaMargins(this.props.insets).marginBottom}]}
data={this.props.optionListItems}
onSelectRow={this.showReportPage}
shouldDisableFocusOptions={this.props.isSmallScreenWidth}
optionMode={this.props.priorityMode === CONST.PRIORITY_MODE.GSD ? CONST.OPTION_MODE.COMPACT : CONST.OPTION_MODE.DEFAULT}
optionMode={viewMode}
/>
)}
</View>
Expand All @@ -230,5 +256,15 @@ class SidebarLinks extends React.PureComponent {

SidebarLinks.propTypes = propTypes;
SidebarLinks.defaultProps = defaultProps;
export default compose(withLocalize, withCurrentUserPersonalDetails, withWindowDimensions)(SidebarLinks);
export default compose(
withLocalize,
withCurrentUserPersonalDetails,
withWindowDimensions,
withCurrentReportID,
withOnyx({
report: {
key: ({currentReportID}) => `${ONYXKEYS.COLLECTION.REPORT}${currentReportID}`,
},
}),
)(SidebarLinks);
export {basePropTypes};
16 changes: 8 additions & 8 deletions src/pages/home/sidebar/SidebarLinksData.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import CONST from '../../../CONST';
import useLocalize from '../../../hooks/useLocalize';
import styles from '../../../styles/styles';
import withNavigationFocus from '../../../components/withNavigationFocus';
import * as SessionUtils from '../../../libs/SessionUtils';

const propTypes = {
...basePropTypes,
Expand All @@ -39,8 +40,8 @@ const propTypes = {
),
),

/** Whether the personal details are loading. When false it means they are ready to be used. */
isPersonalDetailsLoading: PropTypes.bool,
/** Whether the reports are loading. When false it means they are ready to be used. */
isLoadingReportData: PropTypes.bool,

/** The chat priority mode */
priorityMode: PropTypes.string,
Expand All @@ -56,13 +57,13 @@ const propTypes = {
const defaultProps = {
chatReports: {},
allReportActions: {},
isLoadingReportData: true,
priorityMode: CONST.PRIORITY_MODE.DEFAULT,
isPersonalDetailsLoading: true,
betas: [],
policies: [],
};

function SidebarLinksData({isFocused, allReportActions, betas, chatReports, currentReportID, insets, isPersonalDetailsLoading, isSmallScreenWidth, onLinkClick, policies, priorityMode}) {
function SidebarLinksData({isFocused, allReportActions, betas, chatReports, currentReportID, insets, isLoadingReportData, isSmallScreenWidth, onLinkClick, policies, priorityMode}) {
const {translate} = useLocalize();

const reportIDsRef = useRef([]);
Expand All @@ -75,7 +76,7 @@ function SidebarLinksData({isFocused, allReportActions, betas, chatReports, curr
return reportIDs;
}, [allReportActions, betas, chatReports, currentReportID, policies, priorityMode]);

const isLoading = _.isEmpty(chatReports) || isPersonalDetailsLoading;
const isLoading = SessionUtils.didUserLogInDuringSession() && isLoadingReportData;

return (
<View
Expand Down Expand Up @@ -178,9 +179,8 @@ export default compose(
key: ONYXKEYS.COLLECTION.REPORT,
selector: chatReportSelector,
},
isPersonalDetailsLoading: {
key: ONYXKEYS.PERSONAL_DETAILS_LIST,
selector: _.isEmpty,
isLoadingReportData: {
key: ONYXKEYS.IS_LOADING_REPORT_DATA,
},
priorityMode: {
key: ONYXKEYS.NVP_PRIORITY_MODE,
Expand Down
15 changes: 15 additions & 0 deletions tests/unit/SidebarFilterTest.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ jest.mock('../../src/libs/Permissions');

const ONYXKEYS = {
PERSONAL_DETAILS_LIST: 'personalDetailsList',
IS_LOADING_REPORT_DATA: 'isLoadingReportData',
NVP_PRIORITY_MODE: 'nvp_priorityMode',
SESSION: 'session',
BETAS: 'betas',
Expand Down Expand Up @@ -88,6 +89,7 @@ describe('Sidebar', () => {
Onyx.multiSet({
[ONYXKEYS.BETAS]: [],
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${report.reportID}`]: report,
}),
)
Expand Down Expand Up @@ -132,6 +134,7 @@ describe('Sidebar', () => {
Onyx.multiSet({
[ONYXKEYS.BETAS]: [],
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${report.reportID}`]: report,
}),
)
Expand Down Expand Up @@ -184,6 +187,7 @@ describe('Sidebar', () => {
Onyx.multiSet({
[ONYXKEYS.BETAS]: [],
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${report1.reportID}`]: report1,
[`${ONYXKEYS.COLLECTION.REPORT}${report2.reportID}`]: report2,
[`${ONYXKEYS.COLLECTION.REPORT}${report3.reportID}`]: report3,
Expand Down Expand Up @@ -235,6 +239,7 @@ describe('Sidebar', () => {
Onyx.multiSet({
[ONYXKEYS.BETAS]: [],
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${report.reportID}`]: report,
[`${ONYXKEYS.COLLECTION.POLICY}${policy.policyID}`]: policy,
}),
Expand Down Expand Up @@ -323,6 +328,7 @@ describe('Sidebar', () => {
[ONYXKEYS.NVP_PRIORITY_MODE]: CONST.PRIORITY_MODE.GSD,
[ONYXKEYS.BETAS]: betas,
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${report1.reportID}`]: report1,
[`${ONYXKEYS.COLLECTION.REPORT}${report2.reportID}`]: report2,
[`${ONYXKEYS.COLLECTION.POLICY}${policy.policyID}`]: policy,
Expand Down Expand Up @@ -366,6 +372,7 @@ describe('Sidebar', () => {
Onyx.multiSet({
[ONYXKEYS.NVP_PRIORITY_MODE]: CONST.PRIORITY_MODE.GSD,
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${report1.reportID}`]: report1,
[`${ONYXKEYS.COLLECTION.REPORT}${report2.reportID}`]: report2,
[`${ONYXKEYS.COLLECTION.REPORT}${report3.reportID}`]: report3,
Expand Down Expand Up @@ -436,6 +443,7 @@ describe('Sidebar', () => {
Onyx.multiSet({
[ONYXKEYS.NVP_PRIORITY_MODE]: CONST.PRIORITY_MODE.GSD,
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${draftReport.reportID}`]: draftReport,
[`${ONYXKEYS.COLLECTION.REPORT}${pinnedReport.reportID}`]: pinnedReport,
}),
Expand Down Expand Up @@ -483,6 +491,7 @@ describe('Sidebar', () => {
[ONYXKEYS.NVP_PRIORITY_MODE]: CONST.PRIORITY_MODE.GSD,
[ONYXKEYS.BETAS]: betas,
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${archivedReport.reportID}`]: archivedReport,
[`${ONYXKEYS.COLLECTION.REPORT}${archivedPolicyRoomReport.reportID}`]: archivedPolicyRoomReport,
[`${ONYXKEYS.COLLECTION.REPORT}${archivedUserCreatedPolicyRoomReport.reportID}`]: archivedUserCreatedPolicyRoomReport,
Expand Down Expand Up @@ -545,6 +554,7 @@ describe('Sidebar', () => {
[ONYXKEYS.NVP_PRIORITY_MODE]: CONST.PRIORITY_MODE.GSD,
[ONYXKEYS.BETAS]: betas,
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${policyRoomReport.reportID}`]: policyRoomReport,
[`${ONYXKEYS.COLLECTION.REPORT}${userCreatedPolicyRoomReport.reportID}`]: userCreatedPolicyRoomReport,
}),
Expand Down Expand Up @@ -643,6 +653,7 @@ describe('Sidebar', () => {
[ONYXKEYS.NVP_PRIORITY_MODE]: CONST.PRIORITY_MODE.GSD,
[ONYXKEYS.BETAS]: betas,
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${report1.reportID}`]: report1,
[`${ONYXKEYS.COLLECTION.REPORT}${report2.reportID}`]: report2,
[`${ONYXKEYS.COLLECTION.POLICY}${policy.policyID}`]: policy,
Expand Down Expand Up @@ -694,6 +705,7 @@ describe('Sidebar', () => {
[ONYXKEYS.NVP_PRIORITY_MODE]: CONST.PRIORITY_MODE.DEFAULT,
[ONYXKEYS.BETAS]: betas,
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${report.reportID}`]: report,
}),
)
Expand Down Expand Up @@ -744,6 +756,7 @@ describe('Sidebar', () => {
[ONYXKEYS.NVP_PRIORITY_MODE]: CONST.PRIORITY_MODE.GSD,
[ONYXKEYS.BETAS]: betas,
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${report.reportID}`]: report,
}),
)
Expand Down Expand Up @@ -792,6 +805,7 @@ describe('Sidebar', () => {
[ONYXKEYS.NVP_PRIORITY_MODE]: CONST.PRIORITY_MODE.GSD,
[ONYXKEYS.BETAS]: betas,
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${report.reportID}`]: report,
}),
)
Expand Down Expand Up @@ -836,6 +850,7 @@ describe('Sidebar', () => {
[ONYXKEYS.NVP_PRIORITY_MODE]: CONST.PRIORITY_MODE.GSD,
[ONYXKEYS.BETAS]: betas,
[ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails,
[ONYXKEYS.IS_LOADING_REPORT_DATA]: false,
[`${ONYXKEYS.COLLECTION.REPORT}${report.reportID}`]: report,
}),
)
Expand Down
Loading

0 comments on commit ed2c287

Please sign in to comment.