Merge pull request #49 from eea/develop

Release

CHANGELOG.md

@@ -4,8 +4,19 @@ 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.6.16](https://github.com/eea/volto-eea-website-theme/compare/0.6.15...0.6.16)
+
+- Nonapi breadcrumbs [`#48`](https://github.com/eea/volto-eea-website-theme/pull/48)
+- Make Breadcrumbs behave better with non-content routes [`9407840`](https://github.com/eea/volto-eea-website-theme/commit/94078403458a5a3ea725ce9126fffed9d463097d)
+- change(megamenu): add border for active element of menu [`252efc4`](https://github.com/eea/volto-eea-website-theme/commit/252efc4485961c8d05e3703fee06179a0fdc8da3)
+- change(footer): tweaked size of eionet logo to follow size of eea logo [`fcfa8ee`](https://github.com/eea/volto-eea-website-theme/commit/fcfa8ee00cffbc147eefa0f614b366c94f30945d)
+- feature(theme): added context navigation component [`083b1c2`](https://github.com/eea/volto-eea-website-theme/commit/083b1c272623c720ebfeb4338e59c2cefcb29ecc)
+
 #### [0.6.15](https://github.com/eea/volto-eea-website-theme/compare/0.6.14...0.6.15)
 
+> 1 July 2022
+
+- Release [`#47`](https://github.com/eea/volto-eea-website-theme/pull/47)
 - Moved customized Toolbar to volto-eea-website-policy [`403b06d`](https://github.com/eea/volto-eea-website-theme/commit/403b06dd1225f4f15883d938d47facfe730a3699)
 - change(logo): use a real svg logo for white eea logo [`e2703af`](https://github.com/eea/volto-eea-website-theme/commit/e2703af2bf3779ad3aa21fa673fa5652691a9f25)
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-eea-website-theme",
-  "version": "0.6.15",
+  "version": "0.6.16",
   "description": "@eeacms/volto-eea-website-theme: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

src/config.js

@@ -108,7 +108,7 @@ export const footerOpts = {
       columnSize: {
         mobile: 6,
         tablet: 12,
-        computer: 7,
+        computer: 6,
       },
     },
   ],

src/customizations/volto/components/theme/Breadcrumbs/Breadcrumbs.jsx

@@ -6,14 +6,35 @@
 import React, { useEffect } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 
+import { useLocation } from 'react-router';
 import { getBaseUrl, hasApiExpander } from '@plone/volto/helpers';
 import { getBreadcrumbs } from '@plone/volto/actions';
+import config from '@plone/volto/registry';
+
 import EEABreadcrumbs from '@eeacms/volto-eea-design-system/ui/Breadcrumbs/Breadcrumbs';
 
+const isContentRoute = (pathname) => {
+  const { settings } = config;
+  const normalized_nonContentRoutes = settings.nonContentRoutes.map((item) => {
+    if (item.test) {
+      return item;
+    } else {
+      return new RegExp(item + '$');
+    }
+  });
+
+  const isNonContentRoute =
+    normalized_nonContentRoutes.findIndex((item) => item.test(pathname)) > -1;
+
+  return !isNonContentRoute;
+};
+
 const Breadcrumbs = (props) => {
   const dispatch = useDispatch();
   const { items = [], root = '/' } = useSelector((state) => state?.breadcrumbs);
-  const { pathname } = props;
+  // const pathname = useSelector((state) => state.location.pathname);
+  const location = useLocation();
+  const { pathname } = location;
 
   const sections = items.map((item) => ({
     title: item.title,
@@ -22,7 +43,10 @@ const Breadcrumbs = (props) => {
   }));
 
   useEffect(() => {
-    if (!hasApiExpander('breadcrumbs', getBaseUrl(pathname))) {
+    if (
+      !hasApiExpander('breadcrumbs', getBaseUrl(pathname)) &&
+      isContentRoute(pathname)
+    ) {
       dispatch(getBreadcrumbs(getBaseUrl(pathname)));
     }
   }, [dispatch, pathname]);

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

@@ -27,6 +27,8 @@ import config from '@plone/volto/registry';
 import { compose } from 'recompose';
 import { BodyClass } from '@plone/volto/helpers';
 
+import cx from 'classnames';
+
 /**
  * EEA Specific Header component.
  */
@@ -192,9 +194,17 @@ const EEAHeader = ({ pathname, token, items, history }) => {
             {item.title}
           </a>
         )}
-        renderMenuItem={(item) => (
-          <UniversalLink href={item.url || '/'} title={item.title}>
-            <span className={'item'}>{item.title}</span>
+        renderMenuItem={(item, options, props) => (
+          <UniversalLink
+            href={item.url || '/'}
+            title={item.title}
+            {...(options || {})}
+            className={cx(options?.className, {
+              active: item.url === router_pathname,
+            })}
+          >
+            {props?.children}
+            <span>{item.title}</span>
           </UniversalLink>
         )}
       ></Header.Main>

theme/theme.config

@@ -86,6 +86,7 @@
 @tag              : 'eea';
 @tags             : 'eea';
 @tagList          : 'eea';
+@contextNavigation : 'eea';
 @inpageNavigation : 'eea';
 @avatar           : 'eea';
 @divider          : 'eea';