@eeacms/volto-eea-website-theme 1.15.0 → 1.16.0

package/CHANGELOG.md

@@ -4,7 +4,16 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
-### [1.15.0](https://github.com/eea/volto-eea-website-theme/compare/1.14.1...1.15.0) - 2 June 2023
+### [1.16.0](https://github.com/eea/volto-eea-website-theme/compare/1.15.0...1.16.0) - 8 June 2023
+
+#### :bug: Bug Fixes
+
+- fix(comments): Upgrade customization of Comments.jsx to reflect the  latest updates from Volto - refs #251360 [dobri1408 - [`2687b94`](https://github.com/eea/volto-eea-website-theme/commit/2687b94b5fc8738e22548c04b64eeb3bba50a12e)]
+
+#### :hammer_and_wrench: Others
+
+- Updated package.json [Miu Razvan - [`da82fae`](https://github.com/eea/volto-eea-website-theme/commit/da82faefe753c7fdc9f6122cc111e81a41f0e947)]
+### [1.15.0](https://github.com/eea/volto-eea-website-theme/compare/1.14.1...1.15.0) - 6 June 2023
 
 #### :rocket: New Features
 

package/package.json

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

package/src/customizations/volto/components/manage/Contents/ContentsPropertiesModal.jsx

@@ -0,0 +1,232 @@
+/**
+ * Contents properties modal.
+ * @module components/manage/Contents/ContentsPropertiesModal
+ */
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+import { isEmpty, map } from 'lodash';
+import { defineMessages, injectIntl } from 'react-intl';
+
+import { updateContent } from '@plone/volto/actions';
+import { ModalForm } from '@plone/volto/components';
+
+const messages = defineMessages({
+  properties: {
+    id: 'Properties',
+    defaultMessage: 'Properties',
+  },
+  default: {
+    id: 'Default',
+    defaultMessage: 'Default',
+  },
+  effectiveTitle: {
+    id: 'Publishing Date',
+    defaultMessage: 'Publishing Date',
+  },
+  effectiveDescription: {
+    id:
+      'If this date is in the future, the content will not show up in listings and searches until this date.',
+    defaultMessage:
+      'If this date is in the future, the content will not show up in listings and searches until this date.',
+  },
+  expiresTitle: {
+    id: 'Expiration Date',
+    defaultMessage: 'Expiration Date',
+  },
+  expiresDescription: {
+    id:
+      'When this date is reached, the content will nolonger be visible in listings and searches.',
+    defaultMessage:
+      'When this date is reached, the content will nolonger be visible in listings and searches.',
+  },
+  rightsTitle: {
+    id: 'Rights',
+    defaultMessage: 'Rights',
+  },
+  rightsDescription: {
+    id: 'Copyright statement or other rights information on this item.',
+    defaultMessage:
+      'Copyright statement or other rights information on this item.',
+  },
+  creatorsTitle: {
+    id: 'Creators',
+    defaultMessage: 'Creators',
+  },
+  creatorsDescription: {
+    id:
+      'Persons responsible for creating the content of this item. Please enter a list of user names, one per line. The principal creator should come first.',
+    defaultMessage:
+      'Persons responsible for creating the content of this item. Please enter a list of user names, one per line. The principal creator should come first.',
+  },
+  excludeFromNavTitle: {
+    id: 'Exclude from navigation',
+    defaultMessage: 'Exclude from navigation',
+  },
+  excludeFromNavDescription: {
+    id: 'If selected, this item will not appear in the navigation tree',
+    defaultMessage:
+      'If selected, this item will not appear in the navigation tree',
+  },
+  yes: {
+    id: 'Yes',
+    defaultMessage: 'Yes',
+  },
+  no: {
+    id: 'No',
+    defaultMessage: 'No',
+  },
+});
+
+/**
+ * ContentsPropertiesModal class.
+ * @class ContentsPropertiesModal
+ * @extends Component
+ */
+class ContentsPropertiesModal extends Component {
+  /**
+   * Property types.
+   * @property {Object} propTypes Property types.
+   * @static
+   */
+  static propTypes = {
+    updateContent: PropTypes.func.isRequired,
+    items: PropTypes.arrayOf(PropTypes.string).isRequired,
+    request: PropTypes.shape({
+      loading: PropTypes.bool,
+      loaded: PropTypes.bool,
+    }).isRequired,
+    open: PropTypes.bool.isRequired,
+    onOk: PropTypes.func.isRequired,
+    onCancel: PropTypes.func.isRequired,
+  };
+
+  /**
+   * Constructor
+   * @method constructor
+   * @param {Object} props Component properties
+   * @constructs ContentsUploadModal
+   */
+  constructor(props) {
+    super(props);
+
+    this.onSubmit = this.onSubmit.bind(this);
+  }
+
+  /**
+   * Component will receive props
+   * @method componentWillReceiveProps
+   * @param {Object} nextProps Next properties
+   * @returns {undefined}
+   */
+  UNSAFE_componentWillReceiveProps(nextProps) {
+    if (this.props.request.loading && nextProps.request.loaded) {
+      this.props.onOk();
+    }
+  }
+
+  /**
+   * Submit handler
+   * @method onSubmit
+   * @param {Object} data Form data
+   * @returns {undefined}
+   */
+  onSubmit(data) {
+    if (isEmpty(data)) {
+      this.props.onOk();
+    } else {
+      this.props.updateContent(
+        this.props.items,
+        map(this.props.items, () => data),
+      );
+    }
+  }
+
+  /**
+   * Render method.
+   * @method render
+   * @returns {string} Markup for the component.
+   */
+  render() {
+    return (
+      this.props.open && (
+        <ModalForm
+          open={this.props.open}
+          onSubmit={this.onSubmit}
+          onCancel={this.props.onCancel}
+          title={this.props.intl.formatMessage(messages.properties)}
+          schema={{
+            fieldsets: [
+              {
+                id: 'default',
+                title: this.props.intl.formatMessage(messages.default),
+                fields: [
+                  'effective',
+                  'expires',
+                  'rights',
+                  'creators',
+                  'exclude_from_nav',
+                ],
+              },
+            ],
+            properties: {
+              effective: {
+                description: this.props.intl.formatMessage(
+                  messages.effectiveDescription,
+                ),
+                title: this.props.intl.formatMessage(messages.effectiveTitle),
+                type: 'string',
+                widget: 'datetime',
+              },
+              expires: {
+                description: this.props.intl.formatMessage(
+                  messages.expiresDescription,
+                ),
+                title: this.props.intl.formatMessage(messages.expiresTitle),
+                type: 'string',
+                widget: 'datetime',
+              },
+              rights: {
+                description: this.props.intl.formatMessage(
+                  messages.rightsDescription,
+                ),
+                title: this.props.intl.formatMessage(messages.rightsTitle),
+                type: 'string',
+                widget: 'textarea',
+              },
+              creators: {
+                description: this.props.intl.formatMessage(
+                  messages.creatorsDescription,
+                ),
+                title: this.props.intl.formatMessage(messages.creatorsTitle),
+                type: 'array',
+              },
+              exclude_from_nav: {
+                description: this.props.intl.formatMessage(
+                  messages.excludeFromNavDescription,
+                ),
+                title: this.props.intl.formatMessage(
+                  messages.excludeFromNavTitle,
+                ),
+                type: 'boolean',
+              },
+            },
+            required: [],
+          }}
+        />
+      )
+    );
+  }
+}
+
+export default compose(
+  injectIntl,
+  connect(
+    (state) => ({
+      request: state.content.update,
+    }),
+    { updateContent },
+  ),
+)(ContentsPropertiesModal);

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

@@ -18,8 +18,10 @@ import { Portal } from 'react-portal';
 import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Button, Comment, Container, Icon } from 'semantic-ui-react';
+import { injectLazyLibs } from '@plone/volto/helpers/Loadable/Loadable';
 import { formatRelativeDate } from '@plone/volto/helpers/Utils/Date';
 import config from '@plone/volto/registry';
+// import { Button, Grid, Segment, Container } from 'semantic-ui-react';
 
 const messages = defineMessages({
   comment: {
@@ -296,7 +298,7 @@ class Comments extends Component {
    * @returns {string} Markup for the component.
    */
   render() {
-    const { items } = this.props;
+    const { items, permissions } = this.props;
     const { collapsedComments } = this.state;
     // object with comment ids, to easily verify if any comment has children
     const allCommentsWithCildren = this.addRepliesAsChildrenToComments(items);
@@ -308,7 +310,7 @@ class Comments extends Component {
     const commentElement = (comment) => (
       <Comment key={comment.comment_id}>
         <Avatar
-          src={comment.author_image}
+          src={flattenToAppURL(comment.author_image)}
           title={comment.author_name || 'Anonymous'}
           color={getColor(comment.author_username)}
         />
@@ -338,13 +340,15 @@ class Comments extends Component {
             )}
           </Comment.Text>
           <Comment.Actions>
-            <Comment.Action
-              as="a"
-              aria-label={this.props.intl.formatMessage(messages.reply)}
-              onClick={() => this.setReplyTo(comment.comment_id)}
-            >
-              <FormattedMessage id="Reply" defaultMessage="Reply" />
-            </Comment.Action>
+            {comment.can_reply && (
+              <Comment.Action
+                as="a"
+                aria-label={this.props.intl.formatMessage(messages.reply)}
+                onClick={() => this.setReplyTo(comment.comment_id)}
+              >
+                <FormattedMessage id="Reply" defaultMessage="Reply" />
+              </Comment.Action>
+            )}
             {comment.is_editable && (
               <Comment.Action
                 onClick={() =>
@@ -420,6 +424,8 @@ class Comments extends Component {
       </Comment>
     );
 
+    if (!permissions.view_comments) return '';
+
     return (
       <Container className="comments">
         <CommentEditModal
@@ -429,16 +435,17 @@ class Comments extends Component {
           id={this.state.editId}
           text={this.state.editText}
         />
-        <div id="comment-add-id">
-          <Form
-            onSubmit={this.onSubmit}
-            onCancel={this.onEditCancel}
-            submitLabel={this.props.intl.formatMessage(messages.comment)}
-            resetAfterSubmit
-            schema={makeFormSchema(this.props.intl)}
-          />
-        </div>
-
+        {permissions.can_reply && (
+          <div id="comment-add-id">
+            <Form
+              onSubmit={this.onSubmit}
+              onCancel={this.onEditCancel}
+              submitLabel={this.props.intl.formatMessage(messages.comment)}
+              resetAfterSubmit
+              schema={makeFormSchema(this.props.intl)}
+            />
+          </div>
+        )}
         {/* all comments  */}
         <Comment.Group threaded={false}>
           {allPrimaryComments.map((item) => commentElement(item))}
@@ -474,11 +481,13 @@ class Comments extends Component {
 
 export default compose(
   injectIntl,
+  injectLazyLibs(['moment']),
   connect(
     (state) => ({
       items: state.comments.items,
       next: state.comments.next,
       items_total: state.comments.items_total,
+      permissions: state.comments.permissions || {},
       addRequest: state.comments.add,
       deleteRequest: state.comments.delete,
     }),