@eeacms/volto-tabs-block 7.5.0 → 8.0.0

package/.eslintrc.js

@@ -0,0 +1,65 @@
+const fs = require('fs');
+const path = require('path');
+const projectRootPath = fs.realpathSync(__dirname + '/../../../');
+
+let voltoPath = path.join(projectRootPath, 'node_modules/@plone/volto');
+let configFile;
+if (fs.existsSync(`${projectRootPath}/tsconfig.json`))
+  configFile = `${projectRootPath}/tsconfig.json`;
+else if (fs.existsSync(`${projectRootPath}/jsconfig.json`))
+  configFile = `${projectRootPath}/jsconfig.json`;
+
+if (configFile) {
+  const jsConfig = require(configFile).compilerOptions;
+  const pathsConfig = jsConfig.paths;
+  if (pathsConfig['@plone/volto'])
+    voltoPath = `./${jsConfig.baseUrl}/${pathsConfig['@plone/volto'][0]}`;
+}
+
+const AddonConfigurationRegistry = require(`${voltoPath}/addon-registry.js`);
+const reg = new AddonConfigurationRegistry(projectRootPath);
+
+// Extends ESlint configuration for adding the aliases to `src` directories in Volto addons
+const addonAliases = Object.keys(reg.packages).map((o) => [
+  o,
+  reg.packages[o].modulePath,
+]);
+
+const addonExtenders = reg.getEslintExtenders().map((m) => require(m));
+
+const defaultConfig = {
+  extends: `${voltoPath}/.eslintrc`,
+  settings: {
+    'import/resolver': {
+      alias: {
+        map: [
+          ['@plone/volto', '@plone/volto/src'],
+          ['@plone/volto-slate', '@plone/volto/packages/volto-slate/src'],
+          ...addonAliases,
+          ['@package', `${__dirname}/src`],
+          ['@root', `${__dirname}/src`],
+          ['~', `${__dirname}/src`],
+        ],
+        extensions: ['.js', '.jsx', '.json'],
+      },
+      'babel-plugin-root-import': {
+        rootPathSuffix: 'src',
+      },
+    },
+  },
+  rules: {
+    'react/jsx-no-target-blank': [
+      'error',
+      {
+        allowReferrer: true,
+      },
+    ],
+  }
+};
+
+const config = addonExtenders.reduce(
+  (acc, extender) => extender.modify(acc),
+  defaultConfig,
+);
+
+module.exports = config;

package/CHANGELOG.md

@@ -4,10 +4,30 @@ 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).
 
+### [8.0.0](https://github.com/eea/volto-tabs-block/compare/7.5.1...8.0.0) - 22 April 2024
+
+#### :rocket: New Features
+
+- feat: Release 8.0.0 - Volto 17 support [alin - [`57dd000`](https://github.com/eea/volto-tabs-block/commit/57dd0008921899688a6175c9fb00588593a7b307)]
+- feat: Volto 17 support - refs #264527 [EEA Jenkins - [`80b384c`](https://github.com/eea/volto-tabs-block/commit/80b384ca871dd2578b1cd0c0bf3e238d0289b977)]
+
+#### :hammer_and_wrench: Others
+
+### [7.5.1](https://github.com/eea/volto-tabs-block/compare/7.5.0...7.5.1) - 28 March 2024
+
+#### :nail_care: Enhancements
+
+- change(accordion): added menu-item-text class to accordion tab span [David Ichim - [`6dad8b1`](https://github.com/eea/volto-tabs-block/commit/6dad8b11ab2a4c81a3e5718d89116d5f28593946)]
+
+#### :house: Internal changes
+
+- style: Automated code fix [eea-jenkins - [`730f20c`](https://github.com/eea/volto-tabs-block/commit/730f20ce438bcbaefa421ba73849fe6089de0466)]
+
 ### [7.5.0](https://github.com/eea/volto-tabs-block/compare/7.0.5...7.5.0) - 7 March 2024
 
 #### :boom: Breaking Change
 
+- breaking(tabs): use DefaultEdit variation as base for responsive accordion edit  refs #266327  #85 from eea/develop [ichim-david - [`2f7fc23`](https://github.com/eea/volto-tabs-block/commit/2f7fc23025532ab9cfb9788f7557dda2f686ac43)]
 - breaking(tabs): menu-item-text markup is now span instead of p tag [David Ichim - [`5aa7981`](https://github.com/eea/volto-tabs-block/commit/5aa798140654b4b6e3487c082483640432eddd65)]
 
 #### :bug: Bug Fixes

package/jest-addon.config.js

@@ -1,3 +1,5 @@
+require('dotenv').config({ path: __dirname + '/.env' })
+
 module.exports = {
   testMatch: ['**/src/addons/**/?(*.)+(spec|test).[jt]s?(x)'],
   collectCoverageFrom: [
@@ -9,19 +11,26 @@ module.exports = {
     '@plone/volto/cypress': '<rootDir>/node_modules/@plone/volto/cypress',
     '@plone/volto/babel': '<rootDir>/node_modules/@plone/volto/babel',
     '@plone/volto/(.*)$': '<rootDir>/node_modules/@plone/volto/src/$1',
-    '@package/(.*)$': '<rootDir>/src/$1',
-    '@root/(.*)$': '<rootDir>/src/$1',
+    '@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':
+    '@plone/volto-slate$':
       '<rootDir>/node_modules/@plone/volto/packages/volto-slate/src',
+    '@plone/volto-slate/(.*)$':
+      '<rootDir>/node_modules/@plone/volto/packages/volto-slate/src/$1',
     '~/(.*)$': '<rootDir>/src/$1',
     'load-volto-addons':
       '<rootDir>/node_modules/@plone/volto/jest-addons-loader.js',
   },
-  transformIgnorePatterns: ['node_modules/(?!@eeacms)/volto-anchors/helpers'],
+  transformIgnorePatterns: [
+    '/node_modules/(?!(@plone|@root|@package|@eeacms)/).*/',
+  ],
   transform: {
     '^.+\\.js(x)?$': 'babel-jest',
+    '^.+\\.ts(x)?$': 'babel-jest',
     '^.+\\.(png)$': 'jest-file',
     '^.+\\.(jpg)$': 'jest-file',
     '^.+\\.(svg)$': './node_modules/@plone/volto/jest-svgsystem-transform.js',
@@ -34,4 +43,9 @@ module.exports = {
       statements: 5,
     },
   },
-};
+  ...(process.env.JEST_USE_SETUP === 'ON' && {
+    setupFilesAfterEnv: [
+      '<rootDir>/node_modules/@eeacms/volto-tabs-block/jest.setup.js',
+    ],
+  }),
+}

package/jest.setup.js

@@ -0,0 +1,65 @@
+import { jest } from '@jest/globals';
+import configureStore from 'redux-mock-store';
+import thunk from 'redux-thunk';
+import { blocksConfig } from '@plone/volto/config/Blocks';
+import installSlate from '@plone/volto-slate/index';
+
+var mockSemanticComponents = jest.requireActual('semantic-ui-react');
+var mockComponents = jest.requireActual('@plone/volto/components');
+var config = jest.requireActual('@plone/volto/registry').default;
+
+config.blocks.blocksConfig = {
+  ...blocksConfig,
+  ...config.blocks.blocksConfig,
+};
+
+jest.doMock('semantic-ui-react', () => ({
+  __esModule: true,
+  ...mockSemanticComponents,
+  Popup: ({ content, trigger }) => {
+    return (
+      <div className="popup">
+        <div className="trigger">{trigger}</div>
+        <div className="content">{content}</div>
+      </div>
+    );
+  },
+}));
+
+jest.doMock('@plone/volto/components', () => {
+  return {
+    __esModule: true,
+    ...mockComponents,
+    SidebarPortal: ({ children }) => <div id="sidebar">{children}</div>,
+  };
+});
+
+jest.doMock('@plone/volto/registry', () =>
+  [installSlate].reduce((acc, apply) => apply(acc), config),
+);
+
+const mockStore = configureStore([thunk]);
+
+global.fetch = jest.fn(() =>
+  Promise.resolve({
+    json: () => Promise.resolve({}),
+  }),
+);
+
+global.store = mockStore({
+  intl: {
+    locale: 'en',
+    messages: {},
+    formatMessage: jest.fn(),
+  },
+  content: {
+    create: {},
+    subrequests: [],
+  },
+  connected_data_parameters: {},
+  screen: {
+    page: {
+      width: 768,
+    },
+  },
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-tabs-block",
-  "version": "7.5.0",
+  "version": "8.0.0",
   "description": "volto-tabs-block: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",
@@ -31,6 +31,7 @@
     "@cypress/code-coverage": "^3.10.0",
     "@plone/scripts": "*",
     "babel-plugin-transform-class-properties": "^6.24.1",
+    "dotenv": "^16.3.2",
     "husky": "^8.0.3",
     "lint-staged": "^14.0.1",
     "md5": "^2.3.0"

package/src/components/templates/accordion/View.jsx

@@ -42,8 +42,11 @@ const View = (props) => {
   const accordionConfig = config.blocks.blocksConfig[
     TABS_BLOCK
   ].variations.filter((v, _i) => v.id === data.variation);
-  const { icons, semanticIcon, transformWidth = 800 } =
-    accordionConfig?.[0] || {};
+  const {
+    icons,
+    semanticIcon,
+    transformWidth = 800,
+  } = accordionConfig?.[0] || {};
 
   const tabsContainer = React.useRef();
   const [mounted, setMounted] = React.useState(false);
@@ -82,7 +85,7 @@ const View = (props) => {
               tabIndex={tabIndex}
             />
           ) : (
-            <span>{title || defaultTitle}</span>
+            <span className="menu-item-text">{title || defaultTitle}</span>
           )}
         </>
       ),

package/src/components/templates/carousel/HorizontalView.jsx

@@ -135,9 +135,8 @@ const View = (props) => {
   }, [activeTab]);
   React.useEffect(() => {
     if (!slider.current?.innerSlider?.list) return;
-    let inaccessibleElements = slider.current.innerSlider.list.querySelectorAll(
-      '.slick-slide',
-    );
+    let inaccessibleElements =
+      slider.current.innerSlider.list.querySelectorAll('.slick-slide');
     for (let element of inaccessibleElements) {
       element.setAttribute('tabindex', '0');
       element.setAttribute('aria-hidden', 'false');

package/src/less/carousel.less

@@ -154,8 +154,8 @@
       left: 0;
       width: 100%;
       height: 2px;
-      background-color: @lightColor;
       border-radius: 2px;
+      background-color: @lightColor;
       opacity: 1;
       transform: translateY(-50%);
     }
@@ -180,8 +180,8 @@
           width: @dotsSize;
           height: @dotsSize;
           padding: 0;
-          background-color: @lightColor;
           border-radius: 100%;
+          background-color: @lightColor;
           color: @lightColor;
 
           &::before {
@@ -304,7 +304,9 @@
 }
 
 @media only screen and (max-width: @largestMobileScreen + @largestMobileScreenOffset) {
-  body:not(.has-toolbar):not(.has-sidebar):not(.has-toolbar-collapsed):not(.has-sidebar-collapsed),
+  body:not(.has-toolbar):not(.has-sidebar):not(.has-toolbar-collapsed):not(
+      .has-sidebar-collapsed
+    ),
   body.has-toolbar-collapsed:not(.has-sidebar):not(.has-sidebar-collapsed),
   body.has-toolbar:not(.has-sidebar):not(.has-sidebar-collapsed) {
     .tabs-block {

package/.project.eslintrc.js

@@ -1,48 +0,0 @@
-const fs = require('fs');
-const path = require('path');
-
-const projectRootPath = fs.existsSync('./project')
-  ? fs.realpathSync('./project')
-  : fs.realpathSync('./../../../');
-const packageJson = require(path.join(projectRootPath, 'package.json'));
-const jsConfig = require(path.join(projectRootPath, 'jsconfig.json')).compilerOptions;
-
-const pathsConfig = jsConfig.paths;
-
-let voltoPath = path.join(projectRootPath, 'node_modules/@plone/volto');
-
-Object.keys(pathsConfig).forEach(pkg => {
-  if (pkg === '@plone/volto') {
-    voltoPath = `./${jsConfig.baseUrl}/${pathsConfig[pkg][0]}`;
-  }
-});
-const AddonConfigurationRegistry = require(`${voltoPath}/addon-registry.js`);
-const reg = new AddonConfigurationRegistry(projectRootPath);
-
-// Extends ESlint configuration for adding the aliases to `src` directories in Volto addons
-const addonAliases = Object.keys(reg.packages).map(o => [
-  o,
-  reg.packages[o].modulePath,
-]);
-
-
-module.exports = {
-  extends: `${projectRootPath}/node_modules/@plone/volto/.eslintrc`,
-  settings: {
-    'import/resolver': {
-      alias: {
-        map: [
-          ['@plone/volto', '@plone/volto/src'],
-          ...addonAliases,
-          ['@package', `${__dirname}/src`],
-          ['~', `${__dirname}/src`],
-        ],
-        extensions: ['.js', '.jsx', '.json'],
-      },
-      'babel-plugin-root-import': {
-        rootPathSuffix: 'src',
-      },
-    },
-  },
-};
-