@eeacms/volto-clms-theme 1.0.200 → 1.0.202

package/CHANGELOG.md

@@ -4,6 +4,38 @@ 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.0.202](https://github.com/eea/volto-clms-theme/compare/1.0.201...1.0.202) - 11 May 2023
+
+#### :rocket: New Features
+
+- feat: CLMS-1556 cart datasets not doleted after downloading [Unai - [`d92704a`](https://github.com/eea/volto-clms-theme/commit/d92704ae8bb2d6346627767da894a2e0e755e2b2)]
+
+#### :hammer_and_wrench: Others
+
+- mediaquery in dashboards for big devices [Unai - [`ede6386`](https://github.com/eea/volto-clms-theme/commit/ede6386b1d30d5a0c9cd9be490df2eaba42ed4e9)]
+### [1.0.201](https://github.com/eea/volto-clms-theme/compare/1.0.200...1.0.201) - 9 May 2023
+
+#### :rocket: New Features
+
+- feat: CLMS-1882 [Unai - [`5509bc6`](https://github.com/eea/volto-clms-theme/commit/5509bc638817d5121e16bdadc6f5e084e363d9ed)]
+- feat: CLMS-2019 ? used for undefined schemas [Unai - [`3440b26`](https://github.com/eea/volto-clms-theme/commit/3440b26e9677410c531b26e10d6f2b7519dd8120)]
+
+#### :bug: Bug Fixes
+
+- fix: clms-1714 remove button when no search button is selected [Mikel Larreategi - [`c3d72e5`](https://github.com/eea/volto-clms-theme/commit/c3d72e53355546019ca1e727b39d477f16079011)]
+- fix: clms-2143 coordinates and direction were split [Mikel Larreategi - [`1c5c000`](https://github.com/eea/volto-clms-theme/commit/1c5c00003e323ef3fbf9911a415ca9143cf992ca)]
+
+#### :hammer_and_wrench: Others
+
+- snaphot update [Unai - [`1afab8d`](https://github.com/eea/volto-clms-theme/commit/1afab8d8087c613a9db53dfad7df4e20fa57e77b)]
+- register/login link working to open modal [Unai - [`a43ff7e`](https://github.com/eea/volto-clms-theme/commit/a43ff7ed10b02facc7906c7d7378e0065b50ef9c)]
+- grab cursor on handle hover [Unai - [`0e57ca8`](https://github.com/eea/volto-clms-theme/commit/0e57ca8bcad6eea5b35b90952ff9a4bd1b047cf9)]
+- code cleaning [Unai - [`2ff7638`](https://github.com/eea/volto-clms-theme/commit/2ff7638bdef58a70c1ab17339d49c80c58e7dfbe)]
+- draggable modal style fixes [Unai - [`6882fb9`](https://github.com/eea/volto-clms-theme/commit/6882fb90884b10dfd92d41713dd6d22d8c0d9177)]
+- draggable-modal fixes [Unai - [`b95ee14`](https://github.com/eea/volto-clms-theme/commit/b95ee14231490e18227b9037fea38716a194a57c)]
+- some fixes [Unai - [`e56229c`](https://github.com/eea/volto-clms-theme/commit/e56229c5c74c8a179bd43d5a48168616c82228e7)]
+- lint [Mikel Larreategi - [`e4fc5d1`](https://github.com/eea/volto-clms-theme/commit/e4fc5d170c96d0b2870d4eba164c32c26005d44a)]
+- modal closes on button click amd eslint fix [Unai - [`6a29ab6`](https://github.com/eea/volto-clms-theme/commit/6a29ab6b37f53df54b912210dd41cee42779b16e)]
 ### [1.0.200](https://github.com/eea/volto-clms-theme/compare/1.0.199...1.0.200) - 27 April 2023
 
 #### :hammer_and_wrench: Others

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-clms-theme",
-  "version": "1.0.200",
+  "version": "1.0.202",
   "description": "volto-clms-theme: Volto theme for CLMS site",
   "main": "src/index.js",
   "author": "CodeSyntax for the European Environment Agency",
@@ -55,6 +55,7 @@
     "lightgallery": "^2.4.0",
     "razzle-plugin-scss": "4.2.18",
     "react-csv": "2.2.2",
+    "react-draggable": "4.4.5",
     "react-input-range": "^1.3.0",
     "react-native-mime-types": "2.3.0",
     "react-slick": "0.28.1",

package/src/components/Blocks/CustomTemplates/VoltoSearchBlock/SearchInput.jsx

@@ -1,8 +1,6 @@
 import React from 'react';
-import { Button, Input } from 'semantic-ui-react';
+import { Input } from 'semantic-ui-react';
 import { defineMessages, useIntl } from 'react-intl';
-import { Icon } from '@plone/volto/components';
-import loupeSVG from '@plone/volto/icons/zoom.svg';
 
 const messages = defineMessages({
   search: {
@@ -50,11 +48,6 @@ const SearchInput = (props) => {
           }
         }}
       />
-      {isLive && (
-        <Button basic icon className="search-input-live-icon-button">
-          <Icon name={loupeSVG} />
-        </Button>
-      )}
     </div>
   );
 };

package/src/components/CLMSDownloadCartView/CLMSCartContent.jsx

@@ -33,7 +33,7 @@ import './cart-table.less';
 const CLMSCartContent = (props) => {
   const { localSessionCart } = props;
   const dispatch = useDispatch();
-  const { removeCartItem, removeCartItems, updateCart } = useCartState();
+  const { removeCartItem, /* removeCartItems, */ updateCart } = useCartState();
 
   // state connections
   const cart = useSelector((state) => state.cart_items.items);
@@ -110,17 +110,17 @@ const CLMSCartContent = (props) => {
 
   // eslint-disable-next-line react-hooks/exhaustive-deps
   const setCartItemInProgress = (in_progress_unique_ids) => {
-    let started_processing_items =
-      cartItems.length > 0
-        ? cartItems.filter((r) =>
-            in_progress_unique_ids.includes(r['unique_id']),
-          )
-        : [];
-    var items_to_remove =
-      started_processing_items.length > 0
-        ? started_processing_items.map((item) => item.unique_id)
-        : [];
-    removeCartItems(items_to_remove);
+    // let started_processing_items =
+    //   cartItems.length > 0
+    //     ? cartItems.filter((r) =>
+    //         in_progress_unique_ids.includes(r['unique_id']),
+    //       )
+    //     : [];
+    // var items_to_remove =
+    //   started_processing_items.length > 0
+    //     ? started_processing_items.map((item) => item.unique_id)
+    //     : [];
+    // removeCartItems(items_to_remove);
     dispatch(getDownloadtool());
   };
 
@@ -189,14 +189,15 @@ const CLMSCartContent = (props) => {
           <>
             <span>Bounding Box</span>
             <br />
-            <span>
-              {`N: ${item.area.value[0].toFixed(
-                1,
-              )}º E: ${item.area.value[1].toFixed(1)}º`}
-              <br />
-              {`S: ${item.area.value[2].toFixed(
-                1,
-              )}º W: ${item.area.value[3].toFixed(1)}º`}
+            <span class="cart-bounding-boxes">
+              <span class="cart-bounding-box-row">
+                <span>{`N: ${item.area.value[0].toFixed(1)}º `}</span>&nbsp;
+                <span>{`E: ${item.area.value[1].toFixed(1)}º `}</span>
+              </span>
+              <span class="cart-bounding-box-row">
+                <span>{`S: ${item.area.value[2].toFixed(1)}º `}</span>&nbsp;
+                <span>{`W: ${item.area.value[3].toFixed(1)}º `}</span>
+              </span>
             </span>
           </>
         );

package/src/components/CclDownloadTable/CclDownloadTable.jsx

@@ -289,28 +289,31 @@ function CclDownloadTable(props) {
                 </>
               )}
               {props.dataset.show_legend_on_prepackages && (
-                <CclModal
-                  trigger={
-                    <CclButton
-                      className="ccl-button ccl-button--default show_legend_on_prepackages"
-                      to="#download"
-                    >
-                      {intl.formatMessage(messages.prePackages_location_map)}
-                    </CclButton>
-                  }
-                  size={'medium'}
-                >
-                  <div className="image-modal">
-                    <img
-                      src={
-                        prepackage_grid_image
-                          ? prepackage_grid_image
-                          : PlaceHolder
-                      }
-                      alt={'Placeholder'}
-                    />
-                  </div>
-                </CclModal>
+                <>
+                  <CclModal
+                    draggable={true}
+                    trigger={
+                      <CclButton
+                        className="ccl-button ccl-button--default show_legend_on_prepackages"
+                        to="#download"
+                      >
+                        {intl.formatMessage(messages.prePackages_location_map)}
+                      </CclButton>
+                    }
+                    size={'medium'}
+                  >
+                    <div className="image-modal">
+                      <img
+                        src={
+                          prepackage_grid_image
+                            ? prepackage_grid_image
+                            : PlaceHolder
+                        }
+                        alt={'Placeholder'}
+                      />
+                    </div>
+                  </CclModal>
+                </>
               )}
               {cartSelection.length !== prePackagedCollection.length && (
                 <>

package/src/components/CclModal/CclModal.jsx

@@ -1,6 +1,9 @@
 import React from 'react';
-import { Modal } from 'semantic-ui-react';
+import { Segment, Modal } from 'semantic-ui-react';
 import './modal.less';
+import Draggable from 'react-draggable';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { faGripHorizontal } from '@fortawesome/free-solid-svg-icons';
 
 function CclModal(props) {
   let {
@@ -9,13 +12,10 @@ function CclModal(props) {
     size = 'fullscreen',
     modalStatus = () => {},
     onCloseExtra = () => {},
+    draggable = false,
   } = props;
   const [open, setOpen] = React.useState(false);
 
-  // React.useEffect(() => {
-  //   setOpen(openState);
-  // }, [openState]);
-
   function openModal() {
     setOpen(true);
     modalStatus(true);
@@ -27,7 +27,40 @@ function CclModal(props) {
     onCloseExtra();
   }
 
-  return (
+  return draggable ? (
+    <>
+      {open && (
+        <Draggable handle=".handle">
+          <div className="dragable-modal-dialog">
+            <div className={'modal-close modal-clms-close'}>
+              <span
+                className="ccl-icon-close"
+                aria-label="Close"
+                onClick={() => closeModal()}
+                onKeyDown={() => closeModal()}
+                tabIndex="0"
+                role="button"
+              ></span>
+            </div>
+            <Segment compact className="handle">
+              <FontAwesomeIcon icon={faGripHorizontal} size="lg" />
+            </Segment>
+
+            {children}
+          </div>
+        </Draggable>
+      )}
+      <Segment
+        basic
+        compact
+        onClick={() => {
+          !open ? openModal() : closeModal();
+        }}
+      >
+        {trigger}
+      </Segment>
+    </>
+  ) : (
     <Modal
       onClose={() => closeModal()}
       onOpen={() => openModal()}

package/src/components/CclModal/modal.less

@@ -248,6 +248,20 @@
 .modal .ccl-container {
   max-width: 100%;
 }
+
+.dragable-modal-dialog {
+  position: absolute;
+  z-index: 9999 !important;
+  width: auto;
+  max-width: 700px;
+  border: 1px solid #acbe39;
+  background-color: white;
+}
+
+.handle {
+  cursor: grab;
+}
+
 @media (min-width: 576px) {
   .modal .ccl-container {
     max-width: 540px;

package/src/components/Widgets/DownloadableFilesTableWidget.jsx

@@ -8,8 +8,8 @@ import './DownloadableFilesTableWidget.less';
 
 const DownloadableFilesTableWidget = (props) => {
   const { functions, data } = useSchema(
-    props.value.schema,
-    props.value.uiSchema,
+    props?.value?.schema,
+    props?.value?.uiSchema,
   );
   const { schema, uiSchema, ready } = data;
   const { setSchema, setUISchema, setSchemaHandler } = functions;
@@ -34,8 +34,8 @@ const DownloadableFilesTableWidget = (props) => {
     }
     props.onChange(id, {
       items: value.items,
-      ...props.schema,
-      ...props.uiSchema,
+      ...props?.schema,
+      ...props?.uiSchema,
     });
   };
 

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

@@ -1,12 +1,12 @@
 /**
  * @module components/theme/Unauthorized/Unauthorized
  */
-
 import React from 'react';
 import { FormattedMessage } from 'react-intl';
+import { useSelector } from 'react-redux';
 import { Link } from 'react-router-dom';
 import { Container } from 'semantic-ui-react';
-import { useSelector } from 'react-redux';
+
 import { withServerErrorCode } from '@plone/volto/helpers/Utils/Utils';
 import CclLoginModal from '@eeacms/volto-clms-theme/components/CclLoginModal/CclLoginModal';
 
@@ -29,7 +29,18 @@ const Unauthorized = () => {
           id="You are trying to access a protected resource, please {login} first."
           defaultMessage="You are trying to access a protected resource, please {login} first."
           values={{
-            login: <CclLoginModal classname={'green-login-link'} />,
+            login: (
+              <CclLoginModal
+                triggerComponent={() => (
+                  <Link to={'#'}>
+                    <FormattedMessage
+                      id="register-login"
+                      defaultMessage="Register / Login"
+                    />
+                  </Link>
+                )}
+              />
+            ),
           }}
         />
       </p>

package/src/customizations/volto/components/theme/Unauthorized/__snapshots__/Unauthorized.test.jsx.snap

@@ -14,16 +14,16 @@ exports[`Unauthorized renders a not found component 1`] = `
     className="description"
   >
     You are trying to access a protected resource, please 
-    <span
-      className="green-login-link"
+    <a
+      href="/"
       onBlur={[Function]}
       onClick={[Function]}
       onFocus={[Function]}
       onMouseEnter={[Function]}
       onMouseLeave={[Function]}
     >
-      Register/Login
-    </span>
+      Register / Login
+    </a>
      first.
   </p>
   <p>

package/theme/clms/css/home.css

@@ -222,7 +222,7 @@
     height: 30vw;
   }
 }
-@media (max-width: 380px) {
+@media (max-width: 420px) {
   .home-products-container {
     margin-top: 3.6rem;
   }

package/theme/clms/css/styles.less

@@ -1281,6 +1281,18 @@ div#page-document h1.documentFirstHeading {
   min-width: 7rem !important;
 }
 
+.cart-bounding-boxes {
+  display: flex;
+  flex-direction: column;
+
+  .cart-bounding-box-row {
+    display: flex;
+    flex-wrap: wrap;
+  }
+}
+
+
+
 .Toastify__toast--success {
   background-color: #fafbf3 !important;
 }

package/theme/clms/css/volto-block-style-override.css

@@ -41,7 +41,7 @@ body.is-anonymous main {
 /* detect if is logged in but in view with toolbar open */
 body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous)
   .stretch {
-  max-width: 1636px;
+  max-width: 100vw !important;
   margin: 0;
 }
 
@@ -49,6 +49,106 @@ body:not(.is-authenticated):not(.document_wide_view).stretch {
   padding: 0;
 }
 
+/* @media screen and (max-width: 1790px) {
+  body.section-stats.section-dashboards .stretch {
+    padding-left: 80px !important;
+    margin-left: -21vw !important;
+  }
+}
+ */
+
+@media screen and (max-width: 3900px) {
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous)
+    .stretch {
+    right: auto;
+    left: auto;
+    width: auto;
+    padding: 0;
+    transform: none;
+  }
+
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
+    .stretch {
+    max-width: 100vw !important;
+    margin: 0 -26.54vw !important;
+  }
+
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
+    .stretch {
+    max-width: 100vw !important;
+    margin: 0 -26.5vw !important;
+  }
+}
+
+@media screen and (max-width: 3400px) {
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous)
+    .stretch {
+    right: auto;
+    left: auto;
+    width: auto;
+    padding: 0;
+    transform: none;
+  }
+
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
+    .stretch {
+    max-width: 100vw !important;
+    margin: 0 -26.54vw !important;
+  }
+
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
+    .stretch {
+    max-width: 100vw !important;
+    margin: 0 -26.5vw !important;
+  }
+}
+
+@media screen and (max-width: 2600px) {
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous)
+    .stretch {
+    right: auto;
+    left: auto;
+    width: auto;
+    padding: 0;
+    transform: none;
+  }
+
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
+    .stretch {
+    max-width: 100vw !important;
+    margin: 0 -19.54vw !important;
+  }
+
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
+    .stretch {
+    max-width: 100vw !important;
+    margin: 0 -19.5vw !important;
+  }
+}
+
+@media screen and (max-width: 2200px) {
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous)
+    .stretch {
+    right: auto;
+    left: auto;
+    width: auto;
+    padding: 0;
+    transform: none;
+  }
+
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar-collapsed)
+    .stretch {
+    max-width: 1636px !important;
+    margin: 0 !important;
+  }
+
+  body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous):not(.has-toolbar)
+    .stretch {
+    max-width: 1636px !important;
+    margin: 0 !important;
+  }
+}
+
 @media screen and (max-width: 1790px) {
   body:not(.view-editview):not(.view-addview):not(.document_wide_view):not(.is-anonymous)
     .stretch {