@eeacms/volto-eea-website-policy 1.14.0 → 2.0.0

package/CHANGELOG.md

@@ -4,6 +4,32 @@ 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.0.0](https://github.com/eea/volto-eea-website-policy/compare/1.14.1-beta.1...2.0.0) - 22 April 2024
+
+#### :rocket: New Features
+
+- feat: Release 2.0.0 - Volto 17 support [alin - [`d6cf5c8`](https://github.com/eea/volto-eea-website-policy/commit/d6cf5c8f41950a94cd68e7a36a45b5be8cc6195b)]
+- feat: Default view layout restriction to Manager - refs #268249 [ichim-david - [`1840c1b`](https://github.com/eea/volto-eea-website-policy/commit/1840c1bd9aae6ce18a23800ce618f8bbe47525ab)]
+
+#### :nail_care: Enhancements
+
+- refactor: Move customizations to volto-eea-website-theme [alin - [`9641437`](https://github.com/eea/volto-eea-website-policy/commit/9641437c7f10ba6c7ec1f896b180b49d2718a7d0)]
+
+### [1.14.1-beta.1](https://github.com/eea/volto-eea-website-policy/compare/1.14.1-beta.0...1.14.1-beta.1) - 19 April 2024
+
+#### :hammer_and_wrench: Others
+
+- Release 1.14.1-beta.1 [nileshgulia1 - [`417ea33`](https://github.com/eea/volto-eea-website-policy/commit/417ea33818550b3f94a576e0a8c98dfd1b1b0d30)]
+### [1.14.1-beta.0](https://github.com/eea/volto-eea-website-policy/compare/1.14.0...1.14.1-beta.0) - 19 April 2024
+
+#### :house: Internal changes
+
+- style: Automated code fix [eea-jenkins - [`6738335`](https://github.com/eea/volto-eea-website-policy/commit/6738335d49068446818199eb5eee352b3ff03f38)]
+
+#### :hammer_and_wrench: Others
+
+- ensure logout works [dobri1408 - [`bf0dca4`](https://github.com/eea/volto-eea-website-policy/commit/bf0dca4f615ef687da8309aef1bf894b3fea4938)]
+- azure_login [dobri1408 - [`c6222f9`](https://github.com/eea/volto-eea-website-policy/commit/c6222f9a97cf7956020f715f76a012051332503b)]
 ### [1.14.0](https://github.com/eea/volto-eea-website-policy/compare/1.13.1...1.14.0) - 16 April 2024
 
 #### :rocket: New Features

package/package.json

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

package/src/customizations/volto/components/manage/Display/Display.jsx

@@ -1,306 +0,0 @@
-import React, { Component, Fragment } from 'react';
-import PropTypes from 'prop-types';
-import { connect } from 'react-redux';
-import { compose } from 'redux';
-import { injectLazyLibs } from '@plone/volto/helpers/Loadable/Loadable';
-
-import jwtDecode from 'jwt-decode';
-import {
-  getSchema,
-  getUser,
-  updateContent,
-  getContent,
-} from '@plone/volto/actions';
-import { getLayoutFieldname } from '@plone/volto/helpers';
-import { FormFieldWrapper, Icon } from '@plone/volto/components';
-import { defineMessages, injectIntl } from 'react-intl';
-import config from '@plone/volto/registry';
-
-import downSVG from '@plone/volto/icons/down-key.svg';
-import upSVG from '@plone/volto/icons/up-key.svg';
-import checkSVG from '@plone/volto/icons/check.svg';
-
-const messages = defineMessages({
-  Viewmode: {
-    id: 'Viewmode',
-    defaultMessage: 'View',
-  },
-});
-
-const Option = injectLazyLibs('reactSelect')((props) => {
-  const { Option } = props.reactSelect.components;
-  return (
-    <Option {...props}>
-      <div>{props.label}</div>
-      {props.isFocused && !props.isSelected && (
-        <Icon name={checkSVG} size="18px" color="#b8c6c8" />
-      )}
-      {props.isSelected && <Icon name={checkSVG} size="18px" color="#007bc1" />}
-    </Option>
-  );
-});
-
-const DropdownIndicator = injectLazyLibs('reactSelect')((props) => {
-  const { DropdownIndicator } = props.reactSelect.components;
-  return (
-    <DropdownIndicator {...props}>
-      {props.selectProps.menuIsOpen ? (
-        <Icon name={upSVG} size="24px" color="#007bc1" />
-      ) : (
-        <Icon name={downSVG} size="24px" color="#007bc1" />
-      )}
-    </DropdownIndicator>
-  );
-});
-
-const selectTheme = (theme) => ({
-  ...theme,
-  borderRadius: 0,
-  colors: {
-    ...theme.colors,
-    primary25: 'hotpink',
-    primary: '#b8c6c8',
-  },
-});
-
-const customSelectStyles = {
-  control: (styles, state) => ({
-    ...styles,
-    border: 'none',
-    borderBottom: '2px solid #b8c6c8',
-    boxShadow: 'none',
-    borderBottomStyle: state.menuIsOpen ? 'dotted' : 'solid',
-  }),
-  menu: (styles, state) => ({
-    ...styles,
-    top: null,
-    marginTop: 0,
-    boxShadow: 'none',
-    borderBottom: '2px solid #b8c6c8',
-  }),
-  menuList: (styles, state) => ({
-    ...styles,
-    maxHeight: '400px',
-  }),
-  indicatorSeparator: (styles) => ({
-    ...styles,
-    width: null,
-  }),
-  valueContainer: (styles) => ({
-    ...styles,
-    padding: 0,
-  }),
-  option: (styles, state) => ({
-    ...styles,
-    backgroundColor: null,
-    minHeight: '50px',
-    display: 'flex',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    padding: '12px 12px',
-    color: state.isSelected
-      ? '#007bc1'
-      : state.isFocused
-      ? '#4a4a4a'
-      : 'inherit',
-    ':active': {
-      backgroundColor: null,
-    },
-    span: {
-      flex: '0 0 auto',
-    },
-    svg: {
-      flex: '0 0 auto',
-    },
-  }),
-};
-
-/**
- * Display container class.
- * @class Display
- * @extends Component
- */
-class DisplaySelect extends Component {
-  /**
-   * Property types.
-   * @property {Object} propTypes Property types.
-   * @static
-   */
-  static propTypes = {
-    getSchema: PropTypes.func.isRequired,
-    updateContent: PropTypes.func.isRequired,
-    getContent: PropTypes.func.isRequired,
-    loaded: PropTypes.bool.isRequired,
-    pathname: PropTypes.string.isRequired,
-    layouts: PropTypes.arrayOf(PropTypes.string),
-    layout: PropTypes.string,
-    type: PropTypes.string.isRequired,
-  };
-
-  /**
-   * Default properties
-   * @property {Object} defaultProps Default properties.
-   * @static
-   */
-  static defaultProps = {
-    layouts: [],
-    layout: '',
-    rolesWhoCanChangeLayout: [],
-  };
-
-  state = {
-    hasMatchingRole: false,
-    selectedOption: {
-      value: this.props.layout,
-      label: config.views.layoutViewsNamesMapping?.[this.props.layout]
-        ? this.props.intl.formatMessage({
-            id: config.views.layoutViewsNamesMapping?.[this.props.layout],
-            defaultMessage:
-              config.views.layoutViewsNamesMapping?.[this.props.layout],
-          })
-        : this.props.layout,
-    },
-  };
-
-  componentDidMount() {
-    this.props.getSchema(this.props.type);
-  }
-
-  UNSAFE_componentWillMount() {
-    if (!this.props.rolesWhoCanChangeLayout.length) {
-      this.props.rolesWhoCanChangeLayout.push(
-        ...(config?.settings?.eea?.rolesWhoCanChangeLayout || []),
-      );
-    }
-    if (!this.props.layouts.length) {
-      this.props.getSchema(this.props.type);
-    }
-    if (Object.keys(this.props.user).length === 0) {
-      this.props.getUser(this.props.userId);
-    } else {
-      const hasMatchingRole = this.props.user.roles.some((role) =>
-        this.props.rolesWhoCanChangeLayout.includes(role),
-      );
-      if (hasMatchingRole !== this.state.hasMatchingRole) {
-        this.setState({ hasMatchingRole });
-      }
-    }
-  }
-
-  /**
-   * Component will receive props
-   * @method componentWillReceiveProps
-   * @param {Object} nextProps Next properties
-   * @returns {undefined}
-   */
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    if (nextProps.pathname !== this.props.pathname) {
-      this.props.getSchema(nextProps.type);
-    }
-    if (!this.props.loaded && nextProps.loaded) {
-      this.props.getContent(nextProps.pathname);
-    }
-
-    if (Object.keys(nextProps.user).length !== 0) {
-      const hasMatchingRole = nextProps.user.roles.some((role) =>
-        this.props.rolesWhoCanChangeLayout.includes(role),
-      );
-      if (hasMatchingRole !== this.state.hasMatchingRole) {
-        this.setState({ hasMatchingRole });
-      }
-    }
-  }
-
-  /**
-   * On set layout handler
-   * @method setLayout
-   * @param {Object} event Event object
-   * @returns {undefined}
-   */
-  setLayout = (selectedOption) => {
-    this.props.updateContent(this.props.pathname, {
-      layout: selectedOption.value,
-    });
-    this.setState({ selectedOption });
-  };
-
-  selectValue = (option) => (
-    <Fragment>
-      <span className="Select-value-label">{option.label}</span>
-    </Fragment>
-  );
-
-  optionRenderer = (option) => (
-    <Fragment>
-      <span style={{ marginRight: 'auto' }}>{option.label}</span>
-      <Icon name={checkSVG} size="24px" />
-    </Fragment>
-  );
-
-  render() {
-    if (!this.state.hasMatchingRole) {
-      return null;
-    }
-    const { selectedOption } = this.state;
-    const Select = this.props.reactSelect.default;
-    const layoutsNames = config.views.layoutViewsNamesMapping;
-    const layoutOptions = this.props.layouts
-      .filter(
-        (layout) =>
-          Object.keys(config.views.contentTypesViews).includes(layout) ||
-          Object.keys(config.views.layoutViews).includes(layout),
-      )
-      .map((item) => ({
-        value: item,
-        label:
-          this.props.intl.formatMessage({
-            id: layoutsNames[item],
-            defaultMessage: layoutsNames[item],
-          }) || item,
-      }));
-
-    return layoutOptions?.length > 1 ? (
-      <FormFieldWrapper
-        id="display-select"
-        title={this.props.intl.formatMessage(messages.Viewmode)}
-        {...this.props}
-      >
-        <Select
-          name="display-select"
-          className="react-select-container"
-          classNamePrefix="react-select"
-          options={layoutOptions}
-          styles={customSelectStyles}
-          theme={selectTheme}
-          components={{ DropdownIndicator, Option }}
-          onChange={this.setLayout}
-          defaultValue={selectedOption}
-          isSearchable={false}
-        />
-      </FormFieldWrapper>
-    ) : null;
-  }
-}
-
-export default compose(
-  injectIntl,
-  injectLazyLibs('reactSelect'),
-  connect(
-    (state) => ({
-      loaded: state.content.update.loaded,
-      layouts: state.schema.schema ? state.schema.schema.layouts : [],
-      layout: state.content.data
-        ? state.content.data[getLayoutFieldname(state.content.data)]
-        : '',
-      layout_fieldname: state.content.data
-        ? getLayoutFieldname(state.content.data)
-        : '',
-      type: state.content.data ? state.content.data['@type'] : '',
-      user: state.users.user,
-      userId: state.userSession.token
-        ? jwtDecode(state.userSession.token).sub
-        : '',
-    }),
-    { getSchema, getUser, updateContent, getContent },
-  ),
-)(DisplaySelect);

package/src/customizations/volto/components/manage/Display/Readme.md

@@ -1 +0,0 @@
-Added customization to condition the display of the layout options based on the user's roles.

package/src/customizations/volto/components/manage/Toolbar/More.jsx

@@ -1,541 +0,0 @@
-/**
- * More component.
- * @module components/manage/Toolbar/More
- */
-
-import React, { Component } from 'react';
-import { defineMessages, injectIntl } from 'react-intl';
-import PropTypes from 'prop-types';
-import { connect } from 'react-redux';
-import { compose } from 'redux';
-import { Link, withRouter } from 'react-router-dom';
-import { find } from 'lodash';
-import { toast } from 'react-toastify';
-import { Toast } from '@plone/volto/components';
-import { Pluggable, Plug } from '@plone/volto/components/manage/Pluggable';
-import {
-  FormattedDate,
-  Icon,
-  Display,
-  Workflow,
-} from '@plone/volto/components';
-import {
-  applyWorkingCopy,
-  createWorkingCopy,
-  removeWorkingCopy,
-} from '@plone/volto/actions';
-import { flattenToAppURL, getBaseUrl } from '@plone/volto/helpers';
-import config from '@plone/volto/registry';
-
-import rightArrowSVG from '@plone/volto/icons/right-key.svg';
-import userSVG from '@plone/volto/icons/user.svg';
-import applySVG from '@plone/volto/icons/ready.svg';
-import removeSVG from '@plone/volto/icons/circle-dismiss.svg';
-
-const messages = defineMessages({
-  personalTools: {
-    id: 'Personal tools',
-    defaultMessage: 'Personal tools',
-  },
-  history: {
-    id: 'History',
-    defaultMessage: 'History',
-  },
-  sharing: {
-    id: 'Sharing',
-    defaultMessage: 'Sharing',
-  },
-  rules: {
-    id: 'Rules',
-    defaultMessage: 'Rules',
-  },
-  aliases: {
-    id: 'URL Management',
-    defaultMessage: 'URL Management',
-  },
-  ManageTranslations: {
-    id: 'Manage Translations',
-    defaultMessage: 'Manage Translations',
-  },
-  manageContent: {
-    id: 'Manage content…',
-    defaultMessage: 'Manage content…',
-  },
-  CreateWorkingCopy: {
-    id: 'Create working copy',
-    defaultMessage: 'Create working copy',
-  },
-  applyWorkingCopy: {
-    id: 'Apply working copy',
-    defaultMessage: 'Apply working copy',
-  },
-  removeWorkingCopy: {
-    id: 'Remove working copy',
-    defaultMessage: 'Remove working copy',
-  },
-  viewWorkingCopy: {
-    id: 'View working copy',
-    defaultMessage: 'View working copy',
-  },
-  workingAppliedTitle: {
-    id: 'Changes applied.',
-    defaultMessage: 'Changes applied',
-  },
-  workingCopyAppliedBy: {
-    id: 'Made by {creator} on {date}. This is not a working copy anymore, but the main content.',
-    defaultMessage:
-      'Made by {creator} on {date}. This is not a working copy anymore, but the main content.',
-  },
-  workingCopyRemovedTitle: {
-    id: 'The working copy was discarded',
-    defaultMessage: 'The working copy was discarded',
-  },
-  Unauthorized: {
-    id: 'Unauthorized',
-    defaultMessage: 'Unauthorized',
-  },
-  workingCopyErrorUnauthorized: {
-    id: 'workingCopyErrorUnauthorized',
-    defaultMessage: 'You are not authorized to perform this operation.',
-  },
-  Error: {
-    id: 'Error',
-    defaultMessage: 'Error',
-  },
-  workingCopyGenericError: {
-    id: 'workingCopyGenericError',
-    defaultMessage: 'An error occurred while performing this operation.',
-  },
-});
-
-/**
- * More container class.
- * @class More
- * @extends Component
- */
-class More extends Component {
-  static propTypes = {
-    actions: PropTypes.shape({
-      object: PropTypes.arrayOf(PropTypes.object),
-      object_buttons: PropTypes.arrayOf(PropTypes.object),
-      user: PropTypes.arrayOf(PropTypes.object),
-    }),
-    pathname: PropTypes.string.isRequired,
-    content: PropTypes.shape({
-      title: PropTypes.string,
-      '@type': PropTypes.string,
-      is_folderish: PropTypes.bool,
-      review_state: PropTypes.string,
-    }),
-    loadComponent: PropTypes.func.isRequired,
-    closeMenu: PropTypes.func.isRequired,
-  };
-
-  /**
-   * Default properties.
-   * @property {Object} defaultProps Default properties.
-   * @static
-   */
-  static defaultProps = {
-    actions: null,
-    content: null,
-  };
-  state = {
-    openManageTranslations: false,
-    pushed: false,
-  };
-
-  push = (selector) => {
-    this.setState(() => ({
-      pushed: true,
-    }));
-    this.props.loadComponent(selector);
-    document.removeEventListener('mousedown', this.handleClickOutside, false);
-  };
-
-  componentDidUpdate(prevProps, prevState) {
-    let erroredAction = '';
-    if (
-      prevProps.workingCopy.apply.loading &&
-      this.props.workingCopy.apply.error
-    ) {
-      erroredAction = 'apply';
-    } else if (
-      prevProps.workingCopy.create.loading &&
-      this.props.workingCopy.create.error
-    ) {
-      erroredAction = 'create';
-    } else if (
-      prevProps.workingCopy.remove.loading &&
-      this.props.workingCopy.remove.error
-    ) {
-      erroredAction = 'remove';
-    }
-
-    if (erroredAction) {
-      const errorStatus = this.props.workingCopy[erroredAction].error.status;
-      if (errorStatus === 401 || errorStatus === 403) {
-        toast.error(
-          <Toast
-            error
-            title={this.props.intl.formatMessage(messages.Unauthorized)}
-            content={this.props.intl.formatMessage(
-              messages.workingCopyErrorUnauthorized,
-            )}
-          />,
-          {
-            toastId: 'workingCopyErrorUnauthorized',
-            autoClose: 10000,
-          },
-        );
-      } else {
-        toast.error(
-          <Toast
-            error
-            title={this.props.intl.formatMessage(messages.Error)}
-            content={this.props.intl.formatMessage(
-              messages.workingCopyGenericError,
-            )}
-          />,
-          {
-            toastId: 'workingCopyGenericError',
-            autoClose: 10000,
-          },
-        );
-      }
-    }
-  }
-
-  /**
-   * Render method.
-   * @method render
-   * @returns {string} Markup for the component.
-   */
-  render() {
-    const path = getBaseUrl(this.props.pathname);
-    const editAction = find(this.props.actions.object, { id: 'edit' });
-    const historyAction = find(this.props.actions.object, { id: 'history' });
-    const sharingAction = find(this.props.actions.object, {
-      id: 'local_roles',
-    });
-
-    const rulesAction = find(this.props.actions.object, {
-      id: 'contentrules',
-    });
-
-    const aliasesAction = find(this.props.actions.object_buttons, {
-      id: 'redirection',
-    });
-    const { content, intl } = this.props;
-
-    const dateOptions = {
-      year: 'numeric',
-      month: 'long',
-      day: 'numeric',
-    };
-
-    return (
-      <div
-        className="menu-more pastanaga-menu"
-        style={{
-          flex: this.props.theToolbar.current
-            ? `0 0 ${
-                this.props.theToolbar.current.getBoundingClientRect().width
-              }px`
-            : null,
-        }}
-      >
-        <header>
-          <h2>{this.props.content.title}</h2>
-          <button
-            className="more-user"
-            aria-label={this.props.intl.formatMessage(messages.personalTools)}
-            onClick={() => this.push('personalTools')}
-            tabIndex={0}
-          >
-            <Icon
-              name={userSVG}
-              size="30px"
-              title={this.props.intl.formatMessage(messages.personalTools)}
-            />
-          </button>
-        </header>
-        <div className="pastanaga-menu-list">
-          <ul>
-            <Pluggable name="toolbar-more-menu-list" />
-            <Plug pluggable="toolbar-more-menu-list" id="state">
-              {this.props.content['@type'] !== 'Plone Site' && (
-                // Plone Site does not have workflow
-                <li className="state-select">
-                  <Workflow pathname={path} />
-                </li>
-              )}
-            </Plug>
-            <Plug pluggable="toolbar-more-menu-list" id="view">
-              {this.props.content['@type'] !== 'Plone Site' && (
-                // Plone Site does not have view (yet)
-                <li className="display-select">
-                  {editAction && <Display pathname={path} />}
-                </li>
-              )}
-            </Plug>
-            <Plug pluggable="toolbar-more-menu-list" id="history">
-              {this.props.content['@type'] !== 'Plone Site' && (
-                // Plone Site does not have history (yet)
-                <li>
-                  <Link to={`${path}/historyview`}>
-                    <div>
-                      <span className="pastanaga-menu-label">
-                        {historyAction?.title ||
-                          this.props.intl.formatMessage(messages.history)}
-                      </span>
-                      <span className="pastanaga-menu-value" />
-                    </div>
-                    <Icon name={rightArrowSVG} size="24px" />
-                  </Link>
-                </li>
-              )}
-            </Plug>
-            <Plug pluggable="toolbar-more-menu-list" id="sharing">
-              {sharingAction && (
-                <li>
-                  <Link to={`${path}/sharing`}>
-                    {this.props.intl.formatMessage(messages.sharing)}
-                    <Icon name={rightArrowSVG} size="24px" />
-                  </Link>
-                </li>
-              )}
-            </Plug>
-            <Plug pluggable="toolbar-more-menu-list" id="aliases">
-              {aliasesAction && (
-                <li>
-                  <Link to={`${path}/aliases`}>
-                    {this.props.intl.formatMessage(messages.aliases)}
-                    <Icon name={rightArrowSVG} size="24px" />
-                  </Link>
-                </li>
-              )}
-            </Plug>
-            <Plug pluggable="toolbar-more-menu-list" id="rules">
-              {rulesAction && (
-                <li>
-                  <Link to={`${path}/rules`}>
-                    {this.props.intl.formatMessage(messages.rules)}
-                    <Icon name={rightArrowSVG} size="24px" />
-                  </Link>
-                </li>
-              )}
-            </Plug>
-          </ul>
-        </div>
-        <Pluggable name="toolbar-more-manage-content">
-          {(pluggables) => (
-            <>
-              {pluggables.length > 0 && (
-                <>
-                  <header>
-                    <h2>
-                      {this.props.intl.formatMessage(messages.manageContent)}
-                    </h2>
-                  </header>
-                  <div className="pastanaga-menu-list">
-                    <ul>
-                      {pluggables.map((p) => (
-                        <React.Fragment key={p.id}>{p()}</React.Fragment>
-                      ))}
-                    </ul>
-                  </div>
-                </>
-              )}
-            </>
-          )}
-        </Pluggable>
-        {config.settings.hasWorkingCopySupport &&
-          this.props.content['@type'] !== 'Plone Site' &&
-          this.props.content['@type'] !== 'ims_indicator' && (
-            <>
-              {!this.props.content.working_copy && (
-                <Plug pluggable="toolbar-more-manage-content" id="workingcopy">
-                  <li>
-                    <button
-                      aria-label={this.props.intl.formatMessage(
-                        messages.CreateWorkingCopy,
-                      )}
-                      onClick={() => {
-                        this.props.createWorkingCopy(path).then((response) => {
-                          this.props.history.push(
-                            flattenToAppURL(response['@id']),
-                          );
-                          this.props.closeMenu();
-                        });
-                      }}
-                    >
-                      {this.props.intl.formatMessage(
-                        messages.CreateWorkingCopy,
-                      )}
-
-                      <Icon name={rightArrowSVG} size="24px" />
-                    </button>
-                  </li>
-                </Plug>
-              )}
-              {this.props.content.working_copy &&
-                this.props.content.working_copy_of && (
-                  <Plug
-                    pluggable="toolbar-more-manage-content"
-                    id="workingcopy"
-                  >
-                    <li>
-                      <button
-                        aria-label={this.props.intl.formatMessage(
-                          messages.applyWorkingCopy,
-                        )}
-                        onClick={() => {
-                          this.props.applyWorkingCopy(path).then((response) => {
-                            this.props.history.push(
-                              flattenToAppURL(
-                                this.props.content.working_copy_of['@id'],
-                              ),
-                            );
-                            this.props.closeMenu();
-                            toast.info(
-                              <Toast
-                                info
-                                title={intl.formatMessage(
-                                  messages.workingAppliedTitle,
-                                )}
-                                content={intl.formatMessage(
-                                  messages.workingCopyAppliedBy,
-                                  {
-                                    creator: content.working_copy?.creator_name,
-                                    date: (
-                                      <FormattedDate
-                                        date={content.working_copy?.created}
-                                        format={dateOptions}
-                                      />
-                                    ),
-                                  },
-                                )}
-                              />,
-                              {
-                                toastId: 'workingcopyapplyinfo',
-                                autoClose: 10000,
-                              },
-                            );
-                          });
-                        }}
-                      >
-                        {this.props.intl.formatMessage(
-                          messages.applyWorkingCopy,
-                        )}
-
-                        <Icon
-                          name={applySVG}
-                          size="24px"
-                          title={this.props.intl.formatMessage(
-                            messages.applyWorkingCopy,
-                          )}
-                        />
-                      </button>
-                    </li>
-                    <li>
-                      <button
-                        aria-label={this.props.intl.formatMessage(
-                          messages.removeWorkingCopy,
-                        )}
-                        onClick={() => {
-                          this.props
-                            .removeWorkingCopy(path)
-                            .then((response) => {
-                              this.props.history.push(
-                                flattenToAppURL(
-                                  this.props.content.working_copy_of['@id'],
-                                ),
-                              );
-                              this.props.closeMenu();
-                              toast.info(
-                                <Toast
-                                  info
-                                  title={intl.formatMessage(
-                                    messages.workingCopyRemovedTitle,
-                                  )}
-                                />,
-                                {
-                                  toastId: 'workingcopyremovednotice',
-                                  autoClose: 10000,
-                                },
-                              );
-                            });
-                        }}
-                      >
-                        {this.props.intl.formatMessage(
-                          messages.removeWorkingCopy,
-                        )}
-
-                        <Icon
-                          name={removeSVG}
-                          size="24px"
-                          color="#e40166"
-                          title={this.props.intl.formatMessage(
-                            messages.removeWorkingCopy,
-                          )}
-                        />
-                      </button>
-                    </li>
-                  </Plug>
-                )}
-              {this.props.content.working_copy &&
-                !this.props.content.working_copy_of && (
-                  <Plug
-                    pluggable="toolbar-more-manage-content"
-                    id="workingcopy"
-                  >
-                    <li>
-                      <Link
-                        to={flattenToAppURL(
-                          this.props.content.working_copy['@id'],
-                        )}
-                        onClick={() => this.props.closeMenu()}
-                      >
-                        {this.props.intl.formatMessage(
-                          messages.viewWorkingCopy,
-                        )}
-                        <Icon name={rightArrowSVG} size="24px" />
-                      </Link>
-                    </li>
-                  </Plug>
-                )}
-            </>
-          )}
-        {editAction &&
-          config.settings.isMultilingual &&
-          this.props.content['@type'] !== 'ims_indicator' && (
-            <Plug pluggable="toolbar-more-manage-content" id="multilingual">
-              <li>
-                <Link to={`${path}/manage-translations`}>
-                  {this.props.intl.formatMessage(messages.ManageTranslations)}
-
-                  <Icon name={rightArrowSVG} size="24px" />
-                </Link>
-              </li>
-            </Plug>
-          )}
-      </div>
-    );
-  }
-}
-
-export default compose(
-  injectIntl,
-  withRouter,
-  connect(
-    (state, props) => ({
-      actions: state.actions.actions,
-      pathname: props.pathname,
-      content: state.content.data,
-      lang: state.intl.locale,
-      workingCopy: state.workingCopy,
-    }),
-    { applyWorkingCopy, createWorkingCopy, removeWorkingCopy },
-  ),
-)(More);

package/src/customizations/volto/components/manage/Workflow/README.txt

@@ -1 +0,0 @@
-Workflow.jsx - copied from @plone/volto 16.22.2 - refs #256563

package/src/customizations/volto/components/manage/Workflow/Workflow.jsx

@@ -1,421 +0,0 @@
-/**
- * Workflow component.
- * @module components/manage/Workflow/Workflow
- */
-
-import { FormFieldWrapper, Icon, Toast } from '@plone/volto/components';
-import {
-  flattenToAppURL,
-  getCurrentStateMapping,
-  getWorkflowOptions,
-} from '@plone/volto/helpers';
-import { uniqBy } from 'lodash';
-import PropTypes from 'prop-types';
-import { Component, Fragment } from 'react';
-import { defineMessages, injectIntl } from 'react-intl';
-import { connect } from 'react-redux';
-import { withRouter } from 'react-router-dom';
-import { toast } from 'react-toastify';
-import { compose } from 'redux';
-
-import { injectLazyLibs } from '@plone/volto/helpers/Loadable/Loadable';
-
-import {
-  getContent,
-  getWorkflow,
-  transitionWorkflow,
-} from '@plone/volto/actions';
-
-import checkSVG from '@plone/volto/icons/check.svg';
-import downSVG from '@plone/volto/icons/down-key.svg';
-import upSVG from '@plone/volto/icons/up-key.svg';
-
-const messages = defineMessages({
-  messageUpdated: {
-    id: 'Workflow updated.',
-    defaultMessage: 'Workflow updated.',
-  },
-  notAllowedToUpdateWorkflow: {
-    id: 'notAllowedToUpdateWorkflow',
-    defaultMessage: 'Please fill out all the required fields',
-  },
-  messageNoWorkflow: {
-    id: 'No workflow',
-    defaultMessage: 'No workflow',
-  },
-  state: {
-    id: 'State',
-    defaultMessage: 'State',
-  },
-});
-
-const filter_remaining_steps = (values, key) => {
-  return values.filter((value) => {
-    const is_not_ready = !value.is_ready;
-    if (!is_not_ready) {
-      return false;
-    }
-    const states = value.states;
-    const required_for_all = states?.indexOf('all') !== -1;
-    return (
-      (is_not_ready && required_for_all) ||
-      (is_not_ready && states?.indexOf(key) !== -1)
-    );
-  });
-};
-
-const SingleValue = injectLazyLibs('reactSelect')(({ children, ...props }) => {
-  const stateDecorator = {
-    marginRight: '10px',
-    display: 'inline-block',
-    backgroundColor: props.selectProps.value.color || null,
-    content: ' ',
-    height: '10px',
-    width: '10px',
-    borderRadius: '50%',
-  };
-  const { SingleValue } = props.reactSelect.components;
-  return (
-    <SingleValue {...props}>
-      <span style={stateDecorator} />
-      {children}
-    </SingleValue>
-  );
-});
-
-const Option = injectLazyLibs('reactSelect')((props) => {
-  const stateDecorator = {
-    marginRight: '10px',
-    display: 'inline-block',
-    backgroundColor:
-      props.selectProps.value.value === props.data.value
-        ? props.selectProps.value.color
-        : null,
-    content: ' ',
-    height: '10px',
-    width: '10px',
-    borderRadius: '50%',
-    border:
-      props.selectProps.value.value !== props.data.value
-        ? `1px solid ${props.data.color}`
-        : null,
-  };
-
-  const { Option } = props['reactSelect'].components;
-  return (
-    <Option {...props}>
-      <span style={stateDecorator} />
-      <div style={{ marginRight: 'auto' }}>{props.label}</div>
-      {props.isFocused && !props.isSelected && (
-        <Icon name={checkSVG} size="18px" color="#b8c6c8" />
-      )}
-      {props.isSelected && <Icon name={checkSVG} size="18px" color="#007bc1" />}
-    </Option>
-  );
-});
-
-const DropdownIndicator = injectLazyLibs('reactSelect')((props) => {
-  const { DropdownIndicator } = props.reactSelect.components;
-  return (
-    <DropdownIndicator {...props} data-testid="workflow-select-dropdown">
-      {props.selectProps.menuIsOpen ? (
-        <Icon name={upSVG} size="24px" color="#007bc1" />
-      ) : (
-        <Icon name={downSVG} size="24px" color="#007bc1" />
-      )}
-    </DropdownIndicator>
-  );
-});
-
-const selectTheme = (theme) => ({
-  ...theme,
-  borderRadius: 0,
-  colors: {
-    ...theme.colors,
-    primary25: 'hotpink',
-    primary: '#b8c6c8',
-  },
-});
-
-const customSelectStyles = {
-  control: (styles, state) => ({
-    ...styles,
-    border: 'none',
-    borderBottom: '2px solid #b8c6c8',
-    boxShadow: 'none',
-    borderBottomStyle: state.menuIsOpen ? 'dotted' : 'solid',
-  }),
-  menu: (styles, state) => ({
-    ...styles,
-    top: null,
-    marginTop: 0,
-    boxShadow: 'none',
-    borderBottom: '2px solid #b8c6c8',
-  }),
-  indicatorSeparator: (styles) => ({
-    ...styles,
-    width: null,
-  }),
-  valueContainer: (styles) => ({
-    ...styles,
-    padding: 0,
-  }),
-  option: (styles, state) => ({
-    ...styles,
-    backgroundColor: null,
-    minHeight: '50px',
-    display: 'flex',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    padding: '12px 12px',
-    color: state.isSelected
-      ? '#007bc1'
-      : state.isFocused
-      ? '#4a4a4a'
-      : 'inherit',
-    ':active': {
-      backgroundColor: null,
-    },
-    span: {
-      flex: '0 0 auto',
-    },
-    svg: {
-      flex: '0 0 auto',
-    },
-  }),
-};
-
-/**
- * Workflow container class.
- * @class Workflow
- * @extends Component
- */
-class Workflow extends Component {
-  /**
-   * Property types.
-   * @property {Object} propTypes Property types.
-   * @static
-   */
-  static propTypes = {
-    getContent: PropTypes.func.isRequired,
-    getWorkflow: PropTypes.func.isRequired,
-    transitionWorkflow: PropTypes.func.isRequired,
-    workflowLoaded: PropTypes.bool,
-    loaded: PropTypes.bool.isRequired,
-    pathname: PropTypes.string.isRequired,
-
-    contentHistory: PropTypes.arrayOf(
-      PropTypes.shape({
-        review_state: PropTypes.string,
-      }),
-    ),
-    transitions: PropTypes.arrayOf(
-      PropTypes.shape({
-        '@id': PropTypes.string,
-        title: PropTypes.string,
-      }),
-    ),
-  };
-
-  /**
-   * Default properties
-   * @property {Object} defaultProps Default properties.
-   * @static
-   */
-  static defaultProps = {
-    history: [],
-    transitions: [],
-  };
-
-  state = {
-    selectedOption: this.props.currentStateValue,
-  };
-
-  componentDidMount() {
-    this.props.getWorkflow(this.props.pathname);
-  }
-
-  /**
-   * Component will receive props
-   * @method componentWillReceiveProps
-   * @param {Object} nextProps Next properties
-   * @returns {undefined}
-   */
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    if (nextProps.pathname !== this.props.pathname) {
-      this.props.getWorkflow(nextProps.pathname);
-    }
-    if (!this.props.loaded && nextProps.loaded) {
-      this.props.getWorkflow(nextProps.pathname);
-      this.props.getContent(nextProps.pathname);
-    }
-    if (!this.props.workflowLoaded && nextProps.workflowLoaded) {
-      this.props.getContent(nextProps.pathname);
-      // #153145 - Redirect to the newly created version
-      if (this.state?.selectedOption?.value === 'createNewVersion') {
-        this.props.history.push(`${nextProps.pathname}.1`);
-      }
-    }
-  }
-
-  /**
-   * On transition handler
-   * @method transition
-   * @param {string} event Event object
-   * @returns {undefined}
-   */
-  transition = (selectedOption) => {
-    if (
-      filter_remaining_steps(
-        this.props.editingProgressSteps,
-        this.props?.content?.review_state || '',
-      ).length === 0
-    ) {
-      this.props.transitionWorkflow(flattenToAppURL(selectedOption.url));
-      this.setState({ selectedOption });
-      toast.success(
-        <Toast
-          success
-          title={this.props.intl.formatMessage(messages.messageUpdated)}
-          content=""
-        />,
-      );
-    } else {
-      toast.error(
-        <Toast
-          error
-          title={this.props.intl.formatMessage(
-            messages.notAllowedToUpdateWorkflow,
-          )}
-          content=""
-        />,
-      );
-    }
-  };
-
-  selectValue = (option) => {
-    const stateDecorator = {
-      marginLeft: '10px',
-      marginRight: '10px',
-      display: 'inline-block',
-      backgroundColor: option.color || null,
-      content: ' ',
-      height: '10px',
-      width: '10px',
-      borderRadius: '50%',
-    };
-    return (
-      <Fragment>
-        <span style={stateDecorator} />
-        <span className="Select-value-label">{option.label}</span>
-      </Fragment>
-    );
-  };
-
-  optionRenderer = (option) => {
-    const stateDecorator = {
-      marginLeft: '10px',
-      marginRight: '10px',
-      display: 'inline-block',
-      backgroundColor:
-        this.props.currentStateValue.value === option.value
-          ? option.color
-          : null,
-      content: ' ',
-      height: '10px',
-      width: '10px',
-      borderRadius: '50%',
-      border:
-        this.props.currentStateValue.value !== option.value
-          ? `1px solid ${option.color}`
-          : null,
-    };
-
-    return (
-      <Fragment>
-        <span style={stateDecorator} />
-        <span style={{ marginRight: 'auto' }}>{option.label}</span>
-        <Icon name={checkSVG} size="24px" />
-      </Fragment>
-    );
-  };
-
-  render() {
-    const { Placeholder } = this.props.reactSelect.components;
-    const Select = this.props.reactSelect.default;
-    // Remove markForDeletion transition if item is published
-    // in order not to un-publish items by mistake. This transition
-    // can still be executed from /contents - refs #256563, #153145
-    const transitions = this.props.transitions.filter((transition) => {
-      if (
-        transition?.['@id']?.endsWith('markForDeletion') &&
-        this.props?.content?.review_state === 'published'
-      ) {
-        return false;
-      }
-      return true;
-    });
-
-    return (
-      <FormFieldWrapper
-        id="state-select"
-        title={this.props.intl.formatMessage(messages.state)}
-        {...this.props}
-      >
-        <Select
-          name="state-select"
-          className="react-select-container"
-          classNamePrefix="react-select"
-          isDisabled={
-            !this.props.content.review_state || transitions.length === 0
-          }
-          options={uniqBy(
-            transitions.map((transition) => getWorkflowOptions(transition)),
-            'label',
-          ).concat(this.props.currentStateValue)}
-          styles={customSelectStyles}
-          theme={selectTheme}
-          components={{
-            DropdownIndicator,
-            Placeholder,
-            Option,
-            SingleValue,
-          }}
-          onChange={this.transition}
-          value={
-            this.props.content.review_state
-              ? this.props.currentStateValue
-              : {
-                  label: this.props.intl.formatMessage(
-                    messages.messageNoWorkflow,
-                  ),
-                  value: 'noworkflow',
-                }
-          }
-          isSearchable={false}
-        />
-      </FormFieldWrapper>
-    );
-  }
-}
-
-export default compose(
-  injectIntl,
-  injectLazyLibs(['reactSelect']),
-  withRouter,
-  connect(
-    (state, props) => ({
-      loaded: state.workflow.transition.loaded,
-      content: state.content.data,
-      workflowLoaded: state.workflow.get?.loaded,
-      contentHistory: state.workflow.history,
-      transitions: state.workflow.transitions,
-      currentStateValue: getCurrentStateMapping(state.workflow.currentState),
-      editingProgressSteps:
-        state?.editingProgress?.editing?.loaded === true
-          ? state?.editingProgress?.result?.steps
-          : [],
-    }),
-    { getContent, getWorkflow, transitionWorkflow },
-  ),
-)(Workflow);

package/src/customizations/volto/components/manage/Workflow/Workflow.test.jsx

@@ -1,81 +0,0 @@
-import React from 'react';
-import configureStore from 'redux-mock-store';
-import { Provider } from 'react-intl-redux';
-import { waitFor, render, screen } from '@testing-library/react';
-import { MemoryRouter } from 'react-router-dom';
-import config from '@plone/volto/registry';
-
-import Workflow from './Workflow';
-
-const mockStore = configureStore();
-
-jest.mock('@plone/volto/helpers/Loadable/Loadable');
-beforeAll(
-  async () =>
-    await require('@plone/volto/helpers/Loadable/Loadable').__setLoadables(),
-);
-
-beforeEach(() => {
-  config.settings.workflowMapping = {
-    published: { value: 'published', color: '#007bc1' },
-    publish: { value: 'publish', color: '#007bc1' },
-    private: { value: 'private', color: '#ed4033' },
-    pending: { value: 'pending', color: '#f6a808' },
-    send_back: { value: 'private', color: '#ed4033' },
-    retract: { value: 'private', color: '#ed4033' },
-    submit: { value: 'review', color: '#f4e037' },
-  };
-});
-
-describe('Workflow', () => {
-  it('renders an empty workflow component', async () => {
-    const store = mockStore({
-      workflow: {
-        currentState: { id: 'published', title: 'Published' },
-        history: [],
-        transition: { loaded: true },
-        transitions: [],
-      },
-      intl: {
-        locale: 'en',
-        messages: {},
-      },
-      content: { data: { review_state: 'published' } },
-    });
-    const { container } = render(
-      <Provider store={store}>
-        <MemoryRouter>
-          <Workflow pathname="/test" />
-        </MemoryRouter>
-      </Provider>,
-    );
-    await waitFor(() => screen.getByText(/Published/));
-    expect(container).toMatchSnapshot();
-  });
-
-  it('renders a workflow component', async () => {
-    const store = mockStore({
-      workflow: {
-        currentState: { id: 'private', title: 'Private' },
-        history: [{ review_state: 'private' }],
-        transition: { loaded: true },
-        transitions: [{ '@id': 'http://publish', title: 'Publish' }],
-      },
-      intl: {
-        locale: 'en',
-        messages: {},
-      },
-      content: { data: { review_state: 'private' } },
-    });
-
-    const { container } = render(
-      <Provider store={store}>
-        <MemoryRouter>
-          <Workflow pathname="/test" />
-        </MemoryRouter>
-      </Provider>,
-    );
-    await waitFor(() => screen.getByText('Private'));
-    expect(container).toMatchSnapshot();
-  });
-});