@eeacms/volto-clms-theme 1.1.198 → 1.1.200

package/CHANGELOG.md

@@ -4,6 +4,14 @@ 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.1.200](https://github.com/eea/volto-clms-theme/compare/1.1.199...1.1.200) - 14 November 2024
+
+#### :rocket: New Features
+
+- feat: changes needed on the land portal in relation to moving notifications out of the porta to an external tool at EEA -refs #278670 [ana-oprea - [`c79ae45`](https://github.com/eea/volto-clms-theme/commit/c79ae450db397c2ba1f5d322d5592e762d259031)]
+
+### [1.1.199](https://github.com/eea/volto-clms-theme/compare/1.1.198...1.1.199) - 14 November 2024
+
 ### [1.1.198](https://github.com/eea/volto-clms-theme/compare/1.1.197...1.1.198) - 13 November 2024
 
 ### [1.1.197](https://github.com/eea/volto-clms-theme/compare/1.1.196...1.1.197) - 11 November 2024

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-clms-theme",
-  "version": "1.1.198",
+  "version": "1.1.200",
   "description": "volto-clms-theme: Volto theme for CLMS site",
   "main": "src/index.js",
   "author": "CodeSyntax for the European Environment Agency",

package/src/components/Blocks/CclSubscriptionBlock/SubscriptionView.jsx

@@ -1,18 +1,17 @@
-import { SubscriptionView } from '@eeacms/volto-clms-theme/components/CLMSSubscriptionView';
-import CclModal from '@eeacms/volto-clms-theme/components/CclModal/CclModal';
-import CclButton from '@eeacms/volto-clms-theme/components/CclButton/CclButton';
+import { UniversalLink } from '@plone/volto/components';
 
 const SubscriptionBlockView = (props) => {
   const { data } = props;
 
   return (
-    <CclModal
-      trigger={
-        <CclButton mode={'filled'}>{data.title || 'Text example...'}</CclButton>
+    <UniversalLink
+      href={
+        'https://subscriptions.copernicus-land.eea.europa.eu/copernicus-land-monitoring-service-subscription'
       }
+      className="ccl-button ccl-button-green"
     >
-      <SubscriptionView type={data.type || 'events'} />
-    </CclModal>
+      {data.title || 'Text example...'}
+    </UniversalLink>
   );
 };
 

package/src/components/CLMSDownloadCartView/Fields/TimeseriesPicker.jsx

@@ -34,7 +34,7 @@ export const TimeseriesPicker = (props) => {
     const diffDays = Math.round(Math.abs((start - end) / oneDay));
     return diffDays < limit;
   };
-  const dates_array = data_arrays.map((e) => new Date(e)); //
+  const dates_array = data_arrays?.map((e) => new Date(e));
   return (
     <>
       <Popup

package/src/components/CLMSProfileView/CLMSProfileView.jsx

@@ -9,14 +9,9 @@ import CclTabs from '@eeacms/volto-clms-theme/components/CclTab/CclTabs';
 import { helmetTitle } from '@eeacms/volto-clms-theme/components/CclUtils';
 import {
   CLMSApiTokensView,
-  CLMSNewsletterSubscriberView,
   CLMSUserProfileView,
   CLMSDeleteProfileView,
 } from '@eeacms/volto-clms-theme/components/CLMSProfileView';
-import {
-  AVAILABLE_SUBSCRIPTIONS,
-  SubscriptionView,
-} from '@eeacms/volto-clms-theme/components/CLMSSubscriptionView';
 
 import { getExtraBreadcrumbItems } from '../../actions';
 
@@ -67,17 +62,6 @@ class CLMSProfileView extends Component {
             <div tabTitle="API tokens">
               <CLMSApiTokensView />
             </div>
-            {(this.props.roles?.includes('Manager') ||
-              this.props.roles?.includes('Site Administrator')) && (
-              <div tabTitle="CLMS updates subscribers">
-                <CLMSNewsletterSubscriberView />
-              </div>
-            )}
-            {AVAILABLE_SUBSCRIPTIONS.map((subscription) => (
-              <div tabTitle={subscription?.title} key={subscription?.title}>
-                <SubscriptionView type={subscription?.type} />
-              </div>
-            ))}
             <div tabTitle="Delete profile">
               <CLMSDeleteProfileView />
             </div>

package/src/components/CLMSProfileView/CLMSUserProfileView.jsx

@@ -260,6 +260,19 @@ class CLMSUserProfileView extends Component {
                   />
                 )}
               </div>
+
+              <p className="callout" style={{ backgroundColor: '#ebefc6' }}>
+                If you are interested in receiving news and other updates from
+                the Copernicus Land Monitoring Service, please subscribe{' '}
+                <UniversalLink
+                  href={
+                    'https://subscriptions.copernicus-land.eea.europa.eu/copernicus-land-monitoring-service-subscription'
+                  }
+                >
+                  here
+                </UniversalLink>
+                .
+              </p>
             </div>
           </Container>
         )}

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

@@ -5,13 +5,9 @@
 import React, { Component } from 'react';
 import { defineMessages, injectIntl } from 'react-intl';
 import { connect } from 'react-redux';
-import { Link } from 'react-router-dom';
+import { UniversalLink } from '@plone/volto/components';
 import { ReactSVG } from 'react-svg';
-import { toast } from 'react-toastify';
 import { compose } from 'redux';
-import validator from 'validator';
-
-import { Toast } from '@plone/volto/components';
 
 import { FontAwesomeIcon } from '@eeacms/volto-clms-utils/components';
 import { withFontAwesomeLibs } from '@eeacms/volto-clms-utils/helpers';
@@ -126,126 +122,6 @@ const messages = defineMessages({
  */
 
 class Footer extends Component {
-  constructor(props) {
-    super(props);
-    this.handleChange = this.handleChange.bind(this);
-    this.handleInputChange = this.handleInputChange.bind(this);
-    this.handleBlur = this.handleBlur.bind(this);
-    this.onSubmit = this.onSubmit.bind(this);
-    this.state = {
-      value: '',
-      inputValue: false,
-      lang: 'en',
-    };
-  }
-
-  componentDidMount() {
-    this.setState({
-      value: '',
-      inputValue: this.state.inputValue,
-      lang: this.props.intl.locale,
-    });
-  }
-
-  handleInputChange() {
-    this.setState({
-      inputValue: !this.state.inputValue,
-    });
-  }
-
-  handleChange(event) {
-    this.setState({
-      value: event.target.value,
-    });
-  }
-  handleBlur(event) {
-    const input =
-      typeof window !== 'undefined' &&
-      document.getElementById('footer-email') !== null
-        ? document.getElementById('footer-email')
-        : '';
-    if (!validator.isEmail(event.target.value)) {
-      input.setCustomValidity(
-        this.props.intl.formatMessage(messages.invalid_mail),
-      );
-      input.reportValidity();
-    } else {
-      input.setCustomValidity('');
-      input.reportValidity();
-    }
-  }
-
-  emptyFieldErrorToast = () => {
-    toast.error(
-      <Toast error title={'Error'} content={'Write your email in the field'} />,
-    );
-  };
-
-  invalidEmailErrorToast = () => {
-    toast.error(<Toast error title={'Error'} content={'Invalid email'} />);
-  };
-
-  /**
-   * Submit handler
-   * @method onSubmit
-   * @param {object} data Form data.
-   * @returns {undefined}
-   */
-  onSubmit(event) {
-    event.preventDefault();
-    if (
-      validator.isEmail(this.state.value) === true &&
-      this.state.inputValue === true &&
-      this.state.value !== ''
-    ) {
-      this.props
-        .subscribeTo('newsletter', this.state.value)
-        .then(() => {
-          this.props.subscribe_loaded &&
-            toast.success(
-              <Toast
-                success
-                title={this.props.intl.formatMessage(messages.success)}
-                content={this.props.intl.formatMessage(messages.saved)}
-              />,
-            );
-        })
-        .catch(() => {
-          this.props.subscribe_error &&
-            toast.error(
-              <Toast
-                error
-                title={this.props.intl.formatMessage(messages.error)}
-                content={
-                  this.props.subscribe_error_message ||
-                  this.props.intl.formatMessage(messages.errorMessage)
-                }
-              />,
-            );
-        });
-    } else if (
-      this.state.inputValue === true &&
-      validator.isEmail(this.state.value) === false
-    ) {
-      this.invalidEmailErrorToast();
-    } else if (
-      this.state.inputValue === false &&
-      validator.isEmail(this.state.value) === true
-    ) {
-      toast.error(
-        <Toast
-          error
-          title={this.props.intl.formatMessage(messages.error)}
-          content={this.props.intl.formatMessage(
-            messages.agreePrivacyPolicyCheck,
-          )}
-        />,
-      );
-    } else {
-      this.emptyFieldErrorToast();
-    }
-  }
-
   render() {
     return (
       <footer className="ccl-footer">
@@ -379,60 +255,14 @@ class Footer extends Component {
                 Sign up to CLMS updates
               </div>
               <form action="" className="ccl-footer-form">
-                <div className="ccl-footer-newsletter">
-                  <input
-                    maxLength="8000"
-                    placeholder="Enter an email address"
-                    type="text"
-                    id="footer-email"
-                    value={this.state.value}
-                    onChange={this.handleChange}
-                    onBlur={this.handleBlur}
-                  />
-                  <button
-                    disabled={
-                      this.state.inputValue === true &&
-                      validator.isEmail(this.state.value) === true
-                        ? false
-                        : true
-                    }
-                    type="submit"
-                    className="ccl-button ccl-button--default"
-                    onClick={
-                      validator.isEmail(this.state.value) &&
-                      this.state.inputValue === true
-                        ? this.onSubmit
-                        : this.invalidEmailErrorToast
-                    }
+                <div className="ccl-footer-newsletter ">
+                  <UniversalLink
+                    href="https://subscriptions.copernicus-land.eea.europa.eu/copernicus-land-monitoring-service-subscription"
+                    className="ccl-button ccl-button--default footer-clms-updates"
+                    target="_blank"
                   >
                     {this.props.intl.formatMessage(messages.subscribe)}
-                  </button>
-                </div>
-                <div className="ccl-form footer-privacy-check">
-                  <div className="ccl-form-group">
-                    <input
-                      type="checkbox"
-                      id="footer_privacy"
-                      name="footerPrivacy"
-                      value={this.state.inputValue}
-                      onClick={this.handleInputChange}
-                      className="ccl-checkbox ccl-form-check-input"
-                      required={true}
-                    />
-                    <label
-                      className="ccl-form-check-label"
-                      htmlFor="footer_privacy"
-                    >
-                      {this.props.intl.formatMessage(
-                        messages.agreePrivacyPolicy,
-                      )}
-                      <Link to={`/${this.state.lang}/personal-data-protection`}>
-                        {this.props.intl.formatMessage(
-                          messages.agreePrivacyPolicyLinkText,
-                        )}
-                      </Link>
-                    </label>
-                  </div>
+                  </UniversalLink>
                 </div>
               </form>
 

package/theme/site/extras/footer.less

@@ -180,6 +180,17 @@
   color: @clmsGreen;
 }
 
+.ccl-footer
+  .ccl-footer-main
+  .ccl-footer-col
+  .ccl-footer-form
+  .footer-clms-updates {
+  display: block;
+  border: 1px solid #fff;
+  background-color: #fff;
+  color: @clmsGreen;
+}
+
 .ccl-footer .footer-privacy-check .ccl-form-check-label {
   display: inline-block;
   vertical-align: middle;