@eeacms/volto-eea-website-theme 1.28.3 → 1.29.0

package/CHANGELOG.md

@@ -4,6 +4,30 @@ 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.29.0](https://github.com/eea/volto-eea-website-theme/compare/1.28.3...1.29.0) - 7 March 2024
+
+#### :rocket: New Features
+
+- feat: set isPrint redux state when window.print() is triggered [laszlocseh - [`4d07b9a`](https://github.com/eea/volto-eea-website-theme/commit/4d07b9a76af0e43340e100db10ad1051c61f3a89)]
+
+#### :bug: Bug Fixes
+
+- fix: smaller timeout in window.print [laszlocseh - [`808d7e9`](https://github.com/eea/volto-eea-website-theme/commit/808d7e9ef406f38e008a718fd4883fe735c296de)]
+
+#### :house: Internal changes
+
+- chore: cleanup unused RemoveSchema code [laszlocseh - [`6d8de0a`](https://github.com/eea/volto-eea-website-theme/commit/6d8de0a27dd6bfd5645bb730d2c66f2d4784c158)]
+- chore: cleanup unused RemoveSchema code [laszlocseh - [`c1f2650`](https://github.com/eea/volto-eea-website-theme/commit/c1f2650f0f7ffb27c168399fabcbf69d0299235b)]
+
+#### :hammer_and_wrench: Others
+
+- test: TokenWidget.test.jsx and TopicsWidget.test.jsx cover more conditions [laszlocseh - [`dd154bb`](https://github.com/eea/volto-eea-website-theme/commit/dd154bb520237f458be563280cac1545eb381bdf)]
+- Bump version to 1.29.0 from 1.28.4 [Claudia Ifrim - [`7bc8eab`](https://github.com/eea/volto-eea-website-theme/commit/7bc8eabd4b0462fc5afc07ed131d074af642cc89)]
+- test: added TokenWidget.test.jsx and TopicsWidget.test.jsx [laszlocseh - [`f7292bb`](https://github.com/eea/volto-eea-website-theme/commit/f7292bb426591f758dcc7bc159b5dbd75b7afb36)]
+- test: added HomePageView.test.jsx and HomePageInverseView.test.jsx [laszlocseh - [`2076651`](https://github.com/eea/volto-eea-website-theme/commit/2076651820693825b5e20b0a7774307cd78eeb57)]
+- test: fix in Logo.test.jsx [laszlocseh - [`6d552f8`](https://github.com/eea/volto-eea-website-theme/commit/6d552f89d5aff6e47ef3032d4862a1bcbe364c01)]
+- test: add Logo.test.jsx [laszlocseh - [`752c562`](https://github.com/eea/volto-eea-website-theme/commit/752c5629840d906382858f088b97d33147684ca8)]
+- add isPrint missing files [laszlocseh - [`d995789`](https://github.com/eea/volto-eea-website-theme/commit/d995789f337a00455d45b5ec26de9c4c0c898ce6)]
 ### [1.28.3](https://github.com/eea/volto-eea-website-theme/compare/1.28.2...1.28.3) - 5 March 2024
 
 #### :bug: Bug Fixes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-eea-website-theme",
-  "version": "1.28.3",
+  "version": "1.29.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

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

package/src/actions/print.js

@@ -0,0 +1,13 @@
+/**
+ * Print action.
+ * @module actions/print
+ */
+
+import { SET_ISPRINT } from '@eeacms/volto-eea-website-theme/constants/ActionTypes';
+
+export const setIsPrint = (data) => {
+  return {
+    type: SET_ISPRINT,
+    payload: data,
+  };
+};

package/src/components/theme/Banner/View.jsx

@@ -1,11 +1,11 @@
 import React, { useCallback, useMemo, useRef } from 'react';
 import { Helmet } from '@plone/volto/helpers';
 import { compose } from 'redux';
-import { connect } from 'react-redux';
+import { connect, useDispatch } from 'react-redux';
 import { withRouter } from 'react-router';
 import { defineMessages, injectIntl } from 'react-intl';
 import startCase from 'lodash/startCase';
-import { Icon } from 'semantic-ui-react';
+import { Icon, Loader } from 'semantic-ui-react';
 import Popup from '@eeacms/volto-eea-design-system/ui/Popup/Popup';
 import config from '@plone/volto/registry';
 import Banner from '@eeacms/volto-eea-design-system/ui/Banner/Banner';
@@ -14,7 +14,8 @@ import {
   sharePage,
 } from '@eeacms/volto-eea-design-system/ui/Banner/Banner';
 import Copyright from '@eeacms/volto-eea-design-system/ui/Copyright/Copyright';
-
+import { setIsPrint } from '@eeacms/volto-eea-website-theme/actions/print';
+import cx from 'classnames';
 import './styles.less';
 
 const messages = defineMessages({
@@ -65,6 +66,7 @@ const Title = ({ config = {}, properties }) => {
 };
 
 const View = (props) => {
+  const dispatch = useDispatch();
   const { banner = {}, intl } = props;
   const metadata = props.metadata || props.properties;
   const popupRef = useRef(null);
@@ -164,14 +166,95 @@ const View = (props) => {
               </>
             )}
             {!hideDownloadButton && (
-              <Banner.Action
-                icon="ri-download-2-fill"
-                title={intl.formatMessage(messages.download)}
-                className="download"
-                onClick={() => {
-                  window.print();
-                }}
-              />
+              <>
+                <Banner.Action
+                  icon="ri-download-2-fill"
+                  title={intl.formatMessage(messages.download)}
+                  className="download"
+                  onClick={() => {
+                    // set tabs to be visible
+                    const tabs = document.getElementsByClassName('ui tab');
+                    Array.from(tabs).forEach((tab) => {
+                      tab.style.display = 'block';
+                    });
+
+                    dispatch(setIsPrint(true));
+                    // display loader
+                    const printLoader = document.getElementById(
+                      'download-print-loader',
+                    );
+                    printLoader.style.display = 'flex';
+
+                    let timeoutValue = 1000;
+                    // if we have plotlycharts increase timeout
+                    setTimeout(() => {
+                      const plotlyCharts = document.getElementsByClassName(
+                        'visualization-wrapper',
+                      );
+                      if (plotlyCharts.length > 0) {
+                        timeoutValue = timeoutValue + 1000;
+                      }
+                    }, timeoutValue);
+
+                    // scroll to iframes to make them be in the viewport
+                    // use timeout to wait for load
+                    setTimeout(() => {
+                      const iframes = document.getElementsByTagName('iframe');
+                      if (iframes.length > 0) {
+                        timeoutValue = timeoutValue + 2000;
+                        Array.from(iframes).forEach((element, index) => {
+                          setTimeout(() => {
+                            element.scrollIntoView({
+                              behavior: 'instant',
+                              block: 'nearest',
+                              inline: 'center',
+                            });
+                          }, timeoutValue);
+                          timeoutValue = timeoutValue + 3000;
+                        });
+                        timeoutValue = timeoutValue + 1000;
+                      }
+
+                      setTimeout(() => {
+                        window.scrollTo({
+                          top: 0,
+                        });
+                        Array.from(tabs).forEach((tab) => {
+                          tab.style.display = '';
+                        });
+                        printLoader.style.display = 'none';
+                        dispatch(setIsPrint(false));
+                        window.print();
+                      }, timeoutValue);
+                    }, timeoutValue);
+                  }}
+                />
+                <div
+                  id="download-print-loader"
+                  className={cx('ui warning message')}
+                  style={{
+                    position: 'fixed',
+                    left: '40%',
+                    right: '40%',
+                    backgroundColor: '#fff',
+                    padding: '1em',
+                    display: 'none',
+                    flexDirection: 'column',
+                    alignItems: 'center',
+                    top: '40%',
+                    zIndex: '9999',
+                  }}
+                >
+                  <Loader
+                    disabled={false}
+                    indeterminate
+                    active
+                    inline
+                    size="medium"
+                  ></Loader>
+                  <div>Preparing download</div>
+                </div>
+              </>
             )}
             {rssLinks?.map((rssLink, index) => (
               <>
@@ -253,6 +336,7 @@ export default compose(
   connect((state) => {
     return {
       types: state.types.types,
+      isPrint: state.isPrint,
     };
   }),
 )(View);

package/src/components/theme/Homepage/HomePageInverseView.test.jsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import HomePageInverseView from './HomePageInverseView';
+import '@testing-library/jest-dom/extend-expect';
+
+describe('HomePageInverseView Component', () => {
+  it('renders without crashing', () => {
+    const mockContent = (
+      <body>
+        <div>Mock content</div>
+      </body>
+    );
+    const { container } = render(<HomePageInverseView content={mockContent} />);
+    expect(container).toBeTruthy();
+  });
+});

package/src/components/theme/Homepage/HomePageView.test.jsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import HomePageView from './HomePageView';
+import '@testing-library/jest-dom/extend-expect';
+
+describe('HomePageView Component', () => {
+  it('renders without crashing', () => {
+    const mockContent = (
+      <body>
+        <div>Mock content</div>
+      </body>
+    );
+    const { container } = render(<HomePageView content={mockContent} />);
+    expect(container).toBeTruthy();
+  });
+});

package/src/components/theme/Logo.test.jsx

@@ -0,0 +1,31 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { Provider } from 'react-intl-redux';
+import configureStore from 'redux-mock-store';
+import { Router } from 'react-router-dom';
+import { createMemoryHistory } from 'history';
+import EEALogo from './Logo';
+
+const mockStore = configureStore();
+let history = createMemoryHistory();
+
+describe('EEALogo Component', () => {
+  it('renders without crashing', () => {
+    const store = mockStore({
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+
+    const { container } = render(
+      <Provider store={store}>
+        <Router history={history}>
+          <EEALogo />
+        </Router>
+      </Provider>,
+    );
+
+    expect(container).toBeTruthy();
+  });
+});

package/src/components/theme/Widgets/TokenWidget.test.jsx

@@ -0,0 +1,54 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { Provider } from 'react-intl-redux';
+import configureStore from 'redux-mock-store';
+import { Router } from 'react-router-dom';
+import { createMemoryHistory } from 'history';
+import { TokenWidget } from './TokenWidget';
+
+const mockStore = configureStore();
+let history = createMemoryHistory();
+
+describe('TokenWidget Component', () => {
+  it('renders without crashing', () => {
+    const store = mockStore({
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+
+    const { container } = render(
+      <Provider store={store}>
+        <Router history={history}>
+          <TokenWidget
+            value={['Value1', 'Value2']}
+            children={''}
+            className={'test'}
+          />
+        </Router>
+      </Provider>,
+    );
+
+    expect(container).toBeTruthy();
+  });
+
+  it('renders without crashing, without value', () => {
+    const store = mockStore({
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+
+    const { container } = render(
+      <Provider store={store}>
+        <Router history={history}>
+          <TokenWidget value={null} children={''} className={'test'} />
+        </Router>
+      </Provider>,
+    );
+
+    expect(container).toBeTruthy();
+  });
+});

package/src/components/theme/Widgets/TopicsWidget.test.jsx

@@ -0,0 +1,54 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { Provider } from 'react-intl-redux';
+import configureStore from 'redux-mock-store';
+import { Router } from 'react-router-dom';
+import { createMemoryHistory } from 'history';
+import { TopicsWidget } from './TopicsWidget';
+
+const mockStore = configureStore();
+let history = createMemoryHistory();
+
+describe('TopicsWidget Component', () => {
+  it('renders without crashing, with value', () => {
+    const store = mockStore({
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+
+    const { container } = render(
+      <Provider store={store}>
+        <Router history={history}>
+          <TopicsWidget
+            value={['Value1', 'Value2']}
+            children={''}
+            className={'test'}
+          />
+        </Router>
+      </Provider>,
+    );
+
+    expect(container).toBeTruthy();
+  });
+
+  it('renders without crashing, without value', () => {
+    const store = mockStore({
+      intl: {
+        locale: 'en',
+        messages: {},
+      },
+    });
+
+    const { container } = render(
+      <Provider store={store}>
+        <Router history={history}>
+          <TopicsWidget value={null} children={''} className={'test'} />
+        </Router>
+      </Provider>,
+    );
+
+    expect(container).toBeTruthy();
+  });
+});

package/src/constants/ActionTypes.js

@@ -0,0 +1,6 @@
+/**
+ * Action types.
+ * @module constants/ActionTypes
+ */
+
+export const SET_ISPRINT = 'SET_ISPRINT';

package/src/index.js

@@ -27,7 +27,7 @@ import contentBoxSVG from './icons/content-box.svg';
 import okMiddleware from './middleware/ok';
 import voltoCustomMiddleware from './middleware/voltoCustom';
 import installSlate from './slate';
-
+import { print } from './reducers';
 import { nanoid } from '@plone/volto-slate/utils';
 import { v4 as uuid } from 'uuid';
 
@@ -534,6 +534,12 @@ const applyConfig = (config) => {
     };
   }
 
+  // addonReducers
+  config.addonReducers = {
+    ...(config.addonReducers || {}),
+    print,
+  };
+
   // Breadcrumbs
   config.settings.apiExpanders.push({
     match: '',

package/src/index.test.js

@@ -215,6 +215,11 @@ describe('applyConfig', () => {
                 title: 'Horizontal',
                 isDefault: false,
               },
+              {
+                id: 'accordion',
+                title: 'Accordion responsive',
+                isDefault: false,
+              },
             ],
           },
           columnsBlock: {},

package/src/reducers/index.js

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

package/src/reducers/print.js

@@ -0,0 +1,21 @@
+/**
+ * Print reducer.
+ * @module reducers/print
+ */
+
+import { SET_ISPRINT } from '@eeacms/volto-eea-website-theme/constants/ActionTypes';
+
+const initialState = {
+  isPrint: false,
+};
+
+export default function print(state = initialState, action) {
+  if (action.type === SET_ISPRINT) {
+    return {
+      ...state,
+      isPrint: action.payload,
+    };
+  } else {
+    return state;
+  }
+}

package/src/actions/schema.js

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