@eeacms/volto-eea-website-theme 4.0.2 → 4.0.4

package/CHANGELOG.md

@@ -4,6 +4,14 @@ 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).
 
+### [4.0.4](https://github.com/eea/volto-eea-website-theme/compare/4.0.3...4.0.4) - 10 April 2026
+
+#### :bug: Bug Fixes
+
+- fix: EEA Design System dependency version [Alin Voinea - [`2e7be46`](https://github.com/eea/volto-eea-website-theme/commit/2e7be464a1ccec1a86f51aa011639fd9b1111438)]
+
+### [4.0.3](https://github.com/eea/volto-eea-website-theme/compare/4.0.2...4.0.3) - 9 April 2026
+
 ### [4.0.2](https://github.com/eea/volto-eea-website-theme/compare/4.0.1...4.0.2) - 8 April 2026
 
 ### [4.0.1](https://github.com/eea/volto-eea-website-theme/compare/4.0.0...4.0.1) - 8 April 2026

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-eea-website-theme",
-  "version": "4.0.2",
+  "version": "4.0.4",
   "description": "@eeacms/volto-eea-website-theme: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",
@@ -28,7 +28,7 @@
     "@eeacms/volto-anchors": "*",
     "@eeacms/volto-block-style": "*",
     "@eeacms/volto-block-toc": "*",
-    "@eeacms/volto-eea-design-system": "eea/volto-eea-design-system#develop",
+    "@eeacms/volto-eea-design-system": "*",
     "@eeacms/volto-group-block": "*",
     "volto-subsites": "*"
   },

package/src/customizations/volto/components/theme/AlternateHrefLangs/AlternateHrefLangs.jsx

@@ -0,0 +1,36 @@
+/**
+ * PATCH from Volto 18.33.0
+ * To be removed when issue is fixed and released:
+ * https://github.com/plone/volto/issues/7309
+ * https://github.com/plone/volto/pull/8093
+ * https://github.com/plone/volto/pull/8094
+ * */
+import config from '@plone/volto/registry';
+import Helmet from '@plone/volto/helpers/Helmet/Helmet';
+import { flattenToAppURL, toPublicURL } from '@plone/volto/helpers/Url/Url';
+
+const AlternateHrefLangs = (props) => {
+  const { content } = props;
+  return (
+    <Helmet>
+      {config.settings.isMultilingual &&
+        content['@components']?.translations?.items &&
+        content.language?.token &&
+        [
+          ...content['@components']?.translations?.items,
+          { '@id': content['@id'], language: content.language.token },
+        ].map((item, key) => {
+          return (
+            <link
+              key={key}
+              rel="alternate"
+              hrefLang={item.language}
+              href={toPublicURL(flattenToAppURL(item['@id']))}
+            />
+          );
+        })}
+    </Helmet>
+  );
+};
+
+export { AlternateHrefLangs };

package/src/customizations/volto/components/theme/AlternateHrefLangs/AlternateHrefLangs.test.jsx

@@ -0,0 +1,223 @@
+import React from 'react';
+import Helmet from '@plone/volto/helpers/Helmet/Helmet';
+
+import renderer from 'react-test-renderer';
+import configureStore from 'redux-mock-store';
+import { Provider } from 'react-intl-redux';
+import config from '@plone/volto/registry';
+
+import { AlternateHrefLangs } from './AlternateHrefLangs';
+
+const mockStore = configureStore();
+
+describe('AlternateHrefLangs', () => {
+  beforeEach(() => {});
+  it('non multilingual site, renders nothing', () => {
+    config.settings.isMultilingual = false;
+    const content = {
+      '@id': '/',
+      '@components': {},
+    };
+    const store = mockStore({
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+    // We need to force the component rendering
+    // to fill the Helmet
+    renderer.create(
+      <Provider store={store}>
+        <AlternateHrefLangs content={content} />
+      </Provider>,
+    );
+
+    const helmetLinks = Helmet.peek().linkTags;
+    expect(helmetLinks.length).toBe(0);
+  });
+
+  it('multilingual site, content without language field, renders nothing', () => {
+    config.settings.publicURL = 'https://plone.org';
+    config.settings.supportedLanguages = ['en', 'es'];
+
+    const content = {
+      '@id': 'http://localhost:8080/Plone/en/newsroom/news',
+      '@components': {
+        translations: {
+          items: [{ '@id': 'http://localhost:8080/Plone/es', language: 'es' }],
+        },
+      },
+    };
+
+    const store = mockStore({
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+
+    renderer.create(
+      <Provider store={store}>
+        <AlternateHrefLangs content={content} />
+      </Provider>,
+    );
+
+    const helmetLinks = Helmet.peek().linkTags;
+    expect(helmetLinks.length).toBe(0);
+  });
+
+  it('multilingual site, with some translations', () => {
+    config.settings.publicURL = 'https://plone.org';
+    config.settings.isMultilingual = true;
+    config.settings.supportedLanguages = ['en', 'es', 'eu'];
+
+    const content = {
+      '@id': 'http://localhost:8080/Plone/en',
+      language: { token: 'en', title: 'English' },
+      '@components': {
+        translations: {
+          items: [{ '@id': 'http://localhost:8080/Plone/es', language: 'es' }],
+        },
+      },
+    };
+
+    const store = mockStore({
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+
+    // We need to force the component rendering
+    // to fill the Helmet
+    renderer.create(
+      <Provider store={store}>
+        <>
+          <AlternateHrefLangs content={content} />
+        </>
+      </Provider>,
+    );
+    const helmetLinks = Helmet.peek().linkTags;
+
+    expect(helmetLinks.length).toBe(2);
+
+    expect(helmetLinks).toContainEqual({
+      rel: 'alternate',
+      href: 'https://plone.org/es',
+      hrefLang: 'es',
+    });
+    expect(helmetLinks).toContainEqual({
+      rel: 'alternate',
+      href: 'https://plone.org/en',
+      hrefLang: 'en',
+    });
+  });
+
+  it('multilingual site, with all available translations', () => {
+    config.settings.publicURL = 'https://plone.org';
+    config.settings.isMultilingual = true;
+    config.settings.supportedLanguages = ['en', 'es', 'eu'];
+    const store = mockStore({
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+
+    const content = {
+      '@id': 'http://localhost:8080/Plone/en',
+      language: { token: 'en', title: 'English' },
+      '@components': {
+        translations: {
+          items: [
+            { '@id': 'http://localhost:8080/Plone/eu', language: 'eu' },
+            { '@id': 'http://localhost:8080/Plone/es', language: 'es' },
+          ],
+        },
+      },
+    };
+
+    // We need to force the component rendering
+    // to fill the Helmet
+    renderer.create(
+      <Provider store={store}>
+        <AlternateHrefLangs content={content} />
+      </Provider>,
+    );
+
+    const helmetLinks = Helmet.peek().linkTags;
+
+    // We expect having 3 links
+    expect(helmetLinks.length).toBe(3);
+
+    expect(helmetLinks).toContainEqual({
+      rel: 'alternate',
+      href: 'https://plone.org/eu',
+      hrefLang: 'eu',
+    });
+    expect(helmetLinks).toContainEqual({
+      rel: 'alternate',
+      href: 'https://plone.org/es',
+      hrefLang: 'es',
+    });
+    expect(helmetLinks).toContainEqual({
+      rel: 'alternate',
+      href: 'https://plone.org/en',
+      hrefLang: 'en',
+    });
+  });
+
+  it('multilingual site, with all available translations - with server URL', () => {
+    config.settings.publicURL = 'https://plone.org';
+    config.settings.isMultilingual = true;
+    config.settings.supportedLanguages = ['en', 'es', 'eu'];
+    const store = mockStore({
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+
+    const content = {
+      '@id': 'http://localhost:8080/Plone/en',
+      language: { token: 'en', title: 'English' },
+      '@components': {
+        translations: {
+          items: [
+            { '@id': 'http://localhost:8080/Plone/eu', language: 'eu' },
+            { '@id': 'http://localhost:8080/Plone/es', language: 'es' },
+          ],
+        },
+      },
+    };
+
+    // We need to force the component rendering
+    // to fill the Helmet
+    renderer.create(
+      <Provider store={store}>
+        <AlternateHrefLangs content={content} />
+      </Provider>,
+    );
+
+    const helmetLinks = Helmet.peek().linkTags;
+
+    // We expect having 3 links
+    expect(helmetLinks.length).toBe(3);
+
+    expect(helmetLinks).toContainEqual({
+      rel: 'alternate',
+      href: 'https://plone.org/eu',
+      hrefLang: 'eu',
+    });
+    expect(helmetLinks).toContainEqual({
+      rel: 'alternate',
+      href: 'https://plone.org/es',
+      hrefLang: 'es',
+    });
+    expect(helmetLinks).toContainEqual({
+      rel: 'alternate',
+      href: 'https://plone.org/en',
+      hrefLang: 'en',
+    });
+  });
+});