@eeacms/volto-eea-website-policy 2.2.3 → 2.3.1

package/CHANGELOG.md

@@ -4,6 +4,75 @@ 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).
 
+### [2.3.1](https://github.com/eea/volto-eea-website-policy/compare/2.3.0...2.3.1) - 30 January 2025
+
+#### :bug: Bug Fixes
+
+- fix: error on edititing html block and make it readonly - refs #282438 [Teodor Voicu - [`302e393`](https://github.com/eea/volto-eea-website-policy/commit/302e393c8214465673d757b50b89d89574f0f4a8)]
+
+### [2.3.0](https://github.com/eea/volto-eea-website-policy/compare/2.2.3...2.3.0) - 11 October 2024
+
+#### :rocket: New Features
+
+- feat(ContextNavigation): improve accordion outside click handling [David Ichim - [`0eb27ac`](https://github.com/eea/volto-eea-website-policy/commit/0eb27acf6d8fd04ecb7f003d4fe2de65b0077168)]
+- feat(ContextNavigation): wrap accordion summary and list in container on tablet [David Ichim - [`43b659f`](https://github.com/eea/volto-eea-website-policy/commit/43b659fab611c24d42b46fc7e57cbb9e292e5f6e)]
+- feat(ContextNavigation): add aria-label to context navigation [David Ichim - [`5c7241d`](https://github.com/eea/volto-eea-website-policy/commit/5c7241d44146751b370b8d960d28efabd607c870)]
+- feat: use isMenuOpenOnOutsideClick to detect outside clicks [nileshgulia1 - [`5bef098`](https://github.com/eea/volto-eea-website-policy/commit/5bef098d7dd6b9829fbb4c1341747aecad89fce5)]
+- feat: add accordion variation for contextNavigation block [nileshgulia1 - [`a8fdad8`](https://github.com/eea/volto-eea-website-policy/commit/a8fdad8c1902224b56e6e4f30357546ef9de40dc)]
+- feat(contextNavigation): add variations support [nileshgulia1 - [`4c984c8`](https://github.com/eea/volto-eea-website-policy/commit/4c984c8eadfcf0eb7aed0541fb8737fc2b1b2e27)]
+
+#### :bug: Bug Fixes
+
+- fix: cypress [nileshgulia1 - [`5df3c21`](https://github.com/eea/volto-eea-website-policy/commit/5df3c21f0e7043aa80e35077246be75a52c3c7e4)]
+- fix(contextNav): make accordion expands initially, fix tests [nileshgulia1 - [`9bfa568`](https://github.com/eea/volto-eea-website-policy/commit/9bfa568ac9b584e4e3d9dea0675e82a93304a25f)]
+- fix(context-navigation): set active accordion on initial mounts [nileshgulia1 - [`de902b1`](https://github.com/eea/volto-eea-website-policy/commit/de902b1fb1e06d50bc9a39bf589e8ededa6ec2a1)]
+- fix: addKeyDown handlers [nileshgulia1 - [`7150f64`](https://github.com/eea/volto-eea-website-policy/commit/7150f641ab46c885b90474e37ff0bf294868ba95)]
+- fix: make accordion accessible, add details tag [nileshgulia1 - [`d1e5f29`](https://github.com/eea/volto-eea-website-policy/commit/d1e5f29bf62801bf1b3f12f1417729acc1a010b0)]
+- fix: compute is_current for nested items also [nileshgulia1 - [`3e66745`](https://github.com/eea/volto-eea-website-policy/commit/3e66745f39bcd4ac861124a16bfaa5685ec11e47)]
+- fix: acitve states on accordion and links elements [nileshgulia1 - [`1b4426f`](https://github.com/eea/volto-eea-website-policy/commit/1b4426f8ce44f11cc10d73dd08f213c0b891c488)]
+- fix: behave as links when no childs are present [nileshgulia1 - [`c6ac493`](https://github.com/eea/volto-eea-website-policy/commit/c6ac4937519d41f631757472f49f0b609ed8cda1)]
+
+#### :nail_care: Enhancements
+
+- change(navigation): moved navigation block with the side nav within volto-eea-website-theme #270999 #99 from eea/270999_report_navigation [Ichim David - [`f37254e`](https://github.com/eea/volto-eea-website-policy/commit/f37254e403ac3ce13c4b8d7bcecb54c811c8cad8)]
+- change(contextNavigation): use withEEASideMenu in accordion variation [nileshgulia1 - [`24927d8`](https://github.com/eea/volto-eea-website-policy/commit/24927d8bb6c44e9a3267183ac0a0fd0c0aa58bd4)]
+- change(accordion): simplify logic and improve render by have a list of elements instead of div tags [David Ichim - [`9c73cd5`](https://github.com/eea/volto-eea-website-policy/commit/9c73cd55b5303df958c64a12a251f9a9b15d35ef)]
+
+#### :house: Internal changes
+
+- chore(eslint):add tabIndex [nileshgulia1 - [`53a3ac2`](https://github.com/eea/volto-eea-website-policy/commit/53a3ac2bf52499fde069fbe57c5efc3f11eaa485)]
+- chore: fix eslint [nileshgulia1 - [`acad444`](https://github.com/eea/volto-eea-website-policy/commit/acad4440314a9f5464cc1b2f10eb3ab1489ff54a)]
+
+#### :hammer_and_wrench: Others
+
+- removed test for context navigation after the move to volto-eea-website-theme [David Ichim - [`696f0a1`](https://github.com/eea/volto-eea-website-policy/commit/696f0a11c3a8401c064293053490265ffb644215)]
+- bumped package version to 2.3.0 [David Ichim - [`fd88b99`](https://github.com/eea/volto-eea-website-policy/commit/fd88b99d92cb991171807788d8abea3d86832142)]
+- removed ContextNavigation block moved within eea-website-theme [David Ichim - [`361b887`](https://github.com/eea/volto-eea-website-policy/commit/361b8877c02596b971c1ecabd84d8eaa89d3000f)]
+- removed double rolesWhoCanChangeLayout setting [David Ichim - [`37dab9e`](https://github.com/eea/volto-eea-website-policy/commit/37dab9ef04dc1497655e49186f398b5dd53f39b1)]
+- use contextnavigation in policy [nileshgulia1 - [`eea2258`](https://github.com/eea/volto-eea-website-policy/commit/eea2258244c146ff682e055ffb88cf0b9020da93)]
+- move contextNav to volto-eea-website-theme [nileshgulia1 - [`07aa147`](https://github.com/eea/volto-eea-website-policy/commit/07aa14746a0253f75dc7c63610e1998eae6ffbf5)]
+- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`f620f72`](https://github.com/eea/volto-eea-website-policy/commit/f620f72b1bee27d9215b4cec5ddbe125ae0f7030)]
+- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`13b94c3`](https://github.com/eea/volto-eea-website-policy/commit/13b94c308e20970b4a30e1ec12734e8eaabfffb9)]
+- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`8ebc23d`](https://github.com/eea/volto-eea-website-policy/commit/8ebc23dac8134ffed5b8f89d117cec1a13790c2c)]
+- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`a57c3eb`](https://github.com/eea/volto-eea-website-policy/commit/a57c3eb88ad31cc50f5321c406ac5b5d918bf623)]
+- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`f26c537`](https://github.com/eea/volto-eea-website-policy/commit/f26c537fa75fcb6eedad808a933a8a0689eda9f8)]
+- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`b1491ca`](https://github.com/eea/volto-eea-website-policy/commit/b1491ca3c9f07a7b91b9e892b0e53e4cf82762ce)]
+- Added extra handleOutsideClick on  Accordion mobile and tablet to close when clicking besides the smaller menu [David Ichim - [`6d36534`](https://github.com/eea/volto-eea-website-policy/commit/6d365349ba9f779b527344d6d109c77d77501acf)]
+- close nav on tablet or mobile resolution by default [David Ichim - [`9e119d2`](https://github.com/eea/volto-eea-website-policy/commit/9e119d23d50dd5a614279da6ec3ccc369a16ba19)]
+- dropped useless code [David Ichim - [`7f5c122`](https://github.com/eea/volto-eea-website-policy/commit/7f5c122c596eb4db7f0ea4c81708b3c88aca657b)]
+- Added initial context navigation block test for both Default and Accordion variations [David Ichim - [`7257385`](https://github.com/eea/volto-eea-website-policy/commit/7257385a69f3b7b3541c1a78588504812741d59f)]
+- more sonarqube warning fixing [David Ichim - [`e676f77`](https://github.com/eea/volto-eea-website-policy/commit/e676f77a35578ddbc7f03d7c340084d24375bc67)]
+- Removed leftover schema enhancer in favor of normal schema editing [David Ichim - [`b67f3c4`](https://github.com/eea/volto-eea-website-policy/commit/b67f3c412bd31efb1a4bbe2b6b6e1140a55bc32a)]
+- fix sonarqube warning regarding missing onKeyDown for summary tag [David Ichim - [`e0fabbf`](https://github.com/eea/volto-eea-website-policy/commit/e0fabbf31609d8e3c706b13ae09c5c52f6a836c7)]
+- use accordion-list-title instead of title class [David Ichim - [`4ee90f2`](https://github.com/eea/volto-eea-website-policy/commit/4ee90f23d3e3d306c5b26bcd405cc85df390f34d)]
+- Added aria-controls, aria-labelledby and region role for better a11y support for accordion [David Ichim - [`a946170`](https://github.com/eea/volto-eea-website-policy/commit/a946170070dd9edd198338f70f19cd47e75e22d7)]
+- bump size of accordion open close icon [David Ichim - [`b42ee13`](https://github.com/eea/volto-eea-website-policy/commit/b42ee1368ec83c2dc7f724d5e417d8b14c337459)]
+- Added extra classes needed to properly style the accordion style context-navigation [David Ichim - [`bdd5aca`](https://github.com/eea/volto-eea-website-policy/commit/bdd5aca036e81de505051c4d84099bc0c37d54e1)]
+- Improve filtering of navigation using portal_type passed to restapi [David Ichim - [`3a4ae52`](https://github.com/eea/volto-eea-website-policy/commit/3a4ae525a028445bb03686a68c4aeb926fdac39b)]
+- WIP: filter portal_types in contextNavigation block [nileshgulia1 - [`b417ca1`](https://github.com/eea/volto-eea-website-policy/commit/b417ca14397da944220508df75ab38cd8a36f22d)]
+- Lint fix [David Ichim - [`c41d684`](https://github.com/eea/volto-eea-website-policy/commit/c41d68481325009a918078f9870c22e9253638e4)]
+- Added classes to ul and li of accordion context navigation [David Ichim - [`08cd8a6`](https://github.com/eea/volto-eea-website-policy/commit/08cd8a653308a49a137529264536e8aa024c6580)]
+- Fix: also add expand icon when no name is set [nileshgulia1 - [`a06ab09`](https://github.com/eea/volto-eea-website-policy/commit/a06ab0989dc46962a68913dc8836be69d0349a04)]
 ### [2.2.3](https://github.com/eea/volto-eea-website-policy/compare/2.2.2...2.2.3) - 19 September 2024
 
 #### :rocket: New Features

package/locales/volto.pot

@@ -1,16 +1,21 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: Plone\n"
-"POT-Creation-Date: 2023-06-28T10:48:22.678Z\n"
+"POT-Creation-Date: 2024-09-02T18:05:47.779Z\n"
 "Last-Translator: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Language-Team: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
-"MIME-Version: 1.0\n"
 "Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=1; plural=0;\n"
+"MIME-Version: 1.0\n"
 "Language-Code: en\n"
 "Language-Name: English\n"
 "Preferred-Encodings: utf-8\n"
 "Domain: volto\n"
 
-
+#. Default: "Navigation"
+#: components/Blocks/ContextNavigation/variations/Accordion
+#: components/Blocks/ContextNavigation/variations/AccordionClaude
+#: components/Blocks/ContextNavigation/variations/AccordionOriginal
+msgid "Navigation"
+msgstr ""

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-eea-website-policy",
-  "version": "2.2.3",
+  "version": "2.3.1",
   "description": "@eeacms/volto-eea-website-policy: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",
@@ -17,12 +17,10 @@
     "url": "git@github.com:eea/volto-eea-website-policy.git"
   },
   "addons": [
-    "@eeacms/volto-block-toc",
     "@eeacms/volto-widget-dataprovenance",
     "@plone-collective/volto-authomatic"
   ],
   "dependencies": {
-    "@eeacms/volto-block-toc": "*",
     "@eeacms/volto-widget-dataprovenance": "*",
     "@plone-collective/volto-authomatic": "*"
   },

package/src/customizations/volto/components/manage/Blocks/HTML/Edit.jsx

@@ -0,0 +1,371 @@
+/**
+ * Edit html block.
+ * @module components/manage/Blocks/HTML/Edit
+ */
+
+import { compose } from 'redux';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { Button, Popup } from 'semantic-ui-react';
+import { defineMessages, injectIntl } from 'react-intl';
+import loadable from '@loadable/component';
+import { isEqual } from 'lodash';
+
+import { Icon } from '@plone/volto/components';
+import { injectLazyLibs } from '@plone/volto/helpers/Loadable/Loadable';
+import showSVG from '@plone/volto/icons/show.svg';
+// import clearSVG from '@plone/volto/icons/clear.svg';
+// import codeSVG from '@plone/volto/icons/code.svg';
+// import indentSVG from '@plone/volto/icons/indent.svg';
+
+const Editor = loadable(() => import('react-simple-code-editor'));
+
+const messages = defineMessages({
+  source: {
+    id: 'Source',
+    defaultMessage: 'Source',
+  },
+  preview: {
+    id: 'Preview',
+    defaultMessage: 'Preview',
+  },
+  placeholder: {
+    id: '<p>Add some HTML here</p>',
+    defaultMessage: '<p>Add some HTML here</p>',
+  },
+  prettier: {
+    id: 'Prettify your code',
+    defaultMessage: 'Prettify your code',
+  },
+  clear: {
+    id: 'Clear',
+    defaultMessage: 'Clear',
+  },
+  code: {
+    id: 'Code',
+    defaultMessage: 'Code',
+  },
+});
+
+/**
+ * Edit html block class.
+ * @class Edit
+ * @extends Component
+ */
+class Edit extends Component {
+  /**
+   * Property types.
+   * @property {Object} propTypes Property types.
+   * @static
+   */
+  static propTypes = {
+    selected: PropTypes.bool.isRequired,
+    block: PropTypes.string.isRequired,
+    index: PropTypes.number.isRequired,
+    data: PropTypes.objectOf(PropTypes.any).isRequired,
+    onChangeBlock: PropTypes.func.isRequired,
+    onSelectBlock: PropTypes.func.isRequired,
+    onDeleteBlock: PropTypes.func.isRequired,
+    handleKeyDown: PropTypes.func.isRequired,
+    editable: PropTypes.bool,
+  };
+
+  /**
+   * Default properties
+   * @property {Object} defaultProps Default properties.
+   * @static
+   */
+  static defaultProps = {
+    editable: true,
+  };
+  /**
+   * Constructor
+   * @method constructor
+   * @param {Object} props Component properties
+   */
+  constructor(props) {
+    super(props);
+    this.state = {
+      isPreview: false,
+    };
+    this.onChangeCode = this.onChangeCode.bind(this);
+    this.onPreview = this.onPreview.bind(this);
+    this.onCodeEditor = this.onCodeEditor.bind(this);
+  }
+
+  codeEditorRef = React.createRef();
+  savedSelection = {};
+
+  componentDidUpdate(prevProps, prevState, snapshot) {
+    if (this.codeEditorRef.current) {
+      this.savedSelection = snapshot;
+      this.restoreSelectionAndFocus(this.codeEditorRef.current);
+    }
+  }
+
+  /**
+   * @param {*} nextProps
+   * @param {*} nextState
+   * @returns {boolean}
+   * @memberof Edit
+   */
+  shouldComponentUpdate(nextProps) {
+    // Always rerender when the DOM node is not created for the Editor (the
+    // first call to shouldComponentUpdate).
+    if (!this._input) {
+      return true;
+    }
+
+    // Rerender the entire component when the Editor in it changes its selection
+    // because this way we get a call to getSnapshotBeforeUpdate where we can
+    // save the selection.
+    return (
+      this.props.selected ||
+      !isEqual(this.props.data, nextProps.data) ||
+      this._input.selectionStart !== this.savedSelection.selectionStart ||
+      this._input.selectionEnd !== this.savedSelection.selectionEnd
+    );
+  }
+
+  /**
+   * Change html handler
+   * @method onChangeCode
+   * @param {string} code New value html
+   * @returns {undefined}
+   */
+  onChangeCode(code) {
+    this.props.onChangeBlock(this.props.block, {
+      ...this.props.data,
+      html: code,
+    });
+  }
+
+  getValue() {
+    return this.props.data.html || '';
+  }
+
+  /**
+   * Preview mode handler
+   * @method onPreview
+   * @returns {undefined}
+   */
+  async onPreview() {
+    try {
+      const code = (
+        await this.props.prettierStandalone.format(this.getValue(), {
+          parser: 'html',
+          plugins: [this.props.prettierParserHtml],
+        })
+      ).trim();
+      this.setState(
+        {
+          isPreview: !this.state.isPreview,
+        },
+        () => this.onChangeCode(code),
+      );
+    } catch (ex) {
+      // error while parsing the user-typed HTML
+      // TODO: show a toast notification or something similar to the user
+    }
+  }
+
+  /**
+   * Prettify handler
+   * @method onPrettify
+   * @returns {undefined}
+   */
+  onPrettify = async () => {
+    try {
+      const code = (
+        await this.props.prettierStandalone.format(this.getValue(), {
+          parser: 'html',
+          plugins: [this.props.prettierParserHtml],
+        })
+      ).trim();
+      this.onChangeCode(code);
+    } catch (ex) {
+      // error while parsing the user-typed HTML
+      // TODO: show a toast notification or something similar to the user
+    }
+  };
+
+  /**
+   * Code Editor mode handler
+   * @method onPreview
+   * @returns {undefined}
+   */
+  onCodeEditor() {
+    this.setState({ isPreview: !this.state.isPreview });
+  }
+
+  getSelection = (editor) => {
+    if (!editor || !editor._input) {
+      return {};
+    }
+
+    return {
+      selectionStart: editor._input.selectionStart || 0,
+      selectionEnd: editor._input.selectionEnd || 0,
+    };
+  };
+
+  getSnapshotBeforeUpdate(prevProps, prevState) {
+    return this.codeEditorRef.current
+      ? this.getSelection(this.codeEditorRef.current)
+      : {};
+  }
+
+  restoreSelectionAndFocus = (editor) => {
+    if (!editor || !editor._input) {
+      return;
+    }
+    // Don't restore selection when the block is not selected.
+    if (
+      this.props.selected &&
+      editor._input &&
+      typeof this.savedSelection?.selectionStart === 'number' &&
+      typeof this.savedSelection?.selectionEnd === 'number'
+    ) {
+      editor._input.selectionStart = this.savedSelection?.selectionStart;
+      editor._input.selectionEnd = this.savedSelection?.selectionEnd;
+      editor._input.focus();
+    }
+  };
+
+  /**
+   * Render method.
+   * @method render
+   * @returns {string} Markup for the component.
+   */
+  render() {
+    const placeholder =
+      this.props.data.placeholder ||
+      this.props.intl.formatMessage(messages.placeholder);
+    const value = this.getValue();
+    return (
+      <>
+        {this.props.selected && value && (
+          <div className="toolbar">
+            {/* Hide temporary this feature in toolbar.*/}
+            {/* <Popup
+              trigger={
+                <Button
+                  icon
+                  basic
+                  aria-label={this.props.intl.formatMessage(messages.source)}
+                  active={!this.state.isPreview}
+                  onClick={this.onCodeEditor}
+                >
+                  <Icon name={codeSVG} size="24px" />
+                </Button>
+              }
+              position="top center"
+              content={this.props.intl.formatMessage(messages.code)}
+              size="mini"
+            /> */}
+            <Popup
+              trigger={
+                <Button
+                  icon
+                  basic
+                  aria-label={this.props.intl.formatMessage(messages.preview)}
+                  active={this.state.isPreview}
+                  onClick={this.onPreview}
+                >
+                  <Icon name={showSVG} size="24px" />
+                </Button>
+              }
+              position="top center"
+              content={this.props.intl.formatMessage(messages.preview)}
+              size="mini"
+            />
+            {/* Hide temporary this feature in toolbar. */}
+            {/* <Popup
+              trigger={
+                <Button
+                  icon
+                  basic
+                  aria-label={this.props.intl.formatMessage(messages.prettier)}
+                  onClick={this.onPrettify}
+                >
+                  <Icon name={indentSVG} size="24px" />
+                </Button>
+              }
+              position="top center"
+              content={this.props.intl.formatMessage(messages.prettier)}
+              size="mini"
+            />
+            <div className="separator" />
+            <Popup
+              trigger={
+                <Button.Group>
+                  <Button icon basic onClick={() => this.onChangeCode('')}>
+                    <Icon name={clearSVG} size="24px" color="#e40166" />
+                  </Button>
+                </Button.Group>
+              }
+              position="top center"
+              content={this.props.intl.formatMessage(messages.clear)}
+              size="mini"
+            /> */}
+          </div>
+        )}
+        {this.state.isPreview ? (
+          <div dangerouslySetInnerHTML={{ __html: value }} />
+        ) : (
+          <Editor
+            value={this.getValue()}
+            readOnly={true}
+            placeholder={placeholder}
+            onValueChange={(code) => this.onChangeCode(code)}
+            highlight={
+              this.props.prismCore?.highlight &&
+              this.props.prismCore?.languages?.html
+                ? (code) =>
+                    this.props.prismCore.highlight(
+                      code,
+                      this.props.prismCore.languages.html,
+                      'html',
+                    )
+                : () => {}
+            }
+            padding={8}
+            className="html-editor"
+            ref={(node) => {
+              if (node) {
+                this.codeEditorRef.current = node;
+              }
+            }}
+            ignoreTabKey={true}
+          />
+        )}
+      </>
+    );
+  }
+}
+
+const withPrismMarkup = (WrappedComponent) => (props) => {
+  const [loaded, setLoaded] = React.useState();
+  const promise = React.useRef(null);
+  const cancelled = React.useRef(false);
+
+  React.useEffect(() => {
+    promise.current = import('prismjs/components/prism-markup');
+    promise.current.then(() => {
+      if (!cancelled.current) {
+        setLoaded(true);
+      }
+    });
+    return () => {
+      cancelled.current = true;
+    };
+  }, []);
+
+  return loaded ? <WrappedComponent {...props} /> : null;
+};
+
+export default compose(
+  injectLazyLibs(['prettierStandalone', 'prettierParserHtml', 'prismCore']),
+  withPrismMarkup,
+  injectIntl,
+)(Edit);

package/src/index.js

@@ -1,5 +1,4 @@
 import { runtimeConfig } from '@plone/volto/runtime_config';
-import installContextNavigationBlock from '@eeacms/volto-eea-website-policy/components/Blocks/ContextNavigation';
 import { appendGroup } from './helpers';
 import { FrequencyOfDissemination } from '@eeacms/volto-eea-website-policy/components/Widgets/FrequencyOfDissemination';
 
@@ -13,6 +12,9 @@ const restrictedBlocks = [
   'dataqueryfilter',
   'dottedTableChart',
   'simpleDataConnectedTable',
+  'video',
+  'maps',
+  'html',
 ];
 
 const overrideBlocks = {
@@ -98,14 +100,6 @@ const applyConfig = (config) => {
     ...config.settings.eea,
     rolesWhoCanChangeLayout: ['Manager'],
   };
-  config.settings.eea.rolesWhoCanChangeLayout = ['Manager'];
-
-  // Custom blocks
-  // context navigation
-  config = [installContextNavigationBlock].reduce(
-    (acc, apply) => apply(acc),
-    config,
-  );
 
   // Add groups
   config.blocks.groupBlocksOrder = appendGroup(

package/src/components/Blocks/ContextNavigation/ContextNavigationEdit.jsx

@@ -1,45 +0,0 @@
-import React from 'react';
-import { EditSchema } from './schema';
-import { SidebarPortal } from '@plone/volto/components';
-import BlockDataForm from '@plone/volto/components/manage/Form/BlockDataForm';
-
-import ContextNavigationView from './ContextNavigationView';
-
-const ContextNavigationFillEdit = (props) => {
-  const contentTypes = props.properties?.['@components']?.types;
-  const availableTypes = React.useMemo(
-    () => contentTypes?.map((type) => [type.id, type.title || type.name]),
-    [contentTypes],
-  );
-
-  const schema = React.useMemo(
-    () => EditSchema({ availableTypes }),
-    [availableTypes],
-  );
-
-  return (
-    <>
-      <h3>Context navigation</h3>
-      <ContextNavigationView {...props} mode="edit" />{' '}
-      <SidebarPortal selected={props.selected}>
-        <BlockDataForm
-          schema={schema}
-          title={schema.title}
-          onChangeField={(id, value) => {
-            props.onChangeBlock(props.block, {
-              ...props.data,
-              [id]: value,
-            });
-          }}
-          onChangeBlock={props.onChangeBlock}
-          formData={props.data}
-          block={props.block}
-          navRoot={props.navRoot}
-          contentType={props.contentType}
-        />
-      </SidebarPortal>
-    </>
-  );
-};
-
-export default ContextNavigationFillEdit;

package/src/components/Blocks/ContextNavigation/ContextNavigationEdit.test.jsx

@@ -1,88 +0,0 @@
-import React from 'react';
-import { render, fireEvent } from '@testing-library/react';
-import ContextNavigationEdit from './ContextNavigationEdit';
-import { Router } from 'react-router-dom';
-import { Provider } from 'react-intl-redux';
-import configureStore from 'redux-mock-store';
-import { createMemoryHistory } from 'history';
-import '@testing-library/jest-dom/extend-expect';
-
-jest.mock('@plone/volto/components', () => ({
-  InlineForm: ({ onChangeField }) => (
-    <div>
-      <p>InlineForm</p>
-      <input id="test" onChange={onChangeField} />
-    </div>
-  ),
-  SidebarPortal: ({ children, selected }) =>
-    selected ? (
-      <div>
-        <div>SidebarPortal</div>
-        {children}
-      </div>
-    ) : null,
-}));
-
-jest.mock('@plone/volto/components/theme/Navigation/ContextNavigation', () => {
-  return {
-    __esModule: true,
-    default: ({ params }) => {
-      return <div>ConnectedContextNavigation {params.root_path}</div>;
-    },
-  };
-});
-
-jest.mock('@plone/volto/helpers', () => ({
-  withBlockExtensions: jest.fn((Component) => Component),
-  emptyBlocksForm: jest.fn(),
-  getBlocksLayoutFieldname: () => 'blocks_layout',
-  withVariationSchemaEnhancer: jest.fn((Component) => Component),
-}));
-
-const mockStore = configureStore();
-const store = mockStore({
-  intl: {
-    locale: 'en',
-    messages: {},
-  },
-});
-
-describe('ContextNavigationEdit', () => {
-  it('renders corectly', () => {
-    const history = createMemoryHistory();
-    const { getByText, queryByText } = render(
-      <Provider store={store}>
-        <Router history={history}>
-          <ContextNavigationEdit selected={false} />
-        </Router>
-        ,
-      </Provider>,
-    );
-
-    expect(getByText('Context navigation')).toBeInTheDocument();
-    expect(getByText('ConnectedContextNavigation')).toBeInTheDocument();
-    expect(queryByText('InlineForm')).toBeNull();
-    expect(queryByText('SidebarPortal')).toBeNull();
-  });
-
-  it('renders corectly', () => {
-    const history = createMemoryHistory();
-    const { container, getByText } = render(
-      <Provider store={store}>
-        <Router history={history}>
-          <ContextNavigationEdit selected={true} onChangeBlock={() => {}} />
-        </Router>
-        ,
-      </Provider>,
-    );
-
-    expect(getByText('Context navigation')).toBeInTheDocument();
-    expect(getByText('ConnectedContextNavigation')).toBeInTheDocument();
-    expect(getByText('InlineForm')).toBeInTheDocument();
-    expect(getByText('SidebarPortal')).toBeInTheDocument();
-
-    fireEvent.change(container.querySelector('#test'), {
-      target: { value: 'test' },
-    });
-  });
-});

package/src/components/Blocks/ContextNavigation/ContextNavigationView.jsx

@@ -1,14 +0,0 @@
-import React from 'react';
-import { flattenToAppURL, withBlockExtensions } from '@plone/volto/helpers';
-import DefaultTemplate from './variations/Default';
-
-const ContextNavigationView = (props = {}) => {
-  const { variation, data = {} } = props;
-  const navProps = { ...data };
-  const root_path = data?.root_node?.[0]?.['@id'];
-  if (root_path) navProps['root_path'] = flattenToAppURL(root_path);
-  const Renderer = variation?.view ?? DefaultTemplate;
-  return <Renderer params={navProps} mode={props.mode} />;
-};
-
-export default withBlockExtensions(ContextNavigationView);

package/src/components/Blocks/ContextNavigation/ContextNavigationView.test.jsx

@@ -1,71 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import ContextNavigationView from './ContextNavigationView';
-import { Router } from 'react-router-dom';
-import { Provider } from 'react-intl-redux';
-import configureStore from 'redux-mock-store';
-import { createMemoryHistory } from 'history';
-import '@testing-library/jest-dom/extend-expect';
-
-jest.mock('@plone/volto/components/theme/Navigation/ContextNavigation', () => {
-  return {
-    __esModule: true,
-    default: ({ params }) => {
-      return <div>ConnectedContextNavigation {params.root_path}</div>;
-    },
-  };
-});
-
-jest.mock('@plone/volto/helpers', () => ({
-  withBlockExtensions: jest.fn((Component) => Component),
-  emptyBlocksForm: jest.fn(),
-  getBlocksLayoutFieldname: () => 'blocks_layout',
-  flattenToAppURL: () => '',
-}));
-
-const mockStore = configureStore();
-const store = mockStore({
-  intl: {
-    locale: 'en',
-    messages: {},
-  },
-});
-
-describe('ContextNavigationView', () => {
-  let history;
-  beforeEach(() => {
-    history = createMemoryHistory();
-  });
-
-  it('renders corectly', () => {
-    const { container } = render(
-      <Provider store={store}>
-        <Router history={history}>
-          <ContextNavigationView />
-        </Router>
-      </Provider>,
-    );
-
-    expect(container.firstChild).toHaveTextContent(
-      'ConnectedContextNavigation',
-    );
-  });
-
-  it('renders corectly', () => {
-    const { container } = render(
-      <Provider store={store}>
-        <Router history={history}>
-          <ContextNavigationView
-            data={{
-              navProps: { root_path: 'https://localhost:3000/test' },
-              root_node: [{ '@id': 'root_node' }],
-            }}
-          />
-        </Router>
-      </Provider>,
-    );
-    expect(container.firstChild).toHaveTextContent(
-      'ConnectedContextNavigation',
-    );
-  });
-});

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

@@ -1,30 +0,0 @@
-import codeSVG from '@plone/volto/icons/code.svg';
-import ContextNavigationEdit from './ContextNavigationEdit';
-import ContextNavigationView from './ContextNavigationView';
-import BlockSettingsSchema from '@plone/volto/components/manage/Blocks/Block/Schema';
-import variations from './variations';
-
-const applyConfig = (config) => {
-  config.blocks.blocksConfig.contextNavigation = {
-    id: 'contextNavigation',
-    title: 'Navigation',
-    icon: codeSVG,
-    group: 'site',
-    view: ContextNavigationView,
-    edit: ContextNavigationEdit,
-    schema: BlockSettingsSchema,
-    restricted: true,
-    variations,
-    mostUsed: true,
-    blockHasOwnFocusManagement: true,
-    sidebarTab: 1,
-    security: {
-      addPermission: [],
-      view: [],
-    },
-  };
-
-  return config;
-};
-
-export default applyConfig;

package/src/components/Blocks/ContextNavigation/schema.js

@@ -1,88 +0,0 @@
-export const EditSchema = ({ availableTypes }) => {
-  return {
-    title: 'Navigation',
-    fieldsets: [
-      {
-        id: 'default',
-        title: 'Default',
-        fields: [
-          'name',
-          'root_node',
-          'portal_type',
-          'includeTop',
-          'currentFolderOnly',
-          'topLevel',
-          'bottomLevel',
-          'no_icons',
-          'thumb_scale',
-          'no_thumbs',
-        ],
-      },
-    ],
-    required: [],
-    properties: {
-      name: {
-        title: 'Title',
-        description: 'The title of the navigation tree',
-      },
-      root_node: {
-        title: 'Root node',
-        description:
-          'You may search for and choose a folder to act as the root of the navigation tree. Leave blank to use the Plone site root.',
-        widget: 'object_browser',
-        // TODO: these don't work. Why?
-        mode: 'link',
-        selectedItemAttrs: ['Title', 'Description'],
-      },
-      portal_type: {
-        title: 'Filter children',
-        description: 'Only show child items of this content type',
-        choices: availableTypes,
-        isMulti: true,
-      },
-      includeTop: {
-        title: 'Include top node',
-        description:
-          "Whether or not to show the top, or 'root', node in the navigation tree. This is affected by the 'Start level' setting.",
-        type: 'boolean',
-      },
-      currentFolderOnly: {
-        title: 'Only show the contents of the current folder',
-        description:
-          'If selected, the navigation tree will only show the current folder and its children at all times.',
-        type: 'boolean',
-      },
-
-      topLevel: {
-        title: 'Start level',
-        description:
-          'An integer value that specifies the number of folder levels below the site root that must be exceeded before the navigation tree will display. 0 means that the navigation tree should be displayed everywhere including pages in the root of the site. 1 means the tree only shows up inside folders located in the root and downwards, never showing at the top level.',
-        type: 'number',
-        default: 1,
-      },
-      bottomLevel: {
-        title: 'Navigation tree depth',
-        description:
-          'How many folders should be included before the navigation tree stops. 0 means no limit. 1 only includes the root folder.',
-        type: 'number',
-        default: 0,
-      },
-      no_icons: {
-        title: 'Suppress icons',
-        description:
-          'If enabled, the portlet will not show document type icons.',
-        type: 'boolean',
-      },
-      thumb_scale: {
-        title: 'Override thumb scale',
-        description:
-          "Enter a valid scale name (see 'Image Handling' control panel) to override (e.g. icon, tile, thumb, mini, preview, ... ). Leave empty to use default (see 'Site' control panel).",
-      },
-      no_thumbs: {
-        title: 'Suppress thumbs',
-        type: 'boolean',
-        description: 'If enabled, the portlet will not show thumbs.',
-      },
-    },
-  };
-};

package/src/components/Blocks/ContextNavigation/variations/Accordion.jsx

@@ -1,175 +0,0 @@
-import cx from 'classnames';
-import PropTypes from 'prop-types';
-import React from 'react';
-import { defineMessages, useIntl } from 'react-intl';
-import { withRouter } from 'react-router';
-import { compose } from 'redux';
-import { Accordion } from 'semantic-ui-react';
-
-import Slugger from 'github-slugger';
-
-import { Icon, UniversalLink } from '@plone/volto/components';
-import { withContentNavigation } from '@plone/volto/components/theme/Navigation/withContentNavigation';
-import withEEASideMenu from '@eeacms/volto-block-toc/hocs/withEEASideMenu';
-import { flattenToAppURL } from '@plone/volto/helpers';
-
-import downIcon from '@plone/volto/icons/down-key.svg';
-import upIcon from '@plone/volto/icons/up-key.svg';
-
-const messages = defineMessages({
-  navigation: {
-    id: 'Navigation',
-    defaultMessage: 'Navigation',
-  },
-});
-
-const AccordionNavigation = ({
-  navigation = {},
-  device,
-  isMenuOpenOnOutsideClick,
-}) => {
-  const { items = [], title, has_custom_name } = navigation;
-  const intl = useIntl();
-  const navOpen = ['mobile', 'tablet'].includes(device) ? false : true;
-  const [isNavOpen, setIsNavOpen] = React.useState(navOpen);
-  const [activeItems, setActiveItems] = React.useState({});
-
-  const onClickSummary = React.useCallback((e) => {
-    e.preventDefault();
-    setIsNavOpen((prev) => !prev);
-  }, []);
-
-  React.useEffect(() => {
-    if (isMenuOpenOnOutsideClick === false) setIsNavOpen(false);
-  }, [isMenuOpenOnOutsideClick]);
-
-  const onKeyDownSummary = React.useCallback(
-    (e) => {
-      if (e.keyCode === 13 || e.keyCode === 32) {
-        e.preventDefault();
-        onClickSummary(e);
-      }
-    },
-    [onClickSummary],
-  );
-
-  const renderItems = ({ item, level = 0 }) => {
-    const {
-      title,
-      href,
-      is_current,
-      is_in_path,
-      items: childItems,
-      type,
-    } = item;
-    const hasChildItems = childItems && childItems.length > 0;
-    const normalizedTitle = Slugger.slug(title);
-
-    const checkIfActive = () => {
-      return activeItems[href] !== undefined ? activeItems[href] : is_in_path;
-    };
-
-    const isActive = checkIfActive();
-
-    const handleTitleClick = () => {
-      setActiveItems((prev) => ({ ...prev, [href]: !isActive }));
-    };
-
-    return (
-      <li
-        className={cx({
-          is_in_path,
-          'accordion-list-title': !hasChildItems,
-          'accordion-list-item': hasChildItems,
-        })}
-        key={href}
-      >
-        {hasChildItems ? (
-          <Accordion className="default">
-            <Accordion.Title
-              active={isActive}
-              as={'button'}
-              aria-expanded={isActive}
-              onClick={handleTitleClick}
-              aria-controls={`accordion-content-${normalizedTitle}`}
-              id={`accordion-title-${normalizedTitle}`}
-            >
-              <span className="title-text">{title}</span>
-              <Icon name={isActive ? upIcon : downIcon} size="32px" />
-            </Accordion.Title>
-            <Accordion.Content
-              active={isActive}
-              id={`accordion-content-${normalizedTitle}`}
-              aria-labelledby={`accordion-title-${normalizedTitle}`}
-              role="region"
-            >
-              <ul className="accordion-list">
-                {childItems.map((child) =>
-                  renderItems({ item: child, level: level + 1 }),
-                )}
-              </ul>
-            </Accordion.Content>
-          </Accordion>
-        ) : (
-          <UniversalLink
-            href={flattenToAppURL(href)}
-            className={cx(`title-link contenttype-${type}`, {
-              current: is_current,
-              in_path: is_in_path,
-            })}
-          >
-            {title}
-          </UniversalLink>
-        )}
-      </li>
-    );
-  };
-
-  return items.length ? (
-    <>
-      <nav className="context-navigation">
-        <details open={isNavOpen}>
-          {/* eslint-disable-next-line */}
-          <summary
-            className="context-navigation-header accordion-header"
-            onClick={onClickSummary}
-            onKeyDown={onKeyDownSummary}
-          >
-            {has_custom_name ? title : intl.formatMessage(messages.navigation)}
-            <Icon name={isNavOpen ? upIcon : downIcon} size="40px" />
-          </summary>
-          <ul className="context-navigation-list accordion-list">
-            {items.map((item) => renderItems({ item }))}
-          </ul>
-        </details>
-      </nav>
-    </>
-  ) : null;
-};
-
-AccordionNavigation.propTypes = {
-  /**
-   * Navigation tree returned from @contextnavigation restapi endpoint
-   */
-  navigation: PropTypes.shape({
-    items: PropTypes.arrayOf(
-      PropTypes.shape({
-        title: PropTypes.string,
-        url: PropTypes.string,
-        href: PropTypes.string,
-        is_current: PropTypes.bool,
-        is_in_path: PropTypes.bool,
-        items: PropTypes.array,
-        type: PropTypes.string,
-      }),
-    ),
-    has_custom_name: PropTypes.bool,
-    title: PropTypes.string,
-  }),
-};
-
-export default compose(
-  withRouter,
-  withContentNavigation,
-  withEEASideMenu,
-)(AccordionNavigation);

package/src/components/Blocks/ContextNavigation/variations/Default.jsx

@@ -1,9 +0,0 @@
-import React from 'react';
-import ConnectedContextNavigation from '@plone/volto/components/theme/Navigation/ContextNavigation';
-
-const Default = (props) => {
-  const { params } = props;
-  return <ConnectedContextNavigation params={params} />;
-};
-
-export default Default;

package/src/components/Blocks/ContextNavigation/variations/index.js

@@ -1,18 +0,0 @@
-import Accordion from './Accordion';
-import Default from './Default';
-
-const contextBlockVariations = [
-  {
-    id: 'default',
-    title: 'Listing (default)',
-    view: Default,
-    isDefault: true,
-  },
-  {
-    id: 'accordion',
-    title: 'Accordion',
-    view: Accordion,
-  },
-];
-
-export default contextBlockVariations;