[Backport 3.3.x][Fixes #756] Timing issues with timeline histogram initialization (#761)

* include epics needed for timeline at app initialization

* update client bundle

Author: allyoucanmap

geonode_mapstore_client/client/js/apps/gn-dashboard.js

@@ -39,7 +39,8 @@ import {
     setupConfiguration,
     getVersion,
     initializeApp,
-    getPluginsConfiguration
+    getPluginsConfiguration,
+    storeEpicsCache
 } from '@js/utils/AppUtils';
 import pluginsDefinition from '@js/plugins/index';
 import ReactSwipe from 'react-swipeable-views';
@@ -87,6 +88,16 @@ document.addEventListener('DOMContentLoaded', function() {
                     permissions
                 } = setupConfiguration({ localConfig, user });
 
+                const appEpics = {
+                    ...configEpics,
+                    // epics related to dashboard are imported at root levele
+                    // because of the use of initial action
+                    // in particular `dashboardLoaded`
+                    ...widgetsEpics,
+                    ...dashboardEpics
+                };
+                storeEpicsCache(appEpics);
+
                 main({
                     targetId,
                     appComponent: withRoutes(routes)(ConnectedRouter),
@@ -125,14 +136,7 @@ document.addEventListener('DOMContentLoaded', function() {
                         maptype,
                         widgets
                     },
-                    appEpics: {
-                        ...configEpics,
-                        // epics related to dashboard are imported at root levele
-                        // because of the use of initial action
-                        // in particular `dashboardLoaded`
-                        ...widgetsEpics,
-                        ...dashboardEpics
-                    },
+                    appEpics,
                     onStoreInit,
                     initialActions: [
                         // add some settings in the global state to make them accessible in the monitor state

geonode_mapstore_client/client/js/apps/gn-geostory.js

@@ -36,7 +36,8 @@ import {
     setupConfiguration,
     getVersion,
     initializeApp,
-    getPluginsConfiguration
+    getPluginsConfiguration,
+    storeEpicsCache
 } from '@js/utils/AppUtils';
 import pluginsDefinition from '@js/plugins/index';
 import ReactSwipe from 'react-swipeable-views';
@@ -147,6 +148,10 @@ document.addEventListener('DOMContentLoaded', function() {
                 }
                 : geoNodePageConfig.resourceConfig;
 
+            const appEpics = {
+                ...configEpics
+            };
+            storeEpicsCache(appEpics);
             main({
                 targetId,
                 appComponent: withRoutes(routes)(ConnectedRouter),
@@ -197,9 +202,7 @@ document.addEventListener('DOMContentLoaded', function() {
                     security,
                     maptype
                 },
-                appEpics: {
-                    ...configEpics
-                },
+                appEpics,
                 onStoreInit,
                 initialActions: [
                     // add some settings in the global state to make them accessible in the monitor state

geonode_mapstore_client/client/js/apps/gn-map.js

@@ -48,7 +48,8 @@ import {
     setupConfiguration,
     getVersion,
     initializeApp,
-    getPluginsConfiguration
+    getPluginsConfiguration,
+    storeEpicsCache
 } from '@js/utils/AppUtils';
 
 import {
@@ -62,6 +63,7 @@ import {
     gnCheckSelectedLayerPermissions,
     gnSetLayersPermissions
 } from '@js/epics';
+import timelineEpics from '@mapstore/framework/epics/timeline';
 import maplayout from '@mapstore/framework/reducers/maplayout';
 import 'react-widgets/dist/css/react-widgets.css';
 import 'react-select/dist/react-select.css';
@@ -115,6 +117,18 @@ document.addEventListener('DOMContentLoaded', function() {
             const mapLayout = getConfigProp('mapLayout') || {};
             setConfigProp('mapLayout', mapLayout[query.theme] || mapLayout[pluginsConfigKey] || mapLayout.viewer);
 
+            const appEpics = {
+                ...standardEpics,
+                ...configEpics,
+                updateMapLayoutEpic,
+                gnCheckSelectedLayerPermissions,
+                gnSetLayersPermissions,
+                ...pluginsDefinition.epics,
+                // needed to initialize the correct time range
+                ...timelineEpics
+            };
+
+            storeEpicsCache(appEpics);
             // register custom arcgis layer
             import('@js/components/' + mapType + '/ArcGisMapServer')
                 .then(() => {
@@ -178,14 +192,7 @@ document.addEventListener('DOMContentLoaded', function() {
                             annotations,
                             ...pluginsDefinition.reducers
                         },
-                        appEpics: {
-                            ...standardEpics,
-                            ...configEpics,
-                            updateMapLayoutEpic,
-                            gnCheckSelectedLayerPermissions,
-                            gnSetLayersPermissions,
-                            ...pluginsDefinition.epics
-                        },
+                        appEpics,
                         initialActions: [
                             // add some settings in the global state to make them accessible in the monitor state
                             // later we could use expression in localConfig

geonode_mapstore_client/client/js/hooks/useLazyPlugins.js

@@ -11,6 +11,7 @@ import isEmpty from 'lodash/isEmpty';
 import { getPlugins, createPlugin, isMapStorePlugin } from '@mapstore/framework/utils/PluginsUtils';
 import { augmentStore } from '@mapstore/framework/utils/StateUtils';
 import join from 'lodash/join';
+import { getEpicCache, setEpicCache } from '@js/utils/AppUtils';
 
 function filterRemoved(registry, removed = []) {
     return Object.keys(registry).reduce((acc, p) => {
@@ -26,7 +27,6 @@ function filterRemoved(registry, removed = []) {
 
 let storedPlugins = {};
 const pluginsCache = {};
-const epicsCache = {};
 const reducersCache = {};
 
 function useLazyPlugins({
@@ -78,10 +78,10 @@ function useLazyPlugins({
                     // so we need to filter out the one previously added and include only new one
                     const filterOutExistingEpics = Object.keys(epics)
                         .reduce((acc, key) => {
-                            if (epicsCache[key]) {
+                            if (getEpicCache(key)) {
                                 return acc;
                             }
-                            epicsCache[key] = true;
+                            setEpicCache(key);
                             return {
                                 ...acc,
                                 [key]: epics[key]

geonode_mapstore_client/client/js/utils/AppUtils.js

@@ -28,8 +28,18 @@ import isString from 'lodash/isString';
 import url from 'url';
 import axios from '@mapstore/framework/libs/ajax';
 
+let epicsCache = {};
 let actionListeners = {};
 
+export const storeEpicsCache = (epics) => {
+    Object.keys(epics).forEach((key) => {
+        epicsCache[key] = true;
+    });
+};
+
+export const getEpicCache = (name) => epicsCache[name];
+export const setEpicCache = (name) => { epicsCache[name] = true; };
+
 export function getVersion() {
     if (!__DEVTOOLS__) {
         return __MAPSTORE_PROJECT_CONFIG__.version;

geonode_mapstore_client/client/version.txt

@@ -1 +1 @@
-geonode-mapstore-client-v3.3.0-2ac0b447edf34d25283fd67ffbdcc3f0d8082b73
+geonode-mapstore-client-v3.3.0-91f1e52b3b182838c3e9d304be9e3a7afac70942