Refs #2210: add isFetching in state for loader toggling

Signed-off-by: Thomas Shawarma Haddad <thomas.haddad@af83.com>

4 files changed, 13 insertions, 4 deletions

diff --git a/app/assets/javascripts/es6_browserified/journey_patterns/actions/index.js b/app/assets/javascripts/es6_browserified/journey_patterns/actions/index.js
index 1ad2bb48f..f56956b31 100644
--- a/app/assets/javascripts/es6_browserified/journey_patterns/actions/index.js
+++ b/app/assets/javascripts/es6_browserified/journey_patterns/actions/index.js
@@ -27,10 +27,11 @@ const actions = {
     id : e.currentTarget.id,
     index
   }),
-  checkConfirmModal : (event, callback, stateChanged) => {
+  checkConfirmModal : (event, callback, stateChanged,dispatch) => {
     if(stateChanged === true){
       return actions.openConfirmModal(callback)
     }else{
+      dispatch(actions.fetchingApi())
       return callback
     }
   },
@@ -70,6 +71,9 @@ const actions = {
     type: 'UPDATE_TOTAL_COUNT',
     diff
   }),
+  fetchingApi: () =>({
+      type: 'FETCH_API'
+  }),
   resetValidation: (target) => {
     $(target).parent().removeClass('has-error').children('.help-block').remove()
   },
@@ -95,6 +99,7 @@ const actions = {
     }
   },
   submitJourneyPattern : (dispatch, state, next) => {
+    dispatch(actions.fetchingApi())
     let urlJSON = window.location.pathname + ".json"
     let req = new Request(urlJSON, {
       credentials: 'same-origin',
diff --git a/app/assets/javascripts/es6_browserified/journey_patterns/components/Navigate.js b/app/assets/javascripts/es6_browserified/journey_patterns/components/Navigate.js
index 43c3af219..4d58680cd 100644
--- a/app/assets/javascripts/es6_browserified/journey_patterns/components/Navigate.js
+++ b/app/assets/javascripts/es6_browserified/journey_patterns/components/Navigate.js
@@ -15,7 +15,7 @@ let Navigate = ({ dispatch, journeyPatterns, pagination, status }) => {
         <button
           onClick={e => {
             e.preventDefault()
-            dispatch(actions.checkConfirmModal(e, actions.goToPreviousPage(dispatch, pagination), pagination.stateChanged))
+            dispatch(actions.checkConfirmModal(e, actions.goToPreviousPage(dispatch, pagination), pagination.stateChanged, dispatch))
           }}
           type="submit"
           data-toggle=''
@@ -26,7 +26,7 @@ let Navigate = ({ dispatch, journeyPatterns, pagination, status }) => {
         <button
           onClick={e => {
             e.preventDefault()
-            dispatch(actions.checkConfirmModal(e, actions.goToNextPage(dispatch, pagination), pagination.stateChanged))
+            dispatch(actions.checkConfirmModal(e, actions.goToNextPage(dispatch, pagination), pagination.stateChanged, dispatch))
           }}
           type="submit"
           data-toggle=''
diff --git a/app/assets/javascripts/es6_browserified/journey_patterns/containers/ConfirmModal.js b/app/assets/javascripts/es6_browserified/journey_patterns/containers/ConfirmModal.js
index b78a4f49d..d66425a3a 100644
--- a/app/assets/javascripts/es6_browserified/journey_patterns/containers/ConfirmModal.js
+++ b/app/assets/javascripts/es6_browserified/journey_patterns/containers/ConfirmModal.js
@@ -12,9 +12,11 @@ const mapStateToProps = (state) => {
 const mapDispatchToProps = (dispatch) => {
   return {
     onModalAccept: (next, state) =>{
+      dispatch(actions.fetchingApi())
       actions.submitJourneyPattern(dispatch, state, next)
     },
     onModalCancel: (next) =>{
+      dispatch(actions.fetchingApi())
       dispatch(next)
     },
     onModalClose: () =>{
diff --git a/app/assets/javascripts/es6_browserified/journey_patterns/reducers/status.js b/app/assets/javascripts/es6_browserified/journey_patterns/reducers/status.js
index 8378c855b..973fab0f9 100644
--- a/app/assets/javascripts/es6_browserified/journey_patterns/reducers/status.js
+++ b/app/assets/javascripts/es6_browserified/journey_patterns/reducers/status.js
@@ -4,8 +4,10 @@ const status = (state = {}, action) => {
   switch (action.type) {
     case 'UNAVAILABLE_SERVER':
       return Object.assign({}, state, {fetchSuccess: false})
+    case 'FETCH_API':
+      return Object.assign({}, state, {isFetching: true})
     case 'RECEIVE_JOURNEY_PATTERNS':
-      return Object.assign({}, state, {fetchSuccess: true})
+      return Object.assign({}, state, {fetchSuccess: true, isFetching: false})
     default:
       return state
   }