@eeacms/volto-eea-website-theme 1.24.3 → 1.26.0

package/CHANGELOG.md

@@ -4,15 +4,33 @@ 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.26.0](https://github.com/eea/volto-eea-website-theme/compare/1.25.0...1.26.0) - 13 December 2023
+
+#### :bug: Bug Fixes
+
+- fix: remove schema if content type is not the same as for the schema [Miu Razvan - [`0056fa9`](https://github.com/eea/volto-eea-website-theme/commit/0056fa9d68efb7d2f118c9767d756efbfb100f21)]
+
+#### :hammer_and_wrench: Others
+
+- bump version [Miu Razvan - [`69ee513`](https://github.com/eea/volto-eea-website-theme/commit/69ee51378cf6f5dddab0d5c54c3f5e4942756562)]
+- fix tests [Miu Razvan - [`aa3d5c9`](https://github.com/eea/volto-eea-website-theme/commit/aa3d5c9aee1a49f7cdeb760c074f66029504c4de)]
+- clean up [Miu Razvan - [`2a3f3dc`](https://github.com/eea/volto-eea-website-theme/commit/2a3f3dc14203b5641ee325256503527d550e9c5b)]
+### [1.25.0](https://github.com/eea/volto-eea-website-theme/compare/1.24.3...1.25.0) - 13 December 2023
+
+#### :house: Documentation changes
+
+- docs: Update Sidbar customizations README [Alin Voinea - [`7a39ac0`](https://github.com/eea/volto-eea-website-theme/commit/7a39ac0b74aaa0e8f4d0d77d7b6718f297979228)]
+- docs: Add Sidebar customizations README [Alin Voinea - [`dd220bd`](https://github.com/eea/volto-eea-website-theme/commit/dd220bd4b977320860392a7637b441a41354936d)]
+
+#### :hammer_and_wrench: Others
+
+- Release 1.25.0 [Alin Voinea - [`ed2083b`](https://github.com/eea/volto-eea-website-theme/commit/ed2083b6dc1150c6d030f988fbfd94103777844e)]
 ### [1.24.3](https://github.com/eea/volto-eea-website-theme/compare/1.24.2...1.24.3) - 5 December 2023
 
 #### :rocket: New Features
 
 - feat: modify the password reset page - refs #259024 [ana-oprea - [`966e441`](https://github.com/eea/volto-eea-website-theme/commit/966e44163b43f8d41535617f0bb491210465751e)]
 
-#### :hammer_and_wrench: Others
-
-- Update Twitter logo in Share to section. [Ghiță Bizău - [`b9c7426`](https://github.com/eea/volto-eea-website-theme/commit/b9c7426cc29cf1a981603219cec9c780cd43973b)]
 ### [1.24.2](https://github.com/eea/volto-eea-website-theme/compare/1.24.1...1.24.2) - 4 December 2023
 
 #### :bug: Bug Fixes

package/README.md

@@ -25,6 +25,10 @@ EEA Website [Volto](https://github.com/plone/volto) Theme
 See [Docusaurus](https://eea.github.io/).
 See [Storybook](https://eea.github.io/eea-storybook/).
 
+## Volto customizations
+
+- `volto/components/manage/Sidebar/SidebarPopup` -> https://github.com/plone/volto/pull/5520
+
 ## Getting started
 
 ### Try volto-eea-website-theme with Docker
@@ -46,25 +50,25 @@ Go to http://localhost:3000
 
 1. Start Volto frontend
 
-* If you already have a volto project, just update `package.json`:
+- If you already have a volto project, just update `package.json`:
 
-   ```JSON
-   "addons": [
-       "@eeacms/volto-eea-website-theme"
-   ],
+  ```JSON
+  "addons": [
+      "@eeacms/volto-eea-website-theme"
+  ],
 
-   "dependencies": {
-       "@eeacms/volto-eea-website-theme": "*"
-   }
-   ```
+  "dependencies": {
+      "@eeacms/volto-eea-website-theme": "*"
+  }
+  ```
 
-* If not, create one:
+- If not, create one:
 
-   ```
-   npm install -g yo @plone/generator-volto
-   yo @plone/volto my-volto-project --canary --addon @eeacms/volto-eea-website-theme
-   cd my-volto-project
-   ```
+  ```
+  npm install -g yo @plone/generator-volto
+  yo @plone/volto my-volto-project --canary --addon @eeacms/volto-eea-website-theme
+  cd my-volto-project
+  ```
 
 1. Install new add-ons and restart Volto:
 

package/package.json

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

package/src/actions/index.js

@@ -0,0 +1 @@
+export * from './schema';

package/src/actions/schema.js

@@ -0,0 +1,5 @@
+export function removeSchema() {
+  return {
+    type: 'REMOVE_SCHEMA',
+  };
+}

package/src/components/theme/AppExtras/RemoveSchema.jsx

@@ -0,0 +1,24 @@
+import { useEffect } from 'react';
+import { connect } from 'react-redux';
+import { removeSchema } from '@eeacms/volto-eea-website-theme/actions';
+
+function RemoveSchema({ removeSchema, content, schema }) {
+  useEffect(() => {
+    if (
+      schema.schema &&
+      (!content || (content && schema.contentType !== content['@type']))
+    ) {
+      removeSchema();
+    }
+  }, [removeSchema, content, schema]);
+
+  return null;
+}
+
+export default connect(
+  (state) => ({
+    content: state.content.data,
+    schema: state.schema,
+  }),
+  { removeSchema },
+)(RemoveSchema);

package/src/customizations/volto/components/manage/Sidebar/README.md

@@ -0,0 +1,9 @@
+## SidebarPopup
+
+- https://github.com/plone/volto/pull/5520/files
+- refs #257682
+
+## ObjectBrowserNav
+
+- Allow previewing images when selecting them with the file picker
+- refs #152099

package/src/customizations/volto/components/manage/Sidebar/SidebarPopup.jsx

@@ -0,0 +1,82 @@
+// Check this https://github.com/plone/volto/pull/5520
+import React from 'react';
+import { Portal } from 'react-portal';
+import { CSSTransition } from 'react-transition-group';
+import PropTypes from 'prop-types';
+import { doesNodeContainClick } from 'semantic-ui-react/dist/commonjs/lib';
+
+const DEFAULT_TIMEOUT = 500;
+
+const SidebarPopup = (props) => {
+  const { children, open, onClose, overlay } = props;
+
+  const asideElement = React.useRef();
+
+  const handleClickOutside = (e) => {
+    if (asideElement && doesNodeContainClick(asideElement.current, e)) return;
+    onClose();
+  };
+
+  React.useEffect(() => {
+    document.addEventListener('mousedown', handleClickOutside, false);
+    return () => {
+      document.removeEventListener('mousedown', handleClickOutside, false);
+    };
+  });
+
+  return (
+    <>
+      {overlay && (
+        <CSSTransition
+          in={open}
+          timeout={DEFAULT_TIMEOUT}
+          classNames="overlay-container"
+          unmountOnExit
+        >
+          <Portal node={document?.body}>
+            <div className="overlay-container"></div>
+          </Portal>
+        </CSSTransition>
+      )}
+      <CSSTransition
+        in={open}
+        timeout={DEFAULT_TIMEOUT}
+        classNames="sidebar-container"
+        unmountOnExit
+      >
+        <Portal>
+          <aside
+            id="test"
+            role="presentation"
+            onClick={(e) => {
+              e.stopPropagation();
+            }}
+            onKeyDown={(e) => {
+              e.stopPropagation();
+            }}
+            ref={asideElement}
+            key="sidebarpopup"
+            className="sidebar-container"
+            style={{ overflowY: 'auto' }}
+          >
+            {children}
+          </aside>
+        </Portal>
+      </CSSTransition>
+    </>
+  );
+};
+
+SidebarPopup.propTypes = {
+  open: PropTypes.bool,
+  onClose: PropTypes.func,
+  overlay: PropTypes.bool,
+};
+
+SidebarPopup.defaultProps = {
+  open: false,
+  onClose: () => {},
+  overlay: false,
+};
+
+export default SidebarPopup;

package/src/index.js

@@ -26,6 +26,8 @@ import contentBoxSVG from './icons/content-box.svg';
 import okMiddleware from './middleware/ok';
 import voltoCustomMiddleware from './middleware/voltoCustom';
 import installSlate from './slate';
+import installReducers from './reducers';
+import installMiddlewares from './middleware';
 
 import * as eea from './config';
 import React from 'react';
@@ -493,7 +495,10 @@ const applyConfig = (config) => {
   });
 
   // Custom blocks: Title
-  return [installCustomTitle].reduce((acc, apply) => apply(acc), config);
+  return [installCustomTitle, installMiddlewares, installReducers].reduce(
+    (acc, apply) => apply(acc),
+    config,
+  );
 };
 
 export default applyConfig;

package/src/index.test.js

@@ -45,12 +45,17 @@ jest.mock(
 jest.mock('@plone/volto/components', () => ({
   Icon: 'MockedIcon',
 }));
+jest.mock(
+  '@eeacms/volto-eea-website-theme/components/theme/AppExtras/RemoveSchema',
+  () => 'MockedRemoveSchema',
+);
 
 global.__SERVER__ = true;
 
 describe('applyConfig', () => {
   it('should update the config settings with EEA specific settings', () => {
     const originalConfig = {
+      addonReducers: {},
       blocks: {
         blocksConfig: {
           title: {
@@ -139,6 +144,7 @@ describe('applyConfig', () => {
       { match: '', component: 'MockedDraftBackground' },
       { match: '', component: 'MockedSubsiteClass' },
       { match: '', component: BaseTag },
+      { match: '*', component: 'MockedRemoveSchema' },
     ]);
     expect(config.settings.available_colors).toEqual(eea.colors);
     expect(config.settings.hasLanguageDropdown).toBe(false);
@@ -183,6 +189,7 @@ describe('applyConfig', () => {
 
   it('should update the config settings with EEA specific settings', () => {
     const originalConfig = {
+      addonReducers: {},
       blocks: {
         blocksConfig: {
           title: {
@@ -296,6 +303,7 @@ describe('applyConfig', () => {
       { match: '', component: 'MockedDraftBackground' },
       { match: '', component: 'MockedSubsiteClass' },
       { match: '', component: BaseTag },
+      { match: '*', component: 'MockedRemoveSchema' },
     ]);
     expect(config.settings.available_colors).toEqual(eea.colors);
     expect(config.settings.hasLanguageDropdown).toBe(false);

package/src/middleware/apiEnhancer.js

@@ -0,0 +1,11 @@
+export default function apiEnhencar(middlewares) {
+  return [
+    () => (next) => (action) => {
+      if (action.request) {
+        return next({ ...action, _request: action.request });
+      }
+      return next(action);
+    },
+    ...middlewares,
+  ];
+}

package/src/middleware/index.js

@@ -0,0 +1,10 @@
+import apiEnhancer from './apiEnhancer';
+
+export default function applyConfig(config) {
+  config.settings.storeExtenders = [
+    ...(config.settings.storeExtenders || []),
+    apiEnhancer,
+  ];
+
+  return config;
+}

package/src/reducers/index.js

@@ -0,0 +1,17 @@
+import RemoveSchema from '@eeacms/volto-eea-website-theme/components/theme/AppExtras/RemoveSchema';
+
+import schema from './schema';
+
+export default function applyConfig(config) {
+  config.addonReducers.schema = schema;
+
+  config.settings.appExtras = [
+    ...(config.settings.appExtras || []),
+    {
+      match: '*',
+      component: RemoveSchema,
+    },
+  ];
+
+  return config;
+}

package/src/reducers/schema.js

@@ -0,0 +1,48 @@
+import voltoSchema from '@plone/volto/reducers/schema/schema';
+
+const initialState = {
+  contentUrl: null,
+  contentType: null,
+  error: null,
+  loaded: false,
+  loading: false,
+  schema: null,
+  post: {
+    loaded: false,
+    loading: false,
+    error: null,
+  },
+  update: {
+    loaded: false,
+    loading: false,
+    error: null,
+  },
+  put: {
+    loaded: false,
+    loading: false,
+    error: null,
+  },
+};
+
+export default function schema(state = initialState, action = {}) {
+  if (action.type === 'REMOVE_SCHEMA') {
+    return {
+      ...state,
+      error: null,
+      loading: false,
+      loaded: true,
+      schema: null,
+    };
+  }
+
+  if (action.type === 'GET_SCHEMA_SUCCESS') {
+    const [contentUrl, contentType] = action._request.path.split('/@types/');
+    return {
+      ...voltoSchema(state, action),
+      contentUrl,
+      contentType,
+    };
+  }
+
+  return voltoSchema(state, action);
+}