@eeacms/volto-cca-policy 0.3.45 → 0.3.47

package/CHANGELOG.md

@@ -4,6 +4,27 @@ 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.3.47](https://github.com/eea/volto-cca-policy/compare/0.3.46...0.3.47) - 21 May 2025
+
+#### :nail_care: Enhancements
+
+- change(mission): cleanup, remove unused component [kreafox - [`0440183`](https://github.com/eea/volto-cca-policy/commit/044018381a8c42e1a45ff9ba3668613dc08f5198)]
+- change(mission): add link to signatory landing page - refs #287964 [kreafox - [`78378a3`](https://github.com/eea/volto-cca-policy/commit/78378a3d7f8bab7aa6414342e228b45fc24ec57b)]
+
+#### :hammer_and_wrench: Others
+
+- update test [kreafox - [`ae30035`](https://github.com/eea/volto-cca-policy/commit/ae30035c6f3f1d81d560b5552afc0bc9764df983)]
+### [0.3.46](https://github.com/eea/volto-cca-policy/compare/0.3.45...0.3.46) - 21 May 2025
+
+#### :house: Internal changes
+
+- style: Automated code fix [eea-jenkins - [`ea4b8be`](https://github.com/eea/volto-cca-policy/commit/ea4b8beed2cb7426c3125b6edb85d3b1fadf66a1)]
+
+#### :hammer_and_wrench: Others
+
+- Dont' need this now [Tiberiu Ichim - [`eff27fb`](https://github.com/eea/volto-cca-policy/commit/eff27fb4022b445c6c298a1c59e36ecab661e91e)]
+- Add actions customization [Tiberiu Ichim - [`69f9b00`](https://github.com/eea/volto-cca-policy/commit/69f9b00cb45149e9b4d06085f4688800cb4d1d9f)]
+- Remove etag from server [Tiberiu Ichim - [`7d94455`](https://github.com/eea/volto-cca-policy/commit/7d94455440b69ebd97c0ef5cc3dd839687b13e54)]
 ### [0.3.45](https://github.com/eea/volto-cca-policy/compare/0.3.44...0.3.45) - 21 May 2025
 
 #### :rocket: New Features

package/package.json

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

package/src/components/theme/MissionSignatoryProfile/MissionSignatoryProfileView.jsx

@@ -1,7 +1,9 @@
 import React from 'react';
-import { Tab, Container, Divider } from 'semantic-ui-react';
+import { Link } from 'react-router-dom';
+import { Tab, Container, Divider, Button, Icon } from 'semantic-ui-react';
 import { formatTextToHTML } from '@eeacms/volto-cca-policy/utils';
 import { BannerTitle, HTMLField } from '@eeacms/volto-cca-policy/helpers';
+import { flattenToAppURL } from '@plone/volto/helpers';
 
 import GovernanceTab from './TabSections/GovernanceTab';
 import AssessmentTab from './TabSections/AssessmentTab';
@@ -29,6 +31,9 @@ const MissionSignatoryProfileView = ({ content }) => {
     general_text = [{}],
   } = signatoryData;
 
+  const { Back_To_Map_Link, Country_Or_Area } = general_text?.[0] || {};
+  const backToMapPath = flattenToAppURL(content?.parent?.['@id'] || '/');
+
   const [activeIndex, setActiveIndex] = React.useState(0);
 
   const tabData = {
@@ -60,12 +65,18 @@ const MissionSignatoryProfileView = ({ content }) => {
           hidePublishingDate: true,
           hideDownloadButton: false,
           hideShareButton: false,
-          subtitle: general_text?.[0]?.Country_Or_Area,
+          subtitle: Country_Or_Area,
         }}
       />
 
       <div className="signatory-profile">
-        <br />
+        <Link to={backToMapPath}>
+          <Button icon inverted primary className="left labeled back-to-map">
+            <Icon className="chevron left icon" />
+            {Back_To_Map_Link || 'Back to Signatories map'}
+          </Button>
+        </Link>
+
         <Tab
           menu={{
             fluid: true,

package/src/components/theme/MissionSignatoryProfile/MissionSignatoryProfileView.test.jsx

@@ -1,4 +1,5 @@
 import { render, fireEvent, screen } from '@testing-library/react';
+import { MemoryRouter } from 'react-router-dom';
 import '@testing-library/jest-dom';
 import MissionSignatoryProfileView from './MissionSignatoryProfileView';
 
@@ -38,15 +39,25 @@ describe('MissionSignatoryProfileView', () => {
             { key: 'Action_Label', value: 'Action' },
             { key: 'Language', value: 'en' },
           ],
+          general_text: [
+            {
+              Back_To_Map_Link: 'Back to map',
+              Country_Or_Area: 'Testland',
+            },
+          ],
         },
       },
     },
+    parent: {
+      '@id': '/signatories-map',
+    },
   };
 
+  const renderWithRouter = (ui) => render(<MemoryRouter>{ui}</MemoryRouter>);
+
   it('renders tab labels and default content', () => {
-    render(<MissionSignatoryProfileView content={content} />);
+    renderWithRouter(<MissionSignatoryProfileView content={content} />);
 
-    // Tab labels
     expect(screen.getByText('Governance')).toBeInTheDocument();
     expect(screen.getByText('Assessment')).toBeInTheDocument();
     expect(screen.getByText('Planning & Target')).toBeInTheDocument();
@@ -54,7 +65,7 @@ describe('MissionSignatoryProfileView', () => {
   });
 
   it('switches tabs and renders corresponding content', () => {
-    render(<MissionSignatoryProfileView content={content} />);
+    renderWithRouter(<MissionSignatoryProfileView content={content} />);
 
     fireEvent.click(screen.getByText('Governance'));
     expect(screen.getByText('Mocked Governance')).toBeInTheDocument();
@@ -70,10 +81,10 @@ describe('MissionSignatoryProfileView', () => {
   });
 
   it('renders footer disclaimer text if present', () => {
-    render(<MissionSignatoryProfileView content={content} />);
+    renderWithRouter(<MissionSignatoryProfileView content={content} />);
     expect(screen.getByText('Disclaimer Title')).toBeInTheDocument();
     expect(
-      screen.getByText((content) => content.includes('This is a disclaimer.')),
+      screen.getByText((text) => text.includes('This is a disclaimer.')),
     ).toBeInTheDocument();
   });
 });

package/src/customizations/volto/helpers/Html/Html.jsx

@@ -0,0 +1,219 @@
+/**
+ * Html helper.
+ * @module helpers/Html
+ */
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import Helmet from '@plone/volto/helpers/Helmet/Helmet';
+import serialize from 'serialize-javascript';
+import { join } from 'lodash';
+import BodyClass from '@plone/volto/helpers/BodyClass/BodyClass';
+import { runtimeConfig } from '@plone/volto/runtime_config';
+import config from '@plone/volto/registry';
+
+const CRITICAL_CSS_TEMPLATE = `function alter() {
+  document.querySelectorAll("head link[rel='prefetch']").forEach(function(el) { el.rel = 'stylesheet'});
+}
+if (window.addEventListener) {
+  window.addEventListener('DOMContentLoaded', alter, false)
+} else {
+  window.onload=alter
+}`;
+
+export const loadReducers = (state = {}) => {
+  const { settings } = config;
+  return Object.assign(
+    {},
+    ...Object.keys(state).map((name) =>
+      settings.initialReducersBlacklist.includes(name)
+        ? {}
+        : { [name]: state[name] },
+    ),
+  );
+};
+
+/**
+ * Html class.
+ * Wrapper component containing HTML metadata and boilerplate tags.
+ * Used in server-side code only to wrap the string output of the
+ * rendered route component.
+ *
+ * The only thing this component doesn't (and can't) include is the
+ * HTML doctype declaration, which is added to the rendered output
+ * by the server.js file.
+ *
+ * Critical.css behaviour: when a file `public/critical.css` is present, the
+ * loading of stylesheets is changed. The styles in critical.css are inlined in
+ * the generated HTML, and the whole story needs to change completely: instead
+ * of treating stylesheets as priority for rendering, we want to defer their
+ * loading as much as possible. So we change the stylesheets to be prefetched
+ * and we switch their rel back to stylesheets at document ready event.
+ *
+ * @function Html
+ * @param {Object} props Component properties.
+ * @param {Object} props.assets Assets to be rendered.
+ * @param {Object} props.component Content to be rendered as child node.
+ * @param {Object} props.store Store object.
+ * @returns {string} Markup of the not found page.
+ */
+
+/**
+ * Html class.
+ * @class Html
+ * @extends Component
+ */
+class Html extends Component {
+  /**
+   * Property types.
+   * @property {Object} propTypes Property types.
+   * @static
+   */
+  static propTypes = {
+    extractor: PropTypes.shape({
+      getLinkElements: PropTypes.func.isRequired,
+      getScriptElements: PropTypes.func.isRequired,
+      getStyleElements: PropTypes.func.isRequired,
+    }).isRequired,
+    markup: PropTypes.string.isRequired,
+    store: PropTypes.shape({
+      getState: PropTypes.func,
+    }).isRequired,
+    nonce: PropTypes.string,
+  };
+
+  /**
+   * Render method.
+   * @method render
+   * @returns {string} Markup for the component.
+   */
+  render() {
+    const {
+      extractor,
+      markup,
+      store,
+      criticalCss,
+      apiPath,
+      publicURL,
+      nonce,
+    } = this.props;
+    const head = Helmet.rewind();
+    const bodyClass = join(BodyClass.rewind(), ' ');
+    const htmlAttributes = head.htmlAttributes.toComponent();
+
+    return (
+      <html lang={htmlAttributes.lang}>
+        <head>
+          <meta charSet="utf-8" />
+          {head.base.toComponent()}
+          {head.title.toComponent()}
+          {head.meta.toComponent()}
+          {head.link.toComponent()}
+          {head.script.toComponent()}
+
+          {React.createElement('script', {
+            nonce: nonce,
+            dangerouslySetInnerHTML: {
+              __html: `window.env = ${serialize(
+                {
+                  ...runtimeConfig,
+                  // Seamless mode requirement, the client need to know where the API is located
+                  // if not set in the API_PATH
+                  ...(apiPath && {
+                    apiPath,
+                  }),
+                  ...(publicURL && {
+                    publicURL,
+                  }),
+                },
+                { space: 2 },
+              )};`,
+            },
+          })}
+
+          <link rel="icon" href="/favicon.ico" sizes="any" />
+          <link rel="icon" href="/icon.svg" type="image/svg+xml" />
+          <link
+            rel="apple-touch-icon"
+            sizes="180x180"
+            href="/apple-touch-icon.png"
+          />
+          <link rel="manifest" href="/site.webmanifest" />
+          <meta name="generator" content="Plone 6 - https://plone.org" />
+          <meta name="viewport" content="width=device-width, initial-scale=1" />
+          <meta name="apple-mobile-web-app-capable" content="yes" />
+          {process.env.NODE_ENV === 'production' && criticalCss && (
+            <style
+              dangerouslySetInnerHTML={{ __html: this.props.criticalCss }}
+            />
+          )}
+          {/* Add the crossorigin while in development */}
+          {extractor.getLinkElements().map((elem) =>
+            React.cloneElement(elem, {
+              crossOrigin:
+                process.env.NODE_ENV === 'production' ? undefined : 'true',
+              rel: !criticalCss
+                ? elem.props.rel
+                : elem.props.as === 'style'
+                ? 'prefetch'
+                : elem.props.rel,
+            }),
+          )}
+          {/* Styles in development are loaded with Webpack's style-loader, in production,
+              they need to be static*/}
+          {process.env.NODE_ENV === 'production' ? (
+            criticalCss ? (
+              <>
+                <script
+                  dangerouslySetInnerHTML={{
+                    __html: CRITICAL_CSS_TEMPLATE,
+                  }}
+                ></script>
+                {extractor.getStyleElements().map((elem) => (
+                  <noscript>
+                    {React.cloneElement(elem, {
+                      rel: 'stylesheet',
+                      crossOrigin:
+                        process.env.NODE_ENV === 'production'
+                          ? undefined
+                          : 'true',
+                    })}
+                  </noscript>
+                ))}
+              </>
+            ) : (
+              extractor.getStyleElements()
+            )
+          ) : undefined}
+        </head>
+        <body className={bodyClass}>
+          <div role="navigation" aria-label="Toolbar" id="toolbar" />
+          <div id="main" dangerouslySetInnerHTML={{ __html: markup }} />
+          <div role="complementary" aria-label="Sidebar" id="sidebar" />
+          {React.createElement('script', {
+            nonce: nonce,
+            dangerouslySetInnerHTML: {
+              __html: `window.__data=${serialize(
+                loadReducers(store.getState()),
+                { space: 2 },
+              )};`,
+            },
+            charSet: 'UTF-8',
+          })}
+          {/* Add the crossorigin while in development */}
+          {this.props.extractScripts !== false
+            ? extractor.getScriptElements().map((elem) =>
+                React.cloneElement(elem, {
+                  nonce: nonce,
+                  crossOrigin:
+                    process.env.NODE_ENV === 'production' ? undefined : 'true',
+                }),
+              )
+            : ''}
+        </body>
+      </html>
+    );
+  }
+}
+
+export default Html;

package/src/customizations/volto/helpers/Html/README.md

@@ -0,0 +1,3 @@
+Customized for CSP support. Copy of https://github.com/plone/volto/blob/8b0f2af98ce0362f6975ce9c50137f6bd7cc3bb8/src/helpers/Html/Html.jsx Volto 17.x.x branch
+
+Added formatting of json serialized strings

package/src/customizations/volto/server.jsx

@@ -20,6 +20,7 @@ import { resetServerContext } from 'react-beautiful-dnd';
 import { CookiesProvider } from 'react-cookie';
 import cookiesMiddleware from 'universal-cookie-express';
 import debug from 'debug';
+// import crypto from 'crypto';
 
 import routes from '@root/routes';
 import config from '@plone/volto/registry';
@@ -64,6 +65,18 @@ if (config.settings) {
   });
 }
 
+// function buildCSPHeader(opts, nonce) {
+//   return Object.keys(opts)
+//     .sort()
+//     .reduce((acc, key) => {
+//       return [
+//         ...acc,
+//         `${key} ${opts[key].replaceAll('{nonce}', `'nonce-${nonce}'`)}`,
+//       ];
+//     }, [])
+//     .join('; ');
+// }
+
 function reactIntlErrorHandler(error) {
   debug('i18n')(error);
 }
@@ -71,6 +84,7 @@ function reactIntlErrorHandler(error) {
 const supported = new locale.Locales(keys(languages), 'en');
 
 const server = express()
+  .set('etag', false)
   .disable('x-powered-by')
   .head('/*', function (req, res) {
     // Support for HEAD requests. Required by start-test utility in CI.

package/src/index.js

@@ -555,6 +555,13 @@ const applyConfig = (config) => {
     ...config.settings.storeExtenders,
   ];
 
+  config.settings.initialReducersBlacklist = [
+    ...config.settings.initialReducersBlacklist,
+    'intl',
+    // 'router',
+    // 'content',
+  ];
+
   config.widgets.vocabulary[
     'plone.app.vocabularies.Users'
   ] = SelectAutoCompleteWidget;

package/src/search/cca/config.js

@@ -63,7 +63,6 @@ cca_build_runtime_mappings['op_cluster'] = {
 
 export default function installMainSearch(config) {
   const envConfig = ccaConfig;
-
   const pjson = require('@eeacms/volto-cca-policy/../package.json');
 
   envConfig.app_name = pjson.name;
@@ -221,7 +220,17 @@ export default function installMainSearch(config) {
     config.searchui.ccaSearch.host =
       process.env.RAZZLE_ES_PROXY_ADDR || getClientProxyAddress();
   }
+  let fieldsMatchAll = [
+    'cca_climate_impacts.keyword',
+    'cca_adaptation_sectors.keyword',
+    'cca_adaptation_elements.keyword',
+    'cca_key_type_measure.keyword',
+  ];
+  config.searchui.ccaSearch.facets.forEach((facet) => {
+    if (fieldsMatchAll.includes(facet.field)) {
+      facet.filterType = 'all';
+    }
+  });
 
-  // console.log(config);
   return config;
 }

package/theme/globals/mission.less

@@ -123,6 +123,19 @@ body.subsite-mkh {
       margin: 2em 0 !important;
     }
 
+    .ui.inverted.button.back-to-map {
+      margin-bottom: 2em;
+      box-shadow: 0px 0px 0px 2px @pineGreen inset !important;
+      color: @pineGreen;
+
+      &:hover,
+      &:active,
+      &:focus,
+      &:focus-visible {
+        background-color: @pineGreen;
+      }
+    }
+
     .column > .ui.segment {
       background-color: #fff !important;
     }

package/src/components/theme/MissionSignatoryProfile/TabSections/IntroductionTab.jsx

@@ -1,37 +0,0 @@
-import React from 'react';
-import { Tab } from 'semantic-ui-react';
-import { Callout } from '@eeacms/volto-eea-design-system/ui';
-
-const IntroductionTab = () => {
-  return (
-    <Tab.Pane>
-      <h2>Introduction</h2>
-      <Callout>
-        Duis non quam et nisi tincidunt fermentum. Pellentesque habitant morbi
-        tristique senectus et netus et malesuada fames ac turpis egestas.
-      </Callout>
-      <h3>The Mission on Adaptation</h3>
-      <p>
-        Nulla facilisi. Donec fringilla urna id ligula ullamcorper, vel
-        tristique lorem posuere. Donec et orci mauris. Nullam tempor velit id mi
-        luctus, a scelerisque libero accumsan. In hac habitasse platea dictumst.
-        Cras ac nunc nec massa tristique fringilla.
-      </p>
-      <h3>Data source</h3>
-      <p>
-        Donec eget libero id leo congue venenatis. Ut enim ad minim veniam, quis
-        nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
-        consequat. Duis aute irure dolor in reprehenderit in voluptate velit
-        esse cillum dolore eu fugiat nulla pariatur.
-      </p>
-      <p>
-        Donec eget libero id leo congue venenatis. Ut enim ad minim veniam, quis
-        nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
-        consequat. Duis aute irure dolor in reprehenderit in voluptate velit
-        esse cillum dolore eu fugiat nulla pariatur.
-      </p>
-    </Tab.Pane>
-  );
-};
-
-export default IntroductionTab;