@eeacms/volto-arcgis-block 0.1.323 → 0.1.324

package/CHANGELOG.md

@@ -4,6 +4,8 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+### [0.1.324](https://github.com/eea/volto-arcgis-block/compare/0.1.323...0.1.324) - 11 December 2024
+
 ### [0.1.323](https://github.com/eea/volto-arcgis-block/compare/0.1.322...0.1.323) - 10 December 2024
 
 #### :hammer_and_wrench: Others

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-arcgis-block",
-  "version": "0.1.323",
+  "version": "0.1.324",
   "description": "volto-arcgis-block: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: CodeSyntax",

package/src/components/MapViewer/InfoWidget.jsx

@@ -1,17 +1,16 @@
 import React, { createRef } from 'react';
 import { loadModules } from 'esri-loader';
 import { Loader } from 'semantic-ui-react';
-// import loadable from '@loadable/component';
-// import { injectLazyLibs } from '@plone/volto/helpers/Loadable';
-import { FontAwesomeIcon } from '@eeacms/volto-clms-utils/components';
-
-import Highcharts from 'highcharts';
-// import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import loadable from '@loadable/component';
+import { injectLazyLibs } from '@plone/volto/helpers/Loadable';
+// import { FontAwesomeIcon } from '@eeacms/volto-clms-utils/components';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 
 var GeometryEngine, Graphic, esriRequest;
 
-// const HighchartsReact = loadable(() => import('highcharts-react-official'));
+// import Highcharts from 'highcharts';
 
+const HighchartsReact = loadable(() => import('highcharts-react-official'));
 class InfoWidget extends React.Component {
   /**
    * Creator of the InfoWidget widget class
@@ -1156,11 +1155,12 @@ class InfoWidget extends React.Component {
                     {this.state.pixelInfo && !noData && (
                       <>
                         {this.loadVariableSelector(this.state.layerIndex)}
-                        {/* <HighchartsReact */}
-                        <Highcharts
-                          highcharts={this.Highcharts}
-                          options={this.loadInfoChart(this.state.layerIndex)}
-                        />
+                        {this.Highcharts && (
+                          <HighchartsReact
+                            highcharts={this.Highcharts}
+                            options={this.loadInfoChart(this.state.layerIndex)}
+                          />
+                        )}
                         {this.loadStatisticsSelector(this.state.layerIndex)}
                         {this.loadTimeInfoTable(this.state.layerIndex)}
                       </>
@@ -1197,5 +1197,4 @@ class InfoWidget extends React.Component {
   }
 }
 
-// export default injectLazyLibs('highcharts')(InfoWidget);
-export default InfoWidget;
+export default injectLazyLibs('highcharts')(InfoWidget);

package/src/components/MapViewer/MapViewer.jsx

@@ -21,6 +21,7 @@ import HotspotWidget from './HotspotWidget';
 import PanWidget from './PanWidget';
 import BookmarkWidget from './BookmarkWidget';
 import LoadingSpinner from './LoadingSpinner';
+import { injectLazyLibs } from '@plone/volto/helpers/Loadable';
 
 //import "isomorphic-fetch";  <-- Necessary to use fetch?
 var Map, MapView, Zoom, intl, Basemap, WebTileLayer, Extent;
@@ -163,19 +164,9 @@ class MapViewer extends React.Component {
   //   return obj;
   // }
 
-  // waitForContainer(mapdiv) {
-  //   while (mapdiv === null) {
-  //     new Promise((resolve) => setTimeout(resolve, 100)); // wait for 100ms
-  //   }
-  //   return mapdiv;
-  // }
-
   async componentDidMount() {
     loadCss();
     await this.loader();
-    //    this.state.url = window.location.href;
-    //  await this.waitForDataFill(this.compCfg);
-
     this.positronCompositeBasemap = new Basemap({
       title: 'Positron composite',
       thumbnailUrl: this.cfgUrls.positronCompositeThumbnail,
@@ -185,12 +176,8 @@ class MapViewer extends React.Component {
           copyright: '© OpenStreetMap (and) contributors, CC-BY-SA',
         }),
       ],
-      // referenceLayers: [
-      //   new _WebTileLayer(...)
-      // ],
     });
     this.map = new Map({
-      // basemap: 'topo',
       basemap: this.positronCompositeBasemap,
       logo: false,
     });
@@ -290,7 +277,6 @@ class MapViewer extends React.Component {
   componentWillUnmount() {
     // clean up
     if (this.view) {
-      //clearInterval(this.intervalId);
       this.view.container = null;
       this.view.destroy();
       delete this.view;
@@ -549,4 +535,5 @@ export default compose(
     }),
     { MapViewerConfig },
   ),
+  injectLazyLibs('highcharts'),
 )(MapViewer);