@eeacms/volto-eea-website-theme 1.22.0 → 1.23.0

package/CHANGELOG.md

@@ -4,7 +4,35 @@ 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.22.0](https://github.com/eea/volto-eea-website-theme/compare/1.21.0...1.22.0) - 26 September 2023
+### [1.23.0](https://github.com/eea/volto-eea-website-theme/compare/1.22.1...1.23.0) - 2 November 2023
+
+#### :rocket: New Features
+
+- feat(header): updated environmental information systems websites #251860 [David Ichim - [`647a818`](https://github.com/eea/volto-eea-website-theme/commit/647a818cefc9b24464e282e1ff31b9bc56a01d55)]
+
+#### :bug: Bug Fixes
+
+- fix: customize normalizeExternalData until the #5347 is merged in volto core - refs #259857 [dobri1408 - [`19c88a9`](https://github.com/eea/volto-eea-website-theme/commit/19c88a9910646f166e6317a86c6b0ad759b1bd12)]
+
+#### :house: Internal changes
+
+- chore: husky, lint-staged use fixed versions [valentinab25 - [`6d15088`](https://github.com/eea/volto-eea-website-theme/commit/6d150886c5aeb2ca0b569270486e60f7cc274e2c)]
+- chore:volto 16 in tests, update docs, fix stylelint overrides [valentinab25 - [`20c0323`](https://github.com/eea/volto-eea-website-theme/commit/20c032380b33c0077c869a05136f93e2fb68e5d4)]
+
+#### :hammer_and_wrench: Others
+
+- bump package version preparing for release [David Ichim - [`cb88e7c`](https://github.com/eea/volto-eea-website-theme/commit/cb88e7c64bb5ac307504e80203ef03dde9420922)]
+- Moved function to top and added jsdoc [David Ichim - [`2fe74e3`](https://github.com/eea/volto-eea-website-theme/commit/2fe74e332c51caf6f2571b19a75c74174925a3e4)]
+- Tab variations only if we have variation support [David Ichim - [`f086102`](https://github.com/eea/volto-eea-website-theme/commit/f086102fce8ef103e5d18907a58c1b84f9b7f4e8)]
+- * test: add unit tests - refs #254313 [ana-oprea - [`a14ecb4`](https://github.com/eea/volto-eea-website-theme/commit/a14ecb4f1b40fad88787041658a126a4a2bb69f9)]
+### [1.22.1](https://github.com/eea/volto-eea-website-theme/compare/1.22.0...1.22.1) - 29 September 2023
+
+#### :house: Documentation changes
+
+- docs: Update README and DEVELOP [Alin Voinea - [`d0a8655`](https://github.com/eea/volto-eea-website-theme/commit/d0a86555904b43cdc477bc745989b819ab0e86b4)]
+- docs: Update README and add demo gifs [Alin Voinea - [`ad00749`](https://github.com/eea/volto-eea-website-theme/commit/ad007497c063e0c46d444df9ecb54858add23682)]
+
+### [1.22.0](https://github.com/eea/volto-eea-website-theme/compare/1.21.0...1.22.0) - 27 September 2023
 
 #### :rocket: New Features
 

package/DEVELOP.md

@@ -16,12 +16,14 @@
 
 1. Go to http://localhost:3000
 
-1.  Happy hacking!
+1. Initialize git hooks
 
     ```Bash
-    cd src/addons/volto-eea-website-theme/
+    yarn prepare
     ```
 
+1. Happy hacking!
+
 ### Or add @eeacms/volto-eea-website-theme to your Volto project
 
 Before starting make sure your development environment is properly set. See [Volto Developer Documentation](https://docs.voltocms.com/getting-started/install/)
@@ -48,18 +50,15 @@ Before starting make sure your development environment is properly set. See [Vol
 
 1.  Install
 
-        yarn develop
+        make develop
         yarn
 
 1.  Start backend
 
-        docker pull plone
-        docker run -d --name plone -p 8080:8080 -e SITE=Plone -e PROFILES="profile-plone.restapi:blocks" plone
+        docker run --pull always -it --rm --name plone -p 8080:8080 -e SITE=Plone plone/plone-backend
 
     ...wait for backend to setup and start - `Ready to handle requests`:
 
-        docker logs -f plone
-
     ...you can also check http://localhost:8080/Plone
 
 1.  Start frontend

package/README.md

@@ -20,6 +20,11 @@ EEA Website [Volto](https://github.com/plone/volto) Theme
 
 - https://www.eea.europa.eu
 
+## Docusaurus and Storybook
+
+See [Docusaurus](https://eea.github.io/).
+See [Storybook](https://eea.github.io/eea-storybook/).
+
 ## Getting started
 
 ### Try volto-eea-website-theme with Docker
@@ -41,25 +46,25 @@ Go to http://localhost:3000
 
 1. Start Volto frontend
 
-- If you already have a volto project, just update `package.json`:
+* If you already have a volto project, just update `package.json`:
 
-  ```JSON
-  "addons": [
-      "@eeacms/volto-eea-website-theme"
-  ],
+   ```JSON
+   "addons": [
+       "@eeacms/volto-eea-website-theme"
+   ],
 
-  "dependencies": {
-      "@eeacms/volto-eea-website-theme": "^1.0.0"
-  }
-  ```
+   "dependencies": {
+       "@eeacms/volto-eea-website-theme": "*"
+   }
+   ```
 
-- If not, create one:
+* If not, create one:
 
-  ```
-  npm install -g yo @plone/generator-volto
-  yo @plone/volto my-volto-project --addon @eeacms/volto-eea-website-theme
-  cd my-volto-project
-  ```
+   ```
+   npm install -g yo @plone/generator-volto
+   yo @plone/volto my-volto-project --canary --addon @eeacms/volto-eea-website-theme
+   cd my-volto-project
+   ```
 
 1. Install new add-ons and restart Volto:
 
@@ -80,11 +85,6 @@ See [RELEASE.md](https://github.com/eea/volto-eea-website-theme/blob/master/RELE
 
 See [DEVELOP.md](https://github.com/eea/volto-eea-website-theme/blob/master/DEVELOP.md).
 
-## Docusaurus and Storybook
-
-See [Docusaurus](https://eea.github.io/).
-See [Storybook](https://eea.github.io/eea-storybook/).
-
 ## Copyright and license
 
 The Initial Owner of the Original Code is European Environment Agency (EEA).

package/RELEASE.md

@@ -20,9 +20,9 @@ You need to first install the [release-it](https://github.com/release-it/release
    ```
    npm install -g release-it
    ```
-   
+
 Release-it uses the configuration written in the [`.release-it.json`](./.release-it.json) file located in the root of the repository.
-   
+
 Release-it is a tool that automates 4 important steps in the release process:
 
 1. Version increase in `package.json` ( increased from the current version in `package.json`)
@@ -30,45 +30,45 @@ Release-it is a tool that automates 4 important steps in the release process:
 3. GitHub release on the commit with the changelog and package.json modification on the develop branch
 4. NPM release ( by default it's disabled, but can be enabled in the configuration file )
 
-To configure the authentification, you need to export GITHUB_TOKEN for [GitHub](https://github.com/settings/tokens) 
+To configure the authentification, you need to export GITHUB_TOKEN for [GitHub](https://github.com/settings/tokens)
 
    ```
    export GITHUB_TOKEN=XXX-XXXXXXXXXXXXXXXXXXXXXX
    ```
- 
+
  To configure npm, you can use the `npm login` command or use a configuration file with a TOKEN :
- 
+
    ```
    echo "//registry.npmjs.org/:_authToken=YYYYYYYYYYYYYYYYYYYYYYYYYYYYYY" > .npmrc
    ```
 
 #### Using release-it tool
-  
+
 There are 3 yarn scripts that can be run to do the release
 
 ##### yarn release-beta
 
-Automatically calculates and presents 3 beta versions - patch, minor and major for you to choose ( or Other for manual input). 
+Automatically calculates and presents 3 beta versions - patch, minor and major for you to choose ( or Other for manual input).
 
 ```
-? Select increment (next version): 
-❯ prepatch (0.1.1-beta.0) 
-  preminor (0.2.0-beta.0) 
-  premajor (1.0.0-beta.0) 
-  Other, please specify... 
+? Select increment (next version):
+❯ prepatch (0.1.1-beta.0)
+  preminor (0.2.0-beta.0)
+  premajor (1.0.0-beta.0)
+  Other, please specify...
 ```
 
 ##### yarn release-major-beta
 
 Same as `yarn release-beta`, but with premajor version pre-selected.
-    
+
 ##### yarn release
 
 Generic command, does not automatically add the `beta` to version, but you can still manually write it if you choose Other.
 
 #### Important notes
 
-> Do not use release-it tool on master branch, the commit on CHANGELOG.md file and the version increase in the package.json file can't be done without a PULL REQUEST.  
+> Do not use release-it tool on master branch, the commit on CHANGELOG.md file and the version increase in the package.json file can't be done without a PULL REQUEST.
 
 > Do not keep Pull Requests from develop to master branches open when you are doing beta releases from the develop branch. As long as a PR to master is open, an automatic script will run on every commit and will update both the version and the changelog to a production-ready state - ( MAJOR.MINOR.PATCH mandatory format for version).
 

package/jest-addon.config.js

@@ -25,6 +25,9 @@ module.exports = {
     '^.+\\.(jpg)$': 'jest-file',
     '^.+\\.(svg)$': './node_modules/@plone/volto/jest-svgsystem-transform.js',
   },
+  transformIgnorePatterns: [
+    'node_modules/(?!@eeacms)/volto-eea-design-system/ui',
+  ],
   coverageThreshold: {
     global: {
       branches: 0,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-eea-website-theme",
-  "version": "1.22.0",
+  "version": "1.23.0",
   "description": "@eeacms/volto-eea-website-theme: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",
@@ -31,8 +31,8 @@
     "@cypress/code-coverage": "^3.10.0",
     "@plone/scripts": "*",
     "babel-plugin-transform-class-properties": "^6.24.1",
-    "husky": "*",
-    "lint-staged": "*",
+    "husky": "^8.0.3",
+    "lint-staged": "^14.0.1",
     "md5": "^2.3.0",
     "postcss-less": "6.0.0"
   },

package/src/config.js

@@ -194,36 +194,48 @@ export const headerOpts = {
     title: 'Environmental information systems',
     links: [
       {
-        title: 'Biodiversity Information System for Europe',
-        href: 'https://biodiversity.europa.eu/',
+        title: 'European Environment Agency website',
+        href: 'https://www.eea.europa.eu',
       },
       {
-        title: 'Climate Adaptation Platform',
-        href: 'https://climate-adapt.eea.europa.eu/',
+        title: 'WISE marine - Marine information system for Europe',
+        href: 'https://water.europa.eu/marine',
       },
       {
-        title: 'Copernicus in situ component',
-        href: 'https://insitu.copernicus.eu/',
+        title: 'WISE freshwater - Freshwater information system for Europe',
+        href: 'https://water.europa.eu/freshwater',
       },
       {
-        title: 'European Industrial Emissions Portal',
-        href: 'https://industry.eea.europa.eu/',
+        title: 'BISE - Biodiversity information system for Europe',
+        href: 'https://biodiversity.europa.eu',
       },
       {
-        title: 'Forest Information System for Europe',
+        title: 'FISE - Forest information system for Europe',
         href: 'https://forest.eea.europa.eu/',
       },
       {
-        title: 'Information Platform for Chemical Monitoring',
-        href: 'https://ipchem.jrc.ec.europa.eu/RDSIdiscovery/ipchem/index.html',
+        title: 'European Climate and health observatory',
+        href: 'https://climate-adapt.eea.europa.eu/en/observatory',
       },
       {
-        title: 'Marine Water Information System for Europe',
-        href: 'https://water.europa.eu/marine',
+        title: 'ClimateADAPT',
+        href: 'https://climate-adapt.eea.europa.eu/',
       },
       {
-        title: 'Fresh Water Information System for Europe',
-        href: 'https://water.europa.eu/freshwater',
+        title: 'European Industrial Emissions Portal',
+        href: 'https://industry.eea.europa.eu',
+      },
+      {
+        title: 'Climate and energy in the EU',
+        href: 'https://climate-energy.eea.europa.eu',
+      },
+      {
+        title: 'Copernicus Land Monitoring Service',
+        href: 'https://land.copernicus.eu/en',
+      },
+      {
+        title: 'Copernicus InSitu',
+        href: 'https://insitu.copernicus.eu',
       },
     ],
   },

package/src/customizations/@plone/volto-slate/editor/extensions/normalizeExternalData.js

@@ -0,0 +1,9 @@
+// To be removed when https://github.com/plone/volto/pull/5347 is merged and released in Volto 16.x
+import { normalizeExternalData as normalize } from '@plone/volto-slate/utils';
+
+export function normalizeExternalData(editor) {
+  editor.normalizeExternalData = (fragment) => {
+    return normalize(editor, fragment);
+  };
+  return editor;
+}

package/src/customizations/volto/components/manage/Blocks/Image/Edit.test.jsx

@@ -0,0 +1,312 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { Provider } from 'react-intl-redux';
+import configureMockStore from 'redux-mock-store';
+import Edit from './Edit';
+import config from '@plone/volto/registry';
+import '@testing-library/jest-dom/extend-expect';
+
+const mockStore = configureMockStore();
+const { settings } = config;
+
+let store;
+
+config.blocks.blocksConfig = {
+  image: {
+    id: 'image',
+    title: 'Image',
+    group: 'media',
+    extensions: {},
+    variations: [],
+    restricted: false,
+    mostUsed: true,
+    sidebarTab: 1,
+    security: {
+      addPermission: [],
+      view: [],
+    },
+  },
+};
+const blockId = '1234';
+
+describe('Edit', () => {
+  beforeEach(() => {
+    store = mockStore({
+      content: {
+        create: {},
+        data: {},
+        subrequests: {
+          [blockId]: {},
+        },
+      },
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+  });
+
+  it('should render without errors', () => {
+    const { container } = render(
+      <Provider store={store}>
+        <Edit
+          data={{
+            url: 'http://localhost:8080/Plone/image',
+            '@type': 'image',
+            align: 'full',
+          }}
+          selected={false}
+          block={blockId}
+          content={{}}
+          request={{
+            loading: false,
+            loaded: false,
+          }}
+          pathname="/news"
+          onChangeBlock={() => {}}
+          onSelectBlock={() => {}}
+          onDeleteBlock={() => {}}
+          createContent={() => {}}
+          onFocusPreviousBlock={() => {}}
+          onFocusNextBlock={() => {}}
+          handleKeyDown={() => {}}
+          index={1}
+          openObjectBrowser={() => {}}
+        />
+      </Provider>,
+    );
+
+    settings.internalApiPath = 'http://localhost:8080/Plone';
+
+    expect(container.querySelector('.block.image.align')).toBeInTheDocument();
+    expect(
+      container.querySelector('.image-block-container'),
+    ).toBeInTheDocument();
+    expect(container.querySelector('.copyright-wrapper')).toBeInTheDocument();
+  });
+
+  it('should render without errors', () => {
+    const { container } = render(
+      <Provider store={store}>
+        <Edit
+          data={{
+            url: 'http://localhost:8080/Plone/image',
+            '@type': 'image',
+            size: 'l',
+            copyright: 'Copyright',
+          }}
+          selected={false}
+          block={blockId}
+          content={{}}
+          request={{
+            loading: false,
+            loaded: false,
+          }}
+          pathname="/news"
+          onChangeBlock={() => {}}
+          onSelectBlock={() => {}}
+          onDeleteBlock={() => {}}
+          createContent={() => {}}
+          onFocusPreviousBlock={() => {}}
+          onFocusNextBlock={() => {}}
+          handleKeyDown={() => {}}
+          index={1}
+          openObjectBrowser={() => {}}
+        />
+      </Provider>,
+    );
+
+    settings.internalApiPath = 'http://localhost:8080/Plone';
+
+    expect(container.querySelector('.block.image.align')).toBeInTheDocument();
+    expect(
+      container.querySelector('.image-block-container'),
+    ).toBeInTheDocument();
+    expect(container.querySelector('.copyright-wrapper')).toBeInTheDocument();
+  });
+
+  it('should render without errors', () => {
+    const { container } = render(
+      <Provider store={store}>
+        <Edit
+          data={{
+            url: 'http://localhost:8080/Plone/image',
+            '@type': 'image',
+            size: 'm',
+          }}
+          selected={false}
+          block={blockId}
+          content={{}}
+          request={{
+            loading: false,
+            loaded: false,
+          }}
+          pathname="/news"
+          onChangeBlock={() => {}}
+          onSelectBlock={() => {}}
+          onDeleteBlock={() => {}}
+          createContent={() => {}}
+          onFocusPreviousBlock={() => {}}
+          onFocusNextBlock={() => {}}
+          handleKeyDown={() => {}}
+          index={1}
+          openObjectBrowser={() => {}}
+        />
+      </Provider>,
+    );
+
+    settings.internalApiPath = 'http://localhost:8080/Plone';
+
+    expect(container.querySelector('.block.image.align')).toBeInTheDocument();
+    expect(
+      container.querySelector('.image-block-container'),
+    ).toBeInTheDocument();
+    expect(container.querySelector('.copyright-wrapper')).toBeInTheDocument();
+  });
+
+  it('should render without errors', () => {
+    const { container } = render(
+      <Provider store={store}>
+        <Edit
+          data={{
+            url: 'http://localhost:8080/Plone/image',
+            '@type': 'image',
+            size: 's',
+          }}
+          selected={false}
+          block={blockId}
+          content={{}}
+          request={{
+            loading: false,
+            loaded: false,
+          }}
+          pathname="/news"
+          onChangeBlock={() => {}}
+          onSelectBlock={() => {}}
+          onDeleteBlock={() => {}}
+          createContent={() => {}}
+          onFocusPreviousBlock={() => {}}
+          onFocusNextBlock={() => {}}
+          handleKeyDown={() => {}}
+          index={1}
+          openObjectBrowser={() => {}}
+        />
+      </Provider>,
+    );
+
+    settings.internalApiPath = 'http://localhost:8080/Plone';
+
+    expect(container.querySelector('.block.image.align')).toBeInTheDocument();
+    expect(
+      container.querySelector('.image-block-container'),
+    ).toBeInTheDocument();
+    expect(container.querySelector('.copyright-wrapper')).toBeInTheDocument();
+  });
+
+  it('should render without errors', () => {
+    const { container } = render(
+      <Provider store={store}>
+        <Edit
+          data={{
+            url: 'http://localhost:8080/Plone/image',
+            '@type': 'image',
+          }}
+          selected={false}
+          block={blockId}
+          content={{}}
+          request={{
+            loading: false,
+            loaded: false,
+          }}
+          pathname="/news"
+          onChangeBlock={() => {}}
+          onSelectBlock={() => {}}
+          onDeleteBlock={() => {}}
+          createContent={() => {}}
+          onFocusPreviousBlock={() => {}}
+          onFocusNextBlock={() => {}}
+          handleKeyDown={() => {}}
+          index={1}
+          openObjectBrowser={() => {}}
+        />
+      </Provider>,
+    );
+
+    settings.internalApiPath = 'http://localhost:8080/Plone';
+
+    expect(container.querySelector('.block.image.align')).toBeInTheDocument();
+    expect(
+      container.querySelector('.image-block-container'),
+    ).toBeInTheDocument();
+    expect(container.querySelector('.copyright-wrapper')).toBeInTheDocument();
+  });
+
+  it('should render without errors', () => {
+    const { container } = render(
+      <Provider store={store}>
+        <Edit
+          data={{
+            url: 'http://localhost:80801/Plone/image',
+            '@type': 'image',
+          }}
+          selected={false}
+          block={blockId}
+          content={{}}
+          request={{
+            loading: false,
+            loaded: false,
+          }}
+          pathname="/news"
+          onChangeBlock={() => {}}
+          onSelectBlock={() => {}}
+          onDeleteBlock={() => {}}
+          createContent={() => {}}
+          onFocusPreviousBlock={() => {}}
+          onFocusNextBlock={() => {}}
+          handleKeyDown={() => {}}
+          index={1}
+          openObjectBrowser={() => {}}
+        />
+      </Provider>,
+    );
+
+    settings.internalApiPath = 'http://localhost:8080/Plone';
+
+    expect(container.querySelector('.block.image.align')).toBeInTheDocument();
+    expect(
+      container.querySelector('.image-block-container'),
+    ).toBeInTheDocument();
+    expect(container.querySelector('.copyright-wrapper')).toBeInTheDocument();
+  });
+
+  it('should render without errors', () => {
+    render(
+      <Provider store={store}>
+        <Edit
+          data={{
+            url: undefined,
+            '@type': 'image',
+          }}
+          selected={false}
+          block={blockId}
+          content={{}}
+          request={{
+            loading: false,
+            loaded: false,
+          }}
+          editable={true}
+          pathname="/news"
+          onChangeBlock={() => {}}
+          onSelectBlock={() => {}}
+          onDeleteBlock={() => {}}
+          createContent={() => {}}
+          onFocusPreviousBlock={() => {}}
+          onFocusNextBlock={() => {}}
+          handleKeyDown={() => {}}
+          index={1}
+          openObjectBrowser={() => {}}
+        />
+      </Provider>,
+    );
+  });
+});