diff --git a/src/pages/ReportDetailsPage.js b/src/pages/ReportDetailsPage.js
index e76c29c7244e..622cb777aa5d 100644
--- a/src/pages/ReportDetailsPage.js
+++ b/src/pages/ReportDetailsPage.js
@@ -22,6 +22,7 @@ import MenuItem from '../components/MenuItem';
import Text from '../components/Text';
import CONST from '../CONST';
import reportPropTypes from './reportPropTypes';
+import withReportOrNavigateHome from './home/report/withReportOrNavigateHome';
const propTypes = {
...withLocalizePropTypes,
@@ -66,7 +67,7 @@ class ReportDetailsPage extends Component {
key: CONST.REPORT_DETAILS_MENU_ITEM.MEMBERS,
translationKey: 'common.members',
icon: Expensicons.Users,
- subtitle: props.report.participants.length,
+ subtitle: lodashGet(props.report, 'participants', []).length,
action: () => { Navigation.navigate(ROUTES.getReportParticipantsRoute(props.report.reportID)); },
});
@@ -177,10 +178,8 @@ ReportDetailsPage.propTypes = propTypes;
export default compose(
withLocalize,
+ withReportOrNavigateHome,
withOnyx({
- report: {
- key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${route.params.reportID}`,
- },
personalDetails: {
key: ONYXKEYS.PERSONAL_DETAILS,
},
diff --git a/src/pages/ReportParticipantsPage.js b/src/pages/ReportParticipantsPage.js
index f66c0cbfd724..eb1b63980c8a 100755
--- a/src/pages/ReportParticipantsPage.js
+++ b/src/pages/ReportParticipantsPage.js
@@ -19,6 +19,7 @@ import withLocalize, {withLocalizePropTypes} from '../components/withLocalize';
import compose from '../libs/compose';
import * as ReportUtils from '../libs/ReportUtils';
import reportPropTypes from './reportPropTypes';
+import withReportOrNavigateHome from './home/report/withReportOrNavigateHome';
const propTypes = {
/* Onyx Props */
@@ -113,12 +114,10 @@ ReportParticipantsPage.displayName = 'ReportParticipantsPage';
export default compose(
withLocalize,
+ withReportOrNavigateHome,
withOnyx({
personalDetails: {
key: ONYXKEYS.PERSONAL_DETAILS,
},
- report: {
- key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${route.params.reportID}`,
- },
}),
)(ReportParticipantsPage);
diff --git a/src/pages/ReportSettingsPage.js b/src/pages/ReportSettingsPage.js
index 16893895608e..4eb29ef282cc 100644
--- a/src/pages/ReportSettingsPage.js
+++ b/src/pages/ReportSettingsPage.js
@@ -21,6 +21,7 @@ import Picker from '../components/Picker';
import * as ValidationUtils from '../libs/ValidationUtils';
import OfflineWithFeedback from '../components/OfflineWithFeedback';
import reportPropTypes from './reportPropTypes';
+import withReportOrNavigateHome from './home/report/withReportOrNavigateHome';
const propTypes = {
/** Route params */
@@ -243,10 +244,8 @@ ReportSettingsPage.propTypes = propTypes;
export default compose(
withLocalize,
+ withReportOrNavigateHome,
withOnyx({
- report: {
- key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${route.params.reportID}`,
- },
policies: {
key: ONYXKEYS.COLLECTION.POLICY,
},
diff --git a/src/pages/home/report/withReportOrNavigateHome.js b/src/pages/home/report/withReportOrNavigateHome.js
new file mode 100644
index 000000000000..5e74f65a0cb8
--- /dev/null
+++ b/src/pages/home/report/withReportOrNavigateHome.js
@@ -0,0 +1,59 @@
+import PropTypes from 'prop-types';
+import React, {Component} from 'react';
+import {withOnyx} from 'react-native-onyx';
+import _ from 'underscore';
+import getComponentDisplayName from '../../../libs/getComponentDisplayName';
+import Navigation from '../../../libs/Navigation/Navigation';
+import ONYXKEYS from '../../../ONYXKEYS';
+import reportPropTypes from '../../reportPropTypes';
+
+export default function (WrappedComponent) {
+ const propTypes = {
+ /** The HOC takes an optional ref as a prop and passes it as a ref to the wrapped component.
+ * That way, if a ref is passed to a component wrapped in the HOC, the ref is a reference to the wrapped component, not the HOC. */
+ forwardedRef: PropTypes.func,
+
+ /** The report currently being looked at */
+ report: reportPropTypes,
+ };
+
+ const defaultProps = {
+ forwardedRef: () => {},
+ report: {},
+ };
+
+ class WithReportOrNavigateHome extends Component {
+ componentDidMount() {
+ if (!_.isEmpty(this.props.report)) {
+ return;
+ }
+ Navigation.dismissModal();
+ }
+
+ render() {
+ const rest = _.omit(this.props, ['forwardedRef']);
+
+ return (
+
+ );
+ }
+ }
+
+ WithReportOrNavigateHome.propTypes = propTypes;
+ WithReportOrNavigateHome.defaultProps = defaultProps;
+ WithReportOrNavigateHome.displayName = `withReportOrNavigateHome(${getComponentDisplayName(WrappedComponent)})`;
+ const withReportOrNavigateHome = React.forwardRef((props, ref) => (
+ // eslint-disable-next-line react/jsx-props-no-spreading
+
+ ));
+
+ return withOnyx({
+ report: {
+ key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${route.params.reportID}`,
+ },
+ })(withReportOrNavigateHome);
+}