From 81026ae013d33d75452c6bbb0c7b7a859d65b030 Mon Sep 17 00:00:00 2001
From: leangseu-edx <83240113+leangseu-edx@users.noreply.github.com>
Date: Tue, 25 Jan 2022 14:00:51 -0500
Subject: [PATCH] feat: make the app reload submission on modal close (#50)

* feat: make the app reload submission on modal close

* chore: remove reloadSubmission request and reuse initial app
---
 src/containers/ReviewModal/index.jsx      |  5 +++-
 src/containers/ReviewModal/index.test.jsx | 34 +++++++++++++++++++----
 src/data/constants/requests.js            |  1 +
 src/data/redux/thunkActions/app.js        | 16 ++++++++++-
 src/data/redux/thunkActions/requests.js   |  7 +++--
 src/data/services/lms/api.js              |  1 +
 6 files changed, 53 insertions(+), 11 deletions(-)

diff --git a/src/containers/ReviewModal/index.jsx b/src/containers/ReviewModal/index.jsx
index 079b555..9b85dd1 100644
--- a/src/containers/ReviewModal/index.jsx
+++ b/src/containers/ReviewModal/index.jsx
@@ -4,7 +4,7 @@ import { connect } from 'react-redux';
 
 import { FullscreenModal } from '@edx/paragon';
 
-import { selectors, actions } from 'data/redux';
+import { selectors, actions, thunkActions } from 'data/redux';
 import { RequestKeys } from 'data/constants/requests';
 
 import LoadingMessage from 'components/LoadingMessage';
@@ -25,6 +25,7 @@ export class ReviewModal extends React.Component {
 
   onClose() {
     this.props.setShowReview(false);
+    this.props.reloadSubmissions();
   }
 
   get isLoading() {
@@ -60,6 +61,7 @@ ReviewModal.propTypes = {
     text: PropTypes.node,
   }),
   setShowReview: PropTypes.func.isRequired,
+  reloadSubmissions: PropTypes.func.isRequired,
   isLoaded: PropTypes.bool.isRequired,
   errorStatus: PropTypes.number,
 };
@@ -74,6 +76,7 @@ export const mapStateToProps = (state) => ({
 
 export const mapDispatchToProps = {
   setShowReview: actions.app.setShowReview,
+  reloadSubmissions: thunkActions.app.reloadSubmissions,
 };
 
 export default connect(mapStateToProps, mapDispatchToProps)(ReviewModal);
diff --git a/src/containers/ReviewModal/index.test.jsx b/src/containers/ReviewModal/index.test.jsx
index 38c8418..418ce72 100644
--- a/src/containers/ReviewModal/index.test.jsx
+++ b/src/containers/ReviewModal/index.test.jsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 
-import { selectors, actions } from 'data/redux';
+import { selectors, actions, thunkActions } from 'data/redux';
 import { RequestKeys } from 'data/constants/requests';
 
 import {
@@ -10,7 +10,6 @@ import {
   mapDispatchToProps,
 } from '.';
 
-let el;
 jest.useFakeTimers('modern');
 
 jest.mock('data/redux', () => ({
@@ -32,6 +31,11 @@ jest.mock('data/redux', () => ({
       setShowReview: jest.fn(),
     },
   },
+  thunkActions: {
+    app: {
+      reloadSubmissions: jest.fn(),
+    },
+  },
 }));
 
 jest.mock('containers/ReviewActions', () => 'ReviewActions');
@@ -41,6 +45,7 @@ jest.mock('components/LoadingMessage', () => 'LoadingMessage');
 const requestKey = RequestKeys.fetchSubmission;
 
 describe('ReviewModal component', () => {
+  let el;
   const props = {
     oraName: 'test-ora-name',
     isOpen: false,
@@ -48,10 +53,11 @@ describe('ReviewModal component', () => {
     showRubric: false,
     isLoaded: false,
   };
+  beforeEach(() => {
+    props.setShowReview = jest.fn();
+    props.reloadSubmissions = jest.fn();
+  });
   describe('component', () => {
-    beforeEach(() => {
-      props.setShowReview = jest.fn();
-    });
     describe('snapshots', () => {
       let render;
       beforeEach(() => {
@@ -75,6 +81,18 @@ describe('ReviewModal component', () => {
         expect(render()).toMatchSnapshot();
       });
     });
+
+    describe('component', () => {
+      beforeEach(() => {
+        el = shallow(<ReviewModal {...props} />);
+      });
+      test('setShowReview and reloadSubmissions get call on modal close', () => {
+        el.instance().onClose();
+        const { setShowReview, reloadSubmissions } = props;
+        expect(setShowReview).toHaveBeenCalledTimes(1);
+        expect(reloadSubmissions).toHaveBeenCalledTimes(1);
+      });
+    });
   });
   describe('mapStateToProps', () => {
     let mapped;
@@ -99,8 +117,12 @@ describe('ReviewModal component', () => {
     });
   });
   describe('mapDispatchToProps', () => {
-    it('loads setShowReview from thunkActions.app.setShowReview', () => {
+    it('loads setShowReview from actions.app.setShowReview', () => {
       expect(mapDispatchToProps.setShowReview).toEqual(actions.app.setShowReview);
     });
+
+    it('loads reloadSubmissions from thunkActions.app.reloadSubmissions', () => {
+      expect(mapDispatchToProps.reloadSubmissions).toEqual(thunkActions.app.reloadSubmissions);
+    });
   });
 });
diff --git a/src/data/constants/requests.js b/src/data/constants/requests.js
index b90f5d2..43fd560 100644
--- a/src/data/constants/requests.js
+++ b/src/data/constants/requests.js
@@ -9,6 +9,7 @@ export const RequestStates = StrictDict({
 
 export const RequestKeys = StrictDict({
   initialize: 'initialize',
+  reloadSubmissions: 'reloadSubmissions',
   fetchSubmission: 'fetchSubmission',
   fetchSubmissionStatus: 'fetchSubmissionStatus',
   setLock: 'setLock',
diff --git a/src/data/redux/thunkActions/app.js b/src/data/redux/thunkActions/app.js
index cd5d067..81bcfb5 100644
--- a/src/data/redux/thunkActions/app.js
+++ b/src/data/redux/thunkActions/app.js
@@ -19,4 +19,18 @@ export const initialize = () => (dispatch) => {
   }));
 };
 
-export default StrictDict({ initialize });
+/**
+ * initialize the app, loading ora and course metadata from the api, and loading the initial
+ * submission list data.
+ */
+export const reloadSubmissions = () => (dispatch) => {
+  dispatch(initializeApp({
+    locationId,
+    reload: true,
+    onSuccess: (response) => {
+      dispatch(actions.submissions.loadList(response.submissions));
+    },
+  }));
+};
+
+export default StrictDict({ initialize, reloadSubmissions });
diff --git a/src/data/redux/thunkActions/requests.js b/src/data/redux/thunkActions/requests.js
index 8eb7664..ddc3bac 100644
--- a/src/data/redux/thunkActions/requests.js
+++ b/src/data/redux/thunkActions/requests.js
@@ -35,14 +35,15 @@ export const networkRequest = ({
 
 /**
  * Tracked initializeApp api method.
- * Tracked to the `initialize` request key.
+ * Tracked to the `initialize` or `reloadSubmissions` request key.
  * @param {string} locationId - ora location id
+ * @param {bool} reload - is reloading submission
  * @param {[func]} onSuccess - onSuccess method ((response) => { ... })
  * @param {[func]} onFailure - onFailure method ((error) => { ... })
  */
-export const initializeApp = ({ locationId, ...rest }) => (dispatch) => {
+export const initializeApp = ({ locationId, reload, ...rest }) => (dispatch) => {
   dispatch(module.networkRequest({
-    requestKey: RequestKeys.initialize,
+    requestKey: reload ? RequestKeys.reloadSubmissions : RequestKeys.initialize,
     promise: api.initializeApp(locationId),
     ...rest,
   }));
diff --git a/src/data/services/lms/api.js b/src/data/services/lms/api.js
index 6d54606..0dd0d79 100644
--- a/src/data/services/lms/api.js
+++ b/src/data/services/lms/api.js
@@ -36,6 +36,7 @@ const initializeApp = () => get(
     [paramKeys.oraLocation]: locationId,
   }),
 ).then(response => response.data);
+
 /**
  * get('/api/submission', { submissionUUID })
  * @return {