@eeacms/volto-bise-policy 1.2.11 → 1.2.13

package/CHANGELOG.md

@@ -4,6 +4,32 @@ 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).
 
+### [1.2.13](https://github.com/eea/volto-bise-policy/compare/1.2.12...1.2.13) - 7 November 2024
+
+#### :hammer_and_wrench: Others
+
+- update [Miu Razvan - [`f7bfa97`](https://github.com/eea/volto-bise-policy/commit/f7bfa97d951ca009cd5ef4d525f6194813114806)]
+### [1.2.12](https://github.com/eea/volto-bise-policy/compare/1.2.11...1.2.12) - 6 November 2024
+
+#### :bug: Bug Fixes
+
+- fix: upgrade @eeacms/volto-eea-website-theme to latest version [ana-oprea - [`5424822`](https://github.com/eea/volto-bise-policy/commit/5424822ba47527a071cbeb0a09c7540fc83322f7)]
+- fix: pin @eeacms/volto-eea-website-theme to 2.0.0 [ana-oprea - [`09240cb`](https://github.com/eea/volto-bise-policy/commit/09240cbee32d2dbccd07a900e1738571e5154da9)]
+
+#### :house: Internal changes
+
+- style: Automated code fix [eea-jenkins - [`7eabaae`](https://github.com/eea/volto-bise-policy/commit/7eabaae5dd179d0c076f36fe2d5af0dc652ee16b)]
+- style: make header bigger on natura2000 specific pages, resize logo based on menu items container size [ana-oprea - [`879794b`](https://github.com/eea/volto-bise-policy/commit/879794beb5e16396fef776f3ecf00793866ae6eb)]
+- style: fix eslint errors [ana-oprea - [`f8f62a4`](https://github.com/eea/volto-bise-policy/commit/f8f62a45f5b66411334757789f269ede54dcf373)]
+- style: Automated code fix [eea-jenkins - [`e577abb`](https://github.com/eea/volto-bise-policy/commit/e577abbda7c3154dd5b9f3f15ed253a78f6c0b12)]
+
+#### :hammer_and_wrench: Others
+
+- update [Miu Razvan - [`48277be`](https://github.com/eea/volto-bise-policy/commit/48277bed1c4dc9ed7c24c3deddce76a0bb5b2d97)]
+- lint fix [Miu Razvan - [`a60d19d`](https://github.com/eea/volto-bise-policy/commit/a60d19d8c999e99a212bab03ef5b8118ab5c3690)]
+- merge develop into header-style [Miu Razvan - [`2ebf224`](https://github.com/eea/volto-bise-policy/commit/2ebf224cd30787516653244350e03dbf8624070a)]
+- test: Update to volto 17 PR30 [valentinab25 - [`3ae5e75`](https://github.com/eea/volto-bise-policy/commit/3ae5e752557618a5acd617a7ce3f5bff5df65ec1)]
+- test: Update to volto 17 PR30 [valentinab25 - [`4cd82f2`](https://github.com/eea/volto-bise-policy/commit/4cd82f24a4bfec508a1a4de9035ffe4c75bda0ad)]
 ### [1.2.11](https://github.com/eea/volto-bise-policy/compare/1.2.10...1.2.11) - 28 May 2024
 
 #### :bug: Bug Fixes

package/jest-addon.config.js

@@ -14,6 +14,8 @@ module.exports = {
     '@package/(.*)$': '<rootDir>/node_modules/@plone/volto/src/$1',
     '@root/(.*)$': '<rootDir>/node_modules/@plone/volto/src/$1',
     '@plone/volto-quanta/(.*)$': '<rootDir>/src/addons/volto-quanta/src/$1',
+    '@eeacms/search/(.*)$': '<rootDir>/src/addons/volto-searchlib/searchlib/$1',
+    '@eeacms/search': '<rootDir>/src/addons/volto-searchlib/searchlib',
     '@eeacms/(.*?)/(.*)$': '<rootDir>/node_modules/@eeacms/$1/src/$2',
     '@plone/volto-slate$':
       '<rootDir>/node_modules/@plone/volto/packages/volto-slate/src',
@@ -28,6 +30,7 @@ module.exports = {
   ],
   transform: {
     '^.+\\.js(x)?$': 'babel-jest',
+    '^.+\\.ts(x)?$': 'babel-jest',
     '^.+\\.(png)$': 'jest-file',
     '^.+\\.(jpg)$': 'jest-file',
     '^.+\\.(svg)$': './node_modules/@plone/volto/jest-svgsystem-transform.js',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-bise-policy",
-  "version": "1.2.11",
+  "version": "1.2.13",
   "description": "@eeacms/volto-bise-policy: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",
@@ -17,6 +17,7 @@
     "@eeacms/volto-block-toc",
     "@eeacms/volto-eea-design-system",
     "@eeacms/volto-eea-website-theme",
+    "@eeacms/volto-resize-helper",
     "@eeacms/volto-spotlight"
   ],
   "repository": {
@@ -27,7 +28,8 @@
     "@eeacms/volto-block-toc": "*",
     "@eeacms/volto-datablocks": "*",
     "@eeacms/volto-eea-design-system": "*",
-    "@eeacms/volto-eea-website-theme": "<1.18.2",
+    "@eeacms/volto-eea-website-theme": "*",
+    "@eeacms/volto-resize-helper": "*",
     "@eeacms/volto-spotlight": "*",
     "esri-loader": "3.7.0",
     "plotly.js": "^2.28.0",

package/src/components/manage/Blocks/BodyClass/index.js

@@ -2,7 +2,7 @@ import worldSVG from '@plone/volto/icons/world.svg';
 import BodyClassEdit from './Edit';
 import BodyClassView from './View';
 
-export default (config) => {
+const config = (config) => {
   config.blocks.blocksConfig.body_classname = {
     id: 'body_classname',
     title: 'Body classname',
@@ -22,3 +22,5 @@ export default (config) => {
   };
   return config;
 };
+
+export default config;

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

@@ -1,4 +1,4 @@
-export default {
+const schema = {
   title: 'Body class',
 
   fieldsets: [
@@ -18,3 +18,5 @@ export default {
 
   required: [],
 };
+
+export default schema;

package/src/components/manage/Blocks/FactsheetsListing/index.js

@@ -2,7 +2,7 @@ import codeSVG from '@plone/volto/icons/code.svg';
 import FactsheetsListingView from './FactsheetsListingView';
 import FactsheetsListingEdit from './FactsheetsListingEdit';
 
-export default (config) => {
+const config = (config) => {
   config.blocks.blocksConfig.biseFactsheetListing = {
     id: 'biseFactsheetListing',
     title: 'Factsheets Listing',
@@ -22,3 +22,5 @@ export default (config) => {
 
   return config;
 };
+
+export default config;

package/src/components/manage/Blocks/KeyFacts/index.js

@@ -2,7 +2,7 @@ import codeSVG from '@plone/volto/icons/code.svg';
 import KeyFactsView from './KeyFactsView';
 import KeyFactsEdit from './KeyFactsEdit';
 
-export default (config) => {
+const config = (config) => {
   config.blocks.blocksConfig.keyfacts = {
     id: 'keyfacts',
     title: 'Key Facts',
@@ -20,3 +20,5 @@ export default (config) => {
   };
   return config;
 };
+
+export default config;

package/src/components/manage/Blocks/MaesViewer/index.js

@@ -2,7 +2,7 @@ import codeSVG from '@plone/volto/icons/code.svg';
 import MaesViewerView from './MaesViewerView';
 import MaesViewerEdit from './MaesViewerEdit';
 
-export default (config) => {
+const config = (config) => {
   config.blocks.blocksConfig.maesviewer = {
     id: 'maesviewer',
     title: 'MAES Viewer',
@@ -20,3 +20,5 @@ export default (config) => {
   };
   return config;
 };
+
+export default config;

package/src/components/manage/Blocks/Navigation/View.jsx

@@ -10,7 +10,7 @@ import './styles.less';
 const View = ({ history, data, navigation, ...props }) => {
   const search = history?.location?.search || '';
   const pathname = props.path || props.pathname;
-  const pages = data.pages || [];
+  const pages = useMemo(() => data.pages || [], [data.pages]);
   const items = useMemo(() => {
     return [
       ...(navigation.filter(

package/src/components/manage/Blocks/Navigation/index.js

@@ -2,7 +2,7 @@ import imageSVG from '@plone/volto/icons/image.svg';
 import NavigationBlockView from './View';
 import NavigationBlockEdit from './Edit';
 
-export default (config) => {
+const config = (config) => {
   config.blocks.blocksConfig.navigationBlock = {
     id: 'navigationBlock',
     title: 'Navigation Block',
@@ -20,3 +20,5 @@ export default (config) => {
   };
   return config;
 };
+
+export default config;

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

@@ -19,7 +19,7 @@ const pagesSchema = {
   required: [],
 };
 
-export default {
+const schema = {
   title: 'Navigation block',
   fieldsets: [
     {
@@ -41,3 +41,5 @@ export default {
   },
   required: [],
 };
+
+export default schema;

package/src/components/manage/Blocks/Redirect/index.js

@@ -2,7 +2,7 @@ import worldSVG from '@plone/volto/icons/world.svg';
 import RedirectEdit from './Edit';
 import RedirectView from './View';
 
-export default (config) => {
+const config = (config) => {
   config.blocks.blocksConfig.redirect = {
     id: 'redirect',
     title: 'Redirect',
@@ -22,3 +22,5 @@ export default (config) => {
   };
   return config;
 };
+
+export default config;

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

@@ -1,4 +1,4 @@
-export default {
+const schema = {
   title: 'Redirect',
 
   fieldsets: [
@@ -18,3 +18,5 @@ export default {
 
   required: [],
 };
+
+export default schema;

package/src/components/manage/Blocks/index.js

@@ -5,7 +5,7 @@ import installKeyFacts from './KeyFacts';
 import installMaesViewer from './MaesViewer';
 import installNavigation from './Navigation';
 
-export default (config) => {
+const config = (config) => {
   return [
     installBodyClass,
     installRedirect,
@@ -15,3 +15,5 @@ export default (config) => {
     installNavigation,
   ].reduce((acc, apply) => apply(acc), config);
 };
+
+export default config;

package/src/customizations/@eeacms/volto-datablocks/components/manage/Blocks/SimpleDataTable/Edit.jsx

@@ -107,10 +107,12 @@ const EditWrapper = compose(
   }),
 )(Edit);
 
-export default (props) => {
+const $Edit = (props) => {
   return (
     <VisibilitySensor offset={{ top: -150, bottom: -150 }}>
       <EditWrapper {...props} />
     </VisibilitySensor>
   );
 };
+
+export default $Edit;

package/src/customizations/@eeacms/volto-datablocks/components/manage/Blocks/SimpleDataTable/View.jsx

@@ -117,10 +117,12 @@ const SimpleDataTableViewWrapper = compose(
   }),
 )(SimpleDataTableView);
 
-export default (props) => {
+const View = (props) => {
   return (
     <VisibilitySensor offset={{ top: -150, bottom: -150 }}>
       <SimpleDataTableViewWrapper {...props} />
     </VisibilitySensor>
   );
 };
+
+export default View;

package/src/customizations/@eeacms/volto-datablocks/components/manage/Blocks/SimpleDataTable/index.js

@@ -8,7 +8,7 @@ import {
 import { SmartView, smartSchema } from './templates/smart';
 import { ColoredTableView, coloredTableSchema } from './templates/colored';
 
-export default (config) => {
+const applyConfig = (config) => {
   config.blocks.blocksConfig.simpleDataConnectedTable = {
     id: 'simpleDataConnectedTable',
     title: 'Data Table',
@@ -62,3 +62,5 @@ export default (config) => {
   };
   return config;
 };
+
+export default applyConfig;

package/src/customizations/@eeacms/volto-datablocks/components/manage/Blocks/SimpleDataTable/templates/colored/style.less

@@ -3,9 +3,9 @@
     table {
       overflow: hidden;
       border: 1px solid #e8e8e8 !important;
+      border-radius: 12px !important;
       background: #fff !important;
       border-collapse: separate !important;
-      border-radius: 12px !important;
 
       thead,
       td {

package/src/customizations/@eeacms/volto-datablocks/components/manage/Blocks/SimpleDataTable/templates/smart/schema.js

@@ -1,4 +1,4 @@
-export default () => ({
+const getSchema = () => ({
   title: 'Smart datatable',
   fieldsets: [
     {
@@ -15,3 +15,5 @@ export default () => ({
   },
   required: [],
 });
+
+export default getSchema;

package/src/customizations/@eeacms/volto-datablocks/components/manage/Blocks/SimpleDataTable/templates/smart/style.less

@@ -29,9 +29,9 @@
   table {
     overflow: hidden;
     border: 1px solid #e8e8e8 !important;
+    border-radius: 12px !important;
     background: #fff !important;
     border-collapse: separate !important;
-    border-radius: 12px !important;
 
     thead > tr > th::after {
       display: none;

package/src/customizations/@eeacms/volto-eea-website-theme/components/theme/SubsiteClass.jsx

@@ -14,9 +14,10 @@ const SubsiteClass = () => {
     () => content?.data?.['@components']?.subsite || {},
     [content],
   );
-  const pathname = useMemo(() => flattenToAppURL(content?.['@id']) || '', [
-    content,
-  ]);
+  const pathname = useMemo(
+    () => flattenToAppURL(content?.['@id']) || '',
+    [content],
+  );
 
   const { eea, bise } = config.settings;
   const { subsites, multilingualSubsites } = bise || {};

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

@@ -25,6 +25,7 @@ import eeaFlag from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/
 import config from '@plone/volto/registry';
 import { compose } from 'recompose';
 import { BodyClass } from '@plone/volto/helpers';
+import { withScreenSize } from '@eeacms/volto-resize-helper/hocs';
 
 import cx from 'classnames';
 
@@ -48,7 +49,7 @@ function getLanguage() {
 /**
  * EEA Specific Header component.
  */
-const EEAHeader = ({ token, history, subsite, content, ...props }) => {
+const EEAHeader = ({ token, history, subsite, content, screen, ...props }) => {
   const dispatch = useDispatch();
   const [language, setLanguage] = useState(getLanguage());
   const previousToken = usePrevious(token);
@@ -145,6 +146,20 @@ const EEAHeader = ({ token, history, subsite, content, ...props }) => {
     /* eslint-disable-next-line */
   }, [isN2KSpecies, params]);
 
+  React.useEffect(() => {
+    let width = 0;
+    const menuEl = document.querySelector('.eea.header .main.bar');
+    const items =
+      document.querySelectorAll(
+        '.eea.header .main.bar .main-menu .ui.eea-main-menu li.item',
+      ) || [];
+
+    for (let item of items) {
+      width += item.offsetWidth;
+    }
+    menuEl.style.setProperty('--menu-width', `${width}px`);
+  }, [screen]);
+
   return (
     <Header menuItems={items}>
       {isHomePageInverse && <BodyClass className="homepage homepage-inverse" />}
@@ -379,6 +394,7 @@ const EEAHeader = ({ token, history, subsite, content, ...props }) => {
 
 export default compose(
   withRouter,
+  withScreenSize,
   connect(
     (state) => ({
       token: state.userSession.token,

package/src/index.js

@@ -146,13 +146,15 @@ const applyConfig = (config) => {
   // Customizations
   // Group
   if (config.blocks.blocksConfig.group) {
-    config.blocks.blocksConfig.group.schemaEnhancer = addStylingFieldsetSchemaEnhancer;
+    config.blocks.blocksConfig.group.schemaEnhancer =
+      addStylingFieldsetSchemaEnhancer;
   }
 
   // Columns
   if (config.blocks.blocksConfig.columnsBlock) {
     config.blocks.blocksConfig.columnsBlock.mostUsed = true;
-    config.blocks.blocksConfig.columnsBlock.schemaEnhancer = addStylingFieldsetSchemaEnhancer;
+    config.blocks.blocksConfig.columnsBlock.schemaEnhancer =
+      addStylingFieldsetSchemaEnhancer;
     config.blocks.blocksConfig.columnsBlock.tocEntry = undefined;
     config.blocks.blocksConfig.columnsBlock.tocEntries = (
       block = {},
@@ -179,12 +181,14 @@ const applyConfig = (config) => {
   // Listing
   if (config.blocks.blocksConfig.listing) {
     config.blocks.blocksConfig.listing.title = 'Listing (Content)';
-    config.blocks.blocksConfig.listing.schemaEnhancer = addStylingFieldsetSchemaEnhancer;
+    config.blocks.blocksConfig.listing.schemaEnhancer =
+      addStylingFieldsetSchemaEnhancer;
   }
 
   // Hero image left
   if (config.blocks.blocksConfig.hero_image_left) {
-    config.blocks.blocksConfig.hero_image_left.schemaEnhancer = addStylingFieldsetSchemaEnhancer;
+    config.blocks.blocksConfig.hero_image_left.schemaEnhancer =
+      addStylingFieldsetSchemaEnhancer;
   }
 
   config = [installBlocks, installStyles, installDataTable].reduce(

package/src/styles-config.js

@@ -1,7 +1,7 @@
 import { Icon } from '@plone/volto/components';
 import contentBoxSVG from '@eeacms/volto-bise-policy/icons/content-box.svg';
 
-export default (config) => {
+const config = (config) => {
   config.settings.available_colors = [
     '#005248', // primary color
     '#00A390', // secondary color
@@ -184,3 +184,5 @@ export default (config) => {
 
   return config;
 };
+
+export default config;

package/theme/extras/header.overrides

@@ -10,9 +10,8 @@
   .main.bar {
     .ui.container {
       .ui.text.menu {
-        flex-wrap: wrap;
         justify-content: end;
-  
+
         .item:first-child {
           display: flex;
         }
@@ -39,9 +38,8 @@
   margin-top: 0;
 }
 
-
 @media only screen and (min-width: @computerBreakpoint) {
-   .main.bar {
+  .main.bar {
     .ui.container {
       height: @computerMainSectionHeight;
 
@@ -52,7 +50,7 @@
         display: flex;
         width: 100%;
         max-height: 100%;
-        flex-wrap: wrap;
+        flex-wrap: nowrap;
         justify-content: space-between;
         margin: 0;
 
@@ -82,67 +80,51 @@
 .subsite.subsite-natura2000 {
   .eea.header .main.bar {
     backdrop-filter: blur(2px);
-    background-color: hsla(0,0%,100%,.8);;
+    background-color: hsla(0, 0%, 100%, 0.8);
   }
-
   .eea.header .main.bar > .ui.container {
-    height: 92px;
+    height: 160px;
+    width: 100%;
   }
-
   .eea.header .main-menu {
     align-items: center;
   }
-
   @media only screen and (min-width: @mobileBreakpoint) {
     .eea.header .main.bar > .ui.container {
-      height: 92px;
+      height: 69px;
     }
-
     .eea.header .eea-logo {
-      max-width: fit-content;
-      max-height: 60px;
+      max-width: 142px;
       height: auto;
     }
-
     .burger-action.mobile,
     .search-action {
-      width: 58px;
-      height: 92px;
+      width: 44px;
+      height: 69px;
     }
   }
-
   @media only screen and (min-width: @tabletBreakpoint) {
     .eea.header .main.bar > .ui.container {
-      height: 92px;
+      height: 117px;
     }
-
     .eea.header .eea-logo {
-      max-width: fit-content;
-      max-height: 60px;
+      max-width: 252px;
       height: auto;
     }
-
     .burger-action.mobile,
     .search-action {
-      width: 58px;
-      height: 92px;
+      width: 66px;
+      height: 117px;
     }
   }
-
   @media only screen and (min-width: @computerBreakpoint) {
+    .eea.header .main.bar > .ui.container {
+      height: 160px;
+    }
     .eea.header .eea-logo {
-      max-width: fit-content;
-      max-height: 60px;
+      max-width: 300px;
+      width: 100%;
       height: auto;
     }
   }
 }
-
-
-// #search-box {
-//   min-height: 100%;
-// }
-
-// .has-toolbar.homepage .eea.header {
-//   width: 100%;
-// }

package/theme/globals/natura2000.less

@@ -54,7 +54,10 @@
 
 .is-n2k-site {
   .eea.header .main.bar {
-    .ui.grid, .main-menu, .main-menu > ul, .main-menu > ul > li {
+    .ui.grid,
+    .main-menu,
+    .main-menu > ul,
+    .main-menu > ul > li {
       height: 100%;
     }
   }
@@ -71,7 +74,6 @@
     display: grid !important;
     align-content: center;
 
-
     .ui.container {
       width: 100%;
       padding-bottom: 0;
@@ -83,28 +85,28 @@
   }
 }
 
+// .at-glance {
+//   height: 100%;
+//   padding: 0 2rem;
+//   background: @secondaryColor 0% 0% no-repeat padding-box;
+//   border-bottom: 4px solid @secondaryColor !important;
+//   margin-bottom: -16px;
+//   padding-bottom: 16px;
+//   height: calc(100% + 16px);
+//   border-bottom-left-radius: 10px;
+//   border-bottom-right-radius: 10px;
+//   color: #fff !important;
+//   cursor: pointer;
+//   display: flex;
+//   align-items: center;
+
+//   &:hover {
+//     color: #fff !important;
+//     border-bottom: 4px solid @secondaryColor !important;
+//   }
+// }
 
-.at-glance {
-  height: 100%;
-  padding: 0 2rem;
-  background: @secondaryColor 0% 0% no-repeat padding-box;
-  border-bottom: 4px solid @secondaryColor !important;
-  margin-bottom: -16px;
-  padding-bottom: 16px;
-  height: calc(100% + 16px);
-  border-bottom-left-radius: 10px;
-  border-bottom-right-radius: 10px;
-  color: #fff !important;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-
-  &:hover {
-    color: #fff !important;
-    border-bottom: 4px solid @secondaryColor !important;
-  }
-}
-
+.at-glance,
 .deep-dive {
   color: @secondaryColor !important;
   border-bottom: 4px solid transparent !important;
@@ -122,34 +124,33 @@
 .with-n2k-navigation {
   .eea.header {
     .main.bar .ui.grid {
-      > :first-child:not(:last-child) {
-        width: 200px !important;
-
-        img {
-          object-fit: fill;
+      @media only screen and (min-width: 992px) {
+        > :first-child:not(:last-child) {
+          flex: 1;
+          img {
+            object-fit: fill;
+          }
         }
-      }
 
-      > :last-child:not(:first-child) {
-        width: calc(100% - 200px) !important;
+        > :last-child:not(:first-child) {
+          width: var(--menu-width, 800px) !important;
+        }
       }
 
       @media @smallMonitorUp {
         .main-menu {
           justify-content: center;
-  
+
           ul {
             padding-inline-start: 0;
             justify-content: center !important;
           }
         }
       }
-
     }
   }
 }
 
-
 .tabs-block {
   .columns-header {
     display: none;
@@ -173,4 +174,4 @@
       }
     }
   }
-}
+}

package/theme/modules/accordion.variables

@@ -1,7 +0,0 @@
-/*******************************
-           Accordion
-*******************************/
-
-/* Icon */
-@iconColor: #fff;
-@iconColorActive: #fff;