@eeacms/volto-cca-policy 1.0.36 → 1.0.38

package/src/components/Search/NavigatorCatalogue/NavigatorCatalogueMapView.test.jsx

@@ -3,7 +3,9 @@ import {
   getColorForCount,
   normalizeCountryName,
   buildCountryCounts,
+  clearMapIncompatibleGeographicFilters,
   filterCountryCounts,
+  hasMapIncompatibleGeographicSelection,
   mapLegendItems,
   setCountryFilter,
 } from './utils';
@@ -185,6 +187,92 @@ describe('filterCountryCounts', () => {
   });
 });
 
+describe('hasMapIncompatibleGeographicSelection', () => {
+  it('allows no geographic selection and country selections', () => {
+    expect(hasMapIncompatibleGeographicSelection()).toBe(false);
+    expect(hasMapIncompatibleGeographicSelection([])).toBe(false);
+    expect(
+      hasMapIncompatibleGeographicSelection([
+        {
+          field: 'cca_geographic_countries.keyword',
+          values: [],
+          type: 'any',
+        },
+      ]),
+    ).toBe(false);
+    expect(
+      hasMapIncompatibleGeographicSelection([
+        {
+          field: 'cca_geographic_countries.keyword',
+          values: ['Germany'],
+          type: 'any',
+        },
+      ]),
+    ).toBe(false);
+  });
+
+  it('rejects Global, Europe, and transnational selections', () => {
+    expect(
+      hasMapIncompatibleGeographicSelection([
+        {
+          field: 'cca_navigator_geographic_scope',
+          values: ['Global', 'Europe'],
+          type: 'any',
+        },
+        {
+          field: 'cca_geographic_transnational_region.keyword',
+          values: ['Alpine Space'],
+          type: 'any',
+        },
+      ]),
+    ).toBe(true);
+  });
+});
+
+describe('clearMapIncompatibleGeographicFilters', () => {
+  it('clears only map-incompatible geographic filters', () => {
+    const searchContext = {
+      filters: [
+        {
+          field: 'cca_navigator_geographic_scope',
+          values: ['Europe'],
+          type: 'any',
+        },
+        {
+          field: 'cca_geographic_transnational_region.keyword',
+          values: ['Alpine Space'],
+          type: 'any',
+        },
+        {
+          field: 'cca_geographic_countries.keyword',
+          values: ['Germany'],
+          type: 'any',
+        },
+        {
+          field: 'cca_climate_impacts.keyword',
+          values: ['Flooding'],
+          type: 'any',
+        },
+      ],
+      removeFilter: jest.fn(),
+    };
+
+    clearMapIncompatibleGeographicFilters(searchContext);
+
+    expect(searchContext.removeFilter).toHaveBeenCalledTimes(2);
+    expect(searchContext.removeFilter).toHaveBeenCalledWith(
+      'cca_navigator_geographic_scope',
+      null,
+      'any',
+    );
+    expect(searchContext.removeFilter).toHaveBeenCalledWith(
+      'cca_geographic_transnational_region.keyword',
+      null,
+      'any',
+    );
+  });
+});
+
 describe('mapLegendItems', () => {
   it('has 5 legend items', () => {
     expect(mapLegendItems).toHaveLength(5);

package/src/components/Search/NavigatorCatalogue/NavigatorGeographicCoverageFacet.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { Button, Card, Icon } from 'semantic-ui-react';
 import { defineMessages, useIntl } from 'react-intl';
 import { Term } from '@eeacms/search/components';
-import { useSearchContext } from '@eeacms/search/lib/hocs';
+import { useSearchContext, useViews } from '@eeacms/search/lib/hocs';
 import { markSelectedFacetValuesFromFilters } from '@eeacms/search/lib/search/helpers';
 import {
   CHARACTERISATION_FIELD,
@@ -70,6 +70,7 @@ const FacetOption = ({ field, option, onChange }) => {
 };
 
 const ExpandableFacetGroup = ({
+  defaultOpen = false,
   field,
   id,
   label,
@@ -78,11 +79,11 @@ const ExpandableFacetGroup = ({
   onChange,
 }) => {
   const hasSelection = options.some(({ selected }) => selected);
-  const [isOpen, setIsOpen] = React.useState(hasSelection);
+  const [isOpen, setIsOpen] = React.useState(hasSelection || defaultOpen);
 
   React.useEffect(() => {
-    if (hasSelection) setIsOpen(true);
-  }, [hasSelection]);
+    if (hasSelection || defaultOpen) setIsOpen(true);
+  }, [defaultOpen, hasSelection]);
 
   return (
     <div className="navigator-geographic-facet-group">
@@ -119,16 +120,10 @@ const ExpandableFacetGroup = ({
   );
 };
 
-const NavigatorActiveFilters = ({ filters, onRemove }) => {
+const NavigatorActiveFilters = ({ fields, filters, onRemove }) => {
   const intl = useIntl();
-  const geographicFields = [
-    CHARACTERISATION_FIELD,
-    TRANSNATIONAL_REGION_FIELD,
-    COUNTRIES_FIELD,
-  ];
   const activeFilters = filters.filter(
-    ({ field, values }) =>
-      geographicFields.includes(field) && values?.length > 0,
+    ({ field, values }) => fields.includes(field) && values?.length > 0,
   );
 
   if (!activeFilters.length) return null;
@@ -190,6 +185,8 @@ const NavigatorGeographicCoverageFacet = ({
 }) => {
   const intl = useIntl();
   const { addFilter, facets, filters = [], removeFilter } = useSearchContext();
+  const { activeViewId } = useViews();
+  const isMapView = activeViewId === 'map';
   const transnationalOptions = getFacetOptions(
     facets,
     filters,
@@ -219,6 +216,7 @@ const NavigatorGeographicCoverageFacet = ({
     }
 
     clearFilter(CHARACTERISATION_FIELD);
+    if (isMapView) clearFilter(TRANSNATIONAL_REGION_FIELD);
     addFilter(field, option.value, 'any');
   };
 
@@ -226,25 +224,28 @@ const NavigatorGeographicCoverageFacet = ({
     <fieldset
       className={`sui-facet searchlib-multiterm-facet navigator-geographic-facet ${className}`}
     >
-      <div className="sui-multi-checkbox-facet navigator-geographic-facet-direct-options">
-        {options.map((option) => {
-          const directOption = {
-            ...option,
-            selected:
-              option.selected || selectedDirectValues.includes(option.value),
-          };
+      {!isMapView && (
+        <div className="sui-multi-checkbox-facet navigator-geographic-facet-direct-options">
+          {options.map((option) => {
+            const directOption = {
+              ...option,
+              selected:
+                option.selected || selectedDirectValues.includes(option.value),
+            };
 
-          return (
-            <FacetOption
-              key={valueAsText(option.value)}
-              field={CHARACTERISATION_FIELD}
-              option={directOption}
-              onChange={updateDirectFilter}
-            />
-          );
-        })}
-      </div>
+            return (
+              <FacetOption
+                key={valueAsText(option.value)}
+                field={CHARACTERISATION_FIELD}
+                option={directOption}
+                onChange={updateDirectFilter}
+              />
+            );
+          })}
+        </div>
+      )}
       <ExpandableFacetGroup
+        defaultOpen={isMapView}
         field={COUNTRIES_FIELD}
         id="navigator-geographic-countries"
         label={intl.formatMessage(countriesLabel)}
@@ -252,17 +253,24 @@ const NavigatorGeographicCoverageFacet = ({
         options={countryOptions}
         onChange={(option) => updateChildFilter(COUNTRIES_FIELD, option)}
       />
-      <ExpandableFacetGroup
-        field={TRANSNATIONAL_REGION_FIELD}
-        id="navigator-geographic-transnational-regions"
-        label={intl.formatMessage(transnationalRegionsLabel)}
-        emptyMessage={intl.formatMessage(messages.noOptionsAvailable)}
-        options={transnationalOptions}
-        onChange={(option) =>
-          updateChildFilter(TRANSNATIONAL_REGION_FIELD, option)
-        }
-      />
+      {!isMapView && (
+        <ExpandableFacetGroup
+          field={TRANSNATIONAL_REGION_FIELD}
+          id="navigator-geographic-transnational-regions"
+          label={intl.formatMessage(transnationalRegionsLabel)}
+          emptyMessage={intl.formatMessage(messages.noOptionsAvailable)}
+          options={transnationalOptions}
+          onChange={(option) =>
+            updateChildFilter(TRANSNATIONAL_REGION_FIELD, option)
+          }
+        />
+      )}
       <NavigatorActiveFilters
+        fields={[
+          CHARACTERISATION_FIELD,
+          TRANSNATIONAL_REGION_FIELD,
+          COUNTRIES_FIELD,
+        ]}
         filters={filters}
         onRemove={(field, value, type) => removeFilter(field, value, type)}
       />

package/src/components/Search/NavigatorCatalogue/NavigatorGeographicCoverageFacet.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import '@testing-library/jest-dom';
 import { fireEvent, render, screen } from '@testing-library/react';
 import { IntlProvider } from 'react-intl';
-import { useSearchContext } from '@eeacms/search/lib/hocs';
+import { useSearchContext, useViews } from '@eeacms/search/lib/hocs';
 import NavigatorGeographicCoverageFacet from './NavigatorGeographicCoverageFacet';
 import {
   CHARACTERISATION_FIELD,
@@ -15,9 +15,11 @@ jest.mock('@eeacms/search/components', () => ({
 }));
 jest.mock('@eeacms/search/lib/hocs', () => ({
   useSearchContext: jest.fn(),
+  useViews: jest.fn(),
 }));
 
 const renderFacet = ({
+  activeViewId = 'listing',
   detailedOptions = true,
   filters = [],
   onRemove = jest.fn(),
@@ -26,6 +28,8 @@ const renderFacet = ({
   const addFilter = jest.fn();
   const removeFilter = jest.fn();
 
+  useViews.mockReturnValue({ activeViewId });
+
   useSearchContext.mockReturnValue({
     addFilter,
     removeFilter,
@@ -190,4 +194,64 @@ describe('NavigatorGeographicCoverageFacet', () => {
       screen.getByRole('button', { name: 'Transnational regions' }),
     ).toBeEnabled();
   });
+
+  it('shows only countries in the map view', () => {
+    renderFacet({ activeViewId: 'map' });
+
+    expect(screen.queryByLabelText('Europe')).not.toBeInTheDocument();
+    expect(screen.queryByLabelText('Global')).not.toBeInTheDocument();
+    expect(screen.getByRole('button', { name: 'Countries' })).toHaveAttribute(
+      'aria-expanded',
+      'true',
+    );
+    expect(screen.getByLabelText('Germany')).toBeVisible();
+    expect(
+      screen.queryByRole('button', { name: 'Transnational regions' }),
+    ).not.toBeInTheDocument();
+  });
+
+  it('clears hidden geographic filters when selecting a country on the map', () => {
+    const { addFilter, removeFilter } = renderFacet({
+      activeViewId: 'map',
+      filters: [
+        {
+          field: TRANSNATIONAL_REGION_FIELD,
+          values: ['Alpine Space'],
+          type: 'any',
+        },
+      ],
+    });
+
+    fireEvent.click(screen.getByLabelText('Germany'));
+
+    expect(removeFilter).toHaveBeenCalledWith(
+      CHARACTERISATION_FIELD,
+      null,
+      'any',
+    );
+    expect(removeFilter).toHaveBeenCalledWith(
+      TRANSNATIONAL_REGION_FIELD,
+      null,
+      'any',
+    );
+    expect(addFilter).toHaveBeenCalledWith(COUNTRIES_FIELD, 'Germany', 'any');
+  });
+
+  it('shows hidden active geographic filters in the map view', () => {
+    renderFacet({
+      activeViewId: 'map',
+      detailedOptions: false,
+      filters: [
+        {
+          field: CHARACTERISATION_FIELD,
+          values: ['Europe'],
+          type: 'any',
+        },
+      ],
+    });
+
+    expect(screen.queryByLabelText('Europe')).not.toBeInTheDocument();
+    expect(screen.getByText('Active filters:')).toBeInTheDocument();
+    expect(screen.getByText('Europe')).toBeInTheDocument();
+  });
 });

package/src/components/Search/NavigatorCatalogue/utils.js

@@ -61,6 +61,30 @@ export const filterCountryCounts = (countryCounts, filters) => {
   );
 };
 
+const mapIncompatibleGeographicFields = new Set([
+  'cca_navigator_geographic_scope',
+  'cca_geographic_transnational_region.keyword',
+]);
+
+export const hasMapIncompatibleGeographicSelection = (filters) =>
+  Boolean(
+    filters?.find(
+      ({ field, values }) =>
+        mapIncompatibleGeographicFields.has(field) && values?.length > 0,
+    ),
+  );
+
+export const clearMapIncompatibleGeographicFilters = (searchContext) => {
+  searchContext?.filters
+    ?.filter(
+      ({ field, values }) =>
+        mapIncompatibleGeographicFields.has(field) && values?.length > 0,
+    )
+    .forEach(({ field, type = 'any' }) =>
+      searchContext.removeFilter(field, null, type),
+    );
+};
+
 export const setCountryFilter = (searchContext, countryName) => {
   searchContext?.setFilter(
     'cca_geographic_countries.keyword',

package/src/components/Search/NavigatorGuide/NavigatorGuideContentView.test.jsx

@@ -268,3 +268,70 @@ describe('NavigatorGuideContentView climate hazards', () => {
     ).toHaveTextContent('Flooding');
   });
 });
+
+describe('NavigatorGuideContentView actions', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    useSelector.mockReturnValue('en');
+    useSearchDriver.mockReturnValue(undefined);
+    useGuideFacetOptions.mockReturnValue({
+      'cca_adaptation_sectors.keyword': ['Water'],
+    });
+  });
+
+  it('removes a selected option from the current step', () => {
+    const removeFilter = jest.fn();
+    useAtom.mockReturnValue([0, jest.fn()]);
+    useHistory.mockReturnValue({ push: jest.fn() });
+
+    renderGuide(
+      { title: 'Guide tool', href: '/tools/guide-tool' },
+      {
+        removeFilter,
+        facets: {
+          'cca_adaptation_sectors.keyword': [
+            { data: [{ value: 'Water', count: 4 }] },
+          ],
+        },
+      },
+    );
+
+    fireEvent.click(screen.getByText('Water'));
+
+    expect(removeFilter).toHaveBeenCalledWith(
+      'cca_adaptation_sectors.keyword',
+      'Water',
+      'all',
+    );
+  });
+
+  it('opens catalogue results with only supported Guide filters', () => {
+    const history = { push: jest.fn() };
+    useAtom.mockReturnValue([0, jest.fn()]);
+    useHistory.mockReturnValue(history);
+
+    renderGuide(
+      { title: 'Guide tool', href: '/tools/guide-tool' },
+      {
+        filters: [
+          {
+            field: 'cca_adaptation_sectors.keyword',
+            values: ['Water'],
+            type: 'all',
+          },
+          { field: 'unrelated.keyword', values: ['Ignored'], type: 'any' },
+        ],
+      },
+    );
+
+    fireEvent.click(screen.getByRole('button', { name: 'Skip to results' }));
+
+    expect(history.push).toHaveBeenCalledWith(
+      expect.objectContaining({
+        pathname: '/en/navigator/tool-catalogue',
+        search: expect.any(String),
+      }),
+    );
+    expect(history.push.mock.calls[0][0].search).not.toContain('unrelated');
+  });
+});

package/src/components/theme/CompareTools/CompareToolsView.test.jsx

@@ -12,6 +12,7 @@ import { useAtom } from 'jotai';
 import { useDispatch, useSelector } from 'react-redux';
 import { useHistory, useLocation } from 'react-router-dom';
 import CompareToolsView from './CompareToolsView';
+import { exportComparisonTable } from '../../Search/NavigatorCatalogue/utils';
 import { fetchResultsByUid } from './utils';
 
 jest.mock('jotai', () => ({
@@ -62,6 +63,11 @@ jest.mock('./utils', () => ({
   getPathname: (url) => url?.split('?')[0] || '',
 }));
 
+jest.mock('../../Search/NavigatorCatalogue/utils', () => ({
+  ...jest.requireActual('../../Search/NavigatorCatalogue/utils'),
+  exportComparisonTable: jest.fn(),
+}));
+
 describe('CompareToolsView', () => {
   beforeEach(() => {
     jest.clearAllMocks();
@@ -246,4 +252,57 @@ describe('CompareToolsView', () => {
     expect(thumbnail.querySelector('img')).not.toBeInTheDocument();
     expect(thumbnail.querySelector('.ri-file-line')).toBeInTheDocument();
   });
+
+  it('removes a tool from the selection and URL', async () => {
+    const setSelectedTools = jest.fn();
+    const history = { push: jest.fn() };
+    useAtom.mockReturnValue([[], setSelectedTools]);
+    useHistory.mockReturnValue(history);
+
+    render(
+      <IntlProvider locale="en">
+        <CompareToolsView />
+      </IntlProvider>,
+    );
+    await screen.findByRole('table', { name: 'Compare tools' });
+
+    fireEvent.click(
+      screen.getByRole('button', {
+        name: 'Remove Tool one from comparison',
+      }),
+    );
+
+    const updateSelection = setSelectedTools.mock.calls[0][0];
+    expect(updateSelection([{ uid: 'one' }, { uid: 'two' }])).toEqual([
+      { uid: 'two' },
+    ]);
+    expect(history.push).toHaveBeenCalledWith({
+      pathname: '/en/navigator/compare',
+      search: '?uid=two',
+      hash: '',
+      state: {},
+    });
+  });
+
+  it('exports comparison data with only applicable table options', async () => {
+    render(
+      <IntlProvider locale="en">
+        <CompareToolsView />
+      </IntlProvider>,
+    );
+    await screen.findByRole('table', { name: 'Compare tools' });
+
+    fireEvent.click(screen.getByRole('button', { name: 'Export table' }));
+
+    expect(exportComparisonTable).toHaveBeenCalledTimes(1);
+    const [exportedTools] = exportComparisonTable.mock.calls[0];
+    expect(exportedTools[0].comparisonOptions).toEqual(
+      expect.objectContaining({
+        cca_type_of_outputs: ['Maps and graphs'],
+        cca_adaptation_support_cycle_step: [
+          'Step 2: Assessing Climate Change Risks and Vulnerabilities',
+        ],
+      }),
+    );
+  });
 });

package/src/components/theme/Footer/Footer.jsx

@@ -0,0 +1,137 @@
+/**
+ * Policy Footer component.
+ * @module components/theme/Footer/Footer
+ */
+
+import React from 'react';
+import { useIntl } from 'react-intl';
+import { useSelector, shallowEqual } from 'react-redux';
+import { flattenToAppURL } from '@plone/volto/helpers/Url/Url';
+import EEAFooter from '@eeacms/volto-eea-design-system/ui/Footer/Footer';
+import config from '@plone/volto/registry';
+import isArray from 'lodash/isArray';
+import messages from '@eeacms/volto-cca-policy/messages';
+
+const footerMessages = [
+  messages.sitemap,
+  messages.managedBy,
+  messages.exploreEnvironmentalInformationSystems,
+  messages.about,
+  messages.aboutUs,
+  messages.contact,
+  messages.contactUs,
+  messages.help,
+  messages.privacy,
+  messages.privacyStatement,
+  messages.accessibility,
+  messages.legalNotice,
+  messages.dashboard,
+  messages.login,
+  messages.cmsLogin,
+].reduce((result, message) => ({ ...result, [message.id]: message }), {});
+
+const Footer = () => {
+  const intl = useIntl();
+  const { eea } = config.settings;
+  const {
+    footerActions,
+    copyrightActions,
+    socialActions,
+    contactActions,
+    contactExtraActions,
+  } = useSelector(
+    (state) => ({
+      footerActions: state.actions?.actions?.footer_actions,
+      copyrightActions: state.actions?.actions?.copyright_actions,
+      socialActions: state.actions?.actions?.social_actions,
+      contactActions: state.actions?.actions?.contact_actions,
+      contactExtraActions: state.actions?.actions?.contact_extra_actions,
+    }),
+    shallowEqual,
+  );
+
+  const translate = (text) =>
+    footerMessages[text] ? intl.formatMessage(footerMessages[text]) : text;
+
+  // ZMI > portal_actions > footer_actions
+  const actions = isArray(footerActions)
+    ? footerActions.map((action) => ({
+        title: translate(action.title),
+        url: flattenToAppURL(action.url),
+      }))
+    : eea.footerOpts.actions?.map((action) => ({
+        ...action,
+        title: translate(action.title),
+      }));
+
+  // ZMI > portal_actions > copyright_actions
+  const copyright = isArray(copyrightActions)
+    ? copyrightActions.map((action) => ({
+        title: translate(action.title),
+        site: translate(action.title),
+        url: flattenToAppURL(action.url),
+      }))
+    : eea.footerOpts.copyright?.map((action) => ({
+        ...action,
+        title: translate(action.title),
+        site: translate(action.site),
+      }));
+
+  // ZMI > portal_actions > social_actions
+  const social = isArray(socialActions)
+    ? socialActions.map((action) => ({
+        name: action.id,
+        icon: action.icon,
+        url: action.url,
+      }))
+    : eea.footerOpts.social;
+
+  // ZMI > portal_actions > contact_actions
+  const contacts = isArray(contactActions)
+    ? contactActions.map((action, idx) => ({
+        text: translate(action.title),
+        icon: action.icon,
+        url: flattenToAppURL(action.url),
+        children:
+          idx === 0
+            ? (contactExtraActions || []).map((child) => ({
+                text: translate(child.title),
+                icon: child.icon,
+                url: flattenToAppURL(child.url),
+              }))
+            : [],
+      }))
+    : eea.footerOpts.contacts?.map((contact) => ({
+        ...contact,
+        text: translate(contact.text),
+        children: contact.children?.map((child) => ({
+          ...child,
+          text: translate(child.text),
+        })),
+      }));
+
+  // Update options with actions from backend
+  const options = {
+    ...eea.footerOpts,
+    social,
+    contacts,
+  };
+
+  return (
+    <EEAFooter>
+      <EEAFooter.Header>
+        {translate(eea.footerOpts.logosHeader)}
+      </EEAFooter.Header>
+      <EEAFooter.SubFooter {...options} />
+      <EEAFooter.Header>{translate(eea.footerOpts.header)}</EEAFooter.Header>
+      <EEAFooter.SitesButton
+        buttonName={translate(eea.footerOpts.buttonName)}
+        hrefButton={eea.footerOpts.hrefButton}
+      />
+      <EEAFooter.Social {...options} />
+      <EEAFooter.Actions actions={actions} copyright={copyright} />
+    </EEAFooter>
+  );
+};
+
+export default Footer;

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

@@ -25,7 +25,7 @@ import { injectIntl } from 'react-intl';
 import Error from '@plone/volto/error';
 
 import Breadcrumbs from '@plone/volto/components/theme/Breadcrumbs/Breadcrumbs';
-import Footer from '@plone/volto/components/theme/Footer/Footer';
+import Footer from '@eeacms/volto-cca-policy/components/theme/Footer/Footer';
 import Header from '@plone/volto/components/theme/Header/Header';
 import Icon from '@plone/volto/components/theme/Icon/Icon';
 import OutdatedBrowser from '@plone/volto/components/theme/OutdatedBrowser/OutdatedBrowser';