Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix skeleton loading forever on options list when offline #18788

Merged
merged 3 commits into from
May 14, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/libs/OptionsListUtils.js
Original file line number Diff line number Diff line change
Expand Up @@ -195,10 +195,10 @@ function getPersonalDetailsForLogins(logins, personalDetails) {
/**
* Return true if personal details data is ready, i.e. report list options can be created.
* @param {Object} personalDetails
* @returns {boolean}
* @returns {Boolean}
*/
function isPersonalDetailsReady(personalDetails) {
return !_.isEmpty(personalDetails) && !_.some(_.keys(personalDetails), (key) => !personalDetails[key].login);
return !_.isEmpty(personalDetails) && _.some(_.keys(personalDetails), (key) => personalDetails[key].login);
}

/**
Expand Down
9 changes: 9 additions & 0 deletions src/libs/ReportUtils.js
Original file line number Diff line number Diff line change
Expand Up @@ -1926,6 +1926,14 @@ function shouldReportShowSubscript(report) {
return isExpenseReport(report);
}

/**
* Return true if reports data exists
* @returns {Boolean}
*/
function isReportDataReady() {
return !_.isEmpty(allReports) && _.some(_.keys(allReports), (key) => allReports[key].reportID);
}

export {
getReportParticipantsTitle,
isReportMessageAttachment,
Expand Down Expand Up @@ -2006,5 +2014,6 @@ export {
getWhisperDisplayNames,
getWorkspaceAvatar,
shouldReportShowSubscript,
isReportDataReady,
isSettled,
};
10 changes: 2 additions & 8 deletions src/pages/NewChatPage.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import PropTypes from 'prop-types';
import {withOnyx} from 'react-native-onyx';
import OptionsSelector from '../components/OptionsSelector';
import * as OptionsListUtils from '../libs/OptionsListUtils';
import * as ReportUtils from '../libs/ReportUtils';
import ONYXKEYS from '../ONYXKEYS';
import styles from '../styles/styles';
import * as Report from '../libs/actions/Report';
Expand All @@ -31,9 +32,6 @@ const propTypes = {
/** All reports shared with the user */
reports: PropTypes.objectOf(reportPropTypes),

/** Indicates whether the reports data is ready */
isLoadingReportData: PropTypes.bool,

...windowDimensionsPropTypes,

...withLocalizePropTypes,
Expand All @@ -44,7 +42,6 @@ const defaultProps = {
betas: [],
personalDetails: {},
reports: {},
isLoadingReportData: true,
};

class NewChatPage extends Component {
Expand Down Expand Up @@ -226,7 +223,7 @@ class NewChatPage extends Component {
this.state.searchTerm,
maxParticipantsReached,
);
const isOptionsDataReady = !this.props.isLoadingReportData && OptionsListUtils.isPersonalDetailsReady(this.props.personalDetails);
const isOptionsDataReady = ReportUtils.isReportDataReady() && OptionsListUtils.isPersonalDetailsReady(this.props.personalDetails);

return (
<ScreenWrapper
Expand Down Expand Up @@ -281,8 +278,5 @@ export default compose(
betas: {
key: ONYXKEYS.BETAS,
},
isLoadingReportData: {
key: ONYXKEYS.IS_LOADING_REPORT_DATA,
},
}),
)(NewChatPage);
10 changes: 2 additions & 8 deletions src/pages/SearchPage.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import PropTypes from 'prop-types';
import {withOnyx} from 'react-native-onyx';
import OptionsSelector from '../components/OptionsSelector';
import * as OptionsListUtils from '../libs/OptionsListUtils';
import * as ReportUtils from '../libs/ReportUtils';
import ONYXKEYS from '../ONYXKEYS';
import styles from '../styles/styles';
import Navigation from '../libs/Navigation/Navigation';
Expand Down Expand Up @@ -33,9 +34,6 @@ const propTypes = {
/** All reports shared with the user */
reports: PropTypes.objectOf(reportPropTypes),

/** Indicates whether report data is ready */
isLoadingReportData: PropTypes.bool,

/** Window Dimensions Props */
...windowDimensionsPropTypes,

Expand All @@ -46,7 +44,6 @@ const defaultProps = {
betas: [],
personalDetails: {},
reports: {},
isLoadingReportData: true,
};

class SearchPage extends Component {
Expand Down Expand Up @@ -170,7 +167,7 @@ class SearchPage extends Component {

render() {
const sections = this.getSections();
const isOptionsDataReady = !this.props.isLoadingReportData && OptionsListUtils.isPersonalDetailsReady(this.props.personalDetails);
const isOptionsDataReady = ReportUtils.isReportDataReady() && OptionsListUtils.isPersonalDetailsReady(this.props.personalDetails);

return (
<ScreenWrapper includeSafeAreaPaddingBottom={false}>
Expand Down Expand Up @@ -218,8 +215,5 @@ export default compose(
betas: {
key: ONYXKEYS.BETAS,
},
isLoadingReportData: {
key: ONYXKEYS.IS_LOADING_REPORT_DATA,
},
}),
)(SearchPage);
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
import {withOnyx} from 'react-native-onyx';
import _ from 'underscore';
import * as OptionsListUtils from '../../../../libs/OptionsListUtils';
import * as ReportUtils from '../../../../libs/ReportUtils';
import OptionsSelector from '../../../../components/OptionsSelector';
import ONYXKEYS from '../../../../ONYXKEYS';
import withLocalize, {withLocalizePropTypes} from '../../../../components/withLocalize';
Expand All @@ -27,9 +28,6 @@ const propTypes = {
/** All reports shared with the user */
reports: PropTypes.objectOf(reportPropTypes),

/** Indicates whether report data is ready */
isLoadingReportData: PropTypes.bool,

/** padding bottom style of safe area */
safeAreaPaddingBottomStyle: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.object), PropTypes.object]),

Expand All @@ -44,7 +42,6 @@ const defaultProps = {
personalDetails: {},
reports: {},
betas: [],
isLoadingReportData: true,
};

class MoneyRequestParticipantsSelector extends Component {
Expand Down Expand Up @@ -154,7 +151,7 @@ class MoneyRequestParticipantsSelector extends Component {
Boolean(this.state.userToInvite),
this.state.searchTerm,
);
const isOptionsDataReady = !this.props.isLoadingReportData && OptionsListUtils.isPersonalDetailsReady(this.props.personalDetails);
const isOptionsDataReady = ReportUtils.isReportDataReady() && OptionsListUtils.isPersonalDetailsReady(this.props.personalDetails);

return (
<OptionsSelector
Expand Down Expand Up @@ -187,8 +184,5 @@ export default compose(
betas: {
key: ONYXKEYS.BETAS,
},
isLoadingReportData: {
key: ONYXKEYS.IS_LOADING_REPORT_DATA,
},
}),
)(MoneyRequestParticipantsSelector);
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import ONYXKEYS from '../../../../ONYXKEYS';
import styles from '../../../../styles/styles';
import OptionsSelector from '../../../../components/OptionsSelector';
import * as OptionsListUtils from '../../../../libs/OptionsListUtils';
import * as ReportUtils from '../../../../libs/ReportUtils';
import CONST from '../../../../CONST';
import withLocalize, {withLocalizePropTypes} from '../../../../components/withLocalize';
import compose from '../../../../libs/compose';
Expand Down Expand Up @@ -48,9 +49,6 @@ const propTypes = {
/** padding bottom style of safe area */
safeAreaPaddingBottomStyle: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.object), PropTypes.object]),

/** Indicates whether report data is ready */
isLoadingReportData: PropTypes.bool,

...withLocalizePropTypes,
};

Expand All @@ -60,7 +58,6 @@ const defaultProps = {
personalDetails: {},
reports: {},
safeAreaPaddingBottomStyle: {},
isLoadingReportData: true,
};

class MoneyRequestParticipantsSplitSelector extends Component {
Expand Down Expand Up @@ -213,7 +210,7 @@ class MoneyRequestParticipantsSplitSelector extends Component {
this.state.searchTerm,
maxParticipantsReached,
);
const isOptionsDataReady = !this.props.isLoadingReportData && OptionsListUtils.isPersonalDetailsReady(this.props.personalDetails);
const isOptionsDataReady = ReportUtils.isReportDataReady() && OptionsListUtils.isPersonalDetailsReady(this.props.personalDetails);

return (
<View style={[styles.flex1, styles.w100, this.props.participants.length > 0 ? this.props.safeAreaPaddingBottomStyle : {}]}>
Expand Down Expand Up @@ -254,8 +251,5 @@ export default compose(
betas: {
key: ONYXKEYS.BETAS,
},
isLoadingReportData: {
key: ONYXKEYS.IS_LOADING_REPORT_DATA,
},
}),
)(MoneyRequestParticipantsSplitSelector);