OTC-757: Clearing pagination state if entered the FamiliesPage or Ins…

src/index.js

@@ -39,10 +39,10 @@ import EnrolledFamiliesReport from "./reports/EnrolledFamiliesReport";
 import InsureeFamilyOverviewReport from "./reports/InsureeFamilyOverviewReport";
 
 const ROUTE_INSUREE_FAMILIES = "insuree/families";
-const ROUTE_INSUREE_FAMILY_OVERVIEW = "insuree/familyOverview";
+const ROUTE_INSUREE_FAMILY_OVERVIEW = "insuree/families/familyOverview";
 const ROUTE_INSUREE_FAMILY = "insuree/family";
 const ROUTE_INSUREE_INSUREES = "insuree/insurees";
-const ROUTE_INSUREE_INSUREE = "insuree/insuree";
+const ROUTE_INSUREE_INSUREE = "insuree/insurees/insuree";
 
 const DEFAULT_CONFIG = {
   "translations": [{ key: "en", messages: messages_en }],

src/pages/FamiliesPage.js

@@ -1,10 +1,18 @@
 import React, { Component } from "react";
+import { bindActionCreators } from "redux";
 import { connect } from "react-redux";
 import { injectIntl } from "react-intl";
 import { withTheme, withStyles } from "@material-ui/core/styles";
 import { Fab } from "@material-ui/core";
 import AddIcon from "@material-ui/icons/Add";
-import { historyPush, withModulesManager, withHistory, withTooltip, formatMessage } from "@openimis/fe-core";
+import {
+  historyPush,
+  withModulesManager,
+  withHistory,
+  withTooltip,
+  formatMessage,
+  clearCurrentPaginationPage,
+} from "@openimis/fe-core";
 import FamilySearcher from "../components/FamilySearcher";
 
 import { RIGHT_FAMILY_ADD } from "../constants";
@@ -26,6 +34,21 @@ class FamiliesPage extends Component {
     historyPush(this.props.modulesManager, this.props.history, "insuree.route.family");
   };
 
+  componentDidMount = () => {
+    const moduleName = "insuree";
+    const { module } = this.props;
+    if (module !== moduleName) this.props.clearCurrentPaginationPage();
+  };
+
+  componentWillUnmount = () => {
+    const { location, history } = this.props;
+    const {
+      location: { pathname },
+    } = history;
+    const urlPath = location.pathname;
+    if (!pathname.includes(urlPath)) this.props.clearCurrentPaginationPage();
+  };
+
   render() {
     const { intl, classes, rights } = this.props;
     return (
@@ -52,8 +75,13 @@ class FamiliesPage extends Component {
 
 const mapStateToProps = (state) => ({
   rights: !!state.core && !!state.core.user && !!state.core.user.i_user ? state.core.user.i_user.rights : [],
+  module: state.core?.savedPagination?.module,
 });
 
+const mapDispatchToProps = (dispatch) => bindActionCreators({ clearCurrentPaginationPage }, dispatch);
+
 export default injectIntl(
-  withModulesManager(withHistory(connect(mapStateToProps)(withTheme(withStyles(styles)(FamiliesPage))))),
+  withModulesManager(
+    withHistory(connect(mapStateToProps, mapDispatchToProps)(withTheme(withStyles(styles)(FamiliesPage)))),
+  ),
 );

src/pages/InsureesPage.js

@@ -1,10 +1,18 @@
 import React, { Component } from "react";
+import { bindActionCreators } from "redux";
 import { connect } from "react-redux";
 import { injectIntl } from "react-intl";
 import { withTheme, withStyles } from "@material-ui/core/styles";
 import { Fab } from "@material-ui/core";
 import AddIcon from "@material-ui/icons/Add";
-import { historyPush, withModulesManager, withHistory, withTooltip, formatMessage } from "@openimis/fe-core";
+import {
+  historyPush,
+  withModulesManager,
+  withHistory,
+  withTooltip,
+  formatMessage,
+  clearCurrentPaginationPage,
+} from "@openimis/fe-core";
 import InsureeSearcher from "../components/InsureeSearcher";
 
 import { RIGHT_INSUREE_ADD } from "../constants";
@@ -23,6 +31,21 @@ class InsureesPage extends Component {
     historyPush(this.props.modulesManager, this.props.history, "insuree.route.insuree");
   };
 
+  componentDidMount = () => {
+    const moduleName = "insuree";
+    const { module } = this.props;
+    if (module !== moduleName) this.props.clearCurrentPaginationPage();
+  };
+
+  componentWillUnmount = () => {
+    const { location, history } = this.props;
+    const {
+      location: { pathname },
+    } = history;
+    const urlPath = location.pathname;
+    if (!pathname.includes(urlPath)) this.props.clearCurrentPaginationPage();
+  };
+
   render() {
     const { intl, classes, rights } = this.props;
     return (
@@ -44,8 +67,13 @@ class InsureesPage extends Component {
 
 const mapStateToProps = (state) => ({
   rights: !!state.core && !!state.core.user && !!state.core.user.i_user ? state.core.user.i_user.rights : [],
+  module: state.core?.savedPagination?.module,
 });
 
+const mapDispatchToProps = (dispatch) => bindActionCreators({ clearCurrentPaginationPage }, dispatch);
+
 export default injectIntl(
-  withModulesManager(withHistory(connect(mapStateToProps)(withTheme(withStyles(styles)(InsureesPage))))),
+  withModulesManager(
+    withHistory(connect(mapStateToProps, mapDispatchToProps)(withTheme(withStyles(styles)(InsureesPage)))),
+  ),
 );