Add processing for upload dlock

client/src/scenes/UploadDLockData/components/FileUpload.js

@@ -4,7 +4,7 @@ import { Form } from 'semantic-ui-react';
 
 import UnknownMapping from './UnknownMapping';
 
-import { uploadDoorLockData, fetchMappings } from '../../../store/actions';
+import { uploadDoorLockData, fetchMappings, checkProcessing } from '../../../store/actions';
 
 class FileUpload extends Component {
     constructor(props) {
@@ -20,8 +20,9 @@ class FileUpload extends Component {
     }
 
     componentDidMount() {
-        const { fetchMappings } = this.props;
+        const { fetchMappings, checkProcessing } = this.props;
         fetchMappings();
+        checkProcessing();
     }
 
     componentWillReceiveProps(nextProps, nextContext) {
@@ -36,6 +37,7 @@ class FileUpload extends Component {
         this.setState({unknownMappings: filteredUnknownMappings});
     }
 
+
     extractMappingFromFileName(fileName) {
         const contentBetweenBracketsRegex = /\[(.*?)\]/;
         const rawContent = fileName.match(contentBetweenBracketsRegex)[1];
@@ -52,7 +54,11 @@ class FileUpload extends Component {
 
         const { existingMappings } = mappings;
 
-        return existingMappings.find(mapping => (mapping.officeSlug === officeSlug) && (mapping.resourceSlug === resourceSlug));
+        if (existingMappings && Array.isArray(existingMappings)){
+            return existingMappings.find(mapping => (mapping.officeSlug === officeSlug) && (mapping.resourceSlug === resourceSlug));
+        }else{
+            return false;
+        }
     }
 
     onFileChange(event) {
@@ -85,14 +91,24 @@ class FileUpload extends Component {
         }
     };
 
+    refreshProcessingStatus = (event) => {
+        event.preventDefault();
+        const { checkProcessing } = this.props;
+        checkProcessing();
+    };
+
     render() {
-        const { pendingUpload } = this.props;
+        const { pendingUpload, pendingStatus, processingStatus } = this.props;
         const { unknownMappings, files } = this.state;
 
-        const uploadDisabled = pendingUpload || unknownMappings.length > 0 || !files;
+        const processing = processingStatus && processingStatus.processing ? processingStatus.processing : false;
+
+        const uploadDisabled = pendingStatus || processing || pendingUpload || unknownMappings.length > 0 || !files;
 
         return (
             <div>
+                {processing && <p style={{ color: 'red' }}>Processing in progress. Please try again in a few minutes</p>}
+                {processing && <Form.Button onClick={this.refreshProcessingStatus}>Refresh</Form.Button>}
                 <Form.Input
                     fluid
                     required
@@ -121,11 +137,14 @@ const mapStateToProps = (state) => ({
     pendingMappings: state.mappingsData.pending,
     mappings: state.mappingsData.result,
     addedMapping: state.addMapping.result,
+    pendingStatus: state.checkProcessing.pending,
+    processingStatus: state.checkProcessing.result,
 });
 
 const mapDispatchToProps = (dispatch) => ({
     uploadDoorLockData: (doorLockDataFiles) => uploadDoorLockData(dispatch, doorLockDataFiles),
     fetchMappings: () => fetchMappings(dispatch),
+    checkProcessing: () => checkProcessing(dispatch),
 });
 
 export default connect(mapStateToProps, mapDispatchToProps)(FileUpload);

client/src/scenes/UploadDLockData/components/UploadResults.js

@@ -2,7 +2,20 @@ import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { Loader, Message, Tab, Label, Menu } from 'semantic-ui-react';
 
+import { checkProcessing } from '../../../store/actions';
+
 class UploadResults extends Component {
+
+    componentDidUpdate(prevProps, prevState, snapshot) {
+        const previousPending = prevProps.pending ? prevProps.pending : false;
+        const newPending = this.props.pending ? this.props.pending : false;
+
+        if (previousPending && !newPending){
+            const { checkProcessing } = this.props;
+            checkProcessing();
+        }
+    }
+
     render(){
         const {pending, result, error} = this.props;
 
@@ -80,7 +93,10 @@ const mapStateToProps = (state) => ({
     pending: state.doorLockData.pending,
     result: state.doorLockData.result,
     error: state.doorLockData.error,
-
 });
 
-export default connect(mapStateToProps)(UploadResults);
+const mapDispatchToProps = (dispatch) => ({
+    checkProcessing: () => checkProcessing(dispatch),
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(UploadResults);

client/src/store/actions/integrationActions.js

@@ -17,6 +17,9 @@ import {
     ADD_FEES_TO_ORD_PENDING,
     ADD_FEES_TO_ORD_SUCCESS,
     ADD_FEES_TO_ORD_FAILED,
+    CHECK_PROCESSING_PENDING,
+    CHECK_PROCESSING_SUCCESS,
+    CHECK_PROCESSING_FAILED,
 } from '../constants';
 
 import API from '../../utilities/api';
@@ -95,3 +98,14 @@ export const addFeesToOrd = (dispatch, dateRange, memberIds) => {
             dispatch({type: ADD_FEES_TO_ORD_FAILED, payload: error.response});
         });
 };
+
+export const checkProcessing = (dispatch) => {
+    dispatch({type: CHECK_PROCESSING_PENDING});
+    API.get('integration/processing')
+        .then(response => {
+            dispatch({type: CHECK_PROCESSING_SUCCESS, payload: response.data});
+        })
+        .catch(error => {
+            dispatch({type: CHECK_PROCESSING_FAILED, payload: error.response});
+        });
+};

client/src/store/constants.js

@@ -25,3 +25,7 @@ export const FETCH_MEMBER_INCIDENTS_FAILED = 'FETCH_MEMBER_INCIDENTS_FAILED';
 export const ADD_FEES_TO_ORD_PENDING = 'ADD_FEES_TO_ORD_PENDING';
 export const ADD_FEES_TO_ORD_SUCCESS = 'ADD_FEES_TO_ORD_SUCCESS';
 export const ADD_FEES_TO_ORD_FAILED = 'ADD_FEES_TO_ORD_FAILED';
+
+export const CHECK_PROCESSING_PENDING = 'CHECK_PROCESSING_PENDING';
+export const CHECK_PROCESSING_SUCCESS = 'CHECK_PROCESSING_SUCCESS';
+export const CHECK_PROCESSING_FAILED = 'CHECK_PROCESSING_FAILED';

client/src/store/reducers/checkProcessingReducer.js

@@ -0,0 +1,38 @@
+import {
+    CHECK_PROCESSING_PENDING,
+    CHECK_PROCESSING_SUCCESS,
+    CHECK_PROCESSING_FAILED,
+} from '../constants';
+
+const initialState = {
+    pending: false,
+    result: null,
+    error: null,
+};
+
+export const checkProcessing = (state, action) => {
+  state = state || initialState;
+  action = action || {};
+
+  switch(action.type){
+      case CHECK_PROCESSING_PENDING:
+          return Object.assign({}, state, {
+              pending: true,
+              error: null,
+          });
+      case CHECK_PROCESSING_SUCCESS:
+          return Object.assign({}, state, {
+              pending: false,
+              result: action.payload,
+              error: null,
+          });
+      case CHECK_PROCESSING_FAILED:
+          return Object.assign({}, state, {
+              pending: false,
+              result: {},
+              error: action.payload,
+          });
+      default:
+          return state;
+  }
+};

client/src/store/reducers/index.js

@@ -7,6 +7,7 @@ import { incidentsReport } from './incidentsReportReducer';
 import { membersList } from './membersListReducer';
 import { memberIncidents} from './memberIncidentsReducer';
 import { addFeesStatus } from './addFeesToOrdReducer';
+import { checkProcessing } from './checkProcessingReducer';
 
 export const rootReducer = combineReducers({
     doorLockData,
@@ -16,5 +17,6 @@ export const rootReducer = combineReducers({
     membersList,
     memberIncidents,
     addFeesStatus,
+    checkProcessing,
 });