@eeacms/volto-eea-website-theme 0.7.6 → 0.7.7

package/CHANGELOG.md

@@ -4,6 +4,13 @@ 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.7.7](https://github.com/eea/volto-eea-website-theme/compare/0.7.6...0.7.7) - 19 October 2022
+
+#### :hammer_and_wrench: Others
+
+- feature(theme): added context copyright component [g-stamatis - [`ab4079c`](https://github.com/eea/volto-eea-website-theme/commit/ab4079c2be9bc7eff46f84ef83d552431f8e79bc)]
+- Fix hardcoded search link [kreafox - [`c42d32e`](https://github.com/eea/volto-eea-website-theme/commit/c42d32eee8f1e0974da1526dccb8ac12e92d4bef)]
+- Better handling of active view [kreafox - [`944ce20`](https://github.com/eea/volto-eea-website-theme/commit/944ce20fa3cc10beb02d05cf1f8261d3988520ac)]
 ### [0.7.6](https://github.com/eea/volto-eea-website-theme/compare/0.7.5...0.7.6) - 5 October 2022
 
 #### :rocket: New Features

package/package.json

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

package/src/config.js

@@ -248,6 +248,21 @@ export const websiteTitle = 'Site';
 export const organisationName = 'European Environment Agency';
 export const logoTargetUrl = '/';
 
+export const headerSearchBox = [
+  {
+    isDefault: true,
+    path: '/en/advanced-search',
+    placeholder: 'Search...',
+  },
+  {
+    path: '/en/datahub',
+    placeholder: 'Search Datahub...',
+    description:
+      'Looking for more information? Try searching the full EEA website content',
+    buttonTitle: 'Go to full site search',
+  },
+];
+
 export const colors = [
   // Primary & shades
   '#007B6C',

package/src/customizations/@eeacms/volto-eea-design-system/ui/Header/HeaderSearchPopUp.js

@@ -2,14 +2,23 @@ import React from 'react';
 import { Container, Input } from 'semantic-ui-react';
 import { withRouter } from 'react-router-dom';
 import { useClickOutside } from '@eeacms/volto-eea-design-system/helpers';
+import config from '@plone/volto/registry';
 
 function HeaderSearchPopUp({
   history,
+  location,
   onClose,
   searchInputRef,
   triggerRefs = [],
 }) {
   const nodeRef = React.useRef();
+  const { eea } = config.settings;
+  const defaultView = eea.headerSearchBox.filter((v) => v.isDefault);
+  const localView = eea.headerSearchBox.filter((v) =>
+    location.pathname.includes(v.path),
+  );
+  const activeView = localView.length > 0 ? localView[0] : defaultView[0];
+
   const [text, setText] = React.useState('');
 
   useClickOutside({ targetRefs: [nodeRef, ...triggerRefs], callback: onClose });
@@ -20,7 +29,7 @@ function HeaderSearchPopUp({
   };
 
   const onSubmit = (event) => {
-    history.push(`/en/advanced-search?q=${text}`);
+    history.push(`${activeView.path}?q=${text}`);
 
     if (window?.searchContext?.resetSearch) {
       window.searchContext.resetSearch({ searchTerm: text });
@@ -31,24 +40,40 @@ function HeaderSearchPopUp({
   };
 
   return (
-    <form id="search-box" ref={nodeRef} method="get" onSubmit={onSubmit}>
-      <Container>
-        <div className="wrapper">
-          <Input
-            ref={searchInputRef}
-            className="search"
-            onChange={onChangeText}
-            icon={{
-              className: 'ri-search-line',
-              link: true,
-              onClick: onSubmit,
-            }}
-            placeholder="Search..."
-            fluid
-          />
+    <div id="search-box" ref={nodeRef}>
+      <form method="get" onSubmit={onSubmit}>
+        <Container>
+          <div className="wrapper">
+            <Input
+              ref={searchInputRef}
+              className="search"
+              onChange={onChangeText}
+              icon={{
+                className: 'ri-search-line',
+                link: true,
+                onClick: onSubmit,
+              }}
+              placeholder={activeView.placeholder}
+              fluid
+            />
+          </div>
+        </Container>
+      </form>
+      {(activeView.description || activeView.buttonTitle) && (
+        <div className="advanced-search">
+          <Container>
+            <p>{activeView.description}</p>
+            <a
+              href={defaultView[0].path}
+              className="ui button white inverted"
+              title="Advanced search"
+            >
+              {activeView.buttonTitle}
+            </a>
+          </Container>
         </div>
-      </Container>
-    </form>
+      )}
+    </div>
   );
 }
 

package/theme/theme.config

@@ -109,6 +109,7 @@
 @callout : 'eea';
 @quote   : 'eea';
 @hero    : 'eea';
+@copyright        : 'eea';
 
 /*******************************
             Folders