@eeacms/volto-cca-policy 0.1.81 → 0.1.82

package/CHANGELOG.md

@@ -4,11 +4,28 @@ 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.81](https://github.com/eea/volto-cca-policy/compare/0.1.80...0.1.81) - 21 February 2024
+### [0.1.82](https://github.com/eea/volto-cca-policy/compare/0.1.81...0.1.82) - 24 February 2024
+
+#### :house: Internal changes
+
+- style: Automated code fix [eea-jenkins - [`3107391`](https://github.com/eea/volto-cca-policy/commit/31073918d51bcd0adbe929cfea001671b892e04f)]
 
 #### :hammer_and_wrench: Others
 
-- Don't hide the section header [Tiberiu Ichim - [`f7d9ded`](https://github.com/eea/volto-cca-policy/commit/f7d9ded5932b8636d3f485e5184639f8d88f3d33)]
+- Code cleanup [Tiberiu Ichim - [`47a937c`](https://github.com/eea/volto-cca-policy/commit/47a937c76eeb4d31cf69bdfc84986b4a7b5a53fb)]
+- Use a json file [Tiberiu Ichim - [`cd5307e`](https://github.com/eea/volto-cca-policy/commit/cd5307e14b72e27582e323fa5bd7355e246c886e)]
+- Eslint [Tiberiu Ichim - [`9a79b88`](https://github.com/eea/volto-cca-policy/commit/9a79b882251c83c523c5ac3cfc4d74bed10f2727)]
+- Eslint [Tiberiu Ichim - [`367d0b6`](https://github.com/eea/volto-cca-policy/commit/367d0b632f09e2d7d47289e777019d3257982c0d)]
+- Show tags in news item [Tiberiu Ichim - [`4660adc`](https://github.com/eea/volto-cca-policy/commit/4660adc38a9cc7d0f34db021918e6148f1aef367)]
+- Add newsitem view [Tiberiu Ichim - [`ce83fec`](https://github.com/eea/volto-cca-policy/commit/ce83feca8dc01df52cb410c0a1da748663f75271)]
+- Show blocks in CCAEventView [Tiberiu Ichim - [`89e0e78`](https://github.com/eea/volto-cca-policy/commit/89e0e7864a9a490812bc2599ac0a5c8bca3668b4)]
+- Add event view view [Tiberiu Ichim - [`a4dfcd7`](https://github.com/eea/volto-cca-policy/commit/a4dfcd7b4d560db839eb7d6b116584e82d2bb706)]
+- Fix hit enter in layout settings block [Tiberiu Ichim - [`5774d3e`](https://github.com/eea/volto-cca-policy/commit/5774d3e1d6332b8661aa1a78a9b300820b2d4f1c)]
+- test: increase coverage [kreafox - [`334a6a3`](https://github.com/eea/volto-cca-policy/commit/334a6a374d6af8e4856c1be5bcee073a619c88af)]
+- test: fix ES lint warnings [kreafox - [`e884310`](https://github.com/eea/volto-cca-policy/commit/e88431084ddaa6298541ac2a9edefcc45b26ea0e)]
+- Add details [Tiberiu Ichim - [`ad521be`](https://github.com/eea/volto-cca-policy/commit/ad521bed6f11d4fdf8590eac5dc9f5352d05dd27)]
+### [0.1.81](https://github.com/eea/volto-cca-policy/compare/0.1.80...0.1.81) - 21 February 2024
+
 ### [0.1.80](https://github.com/eea/volto-cca-policy/compare/0.1.79...0.1.80) - 21 February 2024
 
 #### :bug: Bug Fixes
@@ -381,13 +398,10 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - Refs #260715 rast-block wip [Tripon Eugen - [`f19d54e`](https://github.com/eea/volto-cca-policy/commit/f19d54e0b9a6a86bf344eb85b6a1cda7f3de91bf)]
 - Refs #260715 rast-block wip [Tripon Eugen - [`2828537`](https://github.com/eea/volto-cca-policy/commit/2828537b6c084cd1a82162d552fb4ef025b71f9f)]
 - Refs #260715 rast-block updates [Tripon Eugen - [`1e803e5`](https://github.com/eea/volto-cca-policy/commit/1e803e5bd3d3fb7558f261c76c68866be7beb8b5)]
-- test: [JENKINS] Use java17 for sonarqube scanner [valentinab25 - [`0a15e1b`](https://github.com/eea/volto-cca-policy/commit/0a15e1b2ad081233685e80d5b3c60a8663f6b896)]
-- test: [JENKINS] Run cypress in started frontend container [valentinab25 - [`9554e44`](https://github.com/eea/volto-cca-policy/commit/9554e44c92a621a52b2adb5a4830fb084ee5734b)]
 ### [0.1.49](https://github.com/eea/volto-cca-policy/compare/0.1.48...0.1.49) - 15 November 2023
 
 #### :house: Internal changes
 
-- chore: [JENKINS] Refactor automated testing [valentinab25 - [`7b820a6`](https://github.com/eea/volto-cca-policy/commit/7b820a6369c2ddd5203b1a4abe352cb4bb43db7a)]
 - chore: husky, lint-staged use fixed versions [valentinab25 - [`f0a8061`](https://github.com/eea/volto-cca-policy/commit/f0a8061c275c236deb00087c23fac9860a073106)]
 
 #### :hammer_and_wrench: Others
@@ -404,9 +418,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - Refs #259267 - jenkins test [Tripon Eugen - [`cacd31e`](https://github.com/eea/volto-cca-policy/commit/cacd31e7b1afe0983674ed5c7632d2e1d7fa752e)]
 - Refs #259267 - jenkins [Tripon Eugen - [`5b3affe`](https://github.com/eea/volto-cca-policy/commit/5b3affee8401239de10097884c1b7f2349d15ec0)]
 - Refs #259267 - add When, lead image and title to files [Tripon Eugen - [`2cedb23`](https://github.com/eea/volto-cca-policy/commit/2cedb237f898af9057e13fba94b615ef71077204)]
-- test: [JENKINS] Add cpu limit on cypress docker [valentinab25 - [`4d607a5`](https://github.com/eea/volto-cca-policy/commit/4d607a576e9d0a5c34e48c41b409e7df616ee3d6)]
-- test: [JENKINS] Increase shm-size to cypress docker [valentinab25 - [`b7f74d5`](https://github.com/eea/volto-cca-policy/commit/b7f74d53513a6edbfbca5cb6d19687929bb1e5db)]
-- test: [JENKINS] Improve cypress time [valentinab25 - [`db65617`](https://github.com/eea/volto-cca-policy/commit/db656173391f65157098d95d388c25f6429753d8)]
 - Refs #259267 - cca event blocks attachments and check not mandatoty fields [Tripon Eugen - [`3138e5a`](https://github.com/eea/volto-cca-policy/commit/3138e5afb5bfbdbed14e27ed457b16867b7fa414)]
 - Refs #256681 - Fix error in CCA Event view menu. ([React Intl] An id must be provided to format a message.) [GhitaB - [`517eeb8`](https://github.com/eea/volto-cca-policy/commit/517eeb817264a47bbfd6b9b7d22aaf22d44ed224)]
 - Refs #161485 - Fix ECDE name conflict. [GhitaB - [`8bfd99f`](https://github.com/eea/volto-cca-policy/commit/8bfd99ff68bb82a04d1c0ed625fa514fcf46289e)]
@@ -623,7 +634,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
 #### :house: Internal changes
 
-- chore: [JENKINS] Remove alpha testing version [valentinab25 - [`ad1ced0`](https://github.com/eea/volto-cca-policy/commit/ad1ced0971ba116c13a3b5fcc039172cc915c919)]
 
 #### :hammer_and_wrench: Others
 
@@ -1104,7 +1114,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 #### :hammer_and_wrench: Others
 
 - Refs #158294 - Update supported languages list. [GhitaB - [`0a4f91f`](https://github.com/eea/volto-cca-policy/commit/0a4f91f39b7edc367bd4c127d6a8f273c7788361)]
-- Add Sonarqube tag using cca-frontend addons list [EEA Jenkins - [`8f1f9ce`](https://github.com/eea/volto-cca-policy/commit/8f1f9ce6c22805670cc0800d3c779b6d619d0f31)]
 ### [0.1.1](https://github.com/eea/volto-cca-policy/compare/0.1.0...0.1.1) - 13 December 2022
 
 #### :hammer_and_wrench: Others

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-cca-policy",
-  "version": "0.1.81",
+  "version": "0.1.82",
   "description": "@eeacms/volto-cca-policy: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

package/src/components/manage/Blocks/TransRegionSelect/TransRegionSelectView.jsx

@@ -1,10 +1,9 @@
 import React from 'react';
-import { compose } from 'redux';
 import { Link } from 'react-router-dom';
 import { Dropdown } from 'semantic-ui-react';
-import { connect, useDispatch, useSelector } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
 import { getQueryStringResults } from '@plone/volto/actions';
-import { regionCountries } from './countries';
+import regionCountries from './countries.json';
 
 const getSiblings = (items) => {
   const regionsDropdown = (items || []).map((item) => {
@@ -24,8 +23,9 @@ const getSiblings = (items) => {
   return regionsDropdown;
 };
 
-const TransRegionSelectView = (props) => {
-  const { id, data, content } = props;
+export default function TransRegionSelectView(props) {
+  const { id, data } = props;
+  const content = useSelector((state) => state.content.data);
   const { title } = content;
   const dispatch = useDispatch();
   const querystringResults = useSelector(
@@ -86,7 +86,7 @@ const TransRegionSelectView = (props) => {
         title === 'Other regions' ? null : (
           <h5>Region's countries:</h5>
         )}
-        {regionCountries
+        {regionCountries.countries
           .filter((item) => item.region === title)
           .map((item, i) => (
             <div className="countries-listing" key={i}>
@@ -115,10 +115,4 @@ const TransRegionSelectView = (props) => {
       </div>
     </div>
   );
-};
-
-export default compose(
-  connect((state, props) => ({
-    content: state.content.data,
-  })),
-)(TransRegionSelectView);
+}

package/src/components/manage/Blocks/TransRegionSelect/countries.json

@@ -0,0 +1,150 @@
+{
+  "countries": [
+    {
+      "region": "Adriatic-Ionian Area",
+      "countries": [
+        ["Croatia", "/countries/croatia"],
+        ["Greece", "/countries/greece"],
+        ["Italy", "/countries/italy"],
+        ["Slovenia", "/countries/slovenia"],
+        ["Albania", ""],
+        ["Bosnia and Herzegovina", ""],
+        ["Montenegro", ""],
+        ["Republic of North Macedonia", ""],
+        ["Serbia", ""]
+      ]
+    },
+    {
+      "region": "Alpine Space",
+      "countries": [
+        ["Austria", "/countries/austria"],
+        ["France", "/countries/france"],
+        ["Germany", "/countries/germany"],
+        ["Italy", "/countries/italy"],
+        ["Slovenia", "/countries/slovenia"],
+        ["Liechtenstein", ""],
+        ["Switzerland", "/countries/switzerland"]
+      ]
+    },
+    {
+      "region": "Northern Periphery and Arctic",
+      "countries": [
+        ["Finland", "/countries/finland"],
+        ["Ireland", "/countries/ireland"],
+        ["Sweden", "/countries/sweden"],
+        ["Iceland", "/countries/iceland"],
+        ["Norway", "/countries/norway"],
+        ["Greenland", ""],
+        ["Faroe Islands", ""]
+      ]
+    },
+    {
+      "region": "Atlantic Area",
+      "countries": [
+        ["France", "/countries/france"],
+        ["Ireland", "/countries/ireland"],
+        ["Portugal", "/countries/portugal"],
+        ["Spain", "/countries/spain"]
+      ]
+    },
+    {
+      "region": "Baltic Sea",
+      "countries": [
+        ["Denmark", "/countries/denmark"],
+        ["Estonia", "/countries/estonia"],
+        ["Finland", "/countries/finland"],
+        ["Germany", "/countries/germany"],
+        ["Latvia", "/countries/latvia"],
+        ["Lithuania", "/countries/lithuania"],
+        ["Poland", "/countries/poland"],
+        ["Sweden", "/countries/sweden"],
+        ["Norway", "/countries/norway"]
+      ]
+    },
+    {
+      "region": "Central Europe",
+      "countries": [
+        ["Austria", "/countries/austria"],
+        ["Croatia", "/countries/croatia"],
+        ["Czechia", "/countries/czech-republic"],
+        ["Germany", "/countries/germany"],
+        ["Hungary", "/countries/hungary"],
+        ["Italy", "/countries/italy"],
+        ["Poland", "/countries/poland"],
+        ["Slovakia", "/countries/slovakia"],
+        ["Slovenia", "/countries/slovenia"]
+      ]
+    },
+    {
+      "region": "Danube Area",
+      "countries": [
+        ["Austria", "/countries/austria"],
+        ["Bulgaria", "/countries/bulgaria"],
+        ["Croatia", "/countries/croatia"],
+        ["Czechia", "/countries/czech-republic"],
+        ["Germany", "/countries/germany"],
+        ["Hungary", "/countries/hungary"],
+        ["Romania", "/countries/romania"],
+        ["Slovakia", "/countries/slovakia"],
+        ["Slovenia", "/countries/slovenia"],
+        ["Bosnia and Herzegovina, ", ""],
+        ["Montenegro", ""],
+        ["Serbia", ""],
+        ["Ukraine", ""],
+        ["Republic of Moldova", ""]
+      ]
+    },
+    {
+      "region": "Mediterranean Area",
+      "countries": [
+        ["Albania", ""],
+        ["Bosnia and Herzegovina", ""],
+        ["Bulgaria", "/countries/bulgaria"],
+        ["Croatia", "/countries/croatia"],
+        ["Cyprus", "/countries/cyprus"],
+        ["France", "/countries/france"],
+        ["Greece", "/countries/greece"],
+        ["Italy", "/countries/italy"],
+        ["Malta", "/countries/malta"],
+        ["Montenegro", ""],
+        ["Portugal", "/countries/portugal"],
+        ["Republic of North Macedonia", ""],
+        ["Slovenia", "/countries/slovenia"],
+        ["Spain", "/countries/spain"]
+      ]
+    },
+    {
+      "region": "North Sea Region",
+      "countries": [
+        ["Belgium", "/countries/belgium"],
+        ["Denmark", "/countries/denmark"],
+        ["Germany", "/countries/germany"],
+        ["France", "/countries/france"],
+        ["Netherlands", "/countries/netherlands"],
+        ["Sweden", "/countries/sweden"],
+        ["Norway", "/countries/norway"]
+      ]
+    },
+    {
+      "region": "North-West Europe",
+      "countries": [
+        ["Belgium", "/countries/belgium"],
+        ["France", "/countries/france"],
+        ["Germany", "/countries/germany"],
+        ["Ireland", "/countries/ireland"],
+        ["Luxembourg", "/countries/luxembourg"],
+        ["Netherlands", "/countries/netherlands"],
+        ["Switzerland", "/countries/switzerland"]
+      ]
+    },
+    {
+      "region": "South-West Europe",
+      "countries": [
+        ["France", "/countries/france"],
+        ["Portugal", "/countries/portugal"],
+        ["Spain", "/countries/spain"],
+        ["Andorra", ""]
+      ]
+    }
+  ]
+}

package/src/components/manage/Widgets/CreatableSelectWidget.jsx

@@ -0,0 +1,316 @@
+/**
+ * CreatableSelectWidget component.
+ * @module components/manage/Widgets/SelectWidget
+ *
+ * A copy of the SelectWidget component. The only difference is that is uses the Creatable component as a base
+ */
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+import { map } from 'lodash';
+import { defineMessages, injectIntl } from 'react-intl';
+import {
+  getVocabFromHint,
+  getVocabFromField,
+  getVocabFromItems,
+} from '@plone/volto/helpers';
+import { FormFieldWrapper } from '@plone/volto/components';
+import { getVocabulary, getVocabularyTokenTitle } from '@plone/volto/actions';
+import { normalizeValue } from '@plone/volto/components/manage/Widgets/SelectUtils';
+
+import {
+  customSelectStyles,
+  DropdownIndicator,
+  ClearIndicator,
+  Option,
+  selectTheme,
+  MenuList,
+  MultiValueContainer,
+} from '@plone/volto/components/manage/Widgets/SelectStyling';
+import { injectLazyLibs } from '@plone/volto/helpers/Loadable/Loadable';
+
+import loadable from '@loadable/component';
+
+export const Creatable = loadable(() => import('react-select/creatable'));
+
+const messages = defineMessages({
+  default: {
+    id: 'Default',
+    defaultMessage: 'Default',
+  },
+  idTitle: {
+    id: 'Short Name',
+    defaultMessage: 'Short Name',
+  },
+  idDescription: {
+    id: 'Used for programmatic access to the fieldset.',
+    defaultMessage: 'Used for programmatic access to the fieldset.',
+  },
+  title: {
+    id: 'Title',
+    defaultMessage: 'Title',
+  },
+  description: {
+    id: 'Description',
+    defaultMessage: 'Description',
+  },
+  close: {
+    id: 'Close',
+    defaultMessage: 'Close',
+  },
+  choices: {
+    id: 'Choices',
+    defaultMessage: 'Choices',
+  },
+  required: {
+    id: 'Required',
+    defaultMessage: 'Required',
+  },
+  select: {
+    id: 'Select…',
+    defaultMessage: 'Select…',
+  },
+  no_value: {
+    id: 'No value',
+    defaultMessage: 'No value',
+  },
+  no_options: {
+    id: 'No options',
+    defaultMessage: 'No options',
+  },
+});
+
+/**
+ * SelectWidget component class.
+ * @function SelectWidget
+ * @returns {string} Markup of the component.
+ */
+class SelectWidget extends Component {
+  /**
+   * Property types.
+   * @property {Object} propTypes Property types.
+   * @static
+   */
+  static propTypes = {
+    id: PropTypes.string.isRequired,
+    title: PropTypes.string.isRequired,
+    description: PropTypes.string,
+    required: PropTypes.bool,
+    error: PropTypes.arrayOf(PropTypes.string),
+    getVocabulary: PropTypes.func.isRequired,
+    getVocabularyTokenTitle: PropTypes.func.isRequired,
+    choices: PropTypes.arrayOf(
+      PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
+    ),
+    items: PropTypes.shape({
+      vocabulary: PropTypes.object,
+    }),
+    widgetOptions: PropTypes.shape({
+      vocabulary: PropTypes.object,
+    }),
+    value: PropTypes.oneOfType([
+      PropTypes.object,
+      PropTypes.string,
+      PropTypes.bool,
+      PropTypes.func,
+      PropTypes.array,
+    ]),
+    onChange: PropTypes.func.isRequired,
+    onBlur: PropTypes.func,
+    onClick: PropTypes.func,
+    onEdit: PropTypes.func,
+    onDelete: PropTypes.func,
+    wrapped: PropTypes.bool,
+    noValueOption: PropTypes.bool,
+    customOptionStyling: PropTypes.any,
+    isMulti: PropTypes.bool,
+    placeholder: PropTypes.string,
+  };
+
+  /**
+   * Default properties
+   * @property {Object} defaultProps Default properties.
+   * @static
+   */
+  static defaultProps = {
+    description: null,
+    required: false,
+    items: {
+      vocabulary: null,
+    },
+    widgetOptions: {
+      vocabulary: null,
+    },
+    error: [],
+    choices: [],
+    value: null,
+    onChange: () => {},
+    onBlur: () => {},
+    onClick: () => {},
+    onEdit: null,
+    onDelete: null,
+    noValueOption: true,
+    customOptionStyling: null,
+  };
+
+  /**
+   * Component did mount
+   * @method componentDidMount
+   * @returns {undefined}
+   */
+  componentDidMount() {
+    if (
+      (!this.props.choices || this.props.choices?.length === 0) &&
+      this.props.vocabBaseUrl
+    ) {
+      this.props.getVocabulary({
+        vocabNameOrURL: this.props.vocabBaseUrl,
+        size: -1,
+        subrequest: this.props.lang,
+      });
+    }
+  }
+
+  componentDidUpdate(prevProps) {
+    if (
+      this.props.vocabBaseUrl !== prevProps.vocabBaseUrl &&
+      (!this.props.choices || this.props.choices?.length === 0)
+    ) {
+      this.props.getVocabulary({
+        vocabNameOrURL: this.props.vocabBaseUrl,
+        size: -1,
+        subrequest: this.props.lang,
+      });
+    }
+  }
+
+  /**
+   * Render method.
+   * @method render
+   * @returns {string} Markup for the component.
+   */
+  render() {
+    const { id, choices, value, intl, onChange } = this.props;
+    const normalizedValue = normalizeValue(choices, value, intl);
+    // Make sure that both disabled and isDisabled (from the DX layout feat work)
+    const disabled = this.props.disabled || this.props.isDisabled;
+
+    let options = this.props.vocabBaseUrl
+      ? this.props.choices
+      : [
+          ...map(choices, (option) => ({
+            value: option[0],
+            label:
+              // Fix "None" on the serializer, to remove when fixed in p.restapi
+              option[1] !== 'None' && option[1] ? option[1] : option[0],
+          })),
+          // Only set "no-value" option if there's no default in the field
+          // TODO: also if this.props.defaultValue?
+          ...(this.props.noValueOption &&
+          (this.props.default === undefined || this.props.default === null)
+            ? [
+                {
+                  label: this.props.intl.formatMessage(messages.no_value),
+                  value: 'no-value',
+                },
+              ]
+            : []),
+        ];
+
+    const isMulti = this.props.isMulti
+      ? this.props.isMulti
+      : id === 'roles' || id === 'groups' || this.props.type === 'array';
+
+    return (
+      <FormFieldWrapper {...this.props}>
+        <Creatable
+          id={`field-${id}`}
+          key={choices}
+          name={id}
+          menuShouldScrollIntoView={false}
+          isDisabled={disabled}
+          isSearchable={true}
+          className="react-select-container"
+          classNamePrefix="react-select"
+          isMulti={isMulti}
+          options={options}
+          styles={customSelectStyles}
+          theme={selectTheme}
+          components={{
+            ...(options?.length > 25 && {
+              MenuList,
+            }),
+            MultiValueContainer,
+            DropdownIndicator,
+            ClearIndicator,
+            Option: this.props.customOptionStyling || Option,
+          }}
+          value={normalizedValue}
+          placeholder={
+            this.props.placeholder ??
+            this.props.intl.formatMessage(messages.select)
+          }
+          onChange={(selectedOption) => {
+            if (isMulti) {
+              return onChange(
+                id,
+                selectedOption.map((el) => el.value),
+              );
+            }
+            return onChange(
+              id,
+              selectedOption && selectedOption.value !== 'no-value'
+                ? selectedOption.value
+                : undefined,
+            );
+          }}
+          isClearable
+        />
+      </FormFieldWrapper>
+    );
+  }
+}
+
+export const SelectWidgetComponent = injectIntl(SelectWidget);
+
+export default compose(
+  injectLazyLibs(['reactSelect']),
+  connect(
+    (state, props) => {
+      const vocabBaseUrl = !props.choices
+        ? getVocabFromHint(props) ||
+          getVocabFromField(props) ||
+          getVocabFromItems(props)
+        : '';
+
+      const vocabState =
+        state.vocabularies?.[vocabBaseUrl]?.subrequests?.[state.intl.locale];
+
+      // If the schema already has the choices in it, then do not try to get the vocab,
+      // even if there is one
+      if (props.choices) {
+        return {
+          choices: props.choices,
+          lang: state.intl.locale,
+        };
+      } else if (vocabState) {
+        return {
+          vocabBaseUrl,
+          choices: vocabState?.items ?? [],
+          lang: state.intl.locale,
+        };
+        // There is a moment that vocabState is not there yet, so we need to pass the
+        // vocabBaseUrl to the component.
+      } else if (vocabBaseUrl) {
+        return {
+          vocabBaseUrl,
+          lang: state.intl.locale,
+        };
+      }
+      return { lang: state.intl.locale };
+    },
+    { getVocabulary, getVocabularyTokenTitle },
+  ),
+)(SelectWidgetComponent);

package/src/components/manage/Widgets/CreatableSelectWidget.test.jsx

@@ -0,0 +1,89 @@
+import React from 'react';
+import configureStore from 'redux-mock-store';
+import { Provider } from 'react-intl-redux';
+import { waitFor, render, screen, fireEvent } from '@testing-library/react';
+
+import CreatableSelectWidget from './CreatableSelectWidget';
+
+const mockStore = configureStore();
+
+jest.mock('@plone/volto/helpers/Loadable/Loadable');
+beforeAll(
+  async () =>
+    await require('@plone/volto/helpers/Loadable/Loadable').__setLoadables(),
+);
+
+test('renders a select widget component', async () => {
+  const store = mockStore({
+    intl: {
+      locale: 'en',
+      messages: {},
+    },
+    vocabularies: {
+      'plone.app.vocabularies.Keywords': {
+        items: [{ title: 'My item', value: 'myitem' }],
+        itemsTotal: 1,
+      },
+    },
+  });
+
+  const { container } = render(
+    <Provider store={store}>
+      <CreatableSelectWidget
+        id="my-field"
+        title="My field"
+        fieldSet="default"
+        onChange={() => {}}
+        onBlur={() => {}}
+        onClick={() => {}}
+      />
+    </Provider>,
+  );
+
+  await waitFor(() => screen.getByText('My field'));
+  expect(container).toMatchSnapshot();
+});
+
+test("No 'No value' option when default value is 0", async () => {
+  const store = mockStore({
+    intl: {
+      locale: 'en',
+      messages: {},
+    },
+  });
+
+  const choices = [
+    ['0', 'None'],
+    ['1', 'One'],
+  ];
+
+  const value = {
+    value: '0',
+    label: 'None',
+  };
+
+  const _default = 0;
+
+  const { container } = render(
+    <Provider store={store}>
+      <CreatableSelectWidget
+        id="my-field"
+        title="My field"
+        fieldSet="default"
+        choices={choices}
+        default={_default}
+        value={value}
+        onChange={() => {}}
+        onBlur={() => {}}
+        onClick={() => {}}
+      />
+    </Provider>,
+  );
+
+  await waitFor(() => screen.getByText('None'));
+  fireEvent.mouseDown(
+    container.querySelector('.react-select__dropdown-indicator'),
+    { button: 0 },
+  );
+  expect(container).toMatchSnapshot();
+});

package/src/components/theme/Views/CcaEventView.jsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { DocumentsList, HTMLField } from '@eeacms/volto-cca-policy/helpers';
 import { When } from '@plone/volto/components/theme/View/EventDatesInfo';
 import { Grid } from 'semantic-ui-react';
+import RenderBlocks from '@plone/volto/components/theme/View/RenderBlocks';
 import config from '@plone/volto/registry';
 
 function CcaEventView(props) {
@@ -57,6 +58,8 @@ function CcaEventView(props) {
                 </>
               )}
               <HTMLField value={content.text} className="long_description" />
+              <RenderBlocks {...props} />
+
               <h2>Agenda and supporting documents</h2>
               <HTMLField value={content.agenda} className="long_description" />
               {content?.agenda_file && <DocumentsList content={agenda_files} />}

package/src/components/theme/Views/EventView.jsx

@@ -0,0 +1,77 @@
+import React from 'react';
+import { HTMLField } from '@eeacms/volto-cca-policy/helpers';
+import RenderBlocks from '@plone/volto/components/theme/View/RenderBlocks';
+import { When } from '@plone/volto/components/theme/View/EventDatesInfo';
+import { Grid } from 'semantic-ui-react';
+import config from '@plone/volto/registry';
+
+function CcaEventView(props) {
+  const {
+    blocks: { blocksConfig },
+  } = config;
+  const TitleBlockView = blocksConfig?.title?.view;
+  const { content } = props;
+  // cca_files: [content.agenda_file]}
+
+  return (
+    <div className="cca-event-view">
+      {content?.image !== null && (
+        <TitleBlockView
+          {...props}
+          data={{ info: [{ description: '' }] }}
+          metadata={content}
+        />
+      )}
+      <div className="ui container">
+        <Grid columns="12">
+          <div className="row">
+            <Grid.Column
+              mobile={12}
+              tablet={12}
+              computer={9}
+              className="col-left"
+            >
+              {content?.image === null && (
+                <>
+                  <div className="ui label">Climate adapt event</div>
+                  <h1>{content.title}</h1>
+                </>
+              )}
+              <p>{content.description}</p>
+              <HTMLField value={content.text} className="long_description" />
+              <RenderBlocks {...props} />
+            </Grid.Column>
+            <Grid.Column
+              mobile={12}
+              tablet={12}
+              computer={3}
+              className="col-right"
+            >
+              <h3>When</h3>
+              <When
+                start={content.start}
+                end={content.end}
+                whole_day={content.whole_day}
+                open_end={content.open_end}
+              />
+              {content?.location !== null && (
+                <>
+                  <h3>Where</h3>
+                  <p>{content.location}</p>
+                </>
+              )}
+              {!!content.contact_email && (
+                <>
+                  <h3>Info</h3>
+                  <p>{content.contact_email}</p>
+                </>
+              )}
+            </Grid.Column>
+          </div>
+        </Grid>
+      </div>
+    </div>
+  );
+}
+
+export default CcaEventView;

package/src/components/theme/Views/NewsItemView.jsx

@@ -0,0 +1,54 @@
+// import { When } from '@plone/volto/components/theme/View/EventDatesInfo';
+import React from 'react';
+import { HTMLField } from '@eeacms/volto-cca-policy/helpers';
+import RenderBlocks from '@plone/volto/components/theme/View/RenderBlocks';
+import config from '@plone/volto/registry';
+import { Label } from 'semantic-ui-react';
+
+// const Date = (props) => {
+//   const date = props.content?.effective;
+//   return date ? (
+//     <>
+//       <When start={date} end={date} whole_day={true} open_end={false} />
+//     </>
+//   ) : null;
+// };
+
+const SubjectTags = (props) => {
+  const tags = props.content?.subjects;
+  return tags?.length > 0 ? (
+    <>
+      Filed under:{' '}
+      {tags.map((tag) => (
+        <Label key={tag}>{tag}</Label>
+      ))}
+    </>
+  ) : null;
+};
+
+function CcaEventView(props) {
+  const {
+    blocks: { blocksConfig },
+  } = config;
+  const TitleBlockView = blocksConfig?.title?.view;
+  const { content } = props;
+
+  return (
+    <div className="cca-newsitem-view">
+      <TitleBlockView
+        {...props}
+        data={{ info: [{ description: '' }] }}
+        metadata={content}
+      />
+      <div className="ui container">
+        <p>{content.description}</p>
+        <HTMLField value={content.text} className="long_description" />
+        <RenderBlocks {...props} />
+        {/* <Date {...props} /> */}
+        <SubjectTags {...props} />
+      </div>
+    </div>
+  );
+}
+
+export default CcaEventView;

package/src/index.js

@@ -5,6 +5,8 @@ import { Sitemap } from '@plone/volto/components';
 import AdaptationOptionView from './components/theme/Views/AdaptationOptionView';
 import CaseStudyView from './components/theme/Views/CaseStudyView';
 import CcaEventView from './components/theme/Views/CcaEventView';
+import NewsItemView from './components/theme/Views/NewsItemView';
+import EventView from './components/theme/Views/EventView';
 import GuidanceView from './components/theme/Views/GuidanceView';
 import IndicatorView from './components/theme/Views/IndicatorView';
 import InformationPortalView from './components/theme/Views/InformationPortalView';
@@ -30,6 +32,7 @@ import GeolocationWidget from './components/theme/Widgets/GeolocationWidget';
 import MigrationButtons from './components/MigrationButtons';
 
 import { blockAvailableInMission } from '@eeacms/volto-cca-policy/utils';
+import CreatableSelectWidget from './components/manage/Widgets/CreatableSelectWidget';
 
 const getEnv = () => (typeof window !== 'undefined' ? window.env : process.env);
 
@@ -190,6 +193,10 @@ const applyConfig = (config) => {
     config.blocks.blocksConfig.maps.restricted = false;
   }
 
+  if (config.blocks.blocksConfig.layoutSettings) {
+    config.blocks.blocksConfig.layoutSettings.blockHasOwnFocusManagement = false;
+  }
+
   // Enable video
   if (config.blocks.blocksConfig.video) {
     config.blocks.blocksConfig.video.restricted = false;
@@ -241,6 +248,7 @@ const applyConfig = (config) => {
     'eea.climateadapt.adaptationoption': AdaptationOptionView,
     'eea.climateadapt.casestudy': CaseStudyView,
     'cca-event': CcaEventView,
+    Event: EventView,
     'eea.climateadapt.guidancedocument': GuidanceView,
     'eea.climateadapt.indicator': IndicatorView,
     'eea.climateadapt.informationportal': InformationPortalView,
@@ -250,6 +258,7 @@ const applyConfig = (config) => {
     'eea.climateadapt.tool': ToolView,
     'eea.climateadapt.video': VideoView,
     'eea.climateadapt.c3sindicator': C3SIndicatorView,
+    'News Item': NewsItemView,
   };
 
   config.views.layoutViewsNamesMapping.view_cca_event = 'CCA Event View';
@@ -437,6 +446,12 @@ const applyConfig = (config) => {
   // Custom widgets
   config.widgets.id.geochars = GeocharsWidget;
   config.widgets.id.geolocation = GeolocationWidget;
+  config.widgets.widget.creatableselect = CreatableSelectWidget;
+
+  config.blocks.blocksConfig.layoutSettings.schemaEnhancer = ({ schema }) => {
+    schema.properties.body_class.widget = 'creatableselect';
+    return schema;
+  };
 
   // we won't need the listing for Folders
   delete config.views.layoutViews.listing_view;

package/src/components/manage/Blocks/TransRegionSelect/countries.js

@@ -1,148 +0,0 @@
-export const regionCountries = [
-  {
-    region: 'Adriatic-Ionian Area',
-    countries: [
-      ['Croatia', '/countries/croatia'],
-      ['Greece', '/countries/greece'],
-      ['Italy', '/countries/italy'],
-      ['Slovenia', '/countries/slovenia'],
-      ['Albania', ''],
-      ['Bosnia and Herzegovina', ''],
-      ['Montenegro', ''],
-      ['Republic of North Macedonia', ''],
-      ['Serbia', ''],
-    ],
-  },
-  {
-    region: 'Alpine Space',
-    countries: [
-      ['Austria', '/countries/austria'],
-      ['France', '/countries/france'],
-      ['Germany', '/countries/germany'],
-      ['Italy', '/countries/italy'],
-      ['Slovenia', '/countries/slovenia'],
-      ['Liechtenstein', ''],
-      ['Switzerland', '/countries/switzerland'],
-    ],
-  },
-  {
-    region: 'Northern Periphery and Arctic',
-    countries: [
-      ['Finland', '/countries/finland'],
-      ['Ireland', '/countries/ireland'],
-      ['Sweden', '/countries/sweden'],
-      ['Iceland', '/countries/iceland'],
-      ['Norway', '/countries/norway'],
-      ['Greenland', ''],
-      ['Faroe Islands', ''],
-    ],
-  },
-  {
-    region: 'Atlantic Area',
-    countries: [
-      ['France', '/countries/france'],
-      ['Ireland', '/countries/ireland'],
-      ['Portugal', '/countries/portugal'],
-      ['Spain', '/countries/spain'],
-    ],
-  },
-  {
-    region: 'Baltic Sea',
-    countries: [
-      ['Denmark', '/countries/denmark'],
-      ['Estonia', '/countries/estonia'],
-      ['Finland', '/countries/finland'],
-      ['Germany', '/countries/germany'],
-      ['Latvia', '/countries/latvia'],
-      ['Lithuania', '/countries/lithuania'],
-      ['Poland', '/countries/poland'],
-      ['Sweden', '/countries/sweden'],
-      ['Norway', '/countries/norway'],
-    ],
-  },
-  {
-    region: 'Central Europe',
-    countries: [
-      ['Austria', '/countries/austria'],
-      ['Croatia', '/countries/croatia'],
-      ['Czechia', '/countries/czech-republic'],
-      ['Germany', '/countries/germany'],
-      ['Hungary', '/countries/hungary'],
-      ['Italy', '/countries/italy'],
-      ['Poland', '/countries/poland'],
-      ['Slovakia', '/countries/slovakia'],
-      ['Slovenia', '/countries/slovenia'],
-    ],
-  },
-  {
-    region: 'Danube Area',
-    countries: [
-      ['Austria', '/countries/austria'],
-      ['Bulgaria', '/countries/bulgaria'],
-      ['Croatia', '/countries/croatia'],
-      ['Czechia', '/countries/czech-republic'],
-      ['Germany', '/countries/germany'],
-      ['Hungary', '/countries/hungary'],
-      ['Romania', '/countries/romania'],
-      ['Slovakia', '/countries/slovakia'],
-      ['Slovenia', '/countries/slovenia'],
-      ['Bosnia and Herzegovina, ', ''],
-      ['Montenegro', ''],
-      ['Serbia', ''],
-      ['Ukraine', ''],
-      ['Republic of Moldova', ''],
-    ],
-  },
-  {
-    region: 'Mediterranean Area',
-    countries: [
-      ['Albania', ''],
-      ['Bosnia and Herzegovina', ''],
-      ['Bulgaria', '/countries/bulgaria'],
-      ['Croatia', '/countries/croatia'],
-      ['Cyprus', '/countries/cyprus'],
-      ['France', '/countries/france'],
-      ['Greece', '/countries/greece'],
-      ['Italy', '/countries/italy'],
-      ['Malta', '/countries/malta'],
-      ['Montenegro', ''],
-      ['Portugal', '/countries/portugal'],
-      ['Republic of North Macedonia', ''],
-      ['Slovenia', '/countries/slovenia'],
-      ['Spain', '/countries/spain'],
-    ],
-  },
-  {
-    region: 'North Sea Region',
-    countries: [
-      ['Belgium', '/countries/belgium'],
-      ['Denmark', '/countries/denmark'],
-      ['Germany', '/countries/germany'],
-      ['France', '/countries/france'],
-      ['Netherlands', '/countries/netherlands'],
-      ['Sweden', '/countries/sweden'],
-      ['Norway', '/countries/norway'],
-    ],
-  },
-  {
-    region: 'North-West Europe',
-    countries: [
-      ['Belgium', '/countries/belgium'],
-      ['France', '/countries/france'],
-      ['Germany', '/countries/germany'],
-      ['Ireland', '/countries/ireland'],
-      ['Luxembourg', '/countries/luxembourg'],
-      ['Netherlands', '/countries/netherlands'],
-      ['Switzerland', '/countries/switzerland'],
-    ],
-  },
-  {
-    region: 'South-West Europe',
-    countries: [
-      ['France', '/countries/france'],
-      ['Portugal', '/countries/portugal'],
-      ['Spain', '/countries/spain'],
-      ['Andorra', ''],
-    ],
-  },
-];