diff --git a/client/components/Map/index.js b/client/components/Map/index.js
index 416ae33cd..845b8f142 100644
--- a/client/components/Map/index.js
+++ b/client/components/Map/index.js
@@ -5,7 +5,7 @@ import PropTypes from 'proptypes';
import { connect } from 'react-redux';
import { withStyles } from '@material-ui/core/styles';
import axios from 'axios';
-import { getDataRequestSuccess, updateDateRanges } from '@reducers/data';
+import { getDataRequest, getDataRequestSuccess, updateDateRanges } from '@reducers/data';
import { updateMapPosition } from '@reducers/ui';
import { trackMapExport } from '@reducers/analytics';
import { INTERNAL_DATE_SPEC } from '../common/CONSTANTS';
@@ -13,6 +13,7 @@ import CookieNotice from '../main/CookieNotice';
// import "mapbox-gl/dist/mapbox-gl.css";
import Map from './Map';
import moment from 'moment';
+import { CircularProgress } from '@material-ui/core';
// We make API requests on a per-day basis. On average, there are about 4k
// requests per day, so 10k is a large safety margin.
@@ -228,12 +229,13 @@ class MapContainer extends React.Component {
};
setData = async () => {
- const { startDate, endDate } = this.props;
+ const { startDate, endDate, getDataRedux } = this.props;
const missingDateRanges = this.getMissingDateRanges(startDate, endDate);
if (missingDateRanges.length === 0){
return;
}
+ getDataRedux();
this.rawRequests = [];
var allRequestPromises = [];
for (const missingDateRange of missingDateRanges){
@@ -283,7 +285,8 @@ class MapContainer extends React.Component {
};
render() {
- const { position, lastUpdated, updatePosition, exportMap, classes, requests } = this.props;
+ const { position, lastUpdated, updatePosition, exportMap, classes, requests,
+ isMapLoading } = this.props;
const { ncCounts, ccCounts, selectedTypes } = this.state;
return (
@@ -298,6 +301,7 @@ class MapContainer extends React.Component {
selectedTypes={selectedTypes}
/>
+ {isMapLoading && }
);
}
@@ -313,11 +317,13 @@ const mapStateToProps = state => ({
endDate: state.filters.endDate,
requests: state.data.requests,
dateRangesWithRequests: state.data.dateRangesWithRequests,
+ isMapLoading: state.data.isMapLoading,
});
const mapDispatchToProps = dispatch => ({
updatePosition: position => dispatch(updateMapPosition(position)),
exportMap: () => dispatch(trackMapExport()),
+ getDataRedux: () => dispatch(getDataRequest()),
getDataSuccess: data => dispatch(getDataRequestSuccess(data)),
updateDateRangesWithRequests: dateRanges => dispatch(updateDateRanges(dateRanges)),
});
diff --git a/client/redux/reducers/data.js b/client/redux/reducers/data.js
index 09543f39c..0f2b70c0d 100644
--- a/client/redux/reducers/data.js
+++ b/client/redux/reducers/data.js
@@ -119,7 +119,6 @@ export const gitResponseFailure = error => ({
const initialState = {
isMapLoading: false,
- isVisLoading: false,
error: null,
pins: [],
pinsInfo: {},
@@ -135,7 +134,6 @@ export default (state = initialState, action) => {
return {
...state,
isMapLoading: true,
- isVisLoading: true,
};
case types.GET_DATA_REQUEST_SUCCESS: {
const newRequests = {
@@ -145,6 +143,7 @@ export default (state = initialState, action) => {
return {
...state,
requests: newRequests,
+ isMapLoading: false,
};
}
case types.UPDATE_DATE_RANGES:
diff --git a/client/redux/sagas/data.js b/client/redux/sagas/data.js
index bcf45ef33..e911ebdc7 100644
--- a/client/redux/sagas/data.js
+++ b/client/redux/sagas/data.js
@@ -12,7 +12,6 @@ import { COUNCILS, REQUEST_TYPES } from '@components/common/CONSTANTS';
import {
types,
- getDataRequest,
getPinsSuccess,
getPinsFailure,
getPinInfoSuccess,
@@ -147,7 +146,6 @@ function* getNcByLngLat(action) {
}
export default function* rootSaga() {
- yield takeLatest(types.GET_DATA_REQUEST, getMapData);
yield takeLatest(mapFiltersTypes.UPDATE_MAP_DATE_RANGE, getMapData);
yield takeLatest(types.GET_NC_BY_LNG_LAT, getNcByLngLat)
yield takeEvery(types.GET_PIN_INFO_REQUEST, getPinData);