fix: broken maps plugin in dashboard so rollback cli-app-scripts and …

…app-runtime (#3129)

Fix for https://dhis2.atlassian.net/browse/DHIS2-16916

Rollback cli-app-scripts to 10.3.11 and app-runtime to 3.9.4

package.json

@@ -20,7 +20,7 @@
         "postinstall": "patch-package"
     },
     "devDependencies": {
-        "@dhis2/cli-app-scripts": "^10.4.0",
+        "@dhis2/cli-app-scripts": "10.3.11",
         "@dhis2/cli-style": "^10.5.1",
         "@dhis2/cypress-commands": "^10.0.3",
         "@dhis2/cypress-plugins": "^10.0.3",
@@ -40,9 +40,9 @@
     },
     "dependencies": {
         "@dhis2/analytics": "^26.2.0",
-        "@dhis2/app-runtime": "^3.10.2",
+        "@dhis2/app-runtime": "3.9.4",
         "@dhis2/app-runtime-adapter-d2": "^1.1.0",
-        "@dhis2/app-service-alerts": "^3.9.4",
+        "@dhis2/app-service-alerts": "3.9.4",
         "@dhis2/app-service-datastore": "^1.0.0-beta.3",
         "@dhis2/d2-i18n": "^1.1.3",
         "@dhis2/maps-gl": "^3.8.6",
@@ -84,6 +84,8 @@
         "url-polyfill": "^1.1.12"
     },
     "resolutions": {
-        "@dhis2/ui": "^9.2.0"
+        "@dhis2/ui": "^9.2.0",
+        "@dhis2/app-runtime": "3.9.4",
+        "@dhis2/app-service-alerts": "3.9.4"
     }
 }

src/components/loaders/EventLoader.js

@@ -1,10 +1,8 @@
 import PropTypes from 'prop-types'
 import { useEffect } from 'react'
-import { useSelector } from 'react-redux'
 import eventLoader from '../../loaders/eventLoader.js'
 
-const EventLoader = ({ config, onLoad }) => {
-    const dataTableOpen = useSelector((state) => !!state.dataTable)
+const EventLoader = ({ config, dataTableOpen, onLoad }) => {
     useEffect(() => {
         eventLoader(config, dataTableOpen).then(onLoad)
     }, [config, onLoad, dataTableOpen])
@@ -14,6 +12,7 @@ const EventLoader = ({ config, onLoad }) => {
 
 EventLoader.propTypes = {
     config: PropTypes.object.isRequired,
+    dataTableOpen: PropTypes.bool.isRequired,
     onLoad: PropTypes.func.isRequired,
 }
 

src/components/loaders/LayerLoader.js

@@ -18,20 +18,27 @@ const layerType = {
     trackedEntity: TrackedEntityLoader,
 }
 
-const LayerLoader = ({ config, onLoad }) => {
+const LayerLoader = ({ config, dataTableOpen, onLoad }) => {
     const Loader = layerType[config.layer]
 
     if (!Loader) {
         console.log('Unknown layer type', config.layer, config)
         return null
     }
 
-    return <Loader config={config} onLoad={onLoad} />
+    return (
+        <Loader config={config} onLoad={onLoad} dataTableOpen={dataTableOpen} />
+    )
+}
+
+LayerLoader.defaultProps = {
+    dataTableOpen: false,
 }
 
 LayerLoader.propTypes = {
     config: PropTypes.object.isRequired,
     onLoad: PropTypes.func.isRequired,
+    dataTableOpen: PropTypes.bool,
 }
 
 export default LayerLoader

src/components/loaders/LayersLoader.js

@@ -5,7 +5,8 @@ import { EVENT_LAYER } from '../../constants/layers.js'
 import LayerLoader from './LayerLoader.js'
 
 const LayersLoader = () => {
-    const layers = useSelector(({ map, dataTable }) =>
+    const dataTable = useSelector((state) => state.dataTable)
+    const layers = useSelector(({ map }) =>
         map.mapViews.filter(
             ({
                 id,
@@ -53,7 +54,12 @@ const LayersLoader = () => {
     }
 
     return layers.map((config) => (
-        <LayerLoader key={config.id} config={config} onLoad={onLoad} />
+        <LayerLoader
+            key={config.id}
+            config={config}
+            onLoad={onLoad}
+            dataTableOpen={!!dataTable}
+        />
     ))
 }