@eeacms/volto-cca-policy 0.3.131 → 1.0.0

package/src/components/MigrationButtons.jsx

@@ -1,5 +1,9 @@
 import { Plug } from '@plone/volto/components/manage/Pluggable';
-import { getBaseUrl, toPublicURL, addAppURL } from '@plone/volto/helpers';
+import {
+  getBaseUrl,
+  toPublicURL,
+  addAppURL,
+} from '@plone/volto/helpers/Url/Url';
 
 const button = (id, title, label, destination) => (
   <button

package/src/components/manage/Blocks/ASTNavigation/ASTNavigationEdit.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 
-import { BlockDataForm, SidebarPortal } from '@plone/volto/components';
+import BlockDataForm from '@plone/volto/components/manage/Form/BlockDataForm';
+import SidebarPortal from '@plone/volto/components/manage/Sidebar/SidebarPortal';
 
 import ASTNavigationView from './ASTNavigationView';
 import schema from './schema';

package/src/components/manage/Blocks/ASTNavigation/ASTNavigationView.jsx

@@ -1,10 +1,16 @@
 import loadable from '@loadable/component';
 
-const ASTLogoMap = loadable(() =>
-  import('@eeacms/volto-cca-policy/components/theme/ASTNavigation/ASTLogoMap'),
+const ASTLogoMap = loadable(
+  () =>
+    import(
+      '@eeacms/volto-cca-policy/components/theme/ASTNavigation/ASTLogoMap'
+    ),
 );
-const UASTLogoMap = loadable(() =>
-  import('@eeacms/volto-cca-policy/components/theme/ASTNavigation/UASTLogoMap'),
+const UASTLogoMap = loadable(
+  () =>
+    import(
+      '@eeacms/volto-cca-policy/components/theme/ASTNavigation/UASTLogoMap'
+    ),
 );
 
 export default function ASTNavigationView(props) {

package/src/components/manage/Blocks/ASTNavigation/ASTNavigationView.test.jsx

@@ -1,48 +1,100 @@
 import React from 'react';
-import '@testing-library/jest-dom/extend-expect';
-import { MemoryRouter } from 'react-router-dom';
-import configureStore from 'redux-mock-store';
-import { render } from '@testing-library/react';
-import { Provider } from 'react-intl-redux';
+import '@testing-library/jest-dom';
+import { render, screen } from '@testing-library/react';
 import ASTNavigationView from './ASTNavigationView';
 
-const mockStore = configureStore();
+jest.mock('@loadable/component', () => {
+  let callCount = 0;
 
-describe('ASTLogoMap', () => {
-  it('should render the component', () => {
+  return () => {
+    callCount += 1;
+    const componentName = callCount === 1 ? 'ASTLogoMap' : 'UASTLogoMap';
+
+    return ({ items, pathname, href }) => (
+      <div
+        data-testid={componentName}
+        data-items={JSON.stringify(items)}
+        data-pathname={pathname}
+        data-href={href}
+      >
+        {componentName}
+      </div>
+    );
+  };
+});
+
+describe('ASTNavigationView', () => {
+  const makeItems = () =>
+    Array.from({ length: 6 }, (_, index) => ({
+      href: [`/en/source-${index + 1}`],
+      title: `Source ${index + 1}`,
+    }));
+
+  it('renders an incomplete source warning when items length is not 6', () => {
+    const data = {
+      items: [],
+      image_type: 'ast',
+      href: ['/en/ast-nav'],
+    };
+
+    const { container } = render(
+      <ASTNavigationView path="/en/ast-nav" data={data} />,
+    );
+
+    expect(container).toHaveTextContent('Incomplete number of sources');
+  });
+
+  it('renders ASTLogoMap when image_type is ast and items length is 6', () => {
     const data = {
-      items: {
-        'step-0': {
-          '@id': '/en/knowledge/tools/adaptation-support-tool',
-          title: 'Preparing the ground for adaptation',
-          items: [
-            {
-              '@id': '/en/knowledge/tools/adaptation-support-tool/step-1-1',
-              title:
-                '1.1 Obtaining high-level political support for adaptation',
-            },
-          ],
-        },
-      },
-      pathname: '/en/knowledge/tools/adaptation-support-tool',
+      items: makeItems(),
       image_type: 'ast',
+      href: ['/en/ast-nav'],
     };
 
-    const store = mockStore({
-      userSession: { token: '1234' },
-      intl: {
-        locale: 'en',
-        messages: {},
-      },
-    });
+    render(<ASTNavigationView path="/en/ast-nav" data={data} />);
+
+    const astLogoMap = screen.getByTestId('ASTLogoMap');
+    expect(astLogoMap).toBeInTheDocument();
+    expect(astLogoMap.dataset.pathname).toBe('/en/ast-nav');
+    expect(astLogoMap.dataset.href).toBe('/en/ast-nav');
+    expect(astLogoMap.dataset.items).toBe(
+      JSON.stringify({
+        'step-1': '/en/source-1',
+        'step-2': '/en/source-2',
+        'step-3': '/en/source-3',
+        'step-4': '/en/source-4',
+        'step-5': '/en/source-5',
+        'step-6': '/en/source-6',
+      }),
+    );
+  });
+
+  it('renders UASTLogoMap when image_type is uast and items length is 6', () => {
+    const data = {
+      items: makeItems(),
+      image_type: 'uast',
+      href: ['/en/ast-nav'],
+    };
+
+    render(<ASTNavigationView path="/en/ast-nav" data={data} />);
+
+    const uastLogoMap = screen.getByTestId('UASTLogoMap');
+    expect(uastLogoMap).toBeInTheDocument();
+    expect(uastLogoMap.dataset.pathname).toBe('/en/ast-nav');
+    expect(uastLogoMap.dataset.href).toBe('/en/ast-nav');
+  });
+
+  it('renders nothing when image_type is unsupported and items length is 6', () => {
+    const data = {
+      items: makeItems(),
+      image_type: 'unsupported',
+      href: ['/en/ast-nav'],
+    };
 
     const { container } = render(
-      <Provider store={store}>
-        <MemoryRouter>
-          <ASTNavigationView path="/en/ast-nav" data={data} />
-        </MemoryRouter>
-      </Provider>,
+      <ASTNavigationView path="/en/ast-nav" data={data} />,
     );
-    expect(container).toBeTruthy();
+
+    expect(container).toBeEmptyDOMElement();
   });
 });

package/src/components/manage/Blocks/C3SIndicatorsGlossaryBlock/C3SIndicatorsGlossaryBlockEdit.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { SidebarPortal } from '@plone/volto/components';
+import SidebarPortal from '@plone/volto/components/manage/Sidebar/SidebarPortal';
 import BlockDataForm from '@plone/volto/components/manage/Form/BlockDataForm';
 
 import C3SIndicatorsGlossaryBlockView from './C3SIndicatorsGlossaryBlockView';

package/src/components/manage/Blocks/C3SIndicatorsGlossaryBlock/C3SIndicatorsGlossaryBlockView.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import C3SIndicatorsGlossaryBlockView from './C3SIndicatorsGlossaryBlockView';
 

package/src/components/manage/Blocks/C3SIndicatorsListingBlock/C3SIndicatorsListingBlockEdit.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { SidebarPortal } from '@plone/volto/components';
+import SidebarPortal from '@plone/volto/components/manage/Sidebar/SidebarPortal';
 import BlockDataForm from '@plone/volto/components/manage/Form/BlockDataForm';
 
 import C3SIndicatorsListingBlockView from './C3SIndicatorsListingBlockView';

package/src/components/manage/Blocks/C3SIndicatorsListingBlock/C3SIndicatorsListingBlockView.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UniversalLink } from '@plone/volto/components';
+import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink';
 
 export default function C3SIndicatorsListingBlockView(props) {
   const { metadata, properties, mode = 'view' } = props;

package/src/components/manage/Blocks/C3SIndicatorsListingBlock/C3SIndicatorsListingBlockView.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import C3SIndicatorsListingBlockView from './C3SIndicatorsListingBlockView';
 

package/src/components/manage/Blocks/C3SIndicatorsOverviewBlock/C3SIndicatorsOverviewBlockEdit.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { SidebarPortal } from '@plone/volto/components';
+import SidebarPortal from '@plone/volto/components/manage/Sidebar/SidebarPortal';
 import BlockDataForm from '@plone/volto/components/manage/Form/BlockDataForm';
 
 import C3SIndicatorsOverviewBlockView from './C3SIndicatorsOverviewBlockView';

package/src/components/manage/Blocks/C3SIndicatorsOverviewBlock/schema.js

@@ -1,23 +1,3 @@
-// const fields = ['category'];
-//
-//     category: {
-//       title: 'Category',
-//       type: 'string',
-//       factory: 'Choice',
-//       choices: [
-//         ['health', 'Health'],
-//         ['agriculture', 'Agriculture'],
-//         ['forestry', 'Forestry'],
-//         ['energy', 'Energy'],
-//         ['tourism', 'Tourism'],
-//         ['water-and-coastal', 'Water and Coastal'],
-//       ],
-//       default: 'health',
-//       description: 'Choose indicators category to be used as filter.',
-//       required: true,
-//       noValueOption: false,
-//     },
-
 const schema = {
   title: 'C3S Indicators Overview',
 

package/src/components/manage/Blocks/CaseStudyExplorer/CaseStudyExplorerEdit.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import CaseStudyExplorerEdit from './CaseStudyExplorerEdit';
 import { useCases } from './hooks';

package/src/components/manage/Blocks/CaseStudyExplorer/{CaseStudyExplorerView.js → CaseStudyExplorerView.jsx}

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Grid } from 'semantic-ui-react'; // Dropdown,
-import { addAppURL } from '@plone/volto/helpers';
+import { addAppURL } from '@plone/volto/helpers/Url/Url';
 
 import CaseStudyMap from './CaseStudyMap';
 import CaseStudyFilters from './CaseStudyFilters';

package/src/components/manage/Blocks/CaseStudyExplorer/CaseStudyExplorerView.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import CaseStudyExplorerView from './CaseStudyExplorerView';
 import { useCases } from './hooks';
@@ -22,7 +22,7 @@ jest.mock('./utils', () => ({
   getFilters: jest.fn(),
 }));
 
-jest.mock('@plone/volto/helpers', () => ({
+jest.mock('@plone/volto/helpers/Url/Url', () => ({
   addAppURL: jest.fn((url) => url),
 }));
 

package/src/components/manage/Blocks/CaseStudyExplorer/CaseStudyFilters.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import CaseStudyFilters from './CaseStudyFilters';
 

package/src/components/manage/Blocks/CaseStudyExplorer/CaseStudyMap.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import CaseStudyMap from './CaseStudyMap';
 import * as utils from './utils';

package/src/components/manage/Blocks/CaseStudyExplorer/FeatureDisplay.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { FormattedMessage } from 'react-intl';
 import { Icon } from 'semantic-ui-react';
+import Image from '@plone/volto/components/theme/Image/Image';
 
 export default function FeatureDisplay({ feature, onClose }) {
   return feature ? (
@@ -30,7 +31,7 @@ export default function FeatureDisplay({ feature, onClose }) {
       {feature.image && (
         <span className="img">
           <center>
-            <img src={feature.image} alt={feature.title} />
+            <Image src={feature.image} alt={feature.title} />
           </center>
         </span>
       )}

package/src/components/manage/Blocks/CaseStudyExplorer/FeatureDisplay.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import FeatureDisplay from './FeatureDisplay';
 

package/src/components/manage/Blocks/CaseStudyExplorer/styles.less

@@ -100,10 +100,6 @@
         margin-right: 5px;
         background-color: #005c96 !important;
         background-color: #bbb;
-
-        // &.light-blue {
-        //   background-color: #00ffff !important;
-        // }
       }
     }
   }

package/src/components/manage/Blocks/CaseStudyExplorer/utils.js

@@ -23,7 +23,6 @@ export function getFeatures(cases, ol) {
       },
       false,
     );
-    //return new Feature({ labelPoint: point, index: index });
     return point;
   });
 }
@@ -45,35 +44,16 @@ export function filterCases(cases, activeFilters) {
       impacts: false,
     };
 
-    // activeFilters.sectors.forEach((filter) => {
-    //   if (_case.properties.sectors.includes(',' + filter + ','))
-    //     flag.sectors = true;
-    // });
     flag.sectors = activeFilters.sectors.every((sub) =>
       _case.properties.sectors.includes(sub),
     );
-
-    // ADAPTATION APPROACHES
-    // activeFilters.elements.forEach((filter) => {
-    //   if (_case.properties.elements.includes(',' + filter + ','))
-    //     flag.elements = true;
-    // });
     flag.elements = activeFilters.elements.every((sub) =>
       _case.properties.elements.includes(sub),
     );
 
-    // activeFilters.impacts.forEach((filter) => {
-    //   if (_case.properties.impacts.includes(',' + filter + ','))
-    //     flag.impacts = true;
-    // });
     flag.impacts = activeFilters.impacts.every((sub) =>
       _case.properties.impacts.includes(sub),
     );
-
-    // activeFilters.measures.forEach((filter) => {
-    //   if (_case.properties.ktms.includes(',' + filter + ','))
-    //     flag.measures = true;
-    // });
     flag.measures = activeFilters.measures.every((sub) =>
       _case.properties.ktms.includes(sub),
     );
@@ -121,16 +101,6 @@ export function getFilters(cases) {
         _filters.elements[elementKeys[i + 1]] = elementNames[i];
       }
     }
-
-    // let ktmKeys = _case.properties.ktms.split(',');
-    // let ktmNames = _case.properties.impacts_str.split(',');
-    // for (let i = 0; i < ktmKeys.length; i++) {
-    //   if (!_filters.ktms.hasOwnProperty(ktmKeys[i])) {
-    //     _filters.ktms[ktmKeys[i]] = 1;
-    //   }
-    // }
   }
-  // console.log('getFilters:', _filters);
-
   return _filters;
 }

package/src/components/manage/Blocks/CollectionStatistics/CollectionStatsEdit.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { SidebarPortal } from '@plone/volto/components';
+import SidebarPortal from '@plone/volto/components/manage/Sidebar/SidebarPortal';
 import InlineForm from '@plone/volto/components/manage/Form/InlineForm';
 import Schema from './schema';
 import View from './CollectionStatsView';

package/src/components/manage/Blocks/CollectionStatistics/CollectionStatsView.jsx

@@ -3,8 +3,9 @@ import { useSelector, useDispatch } from 'react-redux';
 import { useLocation } from 'react-router-dom';
 import { getQueryStats } from '@eeacms/volto-cca-policy/store';
 import { getBaseUrl as getBase } from '@eeacms/volto-cca-policy/utils';
-import { getBaseUrl } from '@plone/volto/helpers';
-import { Icon, UniversalLink } from '@plone/volto/components';
+import { getBaseUrl } from '@plone/volto/helpers/Url/Url';
+import Icon from '@plone/volto/components/theme/Icon/Icon';
+import UniversalLink from '@plone/volto/components/manage/UniversalLink/UniversalLink';
 import { Icon as UiIcon } from 'semantic-ui-react';
 import config from '@plone/volto/registry';
 import { useIntl } from 'react-intl';

package/src/components/manage/Blocks/CollectionStatistics/CollectionStatsView.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import CollectionStatsView from './CollectionStatsView';
 import config from '@plone/volto/registry';

package/src/components/manage/Blocks/ContentLinks/ContentLinksEdit.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { SidebarPortal } from '@plone/volto/components';
+import SidebarPortal from '@plone/volto/components/manage/Sidebar/SidebarPortal';
 import BlockDataForm from '@plone/volto/components/manage/Form/BlockDataForm';
 
 import schema from './schema';

package/src/components/manage/Blocks/ContentLinks/ContentLinksView.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { List } from 'semantic-ui-react';
 import { Link, useLocation } from 'react-router-dom';
-import { flattenToAppURL } from '@plone/volto/helpers';
+import { flattenToAppURL } from '@plone/volto/helpers/Url/Url';
 import config from '@plone/volto/registry';
 import cx from 'classnames';
 

package/src/components/manage/Blocks/ContentLinks/ContentLinksView.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import renderer from 'react-test-renderer';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import ContentLinksView from './ContentLinksView';
 import config from '@plone/volto/registry';

package/src/components/manage/Blocks/ContentLinks/DropdownListView.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { Link } from 'react-router-dom';
 import { Dropdown } from 'semantic-ui-react';
 import { useIntl, defineMessages } from 'react-intl';
-import { flattenToAppURL } from '@plone/volto/helpers';
+import { flattenToAppURL } from '@plone/volto/helpers/Url/Url';
 
 const messages = defineMessages({
   select: {

package/src/components/manage/Blocks/ContentLinks/DropdownListView.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import renderer from 'react-test-renderer';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import DropdownListView from './DropdownListView';
 import config from '@plone/volto/registry';

package/src/components/manage/Blocks/CountryMapHeatIndex/Filter.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import Filter from './Filter';
 

package/src/components/manage/Blocks/CountryMapHeatIndex/{View.js → View.jsx}

@@ -3,7 +3,7 @@ import { compose } from 'redux';
 import { clientOnly } from '@eeacms/volto-cca-policy/helpers';
 
 import { Map, Layer, Layers, Controls } from '@eeacms/volto-openlayers-map/api';
-import { openlayers as ol } from '@eeacms/volto-openlayers-map';
+import { withOpenLayers } from '@eeacms/volto-openlayers-map';
 import {
   euCountryNames as euCountryNamesRaw,
   tooltipStyle,
@@ -11,16 +11,17 @@ import {
   adjustEuCountryNames,
 } from '@eeacms/volto-cca-policy/helpers/country_map/countryMap';
 import { withGeoJsonData } from '@eeacms/volto-cca-policy/helpers/country_map/hocs';
-
-import withResponsiveContainer from '../withResponsiveContainer';
-import withVisibilitySensor from '../withVisibilitySensor';
+import {
+  withResponsiveContainer,
+  withVisibilitySensor,
+} from '@eeacms/volto-cca-policy/hocs';
 import { makeStyles } from './mapstyle';
 import { Interactions } from './Interactions';
 
 import Filter from './Filter';
 import { Grid } from 'semantic-ui-react';
 import { useCountriesMetadata } from './hooks';
-import { addAppURL } from '@plone/volto/helpers';
+import { addAppURL } from '@plone/volto/helpers/Url/Url';
 
 import './styles.less';
 
@@ -28,13 +29,15 @@ import './styles.less';
 //   'https://raw.githubusercontent.com/eurostat/Nuts2json/master/pub/v2/2021/4326/20M/cntrg.json';
 
 const View = (props) => {
-  const { geofeatures, projection } = props;
+  const { geofeatures, projection, ol } = props;
 
   const highlight = React.useRef();
   const [stateHighlight, setStateHighlight] = React.useState();
 
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  const styles = React.useMemo(() => makeStyles(highlight), [stateHighlight]);
+  const styles = React.useMemo(
+    () => makeStyles(highlight, ol),
+    [stateHighlight, ol], // eslint-disable-line react-hooks/exhaustive-deps
+  );
   const tooltipRef = React.useRef();
   const [tileWMSSources, setTileWMSSources] = React.useState();
   const [euCountriesSource, setEuCountriessource] = React.useState();
@@ -124,7 +127,7 @@ const View = (props) => {
 
     const euSource = new ol.source.Vector({ features: filtered });
     setEuCountriessource(euSource);
-  }, [geofeatures, countries_metadata, thematicMapMode, euCountryNames]);
+  }, [geofeatures, countries_metadata, thematicMapMode, euCountryNames, ol]);
 
   return (
     <div>
@@ -186,8 +189,9 @@ const View = (props) => {
 };
 
 export default compose(
-  withGeoJsonData(),
   clientOnly,
+  withGeoJsonData(),
   withResponsiveContainer('countryMapHeatIndex'),
   withVisibilitySensor(),
+  withOpenLayers,
 )(View);

package/src/components/manage/Blocks/CountryMapHeatIndex/mapstyle.js

@@ -1,5 +1,3 @@
-import { openlayers as ol } from '@eeacms/volto-openlayers-map';
-
 // const flagRenderer = ({ stroke, fill }) => (pixelCoordinates, state) => {
 //   const context = state.context;
 //   const geometry = state.geometry.clone();
@@ -29,7 +27,7 @@ import { openlayers as ol } from '@eeacms/volto-openlayers-map';
 //   context.restore();
 // };
 
-export const makeStyles = (highlight) => {
+export const makeStyles = (highlight, ol) => {
   const stroke = new ol.style.Stroke({
     // color: 'rgba(255,255,255,0.8)',
     color: '#d1d1d1',

package/src/components/manage/Blocks/CountryMapObservatory/CountryMapObservatoryEdit.jsx

@@ -1,4 +1,5 @@
-import { BlockDataForm, SidebarPortal } from '@plone/volto/components';
+import BlockDataForm from '@plone/volto/components/manage/Form/BlockDataForm';
+import SidebarPortal from '@plone/volto/components/manage/Sidebar/SidebarPortal';
 import CountryMapObservatoryView from './CountryMapObservatoryOLView';
 import Schema from './schema';
 

package/src/components/manage/Blocks/CountryMapObservatory/CountryMapObservatoryOLView.jsx

@@ -12,9 +12,10 @@ import {
   getImageUrl,
 } from '@eeacms/volto-cca-policy/helpers/country_map/countryMap';
 import { withGeoJsonData } from '@eeacms/volto-cca-policy/helpers/country_map/hocs';
-
-import withResponsiveContainer from '../withResponsiveContainer';
-import withVisibilitySensor from '../withVisibilitySensor';
+import {
+  withResponsiveContainer,
+  withVisibilitySensor,
+} from '@eeacms/volto-cca-policy/hocs';
 import { makeStyles } from './mapstyle';
 import { Interactions } from './Interactions';
 

package/src/components/manage/Blocks/CountryMapProfile/Filter.test.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
 import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import { Provider } from 'react-intl-redux';
 import Filter from './Filter';