fix: clear document details on unmount to prevent stale data

src/lib/modules/Loan/actions.js

@@ -14,6 +14,7 @@ export const ACTION_HAS_ERROR = 'loanAction/HAS_ERROR';
 export const DETAILS_IS_LOADING = 'fetchLoanDetails/IS_LOADING';
 export const DETAILS_SUCCESS = 'fetchLoanDetails/SUCCESS';
 export const DETAILS_HAS_ERROR = 'fetchLoanDetails/HAS_ERROR';
+export const CLEAR = 'fetchLoanDetails/CLEAR';
 
 export const fetchLoanDetails = (
   loanPid,
@@ -62,6 +63,14 @@ export const fetchLoanDetails = (
   };
 };
 
+export const clearLoanDetails = () => {
+  return (dispatch) => {
+    dispatch({
+      type: CLEAR,
+    });
+  };
+};
+
 export const performLoanAction = (
   actionURL,
   documentPid,

src/lib/modules/Loan/reducer.js

@@ -2,6 +2,7 @@ import {
   ACTION_HAS_ERROR,
   ACTION_IS_LOADING,
   ACTION_SUCCESS,
+  CLEAR,
   DETAILS_HAS_ERROR,
   DETAILS_IS_LOADING,
   DETAILS_SUCCESS,
@@ -66,6 +67,8 @@ export const loanDetailsReducer = (state = initialDetailsState, action) => {
         isLoading: false,
         hasError: true,
       };
+    case CLEAR:
+      return { ...initialDetailsState };
     default:
       return state;
   }

src/lib/pages/backoffice/Acquisition/Order/OrderDetails/OrderDetails.js

@@ -196,6 +196,11 @@ export default class OrderDetails extends React.Component {
     }
   }
 
+  componentWillUnmount() {
+    const { clearOrderDetails } = this.props;
+    clearOrderDetails();
+  }
+
   render() {
     const { isLoading, error, data } = this.props;
     const metadata = data.metadata || {};
@@ -243,6 +248,7 @@ export default class OrderDetails extends React.Component {
 OrderDetails.propTypes = {
   data: PropTypes.object.isRequired,
   fetchOrderDetails: PropTypes.func.isRequired,
+  clearOrderDetails: PropTypes.func.isRequired,
   isLoading: PropTypes.bool,
   error: PropTypes.object,
   match: PropTypes.shape({

src/lib/pages/backoffice/Acquisition/Order/OrderDetails/index.js

@@ -1,6 +1,6 @@
 import { connect } from 'react-redux';
 
-import { fetchOrderDetails } from './state/actions';
+import { fetchOrderDetails, clearOrderDetails } from './state/actions';
 import OrderDetailsComponent from './OrderDetails';
 
 const mapStateToProps = (state) => ({
@@ -12,6 +12,7 @@ const mapStateToProps = (state) => ({
 
 const mapDispatchToProps = (dispatch) => ({
   fetchOrderDetails: (orderPid) => dispatch(fetchOrderDetails(orderPid)),
+  clearOrderDetails: () => dispatch(clearOrderDetails()),
 });
 
 export const OrderDetails = connect(

src/lib/pages/backoffice/Acquisition/Order/OrderDetails/state/actions.js

@@ -4,6 +4,15 @@ import { sendErrorNotification } from '@components/Notifications';
 export const IS_LOADING = 'fetchOrderDetails/IS_LOADING';
 export const SUCCESS = 'fetchOrderDetails/SUCCESS';
 export const HAS_ERROR = 'fetchOrderDetails/HAS_ERROR';
+export const CLEAR = 'fetchOrderDetails/CLEAR';
+
+export const clearOrderDetails = () => {
+  return (dispatch) => {
+    dispatch({
+      type: CLEAR,
+    });
+  };
+};
 
 export const fetchOrderDetails = (pid) => {
   return async (dispatch) => {

src/lib/pages/backoffice/Acquisition/Order/OrderDetails/state/reducer.js

@@ -1,4 +1,4 @@
-import { IS_LOADING, SUCCESS, HAS_ERROR } from './actions';
+import { IS_LOADING, SUCCESS, HAS_ERROR, CLEAR } from './actions';
 
 export const initialState = {
   isLoading: true,
@@ -26,6 +26,8 @@ export default (state = initialState, action) => {
         error: action.payload,
         hasError: true,
       };
+    case CLEAR:
+      return { ...initialState };
     default:
       return state;
   }

src/lib/pages/backoffice/Document/DocumentDetails/DocumentDetails.js

@@ -44,6 +44,11 @@ export default class DocumentDetails extends Component {
     }
   }
 
+  componentWillUnmount() {
+    const { clearDocumentDetails } = this.props;
+    clearDocumentDetails();
+  }
+
   render() {
     const { isLoading, error, data } = this.props;
     return (
@@ -99,6 +104,7 @@ DocumentDetails.propTypes = {
   error: PropTypes.object,
   data: PropTypes.object.isRequired,
   fetchDocumentDetails: PropTypes.func.isRequired,
+  clearDocumentDetails: PropTypes.func.isRequired,
   match: PropTypes.shape({
     params: PropTypes.shape({
       documentPid: PropTypes.string,

src/lib/pages/backoffice/Document/DocumentDetails/index.js

@@ -1,6 +1,6 @@
 import { connect } from 'react-redux';
 
-import { fetchDocumentDetails } from './state/actions';
+import { fetchDocumentDetails, clearDocumentDetails } from './state/actions';
 import DocumentDetailsComponent from './DocumentDetails';
 
 const mapStateToProps = (state) => ({
@@ -13,6 +13,7 @@ const mapStateToProps = (state) => ({
 const mapDispatchToProps = (dispatch) => ({
   fetchDocumentDetails: (documentPid) =>
     dispatch(fetchDocumentDetails(documentPid)),
+  clearDocumentDetails: () => dispatch(clearDocumentDetails()),
 });
 
 export const DocumentDetails = connect(

src/lib/pages/backoffice/Document/DocumentDetails/state/actions.js

@@ -19,11 +19,20 @@ import { Icon } from 'semantic-ui-react';
 export const IS_LOADING = 'fetchDocumentDetails/IS_LOADING';
 export const SUCCESS = 'fetchDocumentDetails/SUCCESS';
 export const HAS_ERROR = 'fetchDocumentDetails/HAS_ERROR';
+export const CLEAR = 'fetchDocumentDetails/CLEAR';
 
 export const DELETE_IS_LOADING = 'deleteDocument/DELETE_IS_LOADING';
 export const DELETE_SUCCESS = 'deleteDocument/DELETE_SUCCESS';
 export const DELETE_HAS_ERROR = 'deleteDocument/DELETE_HAS_ERROR';
 
+export const clearDocumentDetails = () => {
+  return (dispatch) => {
+    dispatch({
+      type: CLEAR,
+    });
+  };
+};
+
 export const fetchDocumentDetails = (documentPid) => {
   return async (dispatch) => {
     dispatch({

src/lib/pages/backoffice/Document/DocumentDetails/state/reducer.js

@@ -5,6 +5,7 @@ import {
   IS_LOADING,
   SUCCESS,
   HAS_ERROR,
+  CLEAR,
 } from './actions';
 
 export const initialState = {
@@ -48,6 +49,8 @@ export default (state = initialState, action) => {
         error: action.payload,
         hasError: true,
       };
+    case CLEAR:
+      return { ...initialState };
     default:
       return state;
   }

src/lib/pages/backoffice/DocumentRequest/DocumentRequestDetails/DocumentRequestDetails.js

@@ -31,6 +31,11 @@ export default class DocumentRequestDetails extends Component {
     }
   }
 
+  componentWillUnmount() {
+    const { clearDocumentRequestDetails } = this.props;
+    clearDocumentRequestDetails();
+  }
+
   render() {
     const { data, isLoading, error } = this.props;
     return (
@@ -72,6 +77,7 @@ export default class DocumentRequestDetails extends Component {
 
 DocumentRequestDetails.propTypes = {
   fetchDocumentRequestDetails: PropTypes.func.isRequired,
+  clearDocumentRequestDetails: PropTypes.func.isRequired,
   data: PropTypes.object.isRequired,
   isLoading: PropTypes.bool,
   error: PropTypes.object,

src/lib/pages/backoffice/DocumentRequest/DocumentRequestDetails/index.js

@@ -1,6 +1,9 @@
 import { connect } from 'react-redux';
 import DocumentRequestDetailsComponent from './DocumentRequestDetails';
-import { fetchDocumentRequestDetails } from './state/actions';
+import {
+  fetchDocumentRequestDetails,
+  clearDocumentRequestDetails,
+} from './state/actions';
 
 const mapStateToProps = (state) => ({
   data: state.documentRequestDetails.data,
@@ -11,6 +14,7 @@ const mapStateToProps = (state) => ({
 const mapDispatchToProps = (dispatch) => ({
   fetchDocumentRequestDetails: (documentRequestPid) =>
     dispatch(fetchDocumentRequestDetails(documentRequestPid)),
+  clearDocumentRequestDetails: () => dispatch(clearDocumentRequestDetails()),
 });
 
 export const DocumentRequestDetails = connect(

src/lib/pages/backoffice/DocumentRequest/DocumentRequestDetails/state/actions.js

@@ -9,11 +9,20 @@ import { BackOfficeRoutes } from '@routes/urls';
 export const IS_LOADING = 'fetchDocumentRequestDetails/IS_LOADING';
 export const SUCCESS = 'fetchDocumentRequestDetails/SUCCESS';
 export const HAS_ERROR = 'fetchDocumentRequestDetails/HAS_ERROR';
+export const CLEAR = 'fetchDocumentRequestDetails/CLEAR';
 
 export const DELETE_IS_LOADING = 'deleteDocumentRequest/DELETE_IS_LOADING';
 export const DELETE_SUCCESS = 'deleteDocumentRequest/DELETE_SUCCESS';
 export const DELETE_HAS_ERROR = 'deleteDocumentRequest/DELETE_HAS_ERROR';
 
+export const clearDocumentRequestDetails = () => {
+  return (dispatch) => {
+    dispatch({
+      type: CLEAR,
+    });
+  };
+};
+
 export const fetchDocumentRequestDetails = (documentRequestPid) => {
   return async (dispatch) => {
     dispatch({

src/lib/pages/backoffice/DocumentRequest/DocumentRequestDetails/state/reducer.js

@@ -4,6 +4,7 @@ import {
   HAS_ERROR,
   IS_LOADING,
   SUCCESS,
+  CLEAR,
 } from './actions';
 
 export const initialState = {
@@ -34,6 +35,8 @@ export default (state = initialState, action) => {
         isLoading: false,
         hasError: true,
       };
+    case CLEAR:
+      return { ...initialState };
     default:
       return state;
   }

src/lib/pages/backoffice/EItem/EItemDetails/EItemDetails.js

@@ -29,6 +29,11 @@ export default class EItemDetails extends Component {
     }
   }
 
+  componentWillUnmount() {
+    const { clearEItemDetails } = this.props;
+    clearEItemDetails();
+  }
+
   render() {
     const { isLoading, error, data } = this.props;
     return (
@@ -69,6 +74,7 @@ export default class EItemDetails extends Component {
 
 EItemDetails.propTypes = {
   fetchEItemDetails: PropTypes.func.isRequired,
+  clearEItemDetails: PropTypes.func.isRequired,
   isLoading: PropTypes.bool.isRequired,
   data: PropTypes.object.isRequired,
   error: PropTypes.object,

src/lib/pages/backoffice/EItem/EItemDetails/index.js

@@ -1,5 +1,5 @@
 import { connect } from 'react-redux';
-import { fetchEItemDetails } from './state/actions';
+import { fetchEItemDetails, clearEItemDetails } from './state/actions';
 import EItemDetailsComponent from './EItemDetails';
 
 const mapStateToProps = (state) => ({
@@ -10,6 +10,7 @@ const mapStateToProps = (state) => ({
 
 const mapDispatchToProps = (dispatch) => ({
   fetchEItemDetails: (eitemPid) => dispatch(fetchEItemDetails(eitemPid)),
+  clearEItemDetails: () => dispatch(clearEItemDetails()),
 });
 
 export const EItemDetails = connect(

src/lib/pages/backoffice/EItem/EItemDetails/state/actions.js

@@ -10,6 +10,7 @@ import { BackOfficeRoutes } from '@routes/urls';
 export const IS_LOADING = 'fetchEItemDetails/IS_LOADING';
 export const SUCCESS = 'fetchEItemDetails/SUCCESS';
 export const HAS_ERROR = 'fetchEItemDetails/HAS_ERROR';
+export const CLEAR = 'fetchEItemDetails/CLEAR';
 
 export const DELETE_IS_LOADING = 'fetchEItemDetails/DELETE_IS_LOADING';
 export const DELETE_SUCCESS = 'fetchEItemDetails/DELETE_SUCCESS';
@@ -18,6 +19,15 @@ export const DELETE_HAS_ERROR = 'fetchEItemDetails/DELETE_HAS_ERROR';
 export const ADD_FILE = 'fetchEItemDetails/ADD_FILE';
 export const DELETE_FILE = 'fetchEItemDetails/DELETE_FILE';
 export const UPLOAD_IS_LOADING = 'fetchEItemDetails/UPLOAD_IS_LOADING';
+
+export const clearEItemDetails = () => {
+  return (dispatch) => {
+    dispatch({
+      type: CLEAR,
+    });
+  };
+};
+
 export const deleteEItem = (eitemPid) => {
   return async (dispatch) => {
     dispatch({

src/lib/pages/backoffice/EItem/EItemDetails/state/reducer.js

@@ -7,6 +7,7 @@ import {
   HAS_ERROR,
   ADD_FILE,
   DELETE_FILE,
+  CLEAR,
 } from './actions';
 import get from 'lodash/get';
 
@@ -81,6 +82,8 @@ export default (state = initialState, action) => {
         error: action.payload,
         hasError: true,
       };
+    case CLEAR:
+      return { ...initialState };
     default:
       return state;
   }

src/lib/pages/backoffice/ILL/BorrowingRequest/BorrowingRequestDetails/BorrowingRequestDetails.js

@@ -171,6 +171,11 @@ export default class BorrowingRequestDetails extends Component {
     }
   }
 
+  componentWillUnmount() {
+    const { clearBorrowingRequestDetails } = this.props;
+    clearBorrowingRequestDetails();
+  }
+
   render() {
     const { isLoading, error, data } = this.props;
     const metadata = data.metadata || {};
@@ -219,6 +224,7 @@ BorrowingRequestDetails.propTypes = {
   error: PropTypes.object,
   isLoading: PropTypes.bool.isRequired,
   fetchBorrowingRequestDetails: PropTypes.func.isRequired,
+  clearBorrowingRequestDetails: PropTypes.func.isRequired,
   match: PropTypes.shape({
     params: PropTypes.shape({
       borrowingRequestPid: PropTypes.string,

src/lib/pages/backoffice/ILL/BorrowingRequest/BorrowingRequestDetails/index.js

@@ -1,6 +1,9 @@
 import { connect } from 'react-redux';
 
-import { fetchBorrowingRequestDetails } from './state/actions';
+import {
+  clearBorrowingRequestDetails,
+  fetchBorrowingRequestDetails,
+} from './state/actions';
 import BorrowingRequestDetailsComponent from './BorrowingRequestDetails';
 
 const mapStateToProps = (state) => ({
@@ -12,6 +15,7 @@ const mapStateToProps = (state) => ({
 const mapDispatchToProps = (dispatch) => ({
   fetchBorrowingRequestDetails: (brwReqPid) =>
     dispatch(fetchBorrowingRequestDetails(brwReqPid)),
+  clearBorrowingRequestDetails: () => dispatch(clearBorrowingRequestDetails()),
 });
 
 export const BorrowingRequestDetails = connect(

src/lib/pages/backoffice/ILL/BorrowingRequest/BorrowingRequestDetails/state/actions.js

@@ -3,6 +3,7 @@ import { borrowingRequestApi } from '@api/ill';
 export const IS_LOADING = 'fetchBorrowingRequestDetails/IS_LOADING';
 export const SUCCESS = 'fetchBorrowingRequestDetails/SUCCESS';
 export const HAS_ERROR = 'fetchBorrowingRequestDetails/HAS_ERROR';
+export const CLEAR = 'fetchBorrowingRequestDetails/CLEAR';
 
 export const fetchBorrowingRequestDetails = (borrowingRequestPid) => {
   return async (dispatch) => {
@@ -24,3 +25,11 @@ export const fetchBorrowingRequestDetails = (borrowingRequestPid) => {
     }
   };
 };
+
+export const clearBorrowingRequestDetails = () => {
+  return (dispatch) => {
+    dispatch({
+      type: CLEAR,
+    });
+  };
+};