@eeacms/volto-eea-website-theme 1.3.1 → 1.4.0

package/CHANGELOG.md

@@ -4,15 +4,38 @@ 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.3.1](https://github.com/eea/volto-eea-website-theme/compare/1.3.0...1.3.1) - 25 November 2022
+### [1.4.0](https://github.com/eea/volto-eea-website-theme/compare/1.3.2...1.4.0) - 28 December 2022
 
 #### :rocket: New Features
 
-- feat(Footer): Bring back footer contacts extra actions - refs #151856 [Alin Voinea - [`6c19413`](https://github.com/eea/volto-eea-website-theme/commit/6c194139420c9fd847692d180db1c1593e2483de)]
+- feat(sidebar): Allow previewing images when selecting them with the file picker - refs #152099 [dobri1408 - [`57949d8`](https://github.com/eea/volto-eea-website-theme/commit/57949d80d6a0b081210ee982af26eeee9865ecbe)]
+- feat(language): Show/hide language menu based on supportedLanguages - refs #158616 [Alin Voinea - [`31c96c5`](https://github.com/eea/volto-eea-website-theme/commit/31c96c528a5f86c0a106749ec117006121835ec6)]
+
+#### :nail_care: Enhancements
+
+- change(logo): reference after latest release of volto-eea-design-system [David Ichim - [`c29781d`](https://github.com/eea/volto-eea-website-theme/commit/c29781db3455e1a42b184ba203131cac2ce8768a)]
 
 #### :hammer_and_wrench: Others
 
-- yarn 3 [Alin Voinea - [`ea7a709`](https://github.com/eea/volto-eea-website-theme/commit/ea7a7094945312776e9b6f44e371178603e92139)]
+- Release 1.4.0 [Alin Voinea - [`bd42a0d`](https://github.com/eea/volto-eea-website-theme/commit/bd42a0d26e928cac5d99933194755da3db06b341)]
+- bump version to use as volto-eea-design-system [David Ichim - [`f4be047`](https://github.com/eea/volto-eea-website-theme/commit/f4be047328b46399b03b612d378b18aaf82e7dc1)]
+- test(Jenkins): Run tests and cypress with latest canary @plone/volto [Alin Voinea - [`df252a9`](https://github.com/eea/volto-eea-website-theme/commit/df252a9bfed0bb86cadf53c59dd1603b1e2cd822)]
+### [1.3.2](https://github.com/eea/volto-eea-website-theme/compare/1.3.1...1.3.2) - 16 December 2022
+
+#### :bug: Bug Fixes
+
+- fix(package): Proper paths if the package is not installed, but in development  #71 from eea/better_razzle [ichim-david - [`024c47a`](https://github.com/eea/volto-eea-website-theme/commit/024c47a41d288f9a90a3b6abcba4db596962425f)]
+
+#### :hammer_and_wrench: Others
+
+- Better razzle.config [Tiberiu Ichim - [`81dbf48`](https://github.com/eea/volto-eea-website-theme/commit/81dbf48815fb27facb4f82c9b764540fdf188b2e)]
+- Better razzle.config [Tiberiu Ichim - [`7bc9da2`](https://github.com/eea/volto-eea-website-theme/commit/7bc9da2cd837ab62a95cd29979cdd9b0055b7d67)]
+### [1.3.1](https://github.com/eea/volto-eea-website-theme/compare/1.3.0...1.3.1) - 28 November 2022
+
+#### :rocket: New Features
+
+- feat(Footer): Bring back footer contacts extra actions - refs #151856 [Alin Voinea - [`6c19413`](https://github.com/eea/volto-eea-website-theme/commit/6c194139420c9fd847692d180db1c1593e2483de)]
+
 ### [1.3.0](https://github.com/eea/volto-eea-website-theme/compare/1.2.0...1.3.0) - 22 November 2022
 
 #### :rocket: New Features
@@ -53,7 +76,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - Add subsite class to body [Tiberiu Ichim - [`74d700f`](https://github.com/eea/volto-eea-website-theme/commit/74d700fbfd6249a8604762a7e4e49cce857db0f3)]
 - Add subsite info to header [Tiberiu Ichim - [`47daf8b`](https://github.com/eea/volto-eea-website-theme/commit/47daf8bb6374a1222040626b19d4154df7ba1b83)]
 - fix eslint [Miu Razvan - [`eb8d0a7`](https://github.com/eea/volto-eea-website-theme/commit/eb8d0a790bc70c0aae256c6ff35f63c4885f338e)]
-- Add Sonarqube tag using circularity-frontend addons list [EEA Jenkins - [`cc578a4`](https://github.com/eea/volto-eea-website-theme/commit/cc578a413b205a8e61e091fab3a88f94cedefc89)]
 ### [1.1.0](https://github.com/eea/volto-eea-website-theme/compare/1.0.0...1.1.0) - 28 October 2022
 
 #### :nail_care: Enhancements
@@ -101,7 +123,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
 #### :hammer_and_wrench: Others
 
-- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`33b56ac`](https://github.com/eea/volto-eea-website-theme/commit/33b56acb13fbaf0c5b79e8fc6e13c4b699c79c90)]
 ### [0.7.3](https://github.com/eea/volto-eea-website-theme/compare/0.7.2...0.7.3) - 22 September 2022
 
 #### :hammer_and_wrench: Others
@@ -369,7 +390,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - Header refactor, add custom logo #5 [ichim-david - [`4950235`](https://github.com/eea/volto-eea-website-theme/commit/49502358105437cfeac3b144e6d301cb59aa2346)]
 - Update footer.config with new publication card component [ichim-david - [`2e38e9a`](https://github.com/eea/volto-eea-website-theme/commit/2e38e9a417f835009d60c80d4eb4b30229f55e45)]
 - feature(breadcrumbs): implement eea-design-system breadcrumb as Volto component #32 #7 [ichim-david - [`181af41`](https://github.com/eea/volto-eea-website-theme/commit/181af4125ce2b9ddac56dab4723cb11c26633221)]
-- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`da8ceb6`](https://github.com/eea/volto-eea-website-theme/commit/da8ceb68ea68bfbc9504e48ccd4d68277f11ab9a)]
 - use breadcrumbs from eea-design-system [nileshgulia1 - [`db2f9e9`](https://github.com/eea/volto-eea-website-theme/commit/db2f9e9a4327420a3cce9a9903cd88549b129eab)]
 - Update theme.config [ichim-david - [`8eca4f4`](https://github.com/eea/volto-eea-website-theme/commit/8eca4f40397a4aeca6d39029c92db78968d37064)]
 - Added keyContent component to theme.config [ichim-david - [`d86f202`](https://github.com/eea/volto-eea-website-theme/commit/d86f202d0274d839487a88b51cae9a0e899beb23)]
@@ -411,5 +431,4 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
 #### :hammer_and_wrench: Others
 
-- yarn bootstrap [Alin Voinea - [`6995e9e`](https://github.com/eea/volto-eea-website-theme/commit/6995e9e091f21fdbbdffa8a44fc0e2c626f6d46a)]
 - Initial commit [Alin Voinea - [`6a9c03a`](https://github.com/eea/volto-eea-website-theme/commit/6a9c03a7cebe71ca87e82cf58c42904063e9d8d3)]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-eea-website-theme",
-  "version": "1.3.1",
+  "version": "1.4.0",
   "description": "@eeacms/volto-eea-website-theme: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",
@@ -22,7 +22,7 @@
     "url": "git@github.com:eea/volto-eea-website-theme.git"
   },
   "dependencies": {
-    "@eeacms/volto-eea-design-system": "*",
+    "@eeacms/volto-eea-design-system": "^1.0.0-alpha.8",
     "volto-subsites": "*"
   },
   "devDependencies": {

package/razzle.extend.js

@@ -4,18 +4,24 @@ const plugins = (defaultPlugins) => {
 };
 const modify = (config, { target, dev }, webpack) => {
   const themeConfigPath = `${__dirname}/theme/theme.config`;
-  config.resolve.alias['../../theme.config$'] = themeConfigPath;
-  config.resolve.alias['../../theme.config'] = themeConfigPath;
-  const projectRootPath = path.resolve('.');
-  const themeLessPath = `${projectRootPath}/node_modules/@eeacms/volto-eea-design-system/theme`;
+  const { alias } = config.resolve;
+  alias['../../theme.config$'] = themeConfigPath;
+  alias['../../theme.config'] = themeConfigPath;
 
-  config.resolve.alias['eea-design-system-theme'] = dev
-    ? `${projectRootPath}/src/addons/volto-eea-design-system/theme/themes/eea`
-    : `${themeLessPath}/themes/eea`;
+  const designSystem = '@eeacms/volto-eea-design-system';
+  const designSystemPath =
+    config.resolve.alias[designSystem] ||
+    path.dirname(require.resolve(designSystem));
 
-  const semanticLessPath = `${projectRootPath}/node_modules/semantic-ui-less`;
-  const hasDesignSystemInstalled = config.resolve.alias['eea-volto-themes'];
-  config.resolve.alias['eea-volto-theme-folder'] = hasDesignSystemInstalled
+  const themeLessPath = path.resolve(`${designSystemPath}/../theme`);
+
+  alias['eea-design-system-theme'] = `${themeLessPath}/themes/eea`;
+
+  const semanticLessPath = path.dirname(
+    require.resolve('semantic-ui-less/package.json'),
+  );
+
+  alias['eea-volto-theme-folder'] = alias['eea-volto-themes']
     ? themeLessPath
     : semanticLessPath;
 

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

@@ -35,11 +35,11 @@ export default {
       title: 'Actions',
       fields: ['hideShareButton', 'hideDownloadButton'],
     },
-    // {
-    //   id: 'advanced',
-    //   title: 'Advanced options',
-    //   fields: ['contentType'],
-    // },
+    {
+      id: 'copyright',
+      title: 'Copyright',
+      fields: ['copyright', 'copyrightIcon', 'copyrightPosition'],
+    },
   ],
   properties: {
     hideContentType: {
@@ -71,10 +71,19 @@ export default {
       widget: 'object_list',
       schema: infoSchema,
     },
-    // contentType: {
-    //   title: 'Type',
-    //   description: "Custom content-type's name",
-    // },
+    copyright: {
+      title: 'Text',
+    },
+    copyrightIcon: {
+      title: 'Icon',
+      default: 'ri-copyright-line',
+    },
+    copyrightPosition: {
+      title: 'Align',
+      widget: 'align',
+      actions: ['left', 'right'],
+      defaultValue: 'left',
+    },
   },
   required: [],
 };

package/src/components/theme/Banner/View.jsx

@@ -5,10 +5,11 @@ import { withRouter } from 'react-router';
 import { defineMessages, injectIntl } from 'react-intl';
 import { startCase } from 'lodash';
 import qs from 'querystring';
-import { Container, Popup } from 'semantic-ui-react';
+import { Container, Popup, Icon } from 'semantic-ui-react';
 import { flattenToAppURL } from '@plone/volto/helpers';
 import Banner from './Banner';
 import { getImageSource, sharePage } from './Banner';
+import Copyright from '@eeacms/volto-eea-design-system/ui/Copyright/Copyright';
 
 import './styles.less';
 
@@ -83,6 +84,9 @@ const View = (props) => {
     hideModificationDate,
     hideShareButton,
     hideDownloadButton,
+    copyright,
+    copyrightIcon,
+    copyrightPosition,
     // contentType,
   } = props.data;
   // Set query parameters
@@ -222,6 +226,16 @@ const View = (props) => {
                   />
                 ))}
               </Banner.Metadata>
+              {copyright ? (
+                <Copyright copyrightPosition={copyrightPosition}>
+                  <Copyright.Icon>
+                    <Icon className={copyrightIcon} />
+                  </Copyright.Icon>
+                  <Copyright.Text>{copyright}</Copyright.Text>
+                </Copyright>
+              ) : (
+                ''
+              )}
             </Banner.Content>
           </ContainerWrapper>
         </div>

package/src/components/theme/Logo.jsx

@@ -3,7 +3,7 @@ import { defineMessages, useIntl } from 'react-intl';
 import config from '@plone/volto/registry';
 
 import { Logo } from '@eeacms/volto-eea-design-system/ui';
-import LogoImage from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/images/Header/eea-logo.svg';
+import LogoImage from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/logo/eea-logo.svg';
 
 const messages = defineMessages({
   site: {

package/src/config.js

@@ -8,8 +8,8 @@ import copernicusLogo from '@eeacms/volto-eea-design-system/../theme/themes/eea/
 import industryLogo from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/logo/industry.svg';
 import marineLogo from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/logo/marine.svg';
 import eionetLogo from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/logo/eionet.svg';
-import eeaLogo from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/images/Header/eea-logo.svg';
-import eeaWhiteLogo from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/logo/eea-white.svg';
+import eeaLogo from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/logo/eea-logo.svg';
+import eeaWhiteLogo from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/logo/eea-logo-white.svg';
 import climateLogo from '@eeacms/volto-eea-design-system/../theme/themes/eea/assets/logo/climate-health.svg';
 
 // TODO: to be consolidated with headerLinks

package/src/customizations/volto/components/manage/Sidebar/ObjectBrowserNav.jsx

@@ -0,0 +1,140 @@
+import React from 'react';
+import { Button, Segment, Popup } from 'semantic-ui-react';
+import { useIntl, defineMessages } from 'react-intl';
+import cx from 'classnames';
+import Icon from '@plone/volto/components/theme/Icon/Icon';
+import { flattenToAppURL, getContentIcon } from '@plone/volto/helpers';
+import { Image } from 'semantic-ui-react';
+import config from '@plone/volto/registry';
+import '../../../../../../theme/site/imageicons/imageicons.less';
+
+import rightArrowSVG from '@plone/volto/icons/right-key.svg';
+import homeSVG from '@plone/volto/icons/home.svg';
+
+const messages = defineMessages({
+  browse: {
+    id: 'Browse',
+    defaultMessage: 'Browse',
+  },
+  select: {
+    id: 'Select',
+    defaultMessage: 'Select',
+  },
+});
+
+const ObjectBrowserNav = ({
+  currentSearchResults,
+  selected,
+  handleClickOnItem,
+  handleDoubleClickOnItem,
+  mode,
+  navigateTo,
+  isSelectable,
+}) => {
+  const intl = useIntl();
+  const isSelected = (item) => {
+    let ret = false;
+    if (selected) {
+      selected
+        .filter((item) => item != null)
+        .forEach((_item) => {
+          if (flattenToAppURL(_item['@id']) === flattenToAppURL(item['@id'])) {
+            ret = true;
+          }
+        });
+    }
+    return ret;
+  };
+
+  return (
+    <Segment as="ul" className="object-listing">
+      {currentSearchResults &&
+        currentSearchResults.items.map((item) => (
+          <li
+            role="presentation"
+            aria-label={
+              item.is_folderish && mode === 'image'
+                ? `${intl.formatMessage(messages.browse)} ${item.title}`
+                : `${intl.formatMessage(messages.select)} ${item.title}`
+            }
+            key={item['@id']}
+            className={cx('', {
+              'selected-item': isSelected(item),
+
+              disabled:
+                mode === 'image'
+                  ? !config.settings.imageObjects.includes(item['@type']) &&
+                    !item.is_folderish
+                  : !isSelectable(item),
+            })}
+            onClick={() => handleClickOnItem(item)}
+            onDoubleClick={() => handleDoubleClickOnItem(item)}
+          >
+            <span title={`${item['@id']} (${item['@type']})`}>
+              <Popup
+                key={item['@id']}
+                content={
+                  <>
+                    <Icon name={homeSVG} size="18px" />{' '}
+                    {flattenToAppURL(item['@id'])} ( {item['@type']})
+                  </>
+                }
+                trigger={
+                  <span>
+                    {item['@type'] === 'Image' ? (
+                      <Image
+                        src={`${item?.getURL}/@@images/image`}
+                        className="sidebar-image-icon"
+                      />
+                    ) : (
+                      <Icon
+                        name={getContentIcon(item['@type'], item.is_folderish)}
+                        size="24px"
+                      />
+                    )}
+                  </span>
+                }
+              />
+
+              {item.title}
+            </span>
+            {item.is_folderish && mode === 'image' && (
+              <Icon
+                className="right-arrow-icon"
+                name={rightArrowSVG}
+                size="24px"
+              />
+            )}
+            {item.is_folderish && (mode === 'link' || mode === 'multiple') && (
+              <div
+                role="presentation"
+                className="right-arrow-link-mode"
+                onClick={(e) => {
+                  e.stopPropagation();
+                  navigateTo(item['@id']);
+                }}
+              >
+                <Button.Group>
+                  <Button
+                    basic
+                    icon
+                    aria-label={`${intl.formatMessage(messages.browse)} ${
+                      item.title
+                    }`}
+                  >
+                    <Icon
+                      className="right-arrow-icon"
+                      name={rightArrowSVG}
+                      size="24px"
+                    />
+                  </Button>
+                </Button.Group>
+              </div>
+            )}
+          </li>
+        ))}
+    </Segment>
+  );
+};
+
+export default ObjectBrowserNav;

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

@@ -153,6 +153,7 @@ const EEAHeader = ({ pathname, token, items, history, subsite }) => {
           <Header.TopDropdownMenu
             id="language-switcher"
             className="item"
+            hasLanguageDropdown={config.settings.supportedLanguages.length > 1}
             text={`${language.toUpperCase()}`}
             mobileText={`${language.toUpperCase()}`}
             icon={

package/theme/site/imageicons/imageicons.less

@@ -0,0 +1,5 @@
+.sidebar-image-icon {
+  margin-right: 10px;
+  height: 24px;
+  width: 24px;
+}