@eeacms/volto-clms-theme 1.1.34 → 1.1.36

package/CHANGELOG.md

@@ -4,6 +4,17 @@ 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.36](https://github.com/eea/volto-clms-theme/compare/1.1.35...1.1.36) - 30 August 2023
+
+#### :hammer_and_wrench: Others
+
+- extract the extra data to a specific component [Mikel Larreategi - [`8055764`](https://github.com/eea/volto-clms-theme/commit/8055764a7331c25a9bd9e30a512aae2edc80dc72)]
+- new button class [Mikel Larreategi - [`4c3d256`](https://github.com/eea/volto-clms-theme/commit/4c3d256ab59b04f23becd4a17ad2688bc4413a8e)]
+### [1.1.35](https://github.com/eea/volto-clms-theme/compare/1.1.34...1.1.35) - 28 August 2023
+
+#### :hammer_and_wrench: Others
+
+- CLMS-2110 (Feat): Bookmark Dependencies [Urkorue - [`d613864`](https://github.com/eea/volto-clms-theme/commit/d6138641365461996e720bc6510578c7e607f20a)]
 ### [1.1.34](https://github.com/eea/volto-clms-theme/compare/1.1.33...1.1.34) - 24 August 2023
 
 #### :hammer_and_wrench: Others

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-clms-theme",
-  "version": "1.1.34",
+  "version": "1.1.36",
   "description": "volto-clms-theme: Volto theme for CLMS site",
   "main": "src/index.js",
   "author": "CodeSyntax for the European Environment Agency",
@@ -37,7 +37,7 @@
   "dependencies": {
     "@eeacms/volto-accordion-block": "7.0.0",
     "@eeacms/volto-arcgis-block": "*",
-    "@eeacms/volto-clms-utils": "0.1.10",
+    "@eeacms/volto-clms-utils": "0.1.12",
     "@eeacms/volto-columns-block": "6.0.2",
     "@eeacms/volto-embed": "5.0.1",
     "@eeacms/volto-metadata-block": "5.0.1",

package/src/components/CclButton/CclButton.jsx

@@ -18,6 +18,7 @@ function CclButton(props) {
   let buttonClass = classNames('ccl-button', {
     'ccl-button-green': mode === 'filled',
     'ccl-button--default': mode === 'default',
+    'ccl-button-small': mode === 'small',
   });
 
   const flattern_url = flattenToAppURL(url);

package/src/components/CclCard/CclCard.jsx

@@ -15,6 +15,7 @@ import { portal_types_labels } from '../Blocks/CustomTemplates/VoltoSearchBlock'
 import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import CclLoginModal from '@eeacms/volto-clms-theme/components/CclLoginModal/CclLoginModal';
+import CclButton from '@eeacms/volto-clms-theme/components/CclButton/CclButton';
 
 const CardImage = ({ card, size = 'preview', isCustomCard }) => {
   return card?.image_field ? (
@@ -102,6 +103,76 @@ const DocCard = ({ card, url, showEditor, children }) => {
     </>
   );
 };
+
+const SearchResultExtras = (props) => {
+  const { content } = props;
+  const locale = useSelector((state) => state.intl.locale);
+  const isLoggedIn = useSelector((state) => state.userSession?.token);
+  const isAuxiliary = content?.mapviewer_viewservice
+    ? content?.mapviewer_viewservice
+        .toLowerCase()
+        .startsWith(
+          'https://trial.discomap.eea.europa.eu/arcgis/services/clms/worldcountries/mapserver/wmsserver',
+        )
+    : false;
+
+  return (
+    <div className="card-doc-extrametadata">
+      {content?.['@type'] === 'DataSet' && (
+        <>
+          <br />
+          <CclButton mode="small" url={content['@id']}>
+            <FormattedMessage id="View more" defaultMessage="View more" />
+          </CclButton>
+          &nbsp; &nbsp; &nbsp;
+        </>
+      )}
+
+      {content?.downloadable_dataset &&
+        content?.['@type'] === 'DataSet' &&
+        isLoggedIn && (
+          <>
+            <CclButton mode="small" url={`${content['@id']}#download`}>
+              <FormattedMessage id="Download" defaultMessage="Download" />
+            </CclButton>
+            &nbsp; &nbsp; &nbsp;
+          </>
+        )}
+
+      {content?.downloadable_dataset &&
+        content?.['@type'] === 'DataSet' &&
+        !isLoggedIn && (
+          <>
+            <CclLoginModal
+              otherPath={`${content['@id']}#download`}
+              triggerComponent={() => (
+                // eslint-disable-next-line jsx-a11y/anchor-is-valid
+                <CclButton mode="small">
+                  <FormattedMessage id="Download" defaultMessage="Download" />
+                </CclButton>
+              )}
+            />
+            &nbsp; &nbsp; &nbsp;
+          </>
+        )}
+
+      {content?.mapviewer_viewservice?.length > 0 &&
+        !isAuxiliary &&
+        content?.['@type'] === 'DataSet' && (
+          <CclButton
+            mode="small"
+            url={'/' + locale + '/map-viewer?dataset=' + content.UID}
+          >
+            <FormattedMessage
+              id="View in the data viewer"
+              defaultMessage="View in the data viewer"
+            />
+          </CclButton>
+        )}
+    </div>
+  );
+};
+
 function CclCard(props) {
   const {
     type,
@@ -148,9 +219,6 @@ function CclCard(props) {
       ? 'line card-line-no-description'
       : type || 'line');
 
-  const locale = useSelector((state) => state.intl.locale);
-  const isLoggedIn = useSelector((state) => state.userSession?.token);
-
   return (
     <CardLink
       url={url}
@@ -237,6 +305,8 @@ function CclCard(props) {
                 </Label>
                 <DocCard card={card} url={url} showEditor={showEditor}>
                   {children}
+
+                  <SearchResultExtras content={card} />
                 </DocCard>
               </>
             )}
@@ -342,59 +412,7 @@ function CclCard(props) {
               )}
               {children}
 
-              <div className="card-doc-extrametadata">
-                {card?.['@type'] === 'DataSet' && (
-                  <>
-                    <br />
-                    <Link to={'/' + locale + '/map-viewer?dataset=' + card.UID}>
-                      <FormattedMessage
-                        id="View in the data viewer"
-                        defaultMessage="View in the data viewer"
-                      />
-                    </Link>
-                    &nbsp; &nbsp; &nbsp;
-                  </>
-                )}
-
-                {card?.['@type'] === 'DataSet' && isLoggedIn && (
-                  <>
-                    <Link to={`${card['@id']}#download`}>
-                      <FormattedMessage
-                        id="Download"
-                        defaultMessage="Download"
-                      />
-                    </Link>
-                    &nbsp; &nbsp; &nbsp;
-                  </>
-                )}
-
-                {card?.['@type'] === 'DataSet' && !isLoggedIn && (
-                  <>
-                    <CclLoginModal
-                      otherPath={`${card['@id']}#download`}
-                      triggerComponent={() => (
-                        // eslint-disable-next-line jsx-a11y/anchor-is-valid
-                        <Link>
-                          <FormattedMessage
-                            id="Download"
-                            defaultMessage="Download"
-                          />
-                        </Link>
-                      )}
-                    />
-                    &nbsp; &nbsp; &nbsp;
-                  </>
-                )}
-
-                {card?.['@type'] === 'DataSet' && (
-                  <Link to={card['@id']}>
-                    <FormattedMessage
-                      id="View more"
-                      defaultMessage="View more"
-                    />
-                  </Link>
-                )}
-              </div>
+              <SearchResultExtras content={card} />
             </div>
           </>
         )}

package/theme/site/extras/forms.less

@@ -31,6 +31,17 @@
   color: @clmsGreen;
 }
 
+.ccl-button.ccl-button-small {
+  border: solid 1px fade(@clmsGreen, 20%);
+  padding: 0.3rem 1rem;
+  font-size: 0.85rem;
+}
+
+.ccl-button.ccl-button-small:hover {
+  background-color: @clmsGreen;
+  color: white;
+}
+
 .ccl-button[disabled] {
   border-color: @clmsGreen;
   color: @clmsGreen;