@eeacms/volto-clms-theme 1.1.113 → 1.1.114

package/CHANGELOG.md

@@ -4,11 +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.113](https://github.com/eea/volto-clms-theme/compare/1.1.112...1.1.113) - 19 February 2024
+### [1.1.114](https://github.com/eea/volto-clms-theme/compare/1.1.113...1.1.114) - 21 February 2024
 
 #### :hammer_and_wrench: Others
 
-- link to contact_email [Mikel Larreategi - [`0b000f5`](https://github.com/eea/volto-clms-theme/commit/0b000f58cf1928fd7dae548ab49e7857fd53e1c4)]
+- console removed [Unai Etxaburu - [`70b039e`](https://github.com/eea/volto-clms-theme/commit/70b039e299724cc2d2ede3fd01eee371408ac56f)]
+- base volto logout component and user in header appears if token and user id exists [Unai Etxaburu - [`650864f`](https://github.com/eea/volto-clms-theme/commit/650864f870356651041b2e5fc96df55ae2f794d5)]
+### [1.1.113](https://github.com/eea/volto-clms-theme/compare/1.1.112...1.1.113) - 19 February 2024
+
 ### [1.1.112](https://github.com/eea/volto-clms-theme/compare/1.1.111...1.1.112) - 16 February 2024
 
 ### [1.1.111](https://github.com/eea/volto-clms-theme/compare/1.1.110...1.1.111) - 13 February 2024

package/package.json

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

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

@@ -216,7 +216,7 @@ class Header extends Component {
                   <li className="header-vertical-line">
                     <div>|</div>
                   </li>
-                  {(this.props.user?.id && (
+                  {(this.props.token && this.props.user?.id && (
                     <>
                       <li className="header-dropdown">
                         <HeaderDropdown user={this.props.user} />

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

@@ -1,36 +1,108 @@
-import { useEffect, useMemo } from 'react';
-import { useDispatch, useSelector, shallowEqual } from 'react-redux';
-import { useHistory } from 'react-router-dom';
+/**
+ * Login container.
+ * @module components/theme/Logout/Logout
+ */
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+import { defineMessages, injectIntl } from 'react-intl';
 import qs from 'query-string';
+
+import { Login } from '@plone/volto/components';
 import { logout, purgeMessages } from '@plone/volto/actions';
+import { toast } from 'react-toastify';
+import { Toast } from '@plone/volto/components';
 
-const Logout = ({ location }) => {
-  const token = useSelector((state) => state.userSession.token, shallowEqual);
-  const history = useHistory();
-  const dispatch = useDispatch();
-
-  const returnUrl = useMemo(
-    () =>
-      qs.parse(location.search).return_url ||
-      location.pathname
-        .replace(/\/login\/?$/, '')
-        .replace(/\/logout\/?$/, '') ||
-      '/',
-    [location],
-  );
-
-  useEffect(() => {
-    dispatch(logout());
-    dispatch(purgeMessages());
-  }, [dispatch]);
-
-  useEffect(() => {
-    if (!token) {
-      window.location.href = '/';
-    }
-  }, [history, returnUrl, token]);
+const messages = defineMessages({
+  loggedOut: {
+    id: 'Logged out',
+    defaultMessage: 'Logged out',
+  },
+  loggedOutContent: {
+    id: 'You have been logged out from the site.',
+    defaultMessage: 'You have been logged out from the site.',
+  },
+});
+
+/**
+ * Logout class.
+ * @class Logout
+ * @extends Component
+ */
+class Logout extends Component {
+  /**
+   * Property types.
+   * @property {Object} propTypes Property types.
+   * @static
+   */
+  static propTypes = {
+    logout: PropTypes.func.isRequired,
+    purgeMessages: PropTypes.func.isRequired,
+    query: PropTypes.shape({
+      return_url: PropTypes.string,
+    }),
+  };
 
-  return '';
-};
+  /**
+   * Default properties.
+   * @property {Object} defaultProps Default properties.
+   * @static
+   */
+  static defaultProps = {
+    query: null,
+  };
+
+  componentDidMount() {
+    this.props.logout();
+    this.props.purgeMessages();
+  }
+
+  /**
+   * Component will receive props
+   * @method componentWillReceiveProps
+   * @param {Object} nextProps Next properties
+   * @returns {undefined}
+   */
+  UNSAFE_componentWillReceiveProps(nextProps) {
+    if (!nextProps.token) {
+      this.props.history.replace(this.props.returnUrl || '/');
+      if (!toast.isActive('loggedOut')) {
+        toast.success(
+          <Toast
+            success
+            title={this.props.intl.formatMessage(messages.loggedOut)}
+            content={this.props.intl.formatMessage(messages.loggedOutContent)}
+          />,
+          { autoClose: false, toastId: 'loggedOut' },
+        );
+      }
+    }
+  }
 
-export default Logout;
+  /**
+   * Render method.
+   * @method render
+   * @returns {string} Markup for the component.
+   */
+  render() {
+    return <Login location={{ query: this.props.location.query }} />;
+  }
+}
+export default compose(
+  injectIntl,
+  connect(
+    (state, props) => ({
+      query: qs.parse(props.location.search),
+      token: state.userSession.token,
+      returnUrl:
+        qs.parse(props.location.search).return_url ||
+        props.location.pathname
+          .replace(/\/login\/?$/, '')
+          .replace(/\/logout\/?$/, '') ||
+        '/',
+    }),
+    { logout, purgeMessages },
+  ),
+)(Logout);