@eeacms/volto-clms-theme 1.0.48 → 1.0.52

package/CHANGELOG.md

@@ -4,8 +4,71 @@ 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.52](https://github.com/eea/volto-clms-theme/compare/1.0.51...1.0.52)
+
+- Download cart [`#163`](https://github.com/eea/volto-clms-theme/pull/163)
+- fixes [`c783f5d`](https://github.com/eea/volto-clms-theme/commit/c783f5de953c79dfe4934ce2dc0fdf472d951753)
+- use dataset information from direct attribute [`b56e96b`](https://github.com/eea/volto-clms-theme/commit/b56e96b2d3c58bfb23994f4c8ef53f85eba7fdf1)
+- debug lint [`74e8e2c`](https://github.com/eea/volto-clms-theme/commit/74e8e2c9857031e636b54826ee9f1c6d384100ab)
+- code refractoring [`79979ed`](https://github.com/eea/volto-clms-theme/commit/79979ed79049e9b600f3b377ae746af6a77903a4)
+- downloadtool post body_extras [`fc15d56`](https://github.com/eea/volto-clms-theme/commit/fc15d56040e5711cde05417f8e7a54c331b93ff1)
+- the format selector always draws according to the api @format_conversion_table [`03e1bd9`](https://github.com/eea/volto-clms-theme/commit/03e1bd9ef7ff276e7006e0d09dea300d38530e99)
+- format and projection selector only available for mapviewer sources [`b86dca7`](https://github.com/eea/volto-clms-theme/commit/b86dca7229d4ce957488166fe800d9ffdaa105f7)
+- view the source in the cart (Pre-packaged or Map viewer) [`cb65dc7`](https://github.com/eea/volto-clms-theme/commit/cb65dc7664d68926e8ae0a481969c82105a6f402)
+- if the cart is empty, dont show the table [`c482e18`](https://github.com/eea/volto-clms-theme/commit/c482e1855eebd57866761759019b79bdc7c182a7)
+- cart items from mapviewer [`d7da742`](https://github.com/eea/volto-clms-theme/commit/d7da74202701703b0c0e2053a42e4dff1d0745f2)
+- fix going back error [`9a24291`](https://github.com/eea/volto-clms-theme/commit/9a24291dcf5bbff3a33ad68b1b06726fda855aa0)
+- added to cart message style [`6a2efdb`](https://github.com/eea/volto-clms-theme/commit/6a2efdb9a0b44f15c3b9e1963dd1434d5f7f7c5c)
+
+#### [1.0.51](https://github.com/eea/volto-clms-theme/compare/1.0.50...1.0.51)
+
+> 20 December 2021
+
+- Cart Download tool [`#162`](https://github.com/eea/volto-clms-theme/pull/162)
+- Download cart [`#160`](https://github.com/eea/volto-clms-theme/pull/160)
+- download cart projections [`#161`](https://github.com/eea/volto-clms-theme/pull/161)
+- Download cart format [`#159`](https://github.com/eea/volto-clms-theme/pull/159)
+- update selected projection option [`6107574`](https://github.com/eea/volto-clms-theme/commit/6107574aa8990b9e431bae8b57069d33b66e9f49)
+- control if downloadtool tasks have been canceled [`0719593`](https://github.com/eea/volto-clms-theme/commit/0719593d211e0b6ef8b156a84fbd512fc09737b8)
+- loading icon and cclbutton isButton option [`807d376`](https://github.com/eea/volto-clms-theme/commit/807d3768beb17cb61a018c21ae490911fe389d95)
+- adapted downloadtool post request [`fc2a2b3`](https://github.com/eea/volto-clms-theme/commit/fc2a2b3ccbee922cd30f5dd62c4583be621391cc)
+- merge develop into download-cart branch [`758ced7`](https://github.com/eea/volto-clms-theme/commit/758ced7ae94351ab9b25b6b6b98ca07821a233ca)
+- add selector to downloadable files editor [`9f05582`](https://github.com/eea/volto-clms-theme/commit/9f05582ed60e9136cc451543a906afa32fef89aa)
+- add action.error on FAIL [`dcf64ac`](https://github.com/eea/volto-clms-theme/commit/dcf64ac1a5cb25092fac1d9aae992c8e783dc85b)
+- basic format selector [`07202c4`](https://github.com/eea/volto-clms-theme/commit/07202c4f548c98df4a74b1058ed24eea88d13425)
+- header nav active border [`037be91`](https://github.com/eea/volto-clms-theme/commit/037be91b4dda6221005dd730fb9d16a862044f87)
+- new volto-clms-utils release [`fca4d27`](https://github.com/eea/volto-clms-theme/commit/fca4d2777ecbd0222fb34c543771f14e5af38fa3)
+- task in progress url changed [`9c23caa`](https://github.com/eea/volto-clms-theme/commit/9c23caa53fc3a61773307f1f3a5b7f6338ecbc69)
+- save endpoint json [`26eb803`](https://github.com/eea/volto-clms-theme/commit/26eb80316a117e7cb2375f10c7100406fbc90308)
+- start Downloading to function [`782e41e`](https://github.com/eea/volto-clms-theme/commit/782e41e71a34492cacc7dc6007d5772db8bbeba9)
+- cartContent remove element [`155bf2d`](https://github.com/eea/volto-clms-theme/commit/155bf2d6e4eb9867a7b6c7b16b01c2f7b433080a)
+- removed unique_id to session_cart [`b4d1ea7`](https://github.com/eea/volto-clms-theme/commit/b4d1ea7e0032b76ee03ad4b44a351d1028f13f42)
+- select all cart elements bug fixed [`0c703f2`](https://github.com/eea/volto-clms-theme/commit/0c703f29aec3c85cb149d89dc64344ade060eba5)
+- cart list from api request [`eeb24e8`](https://github.com/eea/volto-clms-theme/commit/eeb24e88e26d51c82ceda3840ef6f5dc78416d2f)
+- header cart counter always visible [`ac262b1`](https://github.com/eea/volto-clms-theme/commit/ac262b145adff04ca3084ec1bda2387aa03914da)
+
+#### [1.0.50](https://github.com/eea/volto-clms-theme/compare/1.0.49...1.0.50)
+
+> 17 December 2021
+
+- Develop [`#158`](https://github.com/eea/volto-clms-theme/pull/158)
+- cart icon with 0 items [`477f1ef`](https://github.com/eea/volto-clms-theme/commit/477f1efa39d6d5e4adede1b3c4f15e2b524dbcf5)
+- add routing to dataset view [`e65a730`](https://github.com/eea/volto-clms-theme/commit/e65a7304fc338b3262b7f9dad9b5c5029391f3c1)
+- add option without routing [`9675773`](https://github.com/eea/volto-clms-theme/commit/9675773a9531a98cee7f9735b09ebc6c3cfcd6fe)
+
+#### [1.0.49](https://github.com/eea/volto-clms-theme/compare/1.0.48...1.0.49)
+
+> 17 December 2021
+
+- DataSet Metadata view [`#157`](https://github.com/eea/volto-clms-theme/pull/157)
+- labels and conformity pass [`59be2fd`](https://github.com/eea/volto-clms-theme/commit/59be2fd5034fdfed211c4e0b0872504432e254e9)
+- image [`47cc7dc`](https://github.com/eea/volto-clms-theme/commit/47cc7dc37974848f2d90cdf6a035970620489cf8)
+
 #### [1.0.48](https://github.com/eea/volto-clms-theme/compare/1.0.47...1.0.48)
 
+> 16 December 2021
+
+- Develop [`#156`](https://github.com/eea/volto-clms-theme/pull/156)
 - dataset view [`38faa9d`](https://github.com/eea/volto-clms-theme/commit/38faa9d291e22c92a1c9049c7241555b2300f830)
 - tab editor [`cfbcf74`](https://github.com/eea/volto-clms-theme/commit/cfbcf742b370cc665c689a2480a09d3b640dc318)
 - remove required to description in proptypes [`9f6da1d`](https://github.com/eea/volto-clms-theme/commit/9f6da1d9c2125865c329a263d0a7b3e771baa287)

package/README.md

@@ -1,7 +1,18 @@
 # volto-clms-theme
+
 [![Releases](https://img.shields.io/github/v/release/eea/volto-clms-theme)](https://github.com/eea/volto-clms-theme/releases)
+
 [![Pipeline](https://ci.eionet.europa.eu/buildStatus/icon?job=volto-addons%2Fvolto-clms-theme%2Fmaster&subject=master)](https://ci.eionet.europa.eu/view/Github/job/volto-addons/job/volto-clms-theme/job/master/display/redirect)
+[![Lines of Code](https://sonarqube.eea.europa.eu/api/project_badges/measure?project=volto-clms-theme-master&metric=ncloc)](https://sonarqube.eea.europa.eu/dashboard?id=volto-clms-theme-master)
+[![Coverage](https://sonarqube.eea.europa.eu/api/project_badges/measure?project=volto-clms-theme-master&metric=coverage)](https://sonarqube.eea.europa.eu/dashboard?id=volto-clms-theme-master)
+[![Bugs](https://sonarqube.eea.europa.eu/api/project_badges/measure?project=volto-clms-theme-master&metric=bugs)](https://sonarqube.eea.europa.eu/dashboard?id=volto-clms-theme-master)
+[![Duplicated Lines (%)](https://sonarqube.eea.europa.eu/api/project_badges/measure?project=volto-clms-theme-master&metric=duplicated_lines_density)](https://sonarqube.eea.europa.eu/dashboard?id=volto-clms-theme-master)
+
 [![Pipeline](https://ci.eionet.europa.eu/buildStatus/icon?job=volto-addons%2Fvolto-clms-theme%2Fdevelop&subject=develop)](https://ci.eionet.europa.eu/view/Github/job/volto-addons/job/volto-clms-theme/job/develop/display/redirect)
+[![Lines of Code](https://sonarqube.eea.europa.eu/api/project_badges/measure?project=volto-clms-theme-develop&metric=ncloc)](https://sonarqube.eea.europa.eu/dashboard?id=volto-clms-theme-develop)
+[![Coverage](https://sonarqube.eea.europa.eu/api/project_badges/measure?project=volto-clms-theme-develop&metric=coverage)](https://sonarqube.eea.europa.eu/dashboard?id=volto-clms-theme-develop)
+[![Bugs](https://sonarqube.eea.europa.eu/api/project_badges/measure?project=volto-clms-theme-develop&metric=bugs)](https://sonarqube.eea.europa.eu/dashboard?id=volto-clms-theme-develop)
+[![Duplicated Lines (%)](https://sonarqube.eea.europa.eu/api/project_badges/measure?project=volto-clms-theme-develop&metric=duplicated_lines_density)](https://sonarqube.eea.europa.eu/dashboard?id=volto-clms-theme-develop)
 
 [Volto](https://github.com/plone/volto) add-on
 
@@ -46,6 +57,81 @@ Demo GIF
 
 1. Happy editing!
 
+## Release
+
+### Automatic release using Jenkins
+
+*  The automatic release is started by creating a [Pull Request](../../compare/master...develop) from `develop` to `master`. The pull request status checks correlated to the branch and PR Jenkins jobs need to be processed successfully. 1 review from a github user with rights is mandatory.
+* It runs on every commit on `master` branch, which is protected from direct commits, only allowing pull request merge commits.
+* The automatic release is done by [Jenkins](https://ci.eionet.europa.eu). The status of the release job can be seen both in the `README.md` badges and the green check/red cross/yellow circle near the last commit information. If you click on the icon, you will have the list of checks that were run. The `continuous-integration/jenkins/branch` link goes to the Jenkins job execution webpage.
+* Automated release scripts are located in the `eeacms/gitflow` docker image, specifically [js-release.sh](https://github.com/eea/eea.docker.gitflow/blob/master/src/js-release.sh) script. It  uses the `release-it` tool.
+* As long as a PR request is open from develop to master, the PR Jenkins job will automatically re-create the CHANGELOG.md and package.json files to be production-ready.
+* The version format must be MAJOR.MINOR.PATCH. By default, next release is set to next minor version (with patch 0).
+* You can manually change the version in `package.json`.  The new version must not be already present in the tags/releases of the repository, otherwise it will be automatically increased by the script. Any changes to the version will trigger a `CHANGELOG.md` re-generation.
+* Automated commits and commits with [JENKINS] or [YARN] in the commit log are excluded from `CHANGELOG.md` file.
+
+### Manual release from the develop branch ( beta release )
+
+#### Installation and configuration of release-it
+
+You need to first install the [release-it](https://github.com/release-it/release-it)  client.
+
+   ```
+   npm install -g release-it
+   ```
+
+Release-it uses the configuration written in the [`.release-it.json`](./.release-it.json) file located in the root of the repository.
+
+Release-it is a tool that automates 4 important steps in the release process:
+
+1. Version increase in `package.json` ( increased from the current version in `package.json`)
+2. `CHANGELOG.md` automatic generation from commit messages ( grouped by releases )
+3. GitHub release on the commit with the changelog and package.json modification on the develop branch
+4. NPM release ( by default it's disabled, but can be enabled in the configuration file )
+
+To configure the authentification, you need to export GITHUB_TOKEN for [GitHub](https://github.com/settings/tokens)
+
+   ```
+   export GITHUB_TOKEN=XXX-XXXXXXXXXXXXXXXXXXXXXX
+   ```
+
+ To configure npm, you can use the `npm login` command or use a configuration file with a TOKEN :
+
+   ```
+   echo "//registry.npmjs.org/:_authToken=YYYYYYYYYYYYYYYYYYYYYYYYYYYYYY" > .npmrc
+   ```
+
+#### Using release-it tool
+
+There are 3 yarn scripts that can be run to do the release
+
+##### yarn release-beta
+
+Automatically calculates and presents 3 beta versions - patch, minor and major for you to choose ( or Other for manual input).
+
+```
+? Select increment (next version):
+❯ prepatch (0.1.1-beta.0)
+  preminor (0.2.0-beta.0)
+  premajor (1.0.0-beta.0)
+  Other, please specify...
+```
+
+##### yarn release-major-beta
+
+Same as `yarn release-beta`, but with premajor version pre-selected.
+
+##### yarn release
+
+Generic command, does not automatically add the `beta` to version, but you can still manually write it if you choose Other.
+
+#### Important notes
+
+> Do not use release-it tool on master branch, the commit on CHANGELOG.md file and the version increase in the package.json file can't be done without a PULL REQUEST.
+
+> Do not keep Pull Requests from develop to master branches open when you are doing beta releases from the develop branch. As long as a PR to master is open, an automatic script will run on every commit and will update both the version and the changelog to a production-ready state - ( MAJOR.MINOR.PATCH mandatory format for version).
+
+
 ## How to contribute
 
 See [DEVELOP.md](https://github.com/eea/volto-clms-theme/blob/master/DEVELOP.md).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-clms-theme",
-  "version": "1.0.48",
+  "version": "1.0.52",
   "description": "volto-clms-theme: Volto theme for CLMS site",
   "main": "src/index.js",
   "author": "CodeSyntax for the European Environment Agency",
@@ -49,7 +49,7 @@
     "react-svg": "14.0.4",
     "@eeacms/volto-arcgis-block": "*",
     "react-native-mime-types": "2.3.0",
-    "@eeacms/volto-clms-utils": "0.1.1",
+    "@eeacms/volto-clms-utils": "0.1.2",
     "volto-form-block": "2.1.0",
     "@eeacms/volto-taxonomy": "^1.0.0"
   },
@@ -105,6 +105,8 @@
   },
   "scripts": {
     "release": "release-it",
+    "release-major-beta": "release-it major --preRelease=beta",
+    "release-beta": "release-it --preRelease=beta",
     "bootstrap": "npm install -g ejs; npm link ejs; node bootstrap",
     "stylelint": "../../../node_modules/stylelint/bin/stylelint.js --allow-empty-input 'src/**/*.{css,less}'",
     "stylelint:theme": "../../../node_modules/stylelint/bin/stylelint.js --allow-empty-input 'theme/**/*.{css,less}'",

package/src/actions/datasets_by_uid/datasets_by_uid.js

@@ -0,0 +1,20 @@
+/**
+ * Get cart selection to downloadtool.
+ * @module actions/getDatasetsByUid
+ */
+export const DATASETS_BY_UID = 'DATASETS_BY_UID';
+
+/**
+ * Get cart selection to downloadtool.
+ * @function GetDatasetsByUid
+ * @returns {Object} Get extra items action.
+ */
+export function getDatasetsByUid(uids) {
+  return {
+    type: DATASETS_BY_UID,
+    request: {
+      op: 'get',
+      path: '/@datasets_by_uid?UID=' + uids,
+    },
+  };
+}

package/src/actions/downloadtool/delete_downloadtool.js

@@ -9,13 +9,13 @@ export const DELETE_DOWNLOADTOOL = 'DELETE_DOWNLOADTOOL';
  * @function deleteDownloadtool
  * @returns {Object} Get extra items action.
  */
-export function deleteDownloadtool(user_id, task_id) {
+export function deleteDownloadtool(task_id, user_id) {
   return {
     type: DELETE_DOWNLOADTOOL,
     request: {
       op: 'del',
-      data: { UserID: user_id, TaskID: task_id },
-      path: '/@datarequest_delete',
+      data: { TaskID: task_id },
+      path: `/@datarequest_delete`,
     },
   };
 }

package/src/actions/downloadtool/get_downloadtool.js

@@ -9,12 +9,12 @@ export const GET_DOWNLOADTOOL = 'GET_DOWNLOADTOOL';
  * @function GetDownloadtool
  * @returns {Object} Get extra items action.
  */
-export function getDownloadtool(user_id) {
+export function getDownloadtool() {
   return {
     type: GET_DOWNLOADTOOL,
     request: {
       op: 'get',
-      path: `/@datarequest_search?UserID=${user_id}&Status=In_progress`,
+      path: `/@datarequest_search?status=In_progress`,
     },
   };
 }

package/src/actions/downloadtool/post_downloadtool.js

@@ -9,7 +9,8 @@ export const POST_DOWNLOADTOOL = 'POST_DOWNLOADTOOL';
  * @function PostDownloadtool
  * @returns {Object} Get extra items action.
  */
-export function postDownloadtool(item) {
+export function postDownloadtool(item, unique_ids) {
+  // console.log("unique_ids: ", unique_ids);
   return {
     type: POST_DOWNLOADTOOL,
     request: {
@@ -17,5 +18,6 @@ export function postDownloadtool(item) {
       data: item,
       path: '/@datarequest_post',
     },
+    unique_ids: unique_ids,
   };
 }

package/src/actions/format_conversion_table/get_format_conversion_table.js

@@ -0,0 +1,20 @@
+/**
+ * Get cart selection to downloadtool.
+ * @module actions/getFormatConversionTable
+ */
+export const GET_FORMATCONVERSIONTABLE = 'GET_FORMATCONVERSIONTABLE';
+
+/**
+ * Get cart selection to downloadtool.
+ * @function GetFormatConversionTable
+ * @returns {Object} Get extra items action.
+ */
+export function getFormatConversionTable() {
+  return {
+    type: GET_FORMATCONVERSIONTABLE,
+    request: {
+      op: 'get',
+      path: '/@format_conversion_table',
+    },
+  };
+}

package/src/actions/index.js

@@ -47,6 +47,18 @@ export {
   deleteDownloadtool,
 } from './downloadtool/delete_downloadtool';
 
+export {
+  GET_FORMATCONVERSIONTABLE,
+  getFormatConversionTable,
+} from './format_conversion_table/get_format_conversion_table';
+
+export {
+  DATASETS_BY_UID,
+  getDatasetsByUid,
+} from './datasets_by_uid/datasets_by_uid';
+
+export { GET_PROJECTIONS, getProjections } from './projections/get_projections';
+
 export { GET_REGISTRY, getRegistry } from './registry/registry';
 
 export {

package/src/actions/projections/get_projections.js

@@ -0,0 +1,20 @@
+/**
+ * Get cart selection to downloadtool.
+ * @module actions/getProjections
+ */
+export const GET_PROJECTIONS = 'GET_PROJECTIONS';
+
+/**
+ * Get cart selection to downloadtool.
+ * @function GetProjections
+ * @returns {Object} Get extra items action.
+ */
+export function getProjections() {
+  return {
+    type: GET_PROJECTIONS,
+    request: {
+      op: 'get',
+      path: '/@projections',
+    },
+  };
+}

package/src/components/Blocks/CclTextLinkCarouselBlock/CclTextLinkCarouselView.jsx

@@ -23,10 +23,10 @@ const TextLinkCarouselView = (props) => {
 
   return (
     <>
-      <div class="ccl-container">
+      <div className="ccl-container">
         <Slider {...settings} ref={slider} className="text-carousel">
-          {data?.textLink?.items.map((item, index) => (
-            <div className="text-link-carousel-block" key={index}>
+          {data?.textLink?.items.map((key, item) => (
+            <div className="text-link-carousel-block" key={key}>
               <div className="text-link-carousel-block-content">
                 <a href={'' + item?.link?.[0]?.['@id']}>{item.text}</a>
               </div>

package/src/components/Blocks/CustomTemplates/VoltoTabsBlock/CclCarouselView.jsx

@@ -1,15 +1,16 @@
-import React from 'react';
-import { connect } from 'react-redux';
-import { compose } from 'redux';
-import { withRouter } from 'react-router';
-import loadable from '@loadable/component';
-import { RenderBlocks } from '@plone/volto/components';
-import { withScrollToTarget } from '@eeacms/volto-tabs-block/hocs';
 import './custom.less';
-import cx from 'classnames';
 import 'slick-carousel/slick/slick.css';
 import 'slick-carousel/slick/slick-theme.css';
 import '@eeacms/volto-tabs-block/less/carousel.less';
+
+import React from 'react';
+import { RenderBlocks } from '@plone/volto/components';
+import { compose } from 'redux';
+import { connect } from 'react-redux';
+import cx from 'classnames';
+import loadable from '@loadable/component';
+import { withRouter } from 'react-router';
+import { withScrollToTarget } from '@eeacms/volto-tabs-block/hocs';
 const Slider = loadable(() => import('react-slick'));
 
 const View = (props) => {
@@ -32,7 +33,7 @@ const View = (props) => {
     speed: 2000,
     fade: true,
     cssEase: 'linear',
-    autoplay: false,
+    autoplay: true,
     autoplaySpeed: 5000,
     beforeChange: (oldIndex, index) => {
       setActiveTab(tabsList[index]);

package/src/components/CLMSDatasetDetailView/CLMSDatasetDetailView.jsx

@@ -190,7 +190,7 @@ const CLMSDatasetDetailView = ({ content, token }) => {
             })}
           </Segment.Group>
         )}
-      <CclTabs>
+      <CclTabs routing={true}>
         <div tabTitle="General Info">{DataSetInfoContent(content)}</div>
         <div tabTitle="Metadata">{MetadataContent(content)}</div>
 

package/src/components/CLMSDatasetDetailView/MetadataContent.jsx

@@ -64,16 +64,34 @@ const MetadataContent = (data) => {
           <CclInfoDescription
             title="Keywords"
             tooltip=""
-            description={data?.keywords.map((keyword) => {
-              return <Label color="olive">{keyword}</Label>;
-            })}
+            description={
+              <Label.Group>
+                {data?.keywords.map((keyword, key) => {
+                  return (
+                    <Label key={key} color="olive">
+                      {keyword}
+                    </Label>
+                  );
+                })}
+              </Label.Group>
+            }
           />
         )}
-        {data?.geographicCoverage && (
+        {data?.geographicCoverage?.geolocation && (
           <CclInfoDescription
             title="Geographic coverage"
             tooltip=""
-            description={JSON.stringify(data?.geographicCoverage)}
+            description={
+              <Label.Group>
+                {data?.geographicCoverage?.geolocation.map((location, key) => {
+                  return (
+                    <Label key={key} color="olive">
+                      {location.label}
+                    </Label>
+                  );
+                })}
+              </Label.Group>
+            }
           />
         )}
         {data?.accessAndUseLimitationPublic_line && (
@@ -100,10 +118,16 @@ const MetadataContent = (data) => {
             title="Topic of Category"
             tooltip=""
             description={
-              data?.classificationTopicCategory &&
-              data?.classificationTopicCategory.map((topic) => {
-                return <Label color="olive">{topic.title}</Label>;
-              })
+              <Label.Group>
+                {data?.classificationTopicCategory &&
+                  data?.classificationTopicCategory.map((topic, key) => {
+                    return (
+                      <Label key={key} color="olive">
+                        {topic.title}
+                      </Label>
+                    );
+                  })}
+              </Label.Group>
             }
           />
         )}
@@ -121,10 +145,16 @@ const MetadataContent = (data) => {
             title="Temporal Extent"
             tooltip=""
             description={
-              data?.temporalCoverage &&
-              data?.temporalCoverage.map((year) => {
-                return <Label color="olive">{year}</Label>;
-              })
+              <Label.Group>
+                {data?.temporalCoverage &&
+                  data?.temporalCoverage.map((year, key) => {
+                    return (
+                      <Label key={key} color="olive">
+                        {year}
+                      </Label>
+                    );
+                  })}
+              </Label.Group>
             }
           />
         )}
@@ -162,10 +192,18 @@ const MetadataContent = (data) => {
               title="Coordinate Reference System"
               tooltip="CRS of the resource"
               description={
-                data?.coordinateReferenceSystemList &&
-                data?.coordinateReferenceSystemList.map((reference) => {
-                  return <Label color="olive">{reference}</Label>;
-                })
+                <Label.Group>
+                  {data?.coordinateReferenceSystemList &&
+                    data?.coordinateReferenceSystemList.map(
+                      (reference, key) => {
+                        return (
+                          <Label key={key} color="olive">
+                            {reference}
+                          </Label>
+                        );
+                      },
+                    )}
+                </Label.Group>
               }
             />
           </CclInfoContainer>
@@ -179,11 +217,11 @@ const MetadataContent = (data) => {
             <StringToHTML string={data?.conformitySpecification?.data} />
           }
         />
-        {data?.conformityPass && (
+        {data?.conformityPass?.title && (
           <CclInfoDescription
             title="Pass"
             tooltip=""
-            description={data?.conformityPass}
+            description={data?.conformityPass?.title}
           />
         )}
         <CclInfoDescription