@eeacms/volto-cca-policy 1.0.1 → 1.0.3

package/src/components/theme/Views/ExtendedToolView.test.jsx

@@ -0,0 +1,436 @@
+import React from 'react';
+import '@testing-library/jest-dom';
+import { fireEvent, render, screen } from '@testing-library/react';
+import { IntlProvider } from 'react-intl';
+
+import ExtendedToolView from './ExtendedToolView';
+import { useCompareTools } from '../CompareTools/utils';
+import { formatFunctionalityScore } from '../../Search/NavigatorCatalogue/utils';
+
+jest.mock('../CompareTools/utils', () => ({
+  useCompareTools: jest.fn(),
+}));
+
+jest.mock('@eeacms/volto-cca-policy/components', () => ({
+  CompareToolsPanel: () => <div data-testid="compare-tools-panel" />,
+  PortalMessage: () => <div data-testid="portal-message" />,
+}));
+
+jest.mock('@eeacms/volto-cca-policy/helpers', () => ({
+  HTMLField: ({ value }) =>
+    value ? <div dangerouslySetInnerHTML={{ __html: value }} /> : null,
+
+  TextField: ({ label, value }) =>
+    value !== null && value !== undefined && value !== '' ? (
+      <div>
+        <span>{label}</span>
+        <span>{String(value)}</span>
+      </div>
+    ) : null,
+
+  BooleanField: ({ label, value, yesLabel, noLabel }) => (
+    <div>
+      <span>{label}</span>
+      <span>{value ? yesLabel : noLabel}</span>
+    </div>
+  ),
+
+  VocabularyField: ({ label, values = [] }) =>
+    values.length > 0 ? (
+      <div>
+        <span>{label}</span>
+        <span>{values.join(', ')}</span>
+      </div>
+    ) : null,
+
+  ContentMetadata: () => <div data-testid="content-metadata" />,
+  ItemLogo: () => <div data-testid="item-logo" />,
+  DocumentsList: () => <div data-testid="documents-list" />,
+}));
+
+jest.mock('@plone/volto/registry', () => ({
+  blocks: {
+    blocksConfig: {
+      title: {
+        view: ({ metadata }) => <h1>{metadata.title}</h1>,
+      },
+    },
+  },
+}));
+
+jest.mock('../../Search/NavigatorCatalogue/utils', () => ({
+  formatFunctionalityScore: jest.fn((value) => `Formatted score: ${value}`),
+}));
+
+const toggle = jest.fn();
+
+const renderComponent = (content = {}) =>
+  render(
+    <IntlProvider locale="en" messages={{}}>
+      <ExtendedToolView content={content} />
+    </IntlProvider>,
+  );
+
+describe('ExtendedToolView', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+
+    useCompareTools.mockReturnValue({
+      isSelected: false,
+      isLimitReached: false,
+      toggle,
+    });
+  });
+
+  it('renders the title and acronym', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      acronym: 'CT',
+    });
+
+    expect(
+      screen.getByRole('heading', {
+        name: 'Climate Tool (CT)',
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it('renders the title without an acronym', () => {
+    renderComponent({
+      title: 'Climate Tool',
+    });
+
+    expect(
+      screen.getByRole('heading', {
+        name: 'Climate Tool',
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it('renders the open-tool button when a hyperlink is provided', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      hyperlink: 'https://example.com/tool',
+    });
+
+    const openToolButton = screen.getByRole('button', {
+      name: /open tool/i,
+    });
+
+    expect(openToolButton).toHaveAttribute('href', 'https://example.com/tool');
+    expect(openToolButton).toHaveAttribute('target', '_blank');
+    expect(openToolButton).toHaveAttribute('rel', 'noopener noreferrer');
+  });
+
+  it('does not render the open-tool button without a hyperlink', () => {
+    renderComponent({
+      title: 'Climate Tool',
+    });
+
+    expect(
+      screen.queryByRole('button', {
+        name: /open tool/i,
+      }),
+    ).not.toBeInTheDocument();
+  });
+
+  it('adds the tool to comparison when the button is clicked', () => {
+    renderComponent({
+      UID: 'tool-uid',
+      '@id': '/tools/climate-tool',
+      title: 'Climate Tool',
+    });
+
+    fireEvent.click(
+      screen.getByRole('button', {
+        name: /add to comparison/i,
+      }),
+    );
+
+    expect(toggle).toHaveBeenCalledTimes(1);
+  });
+
+  it('passes the correct tool data to useCompareTools', () => {
+    renderComponent({
+      UID: 'tool-uid',
+      '@id': '/tools/climate-tool',
+      title: 'Climate Tool',
+    });
+
+    expect(useCompareTools).toHaveBeenCalledWith({
+      uid: 'tool-uid',
+      title: 'Climate Tool',
+      href: '/tools/climate-tool',
+    });
+  });
+
+  it('disables the comparison button when the tool is selected', () => {
+    useCompareTools.mockReturnValue({
+      isSelected: true,
+      isLimitReached: false,
+      toggle,
+    });
+
+    renderComponent({
+      UID: 'tool-uid',
+      '@id': '/tools/climate-tool',
+      title: 'Climate Tool',
+    });
+
+    const button = screen.getByRole('button', {
+      name: /add to comparison/i,
+    });
+
+    expect(button).toBeDisabled();
+  });
+
+  it('disables the comparison button when the comparison limit is reached', () => {
+    useCompareTools.mockReturnValue({
+      isSelected: false,
+      isLimitReached: true,
+      toggle,
+    });
+
+    renderComponent({
+      UID: 'tool-uid',
+      '@id': '/tools/climate-tool',
+      title: 'Climate Tool',
+    });
+
+    const button = screen.getByRole('button', {
+      name: /add to comparison/i,
+    });
+
+    expect(button).toBeDisabled();
+  });
+
+  it('does not call toggle when the comparison button is disabled', () => {
+    useCompareTools.mockReturnValue({
+      isSelected: true,
+      isLimitReached: false,
+      toggle,
+    });
+
+    renderComponent({
+      UID: 'tool-uid',
+      '@id': '/tools/climate-tool',
+      title: 'Climate Tool',
+    });
+
+    const button = screen.getByRole('button', {
+      name: /add to comparison/i,
+    });
+
+    fireEvent.click(button);
+
+    expect(toggle).not.toHaveBeenCalled();
+  });
+
+  it('does not render the comparison button without a UID', () => {
+    renderComponent({
+      title: 'Climate Tool',
+    });
+
+    expect(
+      screen.queryByRole('button', {
+        name: /add to comparison/i,
+      }),
+    ).not.toBeInTheDocument();
+  });
+
+  it('renders English and the additional available language', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      tool_available_english: true,
+      tool_available_language: 'French',
+    });
+
+    expect(screen.getByText('English, French')).toBeInTheDocument();
+  });
+
+  it('renders only English when no additional language is provided', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      tool_available_english: true,
+    });
+
+    expect(screen.getByText('English')).toBeInTheDocument();
+  });
+
+  it('renders only the additional language when English is unavailable', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      tool_available_english: false,
+      tool_available_language: 'Romanian',
+    });
+
+    expect(screen.getByText('Romanian')).toBeInTheDocument();
+    expect(screen.queryByText(/English,/)).not.toBeInTheDocument();
+  });
+
+  it('does not render an available-language value when none exists', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      tool_available_english: false,
+      tool_available_language: '',
+    });
+
+    expect(screen.queryByText('Available language')).not.toBeInTheDocument();
+  });
+
+  it('formats the functionality score', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      functionality: 4,
+    });
+
+    expect(formatFunctionalityScore).toHaveBeenCalledWith(4);
+    expect(screen.getByText('Formatted score: 4')).toBeInTheDocument();
+  });
+
+  it('formats a functionality score of zero', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      functionality: 0,
+    });
+
+    expect(formatFunctionalityScore).toHaveBeenCalledWith(0);
+    expect(screen.getByText('Formatted score: 0')).toBeInTheDocument();
+  });
+
+  it('does not format an undefined functionality score', () => {
+    renderComponent({
+      title: 'Climate Tool',
+    });
+
+    expect(formatFunctionalityScore).not.toHaveBeenCalled();
+  });
+
+  it('does not format a null functionality score', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      functionality: null,
+    });
+
+    expect(formatFunctionalityScore).not.toHaveBeenCalled();
+  });
+
+  it('renders text fields', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      tool_provider: 'Example Provider',
+      public_private_mode: 'Public',
+      spatial_resolution: 'Regional',
+      underlying_data_maintenance: 'Updated yearly',
+      strengths_and_possible_limitations: 'Easy to use',
+    });
+
+    expect(screen.getByText('Example Provider')).toBeInTheDocument();
+    expect(screen.getByText('Public')).toBeInTheDocument();
+    expect(screen.getByText('Regional')).toBeInTheDocument();
+    expect(screen.getByText('Updated yearly')).toBeInTheDocument();
+    expect(screen.getByText('Easy to use')).toBeInTheDocument();
+  });
+
+  it('renders coder fields', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      coder_1: 'Coder One',
+      coder_2: 'Coder Two',
+    });
+
+    expect(screen.getByText('Coder1')).toBeInTheDocument();
+    expect(screen.getByText('Coder One')).toBeInTheDocument();
+    expect(screen.getByText('Coder2')).toBeInTheDocument();
+    expect(screen.getByText('Coder Two')).toBeInTheDocument();
+  });
+
+  it('renders HTML descriptions', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      long_description: '<p>Long tool description</p>',
+      description: '<p>Short tool description</p>',
+    });
+
+    expect(screen.getByText('Long tool description')).toBeInTheDocument();
+    expect(screen.getByText('Short tool description')).toBeInTheDocument();
+  });
+
+  it('renders boolean fields with YES values', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      only_interactive_support_tool: true,
+      adaptation_cycle_step: true,
+      updating_cycle_of_the_tool: true,
+      language_accessibility: true,
+      free_access: true,
+    });
+
+    expect(screen.getAllByText('YES')).toHaveLength(5);
+  });
+
+  it('renders boolean fields with NO values', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      only_interactive_support_tool: false,
+      adaptation_cycle_step: false,
+      updating_cycle_of_the_tool: false,
+      language_accessibility: false,
+      free_access: false,
+    });
+
+    expect(screen.getAllByText('NO')).toHaveLength(5);
+  });
+
+  it('renders vocabulary fields', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      intended_user_groups: ['Policy makers', 'Researchers'],
+      place_of_implementation: ['Europe'],
+      type_of_data: ['Climate data'],
+      data_sources: ['Satellite'],
+      license_status: ['Open source'],
+      user_support_provisions: ['Documentation'],
+      tool_validation_use: ['Validated'],
+      number_of_users_tool: ['More than 1,000'],
+      tool_provider_mode: ['Public provider'],
+      adaptation_support_cycle_step: ['Assessing risks'],
+      type_of_outputs: ['Maps'],
+      temporality_of_data: ['Historical'],
+    });
+
+    expect(screen.getByText('Policy makers, Researchers')).toBeInTheDocument();
+    expect(screen.getByText('Europe')).toBeInTheDocument();
+    expect(screen.getByText('Climate data')).toBeInTheDocument();
+    expect(screen.getByText('Satellite')).toBeInTheDocument();
+    expect(screen.getByText('Open source')).toBeInTheDocument();
+    expect(screen.getByText('Documentation')).toBeInTheDocument();
+    expect(screen.getByText('Validated')).toBeInTheDocument();
+    expect(screen.getByText('More than 1,000')).toBeInTheDocument();
+    expect(screen.getByText('Public provider')).toBeInTheDocument();
+    expect(screen.getByText('Assessing risks')).toBeInTheDocument();
+    expect(screen.getByText('Maps')).toBeInTheDocument();
+    expect(screen.getByText('Historical')).toBeInTheDocument();
+  });
+
+  it('renders accessibility and usability as a vocabulary value', () => {
+    renderComponent({
+      title: 'Climate Tool',
+      accessibility_and_usability: 'Easy to use',
+    });
+
+    expect(screen.getByText('Easy to use')).toBeInTheDocument();
+  });
+
+  it('renders supporting components', () => {
+    renderComponent({
+      title: 'Climate Tool',
+    });
+
+    expect(screen.getByTestId('item-logo')).toBeInTheDocument();
+    expect(screen.getByTestId('compare-tools-panel')).toBeInTheDocument();
+    expect(screen.getByTestId('portal-message')).toBeInTheDocument();
+    expect(screen.getByTestId('content-metadata')).toBeInTheDocument();
+    expect(screen.getByTestId('documents-list')).toBeInTheDocument();
+  });
+});

package/src/constants.js

@@ -7,6 +7,7 @@ export const ORGANISATION = 'eea.climateadapt.organisation';
 export const ACE_PROJECT = 'eea.climateadapt.aceproject';
 export const PUBLICATION_REPORT = 'eea.climateadapt.publicationreport';
 export const TOOL = 'eea.climateadapt.tool';
+export const EXTENDED_TOOL = 'eea.climateadapt.extendedtool';
 export const VIDEO = 'eea.climateadapt.video';
 export const C3S_INDICATOR = 'eea.climateadapt.c3sindicator';
 export const MISSION_SIGNATORY_PROFILE = 'mission_signatory_profile';

package/src/customizations/@plone-collective/volto-rss-provider/express-middleware.js

@@ -46,7 +46,7 @@ async function getRssFeedData(apiPath, APISUFFIX, req, settings) {
       .accept('json')
       .use(addHeadersFactory(req));
 
-    const authToken = req.universalCookies?.get?.('auth_token');
+    const authToken = req.universalCookies?.get?.('auth_token'); //betterleaks:allow
     if (authToken) {
       request.set('Authorization', `Bearer ${authToken}`);
     }

package/src/customizations/volto/components/theme/View/LinkView.jsx

@@ -39,7 +39,7 @@ class LinkView extends Component {
    */
   static defaultProps = {
     content: null,
-    token: null,
+    token: null, //betterleaks:allow
   };
 
   componentDidMount() {

package/src/customizations/volto/reducers/breadcrumbs/breadcrumbs.js

@@ -67,7 +67,7 @@ export default function breadcrumbs(state = initialState, action = {}) {
         'breadcrumbs',
         getBaseUrl(flattenToAppURL(action.result['@id'])),
       );
-      if (!hasExpander) {
+      if (action.manual || !hasExpander) {
         return {
           ...state,
           error: null,

package/src/customizations/volto/server.jsx

@@ -238,7 +238,7 @@ server.get('/*', (req, res) => {
       .toString(),
   );
 
-  const authToken = req.universalCookies.get('auth_token');
+  const authToken = req.universalCookies.get('auth_token'); //betterleaks:allow
   const initialState = {
     userSession: { ...userSession(), token: authToken },
     form: req.body,

package/src/helpers/Utils.jsx

@@ -62,6 +62,35 @@ export const HTMLField = ({ value, className }) => {
   );
 };
 
+export const TextField = ({ label, value }) => {
+  if (value === null || value === undefined || value === '') return null;
+
+  return (
+    <>
+      <h5>{label}</h5>
+      <p>{value}</p>
+    </>
+  );
+};
+
+export const BooleanField = ({ label, value, yesLabel, noLabel }) => (
+  <TextField label={label} value={value ? yesLabel : noLabel} />
+);
+
+export const VocabularyField = ({ label, values }) => {
+  if (!values?.length) return null;
+
+  return (
+    <TextField
+      label={label}
+      value={values
+        .map((value) => value?.title || value?.token || value)
+        .filter(Boolean)
+        .join(', ')}
+    />
+  );
+};
+
 export const ExternalLink = (props) => {
   let { url, text } = props;
 

package/src/helpers/index.js

@@ -1,6 +1,9 @@
 import { OBSERVATORY_PARTNERS } from '@eeacms/volto-cca-policy/constants';
 export {
   HTMLField,
+  TextField,
+  BooleanField,
+  VocabularyField,
   ExternalLink,
   PublishedModifiedInfo,
   LinksList,

package/src/index.js

@@ -13,11 +13,13 @@ import {
   MissionSignatoryProfileView,
   CreateArchivedCopyButton,
   ImageWidget,
+  CompareToolsView,
 } from '@eeacms/volto-cca-policy/components';
 
 import CcaEventView from './components/theme/Views/CcaEventView';
 import NewsItemView from './components/theme/Views/NewsItemView';
 import EventView from './components/theme/Views/EventView';
+import ExtendedToolView from './components/theme/Views/ExtendedToolView';
 import AdaptationOptionView from './components/theme/Views/AdaptationOptionView';
 import CaseStudyView from './components/theme/Views/CaseStudyView';
 import ProjectView from './components/theme/Views/ProjectView';
@@ -33,6 +35,7 @@ import {
   ACE_PROJECT,
   PUBLICATION_REPORT,
   TOOL,
+  EXTENDED_TOOL,
   VIDEO,
   C3S_INDICATOR,
   CCA_EVENT,
@@ -47,6 +50,11 @@ import GeocharsWidget from './components/theme/Widgets/GeocharsWidget';
 import PromotionalImageWidget from './components/theme/Widgets/PromotionalImageWidget';
 import HealthHorizontalCardItem from './components/Result/HealthHorizontalCardItem';
 import ClusterHorizontalCardItem from './components/Result/ClusterHorizontalCardItem';
+import NavigatorCatalogueCardItem from './components/Search/NavigatorCatalogue/NavigatorCatalogueCardItem';
+import NavigatorCatalogueMapView from './components/Search/NavigatorCatalogue/NavigatorCatalogueMapView';
+import NavigatorCatalogueContentView from './components/Search/NavigatorCatalogue/NavigatorCatalogueContentView';
+import NavigatorGuideLayout from './components/Search/NavigatorGuide/NavigatorGuideLayout';
+import NavigatorGuideContentView from './components/Search/NavigatorGuide/NavigatorGuideContentView';
 
 import { langRedirection } from './store/middleware';
 
@@ -357,6 +365,7 @@ const applyConfig = (config) => {
     [EVENT]: EventView,
     [CCA_EVENT]: CcaEventView,
     [TOOL]: DatabaseItemView,
+    [EXTENDED_TOOL]: ExtendedToolView,
     [INDICATOR]: DatabaseItemView,
     [ORGANISATION]: DatabaseItemView,
     [GUIDANCE]: DatabaseItemView,
@@ -415,6 +424,21 @@ const applyConfig = (config) => {
   config.settings.searchlib.resolve.ClusterHorizontalCardItem = {
     component: ClusterHorizontalCardItem,
   };
+  config.settings.searchlib.resolve.NavigatorCatalogueCardItem = {
+    component: NavigatorCatalogueCardItem,
+  };
+  config.settings.searchlib.resolve.NavigatorCatalogueMapView = {
+    component: NavigatorCatalogueMapView,
+  };
+  config.settings.searchlib.resolve.NavigatorCatalogueContentView = {
+    component: NavigatorCatalogueContentView,
+  };
+  config.settings.searchlib.resolve.NavigatorGuideLayout = {
+    component: NavigatorGuideLayout,
+  };
+  config.settings.searchlib.resolve.NavigatorGuideContentView = {
+    component: NavigatorGuideContentView,
+  };
   // Custom widgets
   config.widgets.id.geochars = GeocharsWidget;
   config.widgets.id.geolocation = GeolocationWidget;
@@ -431,6 +455,7 @@ const applyConfig = (config) => {
     { cssClass: 'large-text', label: 'Large text' },
     { cssClass: 'medium-text', label: 'Medium text' },
     { cssClass: 'small-text', label: 'Small text' },
+    { cssClass: 'green-text', label: 'Green text' },
   ];
 
   // TODO: fix in all languages
@@ -493,13 +518,17 @@ const applyConfig = (config) => {
       path: `/broken-links`,
       component: BrokenLinks,
     },
-
+    {
+      path: `*/navigator/compare`,
+      component: CompareToolsView,
+    },
     ...(config.addonRoutes || []),
   ];
 
   config.settings.nonContentRoutes = [
     ...config.settings.nonContentRoutes,
     '/broken-links',
+    '/navigator/compare',
   ];
 
   config.settings.appExtras = [
@@ -565,7 +594,7 @@ const applyConfig = (config) => {
 
   config.settings.themeColors = [
     ...config.settings.themeColors,
-    { value: 'green', title: 'EEA Green' },
+    { value: 'green', title: 'Green' },
   ];
 
   config.settings.matomoTrackerIdFn = (pathname) => {

package/src/search/index.js

@@ -5,6 +5,8 @@ import installMissionToolsSearch from './mission_tools/config-tools';
 import installMissionProjectsSearch from './mission_projects/config-projects';
 import installMissionFundingSearch from './mission_funding/config-funding';
 import installMissionAllSearch from './mission_all/config-all';
+import installNavigatorCatalogueSearch from './navigator_catalogue/config';
+import installNavigatorGuideSearch from './navigator_guide/config';
 
 const extraQueryParams = {
   text_fields: [
@@ -35,6 +37,8 @@ const applyConfig = (config) => {
     installMissionToolsSearch,
     installMissionFundingSearch,
     installMissionAllSearch,
+    installNavigatorCatalogueSearch,
+    installNavigatorGuideSearch,
   ].reduce((acc, cur) => cur(acc), config.settings.searchlib);
 
   const searchui = config.settings.searchlib.searchui;
@@ -44,6 +48,8 @@ const applyConfig = (config) => {
   searchui.missionStoriesSearch.extraQueryParams = extraQueryParams;
   searchui.missionToolsSearch.extraQueryParams = extraQueryParams;
   searchui.missionAll.extraQueryParams = extraQueryParams;
+  searchui.navigatorCatalogueSearch.extraQueryParams = extraQueryParams;
+  searchui.navigatorGuideSearch.extraQueryParams = extraQueryParams;
 
   // console.log(config.settings.searchlib);