@eeacms/volto-clms-theme 1.0.110 → 1.0.113

package/CHANGELOG.md

@@ -4,8 +4,41 @@ 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).
 
+#### [1.0.113](https://github.com/eea/volto-clms-theme/compare/1.0.112...1.0.113)
+
+- Area widget explanation [`#286`](https://github.com/eea/volto-clms-theme/pull/286)
+- UniversalLink override to download files in case user is not Manager [`dd206ae`](https://github.com/eea/volto-clms-theme/commit/dd206ae6040fe927d2895c00beeaf55e1fd0a6fe)
+- fix profile subscribe checkbox checking [`62facfa`](https://github.com/eea/volto-clms-theme/commit/62facfa2db2ba518f421eca0002c2774c080d1da)
+- some changes [`8b27aeb`](https://github.com/eea/volto-clms-theme/commit/8b27aeb01df2a04c4331ca5e4c83150957ff076c)
+- edit and add form dropdown overflow, override volto-block-style product css [`468ce5d`](https://github.com/eea/volto-clms-theme/commit/468ce5d51cffe86844fea63ac9640561d51a9dbd)
+- Rename Register to this meeting to simple Register [`563e0f8`](https://github.com/eea/volto-clms-theme/commit/563e0f8a46040decc68247c17f134573d5bfb4bf)
+
+#### [1.0.112](https://github.com/eea/volto-clms-theme/compare/1.0.111...1.0.112)
+
+> 3 August 2022
+
+- Develop [`#285`](https://github.com/eea/volto-clms-theme/pull/285)
+- import fields [`#284`](https://github.com/eea/volto-clms-theme/pull/284)
+- search filters checkbox unification [`0cd48bc`](https://github.com/eea/volto-clms-theme/commit/0cd48bc9a873ec1b3c4a082c4ec3519fbc3cef6d)
+- check also childless parents CLMS-987 [`641a887`](https://github.com/eea/volto-clms-theme/commit/641a887e9e36f0f2e04aa8eb5362065ed53380a3)
+- User profile form changes [`a7f7a63`](https://github.com/eea/volto-clms-theme/commit/a7f7a63a288f35037fc42a7af6761071c889e7ad)
+- added UniversalLink to relatedItems [`46cb0c5`](https://github.com/eea/volto-clms-theme/commit/46cb0c5e6abb6658d0ec8108ba1eb1cf136d5e2f)
+
+#### [1.0.111](https://github.com/eea/volto-clms-theme/compare/1.0.110...1.0.111)
+
+> 2 August 2022
+
+- Develop [`#283`](https://github.com/eea/volto-clms-theme/pull/283)
+- bump accordion block [`f64f037`](https://github.com/eea/volto-clms-theme/commit/f64f037cbcb1200f15d70590beaf4131f7bf464d)
+- Use Case view [`c60b74f`](https://github.com/eea/volto-clms-theme/commit/c60b74f110f98faff7d15a42167e45e410efeec1)
+- textWidget limit to 1000 characters and textAreaWidget show error with more than 8000 characters [`662f035`](https://github.com/eea/volto-clms-theme/commit/662f035fa9ecd7b61b7bb8aa17acb0ce89718df8)
+- relationship between Datasets Use Cases/News [`b1f1848`](https://github.com/eea/volto-clms-theme/commit/b1f184858685783b3ea408930b9e3b1884b381a8)
+
 #### [1.0.110](https://github.com/eea/volto-clms-theme/compare/1.0.109...1.0.110)
 
+> 28 July 2022
+
+- Develop [`#282`](https://github.com/eea/volto-clms-theme/pull/282)
 - Subscription header [`#281`](https://github.com/eea/volto-clms-theme/pull/281)
 - eea.meeting editor box condition [`1cb1361`](https://github.com/eea/volto-clms-theme/commit/1cb13611bee071293875e5425a4e63fa689ae640)
 - fix contents invalid time error [`87dc051`](https://github.com/eea/volto-clms-theme/commit/87dc051c8f8eb0278c0372685adf7a0e3ee2fc09)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-clms-theme",
-  "version": "1.0.110",
+  "version": "1.0.113",
   "description": "volto-clms-theme: Volto theme for CLMS site",
   "main": "src/index.js",
   "author": "CodeSyntax for the European Environment Agency",
@@ -34,7 +34,7 @@
   ],
   "dependencies": {
     "volto-cookie-banner": "2.1.0",
-    "@eeacms/volto-accordion-block": "3.4.13",
+    "@eeacms/volto-accordion-block": "3.5.0",
     "@eeacms/volto-arcgis-block": "*",
     "@eeacms/volto-clms-utils": "0.1.6",
     "@eeacms/volto-columns-block": "4.4.3",

package/src/actions/import_wms_fields/import_wms_fields.js

@@ -0,0 +1,20 @@
+/**
+ * Post meeting register actions.
+ * @module actions/postImportGeonetwork
+ */
+export const POST_IMPORT_WMS_FIELDS = 'POST_IMPORT_WMS_FIELDS';
+
+/**
+ * Post import geonetwork.
+ * @function postImportWMSFields
+ * @returns {Object} Get extra items action.
+ */
+export function postImportWMSFields(url, id, type) {
+  return {
+    type: POST_IMPORT_WMS_FIELDS,
+    request: {
+      op: 'post',
+      path: `${url}/@import-wms-fields`,
+    },
+  };
+}

package/src/actions/index.js

@@ -87,3 +87,8 @@ export {
   POST_IMPORT_WMS_LAYERS,
   postImportWMSLayers,
 } from './import_wms_layers/import_wms_layers';
+
+export {
+  POST_IMPORT_WMS_FIELDS,
+  postImportWMSFields,
+} from './import_wms_fields/import_wms_fields';

package/src/components/Blocks/CclHomeSearchBlock/CclHomeSearchBlockView.jsx

@@ -1,6 +1,5 @@
 import { defineMessages, useIntl } from 'react-intl';
 
-import { Link } from 'react-router-dom';
 import React from 'react';
 
 const messages = defineMessages({
@@ -14,20 +13,10 @@ const messages = defineMessages({
   },
 });
 
-function hasProtocol(url) {
-  if (url) {
-    return url.startsWith('https://') || url.startsWith('http://')
-      ? true
-      : false;
-  }
-  return false;
-}
-
 const CclHomeSearchBlockView = (props) => {
   const { data, searchText } = props;
   var SearchText = searchText || '';
   const intl = useIntl();
-  let url = data?.link?.[0]?.['@id'];
 
   function handleChange(event) {
     SearchText = event.target.value;
@@ -68,14 +57,6 @@ const CclHomeSearchBlockView = (props) => {
             </button>
           </form>
         </div>
-        <div className="home-datasets-text">
-          <span>{intl.formatMessage(messages.countText, { count: 999 })}</span>
-          {url && hasProtocol(url) ? (
-            <a href={url}>{data.linkText}</a>
-          ) : (
-            <Link to={url}>{data.linkText}</Link>
-          )}
-        </div>
       </div>
     </div>
   );

package/src/components/Blocks/CclHomeSearchBlock/HomeSearchSchema.js

@@ -4,7 +4,7 @@ export const HomeSearchSchema = () => ({
     {
       id: 'default',
       title: 'Default',
-      fields: ['title', 'linkText', 'link'],
+      fields: ['title'],
     },
   ],
   properties: {
@@ -12,19 +12,6 @@ export const HomeSearchSchema = () => ({
       title: 'Title',
       type: 'string',
     },
-    linkText: {
-      title: 'Link text',
-      description: 'Text for the link to the catalogue',
-      type: 'string',
-    },
-    link: {
-      title: 'Link',
-      description: 'Select site content or paste external url',
-      widget: 'object_browser',
-      mode: 'link',
-      selectedItemAttrs: ['Title', 'Description', '@type', '@id'],
-      allowExternals: true,
-    },
   },
   required: ['title'],
 });

package/src/components/Blocks/CustomTemplates/VoltoSearchBlock/AccordionFacet.jsx

@@ -1,4 +1,4 @@
-import { Checkbox } from 'semantic-ui-react';
+import { Checkbox, List } from 'semantic-ui-react';
 import React from 'react';
 import {
   selectFacetSchemaEnhancer,
@@ -47,38 +47,46 @@ const AccordionFacet = (props) => {
         <legend className="ccl-form-legend">{facet.title}</legend>
       </div>
       <Wrapper typeName={typeName}>
-        {choices.map((choice, i) => (
-          <div
-            className={
-              typeName === 'checkbox' ? 'ccl-form-group' : 'filters-tag'
-            }
-            key={choice.value}
-          >
-            <Checkbox
-              disabled={isEditMode}
-              label={choice.label}
-              radio={!isMulti}
-              checked={
-                isMulti
-                  ? !!facetValue?.find((f) => f.value === choice.value)
-                  : facetValue && facetValue.value === choice.value
-              }
-              onChange={(e, { checked }) =>
-                onChange(
-                  facet.field.value,
-                  isMulti
-                    ? [
-                        ...facetValue
-                          .filter((f) => f.value !== choice.value)
-                          .map((f) => f.value),
-                        ...(checked ? [choice.value] : []),
-                      ]
-                    : isChoiceValue(checked, choice.value),
-                )
-              }
-            />
-          </div>
-        ))}
+        <List>
+          {choices.map((choice, i) => (
+            <List.Item
+              key={choice.value}
+              style={{
+                paddingLeft: '15px',
+                paddingBottom: '15px',
+                paddingTop: '10px',
+              }}
+            >
+              <List.Content>
+                <List.Header>
+                  <Checkbox
+                    disabled={isEditMode}
+                    label={choice.label}
+                    radio={!isMulti}
+                    checked={
+                      isMulti
+                        ? !!facetValue?.find((f) => f.value === choice.value)
+                        : facetValue && facetValue.value === choice.value
+                    }
+                    onChange={(e, { checked }) =>
+                      onChange(
+                        facet.field.value,
+                        isMulti
+                          ? [
+                              ...facetValue
+                                .filter((f) => f.value !== choice.value)
+                                .map((f) => f.value),
+                              ...(checked ? [choice.value] : []),
+                            ]
+                          : isChoiceValue(checked, choice.value),
+                      )
+                    }
+                  />
+                </List.Header>
+              </List.Content>
+            </List.Item>
+          ))}
+        </List>
       </Wrapper>
     </fieldset>
   );

package/src/components/Blocks/CustomTemplates/VoltoSearchBlock/CheckboxTreeFacet.jsx

@@ -10,6 +10,7 @@ import {
   selectFacetStateToValue,
   selectFacetValueToQuery,
 } from '@plone/volto/components/manage/Blocks/Search/components/base';
+import { checkAllChildren } from './utils';
 
 const hasAllChildrensSelected = (value, childrens) => {
   var result = true;
@@ -24,20 +25,21 @@ const hasAllChildrensSelected = (value, childrens) => {
   return result;
 };
 
-const checkAllChildren = (value, childrens) => {
-  if (!childrens || childrens.length === 0) {
-    return value;
+const Wrapper = ({ typeName, children }) => {
+  if (typeName === 'checkbox') {
+    return <div className="ccl-form">{children}</div>;
+  } else if (typeName === 'label') {
+    return (
+      <div>
+        <div className="filters-tag-container">{children}</div>
+      </div>
+    );
   }
-  childrens.forEach((ch) => {
-    if (value.filter((v) => v.value === ch.value).length === 0) {
-      value.push(ch);
-    }
-  });
-  return value;
 };
 
 const CheckboxTreeFacet = (props) => {
-  const { facet, choices, onChange, value } = props;
+  const { facet, choices, onChange, value, typeName } = props;
+
   const facetValue = value;
   var [open, setOpen] = useState(false);
   let options = [];
@@ -56,7 +58,7 @@ const CheckboxTreeFacet = (props) => {
       >
         <legend className="ccl-form-legend">{facet.title}</legend>
       </div>
-      <div>
+      <Wrapper typeName={typeName}>
         <List>
           {options.map((option) => (
             <CheckboxListParent
@@ -68,7 +70,7 @@ const CheckboxTreeFacet = (props) => {
             />
           ))}
         </List>
-      </div>
+      </Wrapper>
     </fieldset>
   );
 };
@@ -88,9 +90,7 @@ const CheckboxListParent = ({ option, key, onChange, value, id }) => {
               checked
                 ? onChange(id, [
                     // if this option has children, check them all
-                    ...checkAllChildren(value, option.childrens).map(
-                      (f) => f.value,
-                    ),
+                    ...checkAllChildren(value, option).map((f) => f.value),
                   ])
                 : onChange(id, [
                     ...value

package/src/components/Blocks/CustomTemplates/VoltoSearchBlock/CheckboxTreeParentFacet.jsx

@@ -10,6 +10,7 @@ import {
   selectFacetStateToValue,
   selectFacetValueToQuery,
 } from '@plone/volto/components/manage/Blocks/Search/components/base';
+import { checkAllChildren } from './utils';
 
 const hasAllChildrensSelected = (value, childrens) => {
   var result = true;
@@ -24,20 +25,20 @@ const hasAllChildrensSelected = (value, childrens) => {
   return result;
 };
 
-const checkAllChildren = (value, childrens) => {
-  if (!childrens || childrens.length === 0) {
-    return value;
+const Wrapper = ({ typeName, children }) => {
+  if (typeName === 'checkbox') {
+    return <div className="ccl-form">{children}</div>;
+  } else if (typeName === 'label') {
+    return (
+      <div>
+        <div className="filters-tag-container">{children}</div>
+      </div>
+    );
   }
-  childrens.forEach((ch) => {
-    if (value.filter((v) => v.value === ch.value).length === 0) {
-      value.push(ch);
-    }
-  });
-  return value;
 };
 
 const CheckboxTreeParentFacet = (props) => {
-  const { facet, choices, onChange, value } = props;
+  const { facet, choices, onChange, value, typeName } = props;
   const facetValue = value;
   var [open, setOpen] = useState(false);
   let options = [];
@@ -56,7 +57,7 @@ const CheckboxTreeParentFacet = (props) => {
       >
         <legend className="ccl-form-legend">{facet.title}</legend>
       </div>
-      <div>
+      <Wrapper typeName={typeName}>
         <List>
           {options.map((option) => (
             <CheckboxListParent
@@ -68,7 +69,7 @@ const CheckboxTreeParentFacet = (props) => {
             />
           ))}
         </List>
-      </div>
+      </Wrapper>
     </fieldset>
   );
 };
@@ -85,12 +86,10 @@ const CheckboxListParent = ({ option, key, onChange, value, id }) => {
             key={option.value}
             name={`field-${option.value}`}
             onChange={(event, { checked }) => {
-              checked
+              return checked
                 ? onChange(id, [
                     // if this option has children, check them all
-                    ...checkAllChildren(value, option.childrens).map(
-                      (f) => f.value,
-                    ),
+                    ...checkAllChildren(value, option).map((f) => f.value),
                   ])
                 : onChange(id, [
                     ...value

package/src/components/Blocks/CustomTemplates/VoltoSearchBlock/utils.js

@@ -0,0 +1,11 @@
+export const checkAllChildren = (value, option) => {
+  if (!option?.childrens || option.childrens.length === 0) {
+    return [...value, { label: option.label, value: option.value }];
+  }
+  option.childrens.forEach((ch) => {
+    if (value.filter((v) => v.value === ch.value).length === 0) {
+      value.push(ch);
+    }
+  });
+  return value;
+};

package/src/components/Blocks/customBlocks.js

@@ -328,7 +328,7 @@ const customBlocks = (config) => ({
           {
             id: 'doubleRangeFacet',
             title: 'Double Range',
-            view: DoubleRangeFacet,
+            view: WithType(DoubleRangeFacet, 'range'),
             isDefault: false,
             schemaEnhancer: DoubleRangeFacet.schemaEnhancer,
             stateToValue: DoubleRangeFacet.stateToValue,
@@ -338,7 +338,7 @@ const customBlocks = (config) => ({
           {
             id: 'checkboxTreeFacet',
             title: 'Checkbox Tree',
-            view: CheckboxTreeFacet,
+            view: WithType(CheckboxTreeFacet, 'checkbox'),
             isDefault: false,
             schemaEnhancer: CheckboxTreeFacet.schemaEnhancer,
             stateToValue: CheckboxTreeFacet.stateToValue,
@@ -348,7 +348,7 @@ const customBlocks = (config) => ({
           {
             id: 'checkboxTreeParentFacet',
             title: 'Checkbox Tree Parents',
-            view: CheckboxTreeParentFacet,
+            view: WithType(CheckboxTreeParentFacet, 'checkbox'),
             isDefault: false,
             schemaEnhancer: CheckboxTreeParentFacet.schemaEnhancer,
             stateToValue: CheckboxTreeParentFacet.stateToValue,

package/src/components/CLMSDatasetDetailView/CLMSDatasetDetailView.jsx

@@ -6,10 +6,16 @@
 import {
   DataSetInfoContent,
   DownloadDataSetContent,
+  RelatedNews,
+  RelatedUseCases,
 } from '@eeacms/volto-clms-theme/components/CLMSDatasetDetailView';
 import { Modal, Segment } from 'semantic-ui-react';
 import { connect, useDispatch, useSelector } from 'react-redux';
-import { postImportGeonetwork, postImportWMSLayers } from '../../actions';
+import {
+  postImportGeonetwork,
+  postImportWMSLayers,
+  postImportWMSFields,
+} from '../../actions';
 
 import CclButton from '@eeacms/volto-clms-theme/components/CclButton/CclButton';
 import CclTabs from '@eeacms/volto-clms-theme/components/CclTab/CclTabs';
@@ -35,6 +41,7 @@ const CLMSDatasetDetailView = ({ content, token }) => {
     (state) => state.geonetwork_importation,
   );
   const wms_layers_importation = useSelector((state) => state.importWMSLayers);
+  const wms_fields_importation = useSelector((state) => state.importWMSFields);
   const user = useSelector((state) => state.users?.user);
   React.useEffect(() => {
     dispatch(getUser(token));
@@ -48,6 +55,10 @@ const CLMSDatasetDetailView = ({ content, token }) => {
     dispatch(postImportWMSLayers(location.pathname));
   }
 
+  function handleWMSFieldimport() {
+    dispatch(postImportWMSFields(location.pathname));
+  }
+
   const [open, setOpen] = React.useState({});
   const locale = useSelector((state) => state.intl.locale);
 
@@ -280,8 +291,104 @@ const CLMSDatasetDetailView = ({ content, token }) => {
         </Segment.Group>
       )}
 
+      {user?.roles && user.roles.includes('Manager') && (
+        <Segment.Group compact horizontal>
+          <Segment
+            padded={'very'}
+            color={'olive'}
+            key={'wms-fields-import'}
+            loading={wms_fields_importation?.loading}
+            circular
+          >
+            <Modal
+              onClose={() => {
+                setOpen({ ...open, 'wms-fields-import': false });
+              }}
+              onOpen={() => {
+                setOpen({ ...open, 'wms-fields-import': true });
+              }}
+              open={open['wms-fields-import']}
+              trigger={
+                <CclButton>
+                  <FormattedMessage
+                    id="Import WMS Fields"
+                    defaultMessage="Import WMS Fields"
+                  />
+                </CclButton>
+              }
+              className={'modal-clms'}
+            >
+              <div className={'modal-clms-background'}>
+                <div className={'modal-clms-container'}>
+                  <div className={'modal-close modal-clms-close'}>
+                    <span
+                      className="ccl-icon-close"
+                      aria-label="Close"
+                      onClick={() => {
+                        setOpen({ ...open, 'wms-fields-import': false });
+                      }}
+                      onKeyDown={() => {
+                        setOpen({ ...open, 'wms-fields-import': false });
+                      }}
+                      tabIndex="0"
+                      role="button"
+                    ></span>
+                  </div>
+                  <div className="modal-login-text">
+                    <h1>
+                      <FormattedMessage
+                        id="Import WMS Fields"
+                        defaultMessage="Import WMS Fields"
+                      />
+                    </h1>
+                    This action will import the WMS Fields from the view service
+                    defined in the dataset if this WMS service is Arcgis based
+                    <br />
+                    <br />
+                  </div>
+                  <CclButton
+                    onClick={() => {
+                      handleWMSFieldimport();
+                      setOpen({ ...open, 'wms-fields-import': false });
+                    }}
+                    mode="filled"
+                  >
+                    <FormattedMessage
+                      id="Import data"
+                      defaultMessage="Import data"
+                    />
+                  </CclButton>
+                </div>
+              </div>
+            </Modal>
+            {wms_fields_importation?.imported_wms_fields?.status && (
+              <p>
+                {wms_fields_importation?.loaded &&
+                  wms_fields_importation?.error === null && (
+                    <strong>
+                      {' '}
+                      {wms_fields_importation?.imported_wms_fields?.message}
+                    </strong>
+                  )}
+              </p>
+            )}
+            {wms_fields_importation?.imported_wms_fields?.status ===
+              'error' && (
+              <p>
+                <strong>
+                  {' '}
+                  {wms_fields_importation?.imported_wms_fields?.message}
+                </strong>
+              </p>
+            )}
+          </Segment>
+        </Segment.Group>
+      )}
+
       <CclTabs routing={true}>
         <div tabTitle="General Info">{DataSetInfoContent(content)}</div>
+        <div tabTitle="Use cases">{RelatedUseCases(content)}</div>
+        <div tabTitle="News">{RelatedNews(content)}</div>
         {content?.downloadable_dataset &&
           content?.downloadable_files?.items?.length > 0 && (
             <div tabTitle="Download">{DownloadDataSetContent(content)}</div>

package/src/components/CLMSDatasetDetailView/DataSetInfoContent.jsx

@@ -10,6 +10,7 @@ import React from 'react';
 import { StringToHTML } from '@eeacms/volto-clms-theme/components/CclUtils';
 import config from '@plone/volto/registry';
 import { searchContent } from '@plone/volto/actions';
+import { useLocation } from 'react-router-dom';
 
 const DataSetInfoContent = (props) => {
   const dispatch = useDispatch();
@@ -22,12 +23,13 @@ const DataSetInfoContent = (props) => {
     geonetwork_identifiers,
     citation,
   } = props;
+  const location = useLocation();
   const searchSubrequests = useSelector((state) => state.search.subrequests);
   let libraries = searchSubrequests?.[id]?.items || [];
   let librariesPending = searchSubrequests?.[id]?.loading;
   const user = useSelector((state) => state.users.user);
   React.useEffect(() => {
-    UID &&
+    if (location.hash === '#GeneralInfo' && UID) {
       dispatch(
         searchContent(
           '',
@@ -40,7 +42,8 @@ const DataSetInfoContent = (props) => {
           id,
         ),
       );
-  }, [id, UID, dispatch]);
+    }
+  }, [id, UID, dispatch, location]);
 
   const [activeIndex, setActiveIndex] = React.useState([99]);
 

package/src/components/CLMSDatasetDetailView/RelatedNews.jsx

@@ -0,0 +1,51 @@
+import { Loader } from 'semantic-ui-react';
+import { useDispatch, useSelector } from 'react-redux';
+
+import CclCard from '@eeacms/volto-clms-theme/components/CclCard/CclCard';
+import React from 'react';
+import { searchContent } from '@plone/volto/actions';
+import { useLocation } from 'react-router-dom';
+
+const RelatedNews = (props) => {
+  const dispatch = useDispatch();
+  const { UID, id } = props;
+  const searchSubrequests = useSelector((state) => state.search.subrequests);
+  let libraries = searchSubrequests?.[id]?.items || [];
+  let librariesPending = searchSubrequests?.[id]?.loading;
+  const location = useLocation();
+  React.useEffect(() => {
+    if (location.hash === '#News' && UID) {
+      dispatch(
+        searchContent(
+          '',
+          {
+            fullobjects: 1,
+            portal_type: 'News Item',
+            path: '/',
+            associated_datasets: UID,
+          },
+          id,
+        ),
+      );
+    }
+  }, [id, UID, dispatch, location]);
+
+  return (
+    <div>
+      {librariesPending && <Loader active inline="centered" />}
+      {libraries.length > 0 ? (
+        libraries.map((item, index) => (
+          <CclCard
+            key={index}
+            type={null}
+            card={{ Type: item['@type'], ...item }}
+          />
+        ))
+      ) : (
+        <p>There are no related items.</p>
+      )}
+    </div>
+  );
+};
+
+export default RelatedNews;