@eeacms/volto-arcgis-block 0.1.58 → 0.1.60

package/CHANGELOG.md

@@ -4,6 +4,29 @@ 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.60](https://github.com/eea/volto-arcgis-block/compare/0.1.59...0.1.60) - 19 September 2022
+
+#### :hammer_and_wrench: Others
+
+- ESLint fix [rodriama - [`ca2e108`](https://github.com/eea/volto-arcgis-block/commit/ca2e1086b47be20dbf0858fe728de3ce6b3c91ba)]
+- Update UseCasesMapViewer.jsx [Jose Asensio - [`75b72b9`](https://github.com/eea/volto-arcgis-block/commit/75b72b9018d9b8ec412d923f28e263bbc6cd803a)]
+- Update UseCasesMapViewer.jsx [Jose Asensio - [`190f3a4`](https://github.com/eea/volto-arcgis-block/commit/190f3a46d7a14a647f88bfd84e40c78026e105e9)]
+- Use Cases new country group EEA38 [Jose Asensio - [`d7bb1cc`](https://github.com/eea/volto-arcgis-block/commit/d7bb1cc8a97bc603d7d7be89a73bf29936968873)]
+- Prettier fix [joewdavies - [`e6cb3cc`](https://github.com/eea/volto-arcgis-block/commit/e6cb3ccb53b66f01d503e6347d36ed513854a045)]
+- Prettier fix [joewdavies - [`84f1e00`](https://github.com/eea/volto-arcgis-block/commit/84f1e00fd800d929c711aa7c123c53344bc45a32)]
+- CLMS-1261 clear previously checked layers and expanded dropdowns when navigating from 'viewin the map viewer' [joewdavies - [`478754b`](https://github.com/eea/volto-arcgis-block/commit/478754b12a9a6c8ea005f27425639ff26592be9d)]
+- CLMS-1240 Sublayer title fix in active on map [joewdavies - [`051a465`](https://github.com/eea/volto-arcgis-block/commit/051a465783b8049c8964a0cff02b3760dc7266bc)]
+### [0.1.59](https://github.com/eea/volto-arcgis-block/compare/0.1.58...0.1.59) - 15 September 2022
+
+#### :hammer_and_wrench: Others
+
+- ESlint fix [joewdavies - [`048f62f`](https://github.com/eea/volto-arcgis-block/commit/048f62fb6f86dc62f08a6125eb42b2046a8c66fb)]
+- ESlint fix [joewdavies - [`de6b471`](https://github.com/eea/volto-arcgis-block/commit/de6b471f57e04762c9e374becdb25bcfa78e0881)]
+- ESlint fix [joewdavies - [`0c6564b`](https://github.com/eea/volto-arcgis-block/commit/0c6564bb13e495d2a6d70d31d203e68d9d10ff88)]
+- CLMS-1294 CLMS-1240 CLMS-1293 correct the modal content text shown when adding to downloads. Fix handlingLevel layers in 'active on map' all sublayers are now shown and can be reordered. [joewdavies - [`0e54bc0`](https://github.com/eea/volto-arcgis-block/commit/0e54bc0f073506e6b6cb6b80af263f9801d76b18)]
+- ESlint fix [joewdavies - [`ba69e87`](https://github.com/eea/volto-arcgis-block/commit/ba69e879e66cd7baabe9886067b8afeb53f3636f)]
+- ESlint fix [joewdavies - [`2b62baf`](https://github.com/eea/volto-arcgis-block/commit/2b62bafee4d7baef3df8036db8b83980fec152a9)]
+- CLMS-1312 timeslider close button was not working in the download map viewer [joewdavies - [`f67e78f`](https://github.com/eea/volto-arcgis-block/commit/f67e78f74b5cc3a8dbbf4b6b0fce274bcbe280ce)]
 ### [0.1.58](https://github.com/eea/volto-arcgis-block/compare/0.1.57...0.1.58) - 14 September 2022
 
 #### :hammer_and_wrench: Others

package/package.json

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

package/src/components/MapViewer/MenuWidget.jsx

@@ -239,10 +239,10 @@ export const AddCartItem = ({
                 <ul>
                   <li>
                     <p>
-                      If you would like to download entire dataset select Add
-                      entire dataset (Note: download will take longer for large
-                      datasets, and the bounding box for Europe is selected by
-                      default).
+                      If you would like to download an entire dataset then
+                      select &#39;Add entire dataset&#39; (Note: the download
+                      will take longer for large datasets and Europe is selected
+                      as the area of interest by default).
                     </p>
                   </li>
                   <br />
@@ -250,12 +250,12 @@ export const AddCartItem = ({
                     <>
                       <li>
                         <p>
-                          if you would like to download data for your area of
-                          interest select first area of interest and then click
-                          download button next to the dataset (Note: the time
-                          range to download will be the first date of the
-                          dataset but if it is not informed in the metadata it
-                          will be the last 10 days).
+                          If you would like to download data for your area of
+                          interest: first select an area of interest and then
+                          click the download button next to the dataset (Note:
+                          the time range to download will be the first date of
+                          the dataset but if it is not included in the dataset's
+                          metadata then it will be the last 10 days).
                         </p>
                       </li>
                       <br />
@@ -274,9 +274,9 @@ export const AddCartItem = ({
                   ) : (
                     <li>
                       <p>
-                        if you would like to download data for your area of
-                        interest select first area of interest and then click
-                        download button next to the dataset.
+                        If you would like to download data for your area of
+                        interest: first select an area of interest and then
+                        click the download button next to the dataset.
                       </p>
                     </li>
                   )}
@@ -486,6 +486,15 @@ class MenuWidget extends React.Component {
     let product = url.searchParams.get('product');
     let dataset = url.searchParams.get('dataset');
     if (product || dataset) {
+      // CLMS-1261 - clear any previously checked layers when navigating using 'view in the map viewer'
+      let expandedDropdowns = sessionStorage.getItem('expandedDropdowns');
+      let checkedLayers = sessionStorage.getItem('checkedLayers');
+      if (expandedDropdowns) {
+        sessionStorage.setItem('expandedDropdowns', JSON.stringify([]));
+      }
+      if (checkedLayers) {
+        sessionStorage.setItem('checkedLayers', JSON.stringify([]));
+      }
       let event = new MouseEvent('click', {
         view: window,
         bubbles: true,
@@ -1020,11 +1029,7 @@ class MenuWidget extends React.Component {
         });
       }
     }
-    let style = handlingLevel
-      ? { display: 'none' }
-      : this.props.download
-      ? { paddingLeft: '4rem' }
-      : {};
+    let style = this.props.download ? { paddingLeft: '4rem' } : {};
     return (
       <div
         className="ccl-form-group map-menu-layer"
@@ -1076,7 +1081,8 @@ class MenuWidget extends React.Component {
         let dataset = document
           .querySelector('[datasetid="' + group + '"]')
           .querySelector('input');
-        elem.title = dataset.title;
+        elem.title =
+          dataset.title + ' - ' + this.getLayerTitle(this.layers[elem.id]);
         let groupLayers = this.getGroupLayers(group);
         if (groupLayers.length > 0 && groupLayers[0] in this.activeLayersJSON) {
           elem.hide = true;
@@ -1158,8 +1164,10 @@ class MenuWidget extends React.Component {
       layerChecks = document.querySelectorAll(`[parentid=${id}]`);
     }
     layerChecks.forEach((element) => {
-      element.checked = value;
-      this.toggleLayer(element);
+      if (element) {
+        element.checked = value;
+        this.toggleLayer(element);
+      }
     });
   }
 
@@ -1246,7 +1254,7 @@ class MenuWidget extends React.Component {
         layer-id={elem.id}
         layer-order={order}
         draggable="true"
-        {...(elem.hide && { style: { display: 'none' } })}
+        // {...(elem.hide && { style: { display: 'none' } })}
         onDrop={(e) => this.onDrop(e)}
         onDragOver={(e) => this.onDragOver(e)}
         onDragStart={(e) => this.onDragStart(e)}
@@ -1338,34 +1346,34 @@ class MenuWidget extends React.Component {
     //First, we decide how to insert the element in the DOM
     let init_ord = this.draggingElement.getAttribute('layer-order');
     let dst_ord = dst.getAttribute('layer-order');
-    let group = this.getGroup(
-      document.getElementById(this.draggingElement.getAttribute('layer-id')),
-    )
-      ? this.getGroup(
-          document.getElementById(
-            this.draggingElement.getAttribute('layer-id'),
-          ),
-        )
-      : this.getGroup(document.getElementById(dst.getAttribute('layer-id')));
-    let groupLayers = this.getGroupLayers(group);
+    // let group = this.getGroup(
+    //   document.getElementById(this.draggingElement.getAttribute('layer-id')),
+    // )
+    //   ? this.getGroup(
+    //       document.getElementById(
+    //         this.draggingElement.getAttribute('layer-id'),
+    //       ),
+    //     )
+    //   : this.getGroup(document.getElementById(dst.getAttribute('layer-id')));
+    //let groupLayers = this.getGroupLayers(group);
     if (init_ord > dst_ord) {
       dst.parentElement.insertBefore(this.draggingElement, dst.nextSibling);
     } else {
       dst.parentElement.insertBefore(this.draggingElement, dst);
     }
-    if (group && groupLayers.length > 1) {
-      groupLayers.forEach((item, index) => {
-        if (
-          this.draggingElement.getAttribute('layer-id') !== item ||
-          dst.getAttribute('layer-id') !== item
-        ) {
-          dst.parentElement.insertBefore(
-            document.getElementById('active_' + item),
-            this.draggingElement.nextSibling,
-          );
-        }
-      });
-    }
+    // if (group && groupLayers.length > 1) {
+    //   groupLayers.forEach((item, index) => {
+    //     if (
+    //       this.draggingElement.getAttribute('layer-id') !== item ||
+    //       dst.getAttribute('layer-id') !== item
+    //     ) {
+    //       dst.parentElement.insertBefore(
+    //         document.getElementById('active_' + item),
+    //         this.draggingElement.nextSibling,
+    //       );
+    //     }
+    //   });
+    // }
     this.layersReorder();
     this.saveLayerOrder();
   }
@@ -1535,10 +1543,7 @@ class MenuWidget extends React.Component {
               .querySelector('#download_label')
               .classList.remove('locked');
           if (
-            document.contains(
-              document.querySelector('.timeslider-container'),
-            ) &&
-            !this.props.download
+            document.contains(document.querySelector('.timeslider-container'))
           )
             ReactDOM.unmountComponentAtNode(
               document.querySelector('.esri-ui-bottom-right'),
@@ -1739,22 +1744,23 @@ class MenuWidget extends React.Component {
    * @param {*} id id from elem
    */
   deleteCrossEvent(elem) {
-    let group = this.getGroup(elem);
-    let groupLayers = this.getGroupLayers(group);
-    if (group && groupLayers.length > 1) {
-      groupLayers.forEach((item) => {
-        elem = document.getElementById(item);
-        // elem has to be unchecked
-        elem.checked = false;
-        this.toggleLayer(elem);
-        delete this.activeLayersJSON[elem.id];
-      });
-    } else {
-      // elem has to be unchecked
-      elem.checked = false;
-      this.toggleLayer(elem);
-      delete this.activeLayersJSON[elem.id];
-    }
+    // let group = this.getGroup(elem);
+    // let groupLayers = this.getGroupLayers(group);
+    // if (group && groupLayers.length > 1) {
+    //   // are we sure we want to delete all sublayers when one is deleted?
+    //   groupLayers.forEach((item) => {
+    //     elem = document.getElementById(item);
+    //     // elem has to be unchecked
+    //     elem.checked = false;
+    //     this.toggleLayer(elem);
+    //     delete this.activeLayersJSON[elem.id];
+    //   });
+    // } else {
+    // elem has to be unchecked
+    elem.checked = false;
+    this.toggleLayer(elem);
+    delete this.activeLayersJSON[elem.id];
+    // }
     this.setState({});
   }
 
@@ -1804,6 +1810,7 @@ class MenuWidget extends React.Component {
    * Method to load previously expanded dropdowns according to sessionStorage
    */
   expandDropdowns() {
+    if (this.props.download) return;
     let expandedDropdowns = JSON.parse(
       sessionStorage.getItem('expandedDropdowns'),
     );

package/src/components/UseCasesMapViewer/UseCasesMapViewer.jsx

@@ -370,6 +370,13 @@ class UseCasesMapViewer extends React.Component {
                   ),
                 ].length;
                 let data_eea = [
+                  ...new Set(
+                    data.features
+                      .filter((a) => a.attributes.Spatial_coverage === 'EEA38')
+                      .map((item) => item.attributes.Use_case_id),
+                  ),
+                ].length;
+                let data_eea_uk = [
                   ...new Set(
                     data.features
                       .filter(
@@ -392,6 +399,7 @@ class UseCasesMapViewer extends React.Component {
                         (a) =>
                           a.attributes.Spatial_coverage !== 'EU' &&
                           a.attributes.Spatial_coverage !== 'EU 27+UK' &&
+                          a.attributes.Spatial_coverage !== 'EEA38' &&
                           a.attributes.Spatial_coverage !== 'EEA38+UK' &&
                           a.attributes.Spatial_coverage !== 'GLOBAL',
                       )
@@ -407,6 +415,9 @@ class UseCasesMapViewer extends React.Component {
                   string += `<div>${data_eu_uk} Use cases with EU27+UK coverage</div>`;
                 }
                 if (data_eea > 0) {
+                  string += `<div>${data_eea} Use cases with EEA38 coverage</div>`;
+                }
+                if (data_eea_uk > 0) {
                   string += `<div>${data_eea} Use cases with EEA38+UK coverage</div>`;
                 }
                 if (data_global > 0) {

package/src/components/UseCasesMapViewer/config.js

@@ -104,6 +104,47 @@ const config = {
       'PL',
       'UK',
     ],
+    EEA38: [
+      'AT',
+      'BE',
+      'BG',
+      'CH',
+      'CY',
+      'CZ',
+      'DE',
+      'DK',
+      'EE',
+      'EL',
+      'ES',
+      'FI',
+      'FR',
+      'HR',
+      'HU',
+      'IE',
+      'IS',
+      'IT',
+      'LI',
+      'LT',
+      'LU',
+      'LV',
+      'MT',
+      'NL',
+      'NO',
+      'PL',
+      'PT',
+      'RO',
+      'SE',
+      'SI',
+      'SK',
+      'TR',
+      //COOPERATIVES
+      'AL',
+      'BA',
+      'XK',
+      'ME',
+      'MK',
+      'RS',
+    ],
     'EEA38+UK': [
       'AT',
       'BE',