@eeacms/volto-cca-policy 0.1.102 → 0.2.1

package/src/components/manage/Blocks/CaseStudyExplorer/CaseStudyFilters.test.jsx

@@ -0,0 +1,50 @@
+import React from 'react';
+import { MemoryRouter } from 'react-router-dom';
+import configureStore from 'redux-mock-store';
+import { render } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import { Provider } from 'react-intl-redux';
+import CaseStudyFilters from './CaseStudyFilters';
+
+const mockStore = configureStore();
+
+describe('CaseStudyFilters', () => {
+  it('should render the component', () => {
+    const data = {
+      filters: {
+        // sectors: [{ HEALTH: 'Health' }],
+        // impacts: [{ DROUGHT: 'Drought' }],
+        sectors: [],
+        impacts: [],
+        measures: {
+          //   Measure1: [
+          //     { key: 'M11', value: 'm11' },
+          //     { key: 'M12', value: 'm12' },
+          //   ],
+        },
+      },
+      activeFilters: {
+        sectors: [],
+        impacts: [],
+        measures: [],
+      },
+    };
+
+    const store = mockStore({
+      userSession: { token: '1234' },
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+
+    const { container } = render(
+      <Provider store={store}>
+        <MemoryRouter>
+          <CaseStudyFilters {...data} />
+        </MemoryRouter>
+      </Provider>,
+    );
+    expect(container).toBeTruthy();
+  });
+});

package/src/components/manage/Blocks/CaseStudyExplorer/CaseStudyMap.jsx

@@ -12,7 +12,7 @@ export default function CaseStudyMap(props) {
   const { items, activeItems } = props;
   const [selectedCase, onSelectedCase] = React.useState();
 
-  const features = getFeatures(items); //console.log('Features list', features);
+  const features = getFeatures(items);
 
   const [tileWMSSources] = React.useState([
     // , setTileWMSSources

package/src/components/manage/Blocks/CaseStudyExplorer/FeatureDisplay.jsx

@@ -4,33 +4,35 @@ import { FormattedMessage } from 'react-intl';
 export default function FeatureDisplay({ feature }) {
   return feature ? (
     <div id="csepopup">
-      <strong>{feature.title}</strong>
+      <p>
+        <strong>{feature.title}</strong> <a href={feature.url}>open DB</a>
+      </p>
       <span className="img">
         <center>
           <img src={feature.image} alt={feature.title} />
         </center>
       </span>
+      <p style={{ marginBottom: '10px' }}>
+        <span className="blue">
+          <FormattedMessage
+            id="Adaptation sectors"
+            defaultMessage="Adaptation sectors"
+          />
+          {': '}
+        </span>
+        <span>{feature.adaptations}</span>
+      </p>
+      <p style={{ marginBottom: '10px' }}>
+        <span className="blue">
+          <FormattedMessage
+            id="Climate impacts"
+            defaultMessage="Climate impacts"
+          />
+          {': '}
+        </span>
+        <span>{feature.impacts}</span>
+      </p>
       <p>
-        <p style={{ marginBottom: '10px' }}>
-          <span className="blue">
-            <FormattedMessage
-              id="Adaptation sectors"
-              defaultMessage="Adaptation sectors"
-            />
-            {': '}
-          </span>
-          <span>{feature.adaptations}</span>
-        </p>
-        <p style={{ marginBottom: '10px' }}>
-          <span className="blue">
-            <FormattedMessage
-              id="Climate impacts"
-              defaultMessage="Climate impacts"
-            />
-            {': '}
-          </span>
-          <span>{feature.impacts}</span>
-        </p>
         <span className="blue">
           <FormattedMessage
             id="Adaptation options"
@@ -40,7 +42,8 @@ export default function FeatureDisplay({ feature }) {
         </span>
         <span
           dangerouslySetInnerHTML={{
-            __html: feature.adaptation_options_links.replace('<>', '; '),
+            __html: feature.adaptation_options_links.replaceAll('<>', '; '),
+            // __html: feature.adaptation_options_links,
           }}
         ></span>
       </p>

package/src/components/manage/Blocks/CaseStudyExplorer/FeatureInteraction.jsx

@@ -60,7 +60,6 @@ export default function FeatureInteraction({ onFeatureSelect }) {
         if (subfeatures.length === 1) {
           const selectedFeature = subfeatures[0].values_;
           onFeatureSelect(selectedFeature);
-          // console.log('onfeatureselect');
         } else {
           // zoom to extent of cluster points
           const extent = getExtentOfFeatures(subfeatures);
@@ -68,12 +67,10 @@ export default function FeatureInteraction({ onFeatureSelect }) {
           let extentBuffer =
             (extent[3] - extent[1] + extent[2] - extent[0]) / 4;
           extentBuffer = extentBuffer < 500 ? 500 : extentBuffer;
-          // console.log('extentBuffer', { extent, extentBuffer });
           const paddedExtent = ol.extent.buffer(extent, extentBuffer);
 
           // const paddedExtent = ol.extent.buffer(extent, 50000);
           map.getView().fit(paddedExtent, { ...map.getSize(), duration: 1000 });
-          // console.log('onclusterzoom');
         }
       });
 

package/src/components/manage/Blocks/CaseStudyExplorer/hooks.js

@@ -4,7 +4,7 @@ import superagent from 'superagent';
 const cases_url = '@@case-studies-map.arcgis.json';
 
 export function useCases(url) {
-  const [cases, setCases] = React.useState([]);
+  const [cases, setCases] = React.useState([[], []]);
 
   React.useEffect(() => {
     superagent
@@ -12,7 +12,7 @@ export function useCases(url) {
       .set('accept', 'json')
       .then((resp) => {
         const res = JSON.parse(resp.text);
-        setCases(res.features);
+        setCases({ features: res.features, filters: res.filters });
       });
   }, []);
 

package/src/components/manage/Blocks/CaseStudyExplorer/styles.less

@@ -5,12 +5,19 @@
 }
 
 #csepopup {
+  border-bottom: 6px solid #005c96;
+
   p {
+    padding: 0 10px 0 10px;
     font-size: 13px;
 
     p {
       margin-bottom: 10px;
     }
+
+    a {
+      text-decoration: underline;
+    }
   }
 
   span.blue {
@@ -33,16 +40,18 @@
     position: relative;
     padding: 10px;
     border-bottom: 1px solid #d8d8d8;
+    margin-top: 0 !important;
     margin-bottom: 0 !important;
-    background-color: #005c96;
-    color: #fff;
+    background-color: #fff;
+    clear: both;
+    color: #005c96;
     cursor: pointer;
     font-size: 14px;
   }
 
   p {
-    padding: 2px;
-    padding-left: 10px;
+    // padding: 2px;
+    padding-bottom: 10px;
     clear: both;
     line-height: 20px;
 
@@ -56,4 +65,32 @@
       float: right;
     }
   }
+
+  div.title {
+    width: 100%;
+  }
+
+  .ui.accordion > .title > .icon {
+    line-height: 1rem;
+  }
+
+  .ui.accordion p {
+    margin: 0;
+  }
+
+  .ui.accordion .subcategory {
+    margin-bottom: 30px;
+  }
+
+  button.reset {
+    margin-top: 20px;
+  }
+
+  .ui.checkbox {
+    width: 100%;
+  }
+}
+
+.section-case-study-explorer #popup-overlay {
+  padding: 0;
 }

package/src/components/manage/Blocks/CaseStudyExplorer/utils.js

@@ -19,6 +19,7 @@ export function getFeatures(cases) {
         impacts: c.properties.impacts_str,
         adaptation_options_links: c.properties.adaptation_options_links,
         index: index,
+        url: c.properties.url,
       },
       false,
     );
@@ -29,7 +30,12 @@ export function getFeatures(cases) {
 
 export function filterCases(cases, activeFilters) {
   const data = cases.filter((_case) => {
-    if (activeFilters.sectors.length === 0) return _case;
+    if (
+      activeFilters.sectors.length === 0 &&
+      activeFilters.measures.length === 0 &&
+      activeFilters.impacts.length === 0
+    )
+      return _case;
 
     let flag = false;
 
@@ -41,6 +47,10 @@ export function filterCases(cases, activeFilters) {
       if (_case.properties.impacts.includes(',' + filter + ',')) flag = true;
     });
 
+    activeFilters.measures.forEach((filter) => {
+      if (_case.properties.ktms.includes(',' + filter + ',')) flag = true;
+    });
+
     return flag ? _case : false;
   });
 
@@ -48,10 +58,11 @@ export function filterCases(cases, activeFilters) {
 }
 
 export function getFilters(cases) {
-  let _filters = { sectors: {}, impacts: {} };
+  let _filters = { sectors: {}, impacts: {}, measures: {} };
 
   for (let key of Object.keys(cases)) {
     const _case = cases[key];
+
     let sectorKeys = _case.properties.sectors.split(',');
     let sectorNames = _case.properties.sectors_str.split(',');
     for (let i = 0; i < sectorNames.length; i++) {
@@ -59,15 +70,24 @@ export function getFilters(cases) {
         _filters.sectors[sectorKeys[i + 1]] = sectorNames[i];
       }
     }
+
     let impactKeys = _case.properties.impacts.split(',');
     let impactNames = _case.properties.impacts_str.split(',');
-
     for (let i = 0; i < impactNames.length; i++) {
       if (!_filters.impacts.hasOwnProperty(impactKeys[i + 1])) {
         _filters.impacts[impactKeys[i + 1]] = impactNames[i];
       }
     }
+
+    // let ktmKeys = _case.properties.ktms.split(',');
+    // let ktmNames = _case.properties.impacts_str.split(',');
+    // for (let i = 0; i < ktmKeys.length; i++) {
+    //   if (!_filters.ktms.hasOwnProperty(ktmKeys[i])) {
+    //     _filters.ktms[ktmKeys[i]] = 1;
+    //   }
+    // }
   }
+  // console.log('getFilters:', _filters);
 
   return _filters;
 }

package/src/components/manage/Blocks/CollectionStatistics/CollectionStatsView.jsx

@@ -90,7 +90,7 @@ export default function CollectionStatsView(props) {
   let stats = useStats(getBaseUrl(pathname), id, data);
 
   const groupDefinition =
-    config.blocks.blocksConfig.collectionStats.groups[field] || {};
+    config.blocks.blocksConfig.collectionStats?.groups?.[field] || {};
   const { cleanup, icons = {}, iconComponent: IconComponent } = groupDefinition;
 
   if (cleanup) stats = cleanup(stats);

package/src/components/manage/Blocks/CollectionStatistics/CollectionStatsView.test.jsx

@@ -0,0 +1,93 @@
+import React from 'react';
+import { MemoryRouter } from 'react-router-dom';
+import configureStore from 'redux-mock-store';
+import { render } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import { Provider } from 'react-intl-redux';
+import CollectionStatsView from './CollectionStatsView';
+import config from '@plone/volto/registry';
+import applyConfig from './index';
+
+const mockStore = configureStore();
+
+applyConfig(config);
+
+describe('CollectionStatsView', () => {
+  it('should render the component', () => {
+    const data = {
+      id: 'id-1',
+      data: {
+        aggregateField: {
+          label: 'Portal type',
+          value: 'portal_type',
+        },
+        href: [
+          {
+            '@id': '/en/observatory/advanced-search',
+            title: 'Resource catalogue',
+          },
+        ],
+        query: {
+          query: [
+            {
+              i: 'include_in_observatory',
+              o: 'plone.app.querystring.operation.boolean.isTrue',
+              v: '',
+            },
+            {
+              i: 'path',
+              o: 'plone.app.querystring.operation.string.absolutePath',
+              v: '/en',
+            },
+            {
+              i: 'review_state',
+              o: 'plone.app.querystring.operation.selection.any',
+              v: ['published'],
+            },
+          ],
+          sort_order: 'ascending',
+          queryParameterStyle: 'EEASemanticSearch',
+          showLabel: true,
+        },
+      },
+      path: '/some-location',
+      pathname: '/some-location',
+    };
+
+    const store = mockStore({
+      userSession: { token: '1234' },
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+      querystats: {
+        'id-1': {
+          items: {
+            Event: 82,
+            'News Item': 116,
+            'eea.climateadapt.aceproject': 60,
+            'eea.climateadapt.adaptationoption': 1,
+            'eea.climateadapt.c3sindicator': 9,
+            'eea.climateadapt.casestudy': 32,
+            'eea.climateadapt.guidancedocument': 21,
+            'eea.climateadapt.indicator': 14,
+            'eea.climateadapt.informationportal': 27,
+            'eea.climateadapt.organisation': 22,
+            'eea.climateadapt.publicationreport': 187,
+            'eea.climateadapt.tool': 14,
+            'eea.climateadapt.video': 17,
+          },
+        },
+      },
+    });
+
+    const { container } = render(
+      <Provider store={store}>
+        <MemoryRouter>
+          <CollectionStatsView {...data} />
+        </MemoryRouter>
+      </Provider>,
+    );
+    expect(container.querySelector('.collection-stats')).toBeInTheDocument();
+  });
+});

package/src/components/manage/Blocks/CountryProfileDetail/Edit.js

@@ -0,0 +1,5 @@
+import View from './View';
+
+export default function Edit(props) {
+  return <View {...props} mode="edit" />;
+}

package/src/components/manage/Blocks/CountryProfileDetail/View.js

@@ -0,0 +1,67 @@
+import React from 'react';
+import { TabPane, Tab } from 'semantic-ui-react';
+
+const extract_body = (html_string) => {
+  let parser = new DOMParser();
+  let dom_document = parser.parseFromString(html_string, 'text/html');
+
+  let list = dom_document
+    .getElementById('third-level-menu')
+    .getElementsByTagName('a');
+  let response = { options: [], values: [] };
+  for (let i = 0; i < list.length; i++) {
+    let theId = list[i].href.split('#')[1];
+    response.options.push({
+      id: theId,
+      name: list[i].innerHTML.replace('&amp;', '&'),
+    });
+    response.values.push(dom_document.getElementById(theId).innerHTML);
+  }
+  return response;
+};
+
+export default function View(props) {
+  const [data, setData] = React.useState();
+  const html = props.properties['@components'].countryprofile.html;
+
+  React.useEffect(
+    () =>
+      setData(extract_body(html.replaceAll('\n', '').replaceAll('\\"', '"'))),
+    [html],
+  );
+
+  const panes = [];
+  if (data?.options) {
+    data.options.forEach((element, index) => {
+      panes.push({
+        menuItem: element.name,
+        render: () => (
+          <TabPane>
+            {!!data && (
+              <div
+                dangerouslySetInnerHTML={{ __html: data.values[index] }}
+              ></div>
+            )}
+          </TabPane>
+        ),
+      });
+    });
+  }
+
+  return (
+    <Tab
+      className="secondary mnu"
+      panes={panes}
+      grid={{ paneWidth: 8, tabWidth: 4 }}
+      menu={{
+        tabular: true,
+        vertical: true,
+        inverted: false,
+        pointing: true,
+        fluid: true,
+        className: 'secondary',
+        tabIndex: 0,
+      }}
+    />
+  );
+}

package/src/components/manage/Blocks/CountryProfileDetail/index.js

@@ -0,0 +1,25 @@
+import worldSVG from '@plone/volto/icons/world.svg';
+import Edit from './Edit';
+import View from './View';
+// import { blockAvailableInMission } from '@eeacms/volto-cca-policy/utils';
+
+export default function installCountryProfileDetailBlock(config) {
+  config.blocks.blocksConfig.countryProfileDetail = {
+    id: 'countryProfileDetail',
+    title: 'Country Profile Detail',
+    icon: worldSVG,
+    group: 'site',
+    edit: Edit,
+    view: View,
+    sidebarTab: 1,
+    security: {
+      addPermission: [],
+      view: [],
+    },
+    restricted: ({ properties, block }) => {
+      return false;
+    },
+  };
+
+  return config;
+}

package/src/components/manage/Blocks/RASTBlock/ContextNavigation.jsx

@@ -11,7 +11,7 @@ import { useLocation } from 'react-router-dom';
  * INavigationPortlet
  */
 export function ContextNavigationComponent(props) {
-  const { location, items } = props;
+  const { location, items, skip_items, show_subfolders } = props;
   let activeMenu = null;
 
   const curent_location = useLocation();
@@ -28,12 +28,14 @@ export function ContextNavigationComponent(props) {
     <>
       <RASTMap
         items={items}
+        skip_items={skip_items}
         pathname={location.pathname}
         activeMenu={activeMenu}
       />
       {items.length ? (
         <RASTAccordion
           items={items}
+          show_subfolders={show_subfolders}
           curent_location={curent_location}
           activeMenu={activeMenu}
         />

package/src/components/manage/Blocks/RASTBlock/RASTAccordion.jsx

@@ -4,7 +4,7 @@ import RASTAccordionContent from './RASTAccordionContent';
 import { useHistory } from 'react-router-dom';
 
 const RASTAccordion = (props) => {
-  const { items = {}, curent_location, activeMenu } = props;
+  const { items = {}, curent_location, activeMenu, show_subfolders } = props;
 
   const history = useHistory();
 
@@ -12,6 +12,7 @@ const RASTAccordion = (props) => {
     let itemUrl = '/' + item['@id'].split('/').slice(3).join('/');
     history.push(itemUrl);
   };
+
   return (
     <>
       {items.map((item, index) => {
@@ -35,23 +36,27 @@ const RASTAccordion = (props) => {
               }}
             >
               <span className="item-title">{item.title}</span>
-              {active ? (
-                <Icon className="ri-arrow-up-s-line" />
-              ) : (
-                <Icon className="ri-arrow-down-s-line" />
-              )}
+              {show_subfolders ? (
+                active ? (
+                  <Icon className="ri-arrow-up-s-line" />
+                ) : (
+                  <Icon className="ri-arrow-down-s-line" />
+                )
+              ) : null}
             </Accordion.Title>
-            <Accordion.Content active={active}>
-              <RASTAccordionContent
-                curent_location={curent_location}
-                key={index}
-                main={{
-                  title: item.title,
-                  href: item['@id'],
-                  url: item.url,
-                }}
-              />
-            </Accordion.Content>
+            {show_subfolders ? (
+              <Accordion.Content active={active}>
+                <RASTAccordionContent
+                  curent_location={curent_location}
+                  key={index}
+                  main={{
+                    title: item.title,
+                    href: item['@id'],
+                    url: item.url,
+                  }}
+                />
+              </Accordion.Content>
+            ) : null}
           </Accordion>
         );
       })}