npm - @eeacms/volto-marine-policy - Versions diffs - 2.0.13 → 2.0.15 - Mend

@eeacms/volto-marine-policy 2.0.13 → 2.0.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (8) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -4,6 +4,33 @@ 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).
+### [2.0.15](https://github.com/eea/volto-marine-policy/compare/2.0.14...2.0.15) - 16 June 2025
+#### :house: Internal changes
+- style: Automated code fix [eea-jenkins - [`5b37969`](https://github.com/eea/volto-marine-policy/commit/5b3796962e97e62cde61dfe0e78e85e340eefc0c)]
+#### :hammer_and_wrench: Others
+- small change to demo sites map viewer legend position [laszlocseh - [`0891fdf`](https://github.com/eea/volto-marine-policy/commit/0891fdf38b439804c27c3442a731637ed415ea2b)]
+### [2.0.14](https://github.com/eea/volto-marine-policy/compare/2.0.13...2.0.14) - 15 May 2025
+#### :rocket: Dependency updates
+- Release @eeacms/volto-globalsearch@2.1.2 [EEA Jenkins - [`4781112`](https://github.com/eea/volto-marine-policy/commit/47811128d3fd2711efaafe426d32e28d87296222)]
+- Release @eeacms/volto-globalsearch@2.1.1 [EEA Jenkins - [`91c4b2b`](https://github.com/eea/volto-marine-policy/commit/91c4b2ba5b743911f6898d2ad74230f3b87154b3)]
+#### :house: Internal changes
+- style: Automated code fix [eea-jenkins - [`ebda5f4`](https://github.com/eea/volto-marine-policy/commit/ebda5f4f834a8851ccaabb27b1a75caa13a5989c)]
+- style: Automated code fix [eea-jenkins - [`f3118b8`](https://github.com/eea/volto-marine-policy/commit/f3118b86f9324b186eacbf9f5cfcf716d72213f0)]
+#### :hammer_and_wrench: Others
+- update jest-addon.config.js [laszlocseh - [`f63cc32`](https://github.com/eea/volto-marine-policy/commit/f63cc327fdc89ed930f03ae4c16baaf80a8e6fc0)]
+- fix eslint [laszlocseh - [`4490f3f`](https://github.com/eea/volto-marine-policy/commit/4490f3f48a8256713760bc5193588cad9cb1ce6b)]
+- remove console.log [laszlocseh - [`c2adb4a`](https://github.com/eea/volto-marine-policy/commit/c2adb4afc1c98315b36e55e94011212eec6b3927)]
+- make filters auto update based on selection [laszlocseh - [`1a11f9a`](https://github.com/eea/volto-marine-policy/commit/1a11f9a2a0f65a2b03778c306052086068c5c323)]
 ### [2.0.13](https://github.com/eea/volto-marine-policy/compare/2.0.12...2.0.13) - 13 May 2025
 #### :house: Internal changes

package/jest-addon.config.js CHANGED Viewed

@@ -41,10 +41,10 @@ module.exports = {
   },
   coverageThreshold: {
     global: {
-      branches: 3,
-      functions: 3,
-      lines: 3,
-      statements: 3,
+      branches: 2,
+      functions: 2,
+      lines: 2,
+      statements: 2,
     },
   },
   ...(process.env.JEST_USE_SETUP === 'ON' && {

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-marine-policy",
-  "version": "2.0.13",
+  "version": "2.0.15",
   "description": "@eeacms/volto-marine-policy: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",
@@ -34,7 +34,7 @@
     "@eeacms/volto-eea-design-system": "*",
     "@eeacms/volto-eea-website-theme": "*",
     "@eeacms/volto-embed": "*",
-    "@eeacms/volto-globalsearch": "2.1.0",
+    "@eeacms/volto-globalsearch": "2.1.2",
     "@eeacms/volto-openlayers-map": "0.3.2",
     "@eeacms/volto-searchlib": "2.0.16",
     "@eeacms/volto-tabs-block": "*",

package/src/components/Blocks/DemoSitesExplorer/DemoSitesExplorerView.js CHANGED Viewed

@@ -36,12 +36,13 @@ export default function DemoSitesExplorerView(props) {
   const [filters, setFilters] = React.useState([]);
   const [map, setMap] = React.useState();
   const [highlightedIndex, setHighlightedIndex] = React.useState(-1);
+  const columnsLength = hideFilters ? 12 : 8;
   React.useEffect(() => {
-    const _filters = getFilters(cases, indicatorOnly);
+    const _filters = getFilters(activeItems, indicatorOnly);
     setFilters(_filters);
   }, [
-    cases,
+    activeItems,
     activeFilters.objective_filter,
     activeFilters.target_filter,
     activeFilters.indicator_filter,
@@ -82,7 +83,11 @@ export default function DemoSitesExplorerView(props) {
       <Grid.Row>
         {cases.length ? (
           <Grid columns={12}>
-            <Grid.Column mobile={8} tablet={8} computer={8}>
+            <Grid.Column
+              mobile={columnsLength}
+              tablet={columnsLength}
+              computer={columnsLength}
+            >
               <DemoSitesMap
                 items={cases}
                 activeItems={activeItems}
@@ -96,18 +101,18 @@ export default function DemoSitesExplorerView(props) {
                 setHighlightedIndex={setHighlightedIndex}
               />
             </Grid.Column>
-            <Grid.Column
-              mobile={4}
-              tablet={4}
-              computer={4}
-              className="right-side-filters"
-            >
-              <Grid.Row>
-                {!hideFilters ? (
+            {!hideFilters ? (
+              <Grid.Column
+                mobile={4}
+                tablet={4}
+                computer={4}
+                className="right-side-filters"
+              >
+                <Grid.Row>
                   <VisibilitySensor>
                     <ObjectivesChart
                       items={cases}
-                      // activeItems={activeItems}
+                      activeItems={activeItems}
                       // filters={filters}
                       activeFilters={activeFilters}
                       setActiveFilters={setActiveFilters}
@@ -119,31 +124,52 @@ export default function DemoSitesExplorerView(props) {
                       setInitialized={setInitialized}
                     />
                   </VisibilitySensor>
-                ) : (
-                  ''
-                )}
-              </Grid.Row>
-              <Grid.Row>
-                <div className="legend">
-                  {/* <div className="legend-row legend-subtitle">Legend</div> */}
-                  <div className="legend-row">
-                    <div className="circle">
-                      <div className="dot-demosite"></div>
+                </Grid.Row>
+                <Grid.Row>
+                  <div className="legend">
+                    {/* <div className="legend-row legend-subtitle">Legend</div> */}
+                    <div className="legend-row">
+                      <div className="circle">
+                        <div className="dot-demosite"></div>
+                      </div>
+                      <div>Demo site</div>
                     </div>
-                    <div>Demo site</div>
-                  </div>
-                  <div className="legend-row">
-                    <div className="circle">
-                      <div className="dot-region"></div>
+                    <div className="legend-row">
+                      <div className="circle">
+                        <div className="dot-region"></div>
+                      </div>
+                      <div>Associated region</div>
                     </div>
-                    <div>Associated region</div>
                   </div>
-                </div>
-              </Grid.Row>
-            </Grid.Column>
+                </Grid.Row>
+              </Grid.Column>
+            ) : (
+              ''
+            )}
           </Grid>
         ) : null}
       </Grid.Row>
+      {hideFilters ? (
+        <Grid.Row stretched={true}>
+          <div className="legend position-bottom">
+            {/* <div className="legend-row legend-subtitle">Legend</div> */}
+            <div className="legend-row">
+              <div className="circle">
+                <div className="dot-demosite"></div>
+              </div>
+              <div>Demo site</div>
+            </div>
+            <div className="legend-row">
+              <div className="circle">
+                <div className="dot-region"></div>
+              </div>
+              <div>Associated region</div>
+            </div>
+          </div>
+        </Grid.Row>
+      ) : (
+        ''
+      )}
     </div>
   );
 }

package/src/components/Blocks/DemoSitesExplorer/DemoSitesFilters.jsx CHANGED Viewed

@@ -82,15 +82,11 @@ export function DemoSitesFilter(props) {
           {Object.entries(filters?.[filterName] || {})
             // .sort((item1, item2) => item1[1].localeCompare(item2[1]))
             .map(([value, label], index) => (
-              <label
-                htmlFor={label + index}
-                className="filter-input"
-                key={index}
-              >
+              <label htmlFor={label} className="filter-input" key={label}>
                 <input
                   value={value}
                   type="checkbox"
-                  id={label + index}
+                  id={label}
                   onChange={(e) => {
                     const temp = JSON.parse(JSON.stringify(activeFilters));
                     if (e.target.checked) {

package/src/components/Blocks/DemoSitesExplorer/DemoSitesMap.jsx CHANGED Viewed

@@ -91,10 +91,14 @@ export default function DemoSitesMap(props) {
         const coords = selectedCase.geometry.flatCoordinates;
         const pixel = map.getPixelFromCoordinate(coords);
         map.getInteractions().array_[9].getFeatures().clear();
-        map
-          .getInteractions()
-          .array_[9].getFeatures()
-          .push(map.getFeaturesAtPixel(pixel)[0]);
+        try {
+          map
+            .getInteractions()
+            .array_[9].getFeatures()
+            .push(map.getFeaturesAtPixel(pixel)[0]);
+        } catch (e) {
+          // console.error(e);
+        }
       } else {
         map.getInteractions().array_[9].getFeatures().clear();
       }

package/src/components/Blocks/DemoSitesExplorer/ObjectivesChart.jsx CHANGED Viewed

@@ -9,7 +9,7 @@ const Plot = loadable(() => import('react-plotly.js'));
 const ObjectivesChart = ({
   items,
-  // activeItems,
+  activeItems,
   //   filters,
   activeFilters,
   setActiveFilters,
@@ -21,9 +21,29 @@ const ObjectivesChart = ({
   setInitialized,
 }) => {
   const chartRef = useRef(null);
-  const objectiveCounts = {};
+  let objectiveCounts = {};
-  for (const item of items) {
+  // if (!items) return;
+  items.forEach((item) => {
+    const _obj = item.properties.objective;
+    _obj.forEach((_o) => {
+      if (!(_o in objectiveCounts)) {
+        objectiveCounts[_o] = 0;
+      }
+    });
+  });
+  let itemsUsedForChart = [];
+  if (initialized) {
+    itemsUsedForChart = activeItems;
+  } else {
+    itemsUsedForChart = items;
+  }
+  for (const item of itemsUsedForChart) {
     item.properties.objective.map((obj) => {
       objectiveCounts[obj] = (objectiveCounts[obj] || 0) + 1;
       return [];
@@ -43,9 +63,9 @@ const ObjectivesChart = ({
     const interval = setInterval(() => {
       setHighlightedIndex((prevIndex) => {
+        if (prevIndex + 1 >= objectivesLength) setInitialized(true);
         if (prevIndex + 1 >= objectivesLength + 1) {
           clearInterval(interval); // Stop after last item
-          setInitialized(true);
           return prevIndex;
         }
         return prevIndex + 1;
@@ -63,6 +83,7 @@ const ObjectivesChart = ({
   ]);
   React.useEffect(() => {
+    // set the objectives filter based on chartclick or list selection
     // if (!objectives) return;
     const filterKey = 'objective_filter';
@@ -172,6 +193,7 @@ const ObjectivesChart = ({
                 labels: labels,
                 values: values,
                 textinfo: 'none',
+                sort: false,
                 // textinfo: highlightedIndex === 5 ? 'value' : 'none',
                 hole: 0.4,
                 insidetextorientation: 'radial',
@@ -240,6 +262,7 @@ const ObjectivesChart = ({
               className={cx(
                 index === highlightedIndex ? 'active' : '',
                 customColors[index].replace('#', 'C'),
+                count === 0 ? 'disabled' : '',
               )}
             >
               <div

package/src/components/Blocks/DemoSitesExplorer/styles.less CHANGED Viewed

@@ -409,12 +409,17 @@
 .legend {
   // position: absolute;
-  bottom: 2em;
+  // bottom: 2em;
   display: flex;
   flex-direction: row;
   align-items: flex-start;
+  justify-content: center;
   gap: 1em;
+  &.position-bottom {
+    margin-top: 1em;
+  }
   .legend-row {
     display: flex;
     align-items: center;
@@ -565,5 +570,11 @@
         height: 1em;
       }
     }
+    &.disabled {
+      cursor: not-allowed;
+      opacity: 0.5;
+      pointer-events: none;
+    }
   }
 }