@eeacms/volto-arcgis-block 0.1.221 → 0.1.222

package/CHANGELOG.md

@@ -4,6 +4,20 @@ 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.222](https://github.com/eea/volto-arcgis-block/compare/0.1.221...0.1.222) - 25 October 2023
+
+#### :hammer_and_wrench: Others
+
+- ready for push [ujbolivar - [`1d00c02`](https://github.com/eea/volto-arcgis-block/commit/1d00c02ac73a24f2179eafbb947cc10ffb19aabb)]
+- ran linting scripts [ujbolivar - [`839258f`](https://github.com/eea/volto-arcgis-block/commit/839258fc2674edd345fb308ad86c33f9e6b8b8c8)]
+- miguel fix added [ujbolivar - [`2f91b36`](https://github.com/eea/volto-arcgis-block/commit/2f91b3642a3d7ec3b9df8163870453d323536f0e)]
+- final lint check before push for hotspot and vector layer update corrections [ujbolivar - [`b1c025c`](https://github.com/eea/volto-arcgis-block/commit/b1c025cd85b231a322d6ab9bde024d622498ec23)]
+- hotspot tabs swaps order based on active layers tab order [ujbolivar - [`b928c3c`](https://github.com/eea/volto-arcgis-block/commit/b928c3ccc8304163ad756e32ecbfb9072a398575)]
+- activelayers are arranged following menu order. Position of dragged layers is preserved [ujbolivar - [`68f1ff4`](https://github.com/eea/volto-arcgis-block/commit/68f1ff43774b6690a7f1f94f12d197f5b518c760)]
+- mods done to hotspot and legends again to cover new edgecases [ujbolivar - [`a1367a3`](https://github.com/eea/volto-arcgis-block/commit/a1367a33fd2184f604182a1c7dffd21e9cb3eed7)]
+- hotspot and legend functions working properly [ujbolivar - [`0f87558`](https://github.com/eea/volto-arcgis-block/commit/0f875580d11ee93ae9919fb7d893dacf360ea7c3)]
+- layers are added and destroyed properly even when pa and klc is unchecked in menuwidget and checked again, it still loads the filtered layer correctly. Legends are acting up after this action as they do not load properly. Next commit will have this feature corrected. [ujbolivar - [`eb6e950`](https://github.com/eea/volto-arcgis-block/commit/eb6e950dc312c1ea3343a29a5d716d183f15b0bd)]
+- hotspot layers are added and removed correctly, still needs a bit of fine tuning, but definitely on track now [ujbolivar - [`240ab62`](https://github.com/eea/volto-arcgis-block/commit/240ab62ca36e561367c66f527d36529024a5a066)]
 ### [0.1.221](https://github.com/eea/volto-arcgis-block/compare/0.1.220...0.1.221) - 25 October 2023
 
 #### :hammer_and_wrench: Others
@@ -1031,13 +1045,10 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 #### :hammer_and_wrench: Others
 
 - Merge pull request #148 from eea/develop [KCarpinteroBM - [`24266fb`](https://github.com/eea/volto-arcgis-block/commit/24266fb3a0c1662d22ae0529dc1d5a25c711cf97)]
-- Revert "[JENKINS] Use eeacms/plone-backend and Volto alpha version- Refs #151967" [Mikel Larreategi - [`f751f69`](https://github.com/eea/volto-arcgis-block/commit/f751f69f652f0340ae55af6a4dab89d6bdc80906)]
 - Revert "Revert "Mapviewer menu and map viewer options persistence"" [Mikel Larreategi - [`ad6e440`](https://github.com/eea/volto-arcgis-block/commit/ad6e440cdc160cffb1e86e1b26e501dbe648476c)]
 - Revert "code coverage removal" [Mikel Larreategi - [`376f2d1`](https://github.com/eea/volto-arcgis-block/commit/376f2d1cd6e4e5110b3b63d5114af1bcfebe094b)]
 - Revert "Update cypress.json" [Mikel Larreategi - [`43d01a0`](https://github.com/eea/volto-arcgis-block/commit/43d01a0a95a58ef5215c6cbf18223ca30a11b9cc)]
 - Revert "Update cypress.json" [Mikel Larreategi - [`054c4ae`](https://github.com/eea/volto-arcgis-block/commit/054c4ae1767e1f26e6ec7e96a0e26a9711f29f04)]
-- Revert "revert [JENKINS] Use eeacms/plone-backend and Volto alpha version- Refs #151967" [Mikel Larreategi - [`64ab56e`](https://github.com/eea/volto-arcgis-block/commit/64ab56e0f1f8dddc26f26039509a028e34653e64)]
-- revert [JENKINS] Use eeacms/plone-backend and Volto alpha version- Refs #151967 [Mikel Larreategi - [`85ee194`](https://github.com/eea/volto-arcgis-block/commit/85ee1941e029df2b7dc910bf75231c75ffeca8c2)]
 - Update cypress.json [KCarpinteroBM - [`be285ff`](https://github.com/eea/volto-arcgis-block/commit/be285fff0c53e06a0180d5318cce81195eabcf80)]
 - Update cypress.json [KCarpinteroBM - [`a7f2118`](https://github.com/eea/volto-arcgis-block/commit/a7f2118acb7b048b4cef85aa9663c2244a1c9ca0)]
 - linting fix [KCarpinteroBM - [`27e969a`](https://github.com/eea/volto-arcgis-block/commit/27e969a7a411fd4646e0e742ce846efc0d79703e)]
@@ -1097,7 +1108,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - UX improvements [rodriama - [`151dc4b`](https://github.com/eea/volto-arcgis-block/commit/151dc4b02d0a73fdd66de9d594620ac0fa5f1dbf)]
 - deleted failing tests [KCarpinteroBM - [`ddaa9e6`](https://github.com/eea/volto-arcgis-block/commit/ddaa9e6f06db6960a4c214d3be2420c48b26715d)]
 - cleaning unnecessary files [KCarpinteroBM - [`2c02199`](https://github.com/eea/volto-arcgis-block/commit/2c021990912beb02b603a1de89aecd62e0063769)]
-- Reverting to Automated release 0.1.39 [KCarpinteroBM - [`fb9f317`](https://github.com/eea/volto-arcgis-block/commit/fb9f3176ccdea18fceb329eaac13ced0566ee648)]
 - commands added [KCarpinteroBM - [`049e60b`](https://github.com/eea/volto-arcgis-block/commit/049e60b7d124d1c05abd0b2775b510795f4ed59f)]
 - Mapviewer testing implementation [KCarpinteroBM - [`0103002`](https://github.com/eea/volto-arcgis-block/commit/0103002869eea108e16e3b5ff2e77a725dcc7c4b)]
 ### [0.1.39](https://github.com/eea/volto-arcgis-block/compare/0.1.38...0.1.39) - 24 March 2022
@@ -1117,7 +1127,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - ESLint fix [rodriama - [`75dae9b`](https://github.com/eea/volto-arcgis-block/commit/75dae9b5bba18ab6d9624f6c99714b4bd2179003)]
 - Remove section title [rodriama - [`ece860e`](https://github.com/eea/volto-arcgis-block/commit/ece860eae3519c7e611abac16e8d53c9a9408b34)]
 - Es-Lint [manuelmartinezbilbomatica - [`39d8d11`](https://github.com/eea/volto-arcgis-block/commit/39d8d11b9096fd603df8510c119d2e12817415d6)]
-- Add Sonarqube tag using clms-frontend addons list [EEA Jenkins - [`bf9f683`](https://github.com/eea/volto-arcgis-block/commit/bf9f683dd35a9edb4cfd9111affcb8f8edbeae89)]
 - FEAT: Parser Time implemented [manuelmartinezbilbomatica - [`689c99e`](https://github.com/eea/volto-arcgis-block/commit/689c99e55221fee6c7c7fafc4ab95ae7a646d3dd)]
 ### [0.1.38](https://github.com/eea/volto-arcgis-block/compare/0.1.37...0.1.38) - 18 March 2022
 
@@ -1212,7 +1221,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - ESLint fix [rodriama - [`5fd3772`](https://github.com/eea/volto-arcgis-block/commit/5fd3772f197a3a380067962a5638dbf901a4624e)]
 - Pixel info [rodriama - [`1ccef39`](https://github.com/eea/volto-arcgis-block/commit/1ccef39a9adcc3ee94655c77a5a166b613600a08)]
 - NUTS bug fix [rodriama - [`37fe7f3`](https://github.com/eea/volto-arcgis-block/commit/37fe7f3fad2c005e3b7c234b3b0564d5df92fa8c)]
-- Add Sonarqube tag using freshwater-frontend addons list [EEA Jenkins - [`ea5af8b`](https://github.com/eea/volto-arcgis-block/commit/ea5af8b02a5f2ee25b9b0be67cf3792bbbe84ed7)]
 ### [0.1.23](https://github.com/eea/volto-arcgis-block/compare/0.1.22...0.1.23) - 17 December 2021
 
 #### :hammer_and_wrench: Others
@@ -1457,7 +1465,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - Trying to delay ArcGIS modules load [gonzalezsd - [`ff16985`](https://github.com/eea/volto-arcgis-block/commit/ff169858e42d30bfcacc423ffc27762bb9ef05a4)]
 - Run bootstrap to fix files [valentinab25 - [`236893f`](https://github.com/eea/volto-arcgis-block/commit/236893f03314eb638b7667f81b1f91491a98ee17)]
 - fix git_name [valentinab25 - [`c7806c3`](https://github.com/eea/volto-arcgis-block/commit/c7806c312964425dc23e5d4c6973de8b81ddaeac)]
-- Add Sonarqube tag using frontend addons list [EEA Jenkins - [`e3afb51`](https://github.com/eea/volto-arcgis-block/commit/e3afb515dda459ee03e2b5d4b56465d2d4ad1503)]
 - Trying to change imports [gonzalezsd - [`d83d7e2`](https://github.com/eea/volto-arcgis-block/commit/d83d7e2f68da4b2a284735847f93c0763a7e13b6)]
 - default design [bipoza - [`88fbe0b`](https://github.com/eea/volto-arcgis-block/commit/88fbe0b2bc73e732e2993324a567f53902e85506)]
 - cleanup of unused code [bipoza - [`b167677`](https://github.com/eea/volto-arcgis-block/commit/b1676771f637f056cad50cb0bc186f2ea79e8517)]

package/package.json

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

package/src/components/MapViewer/HotspotWidget.jsx

@@ -769,8 +769,10 @@ class HotspotWidget extends React.Component {
                   </div>
                 </div>
                 <div>
-                  {divs.map((div) => (
-                    <div className={div.className}>{div.func()}</div>
+                  {divs.map((div, i) => (
+                    <div key={i} className={div.className}>
+                      {div.func()}
+                    </div>
                   ))}
                 </div>
                 <button

package/src/components/MapViewer/LegendWidget.jsx

@@ -65,13 +65,18 @@ class LegendWidget extends React.Component {
   }
 
   brokenLegendImagePatch() {
+    let img = {};
     const collection = document.getElementsByClassName('esri-legend__symbol');
     Array.prototype.forEach.call(collection, (element) => {
-      let img = {};
-
-      if (element.hasChildNodes()) img = element.childNodes[0];
-      else img = element;
-
+      if (element.hasChildNodes()) {
+        for (let i = 0; i < element.childNodes.length; i++) {
+          let child = element.childNodes[i];
+          if (child.nodeName === 'IMG') {
+            img = child;
+            break;
+          }
+        }
+      } else img = element;
       if (!(img.complete && img.naturalHeight !== 0)) {
         // If img src returns a broken link
         if (img?.src?.includes('all_present_lc_a_pol')) {
@@ -81,28 +86,13 @@ class LegendWidget extends React.Component {
 
           img.parentNode.parentNode.parentNode.parentNode.firstElementChild.textContent =
             'Dichotomous Present Land Cover in selected hot spots';
-          return;
         } else if (img?.src?.includes('all_present_lc_b_pol')) {
-          //img.src ='none';
-          const legends = document.getElementsByClassName(
-            'esri-legend__service',
-          );
-          for (let i = 0; i < legends.length; i++) {
-            const legend = legends[i];
-            //find the legend that contains a broken img
-            if (
-              legend.querySelector('img')?.src?.includes('all_present_lc_b_pol')
-            ) {
-              const img = legend.querySelector('img');
-              //set this legend to display none
-              if (!(img.complete && img.naturalHeight !== 0)) {
-                legend.style.display = 'none';
-              }
-              break; // break out of the loop after the first match
-            }
-          }
-          /*img.parentNode.parentNode.parentNode.parentNode.firstElementChild.textContent =
-            'Modular Present Land Cover in selected hot spots';*/
+          img.src = this.props.hotspotData.all_present_lc[
+            'all_present_lc_b_pol'
+          ].FilterStaticImageLegend;
+
+          img.parentNode.parentNode.parentNode.parentNode.firstElementChild.textContent =
+            'Modular Present Land Cover in selected hot spots';
         } else if (img?.src?.includes('all_lcc_a_pol')) {
           img.src = this.props.hotspotData.all_lcc[
             'all_lcc_a_pol'
@@ -111,29 +101,25 @@ class LegendWidget extends React.Component {
           img.parentNode.parentNode.parentNode.parentNode.firstElementChild.textContent =
             'Dichotomous Land Cover Change in selected hot spots';
         } else if (img?.src?.includes('all_lcc_b_pol')) {
-          //img.src ='none';
-          const legends = document.getElementsByClassName(
-            'esri-legend__service',
-          );
-          for (let i = 0; i < legends.length; i++) {
-            const legend = legends[i];
-            //find the legend that contains a broken img
-            if (legend.querySelector('img')?.src?.includes('all_lcc_b_pol')) {
-              const img = legend.querySelector('img');
-              //set this legend to display none
-              if (!(img.complete && img.naturalHeight !== 0)) {
-                legend.style.display = 'none';
-              }
-              break; // break out of the loop after the first match
-            }
-          }
-          /*img.parentNode.parentNode.parentNode.parentNode.firstElementChild.textContent =
-            'Modular Present Land Cover in selected hot spots';*/
+          img.src = this.props.hotspotData.all_lcc[
+            'all_lcc_b_pol'
+          ].FilterStaticImageLegend;
+
+          img.parentNode.parentNode.parentNode.parentNode.firstElementChild.textContent =
+            'Modular Land Cover Change in selected hot spots';
         } else if (img?.src?.includes('cop_klc')) {
-          img.src = this.urls.cop_klc;
+          img.src = this.props.hotspotData.cop_klc[
+            'cop_klc'
+          ].FilterStaticImageLegend;
 
           img.parentNode.parentNode.parentNode.parentNode.firstElementChild.textContent =
             'Key Landscapes for Conservation borders in selected hotspots';
+        } else if (img?.src?.includes('protected_areas')) {
+          img.src = this.props.hotspotData.protected_areas[
+            'protected_areas'
+          ].FilterStaticImageLegend;
+          img.parentNode.parentNode.parentNode.parentNode.firstElementChild.textContent =
+            'Protected Areas in Key Landscapes for Conservation borders in selected hot-spots';
         } else if (img.style) {
           img.parentNode.parentNode.parentNode.parentNode.firstElementChild.style.display =
             'none';
@@ -145,6 +131,15 @@ class LegendWidget extends React.Component {
           span.innerHTML = 'No legend available';
           element.parentNode.appendChild(span);
         }
+        if (
+          img.closest('.esri-legend__service').firstElementChild.nodeName ===
+            'H3' &&
+          img.closest('.esri-legend__service').firstElementChild.textContent ===
+            'WMS'
+        ) {
+          img.closest('.esri-legend__service').firstElementChild.style.display =
+            'none';
+        }
       }
     });
   }

package/src/components/MapViewer/MenuWidget.jsx

@@ -326,8 +326,8 @@ class MenuWidget extends React.Component {
           }
         }
         if (!this.visibleLayers) this.visibleLayers = {};
-        this.view.watch('scale', (newValue) => {});
-        //this.handleRasterVectorLegend();
+        this.handleRasterVectorLegend();
+        this.setState({});
       }
     });
 
@@ -980,8 +980,8 @@ class MenuWidget extends React.Component {
                       <Popup
                         trigger={
                           product.ProductId ===
-                            '8474c3b080fa42cc837f1d2338fcf096' ||
-                          product.ProductTitle === 'Snow and Ice Parameters' ? (
+                          '8474c3b080fa42cc837f1d2338fcf096' /*||
+                          product.ProductTitle === 'Snow and Ice Parameters' */ ? (
                             <div className="zoom-in-message-container">
                               <span>{product.ProductTitle}</span>
                               <div
@@ -1001,9 +1001,9 @@ class MenuWidget extends React.Component {
                         style={{ transform: 'translateX(-4rem)' }}
                       />
                     ) : product.ProductId ===
-                        '8474c3b080fa42cc837f1d2338fcf096' ||
+                      '8474c3b080fa42cc837f1d2338fcf096' /*||
                       product.ProductTitle ===
-                        'High Resolution Snow and Ice Parameters' ? (
+                        'High Resolution Snow and Ice Parameters' */ ? (
                       <div className="zoom-in-message-container">
                         <span>{product.ProductTitle}</span>
                         <div className="zoom-in-message">
@@ -1248,6 +1248,14 @@ class MenuWidget extends React.Component {
                                 Zoom in to view on map
                               </div>
                             </div>
+                          ) : dataset.productId ===
+                            'd764e020485a402598551fa461bf1db2' ? (
+                            <div className="hotspot-filter-message-container">
+                              <span>{dataset.DatasetTitle}</span>
+                              <div className="hotspot-filter-message hotspot-filter-message-dataset">
+                                Use the filter to visualize a KLC area
+                              </div>
+                            </div>
                           ) : (
                             <span>{dataset.DatasetTitle}</span>
                           )
@@ -1265,6 +1273,14 @@ class MenuWidget extends React.Component {
                           Zoom in to view on map
                         </div>
                       </div>
+                    ) : dataset.productId ===
+                      'd764e020485a402598551fa461bf1db2' ? (
+                      <div className="hotspot-filter-message-container">
+                        <span>{dataset.DatasetTitle}</span>
+                        <div className="hotspot-filter-message hotspot-filter-message-dataset">
+                          Use the filter to visualize a KLC area
+                        </div>
+                      </div>
                     ) : (
                       <span>{dataset.DatasetTitle}</span>
                     )}
@@ -1561,7 +1577,7 @@ class MenuWidget extends React.Component {
             const height = this.tileInfo.size[0];
             // create a canvas with 2D rendering context
             const canvas = document.createElement('canvas');
-            const context = canvas.getContext('2d'); //try modifying this value for 3d test UNAI
+            const context = canvas.getContext('2d');
             //canvas
             canvas.width = width;
             canvas.height = height;
@@ -1871,27 +1887,6 @@ class MenuWidget extends React.Component {
       if (nuts) {
         this.map.reorder(nuts, this.map.layers.items.length + 1);
       }
-      //this.props.view //mueve esto
-      //  .whenLayerView(this.layers[elem.id])
-      //  .then((layerView) => {
-      //    layerView.watch('updating', (isUpdating) => {
-      //      if (!isUpdating) {
-      //        setTimeout(() => {
-      //        this.props.loadingHandler(false);
-      //        }, 2000);
-      //      } else {
-      //      }
-      //    });
-      //  })
-      //  .catch((error) => {
-      //    let newHotspotData = this.props.hotspotData;
-      //    let LayerId = elem.id.replace(/\d+\D*/g, '').slice(0, -1);
-      //    let errObj = {};
-      //    errObj[LayerId] = error;
-      //    newHotspotData['layerViewError'] = errObj;
-      //    this.props.hotspotDataHandler(newHotspotData);
-      //    this.props.loadingHandler(false);
-      //  });
       this.checkForHotspots(elem, productContainerId);
     } else {
       sessionStorage.removeItem('downloadButtonClicked');
@@ -1921,12 +1916,6 @@ class MenuWidget extends React.Component {
       this.toggleCustomLegendItem(this.layers[elem.id]);
     }
     this.activeLayersToHotspotData(elem.id);
-    // update DOM
-    //this.setState({});
-    let checkedLayers = sessionStorage.getItem('checkedLayers');
-    if (checkedLayers && checkedLayers.length === 0) {
-      this.props.loadingHandler(false);
-    }
   }
 
   getHotspotLayerIds() {

package/src/components/MapViewer/css/ArcgisMap.css

@@ -1244,7 +1244,14 @@ input[type='range']::-ms-track {
   box-shadow: none;
 }
 
-.zoom-in-message {
+.hotspot-filter-message-container,
+.hotspot-filter-message,
+.hotspot-filter-message-dataset {
+  display: block;
+}
+
+.zoom-in-message,
+.hotspot-filter-message {
   padding: 0.1rem 0.6rem 0.1rem 0.6rem;
   margin-top: 0.2rem;
   background: #a0b128;