feat(tags): add link class when tag has href -refs #263347 #23 from e…

…ea/tags-as-links
eea · May 7, 2024 · 06ebf5f · 06ebf5f
2 parents 1b1798e + 1e439eb
commit 06ebf5f
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 12 deletions.
diff --git a/Jenkinsfile b/Jenkinsfile
@@ -14,7 +14,7 @@ pipeline {
     BACKEND_PROFILES = "eea.kitkat:testing"
     BACKEND_ADDONS = ""
     VOLTO = "17"
-    VOLTO16_BREAKING_CHANGES = "no"
+    VOLTO16_BREAKING_CHANGES = "yes"
     IMAGE_NAME = BUILD_TAG.toLowerCase()
   }
 

diff --git a/cypress/e2e/01-tags-block-basics.cy.js b/cypress/e2e/01-tags-block-basics.cy.js
@@ -42,7 +42,7 @@ describe('Blocks Tests', () => {
     cy.get('.tags-title').contains('Tags Demo');
     cy.get('.tags .tags-content .tag').contains('test 1');
     cy.get('.tags .tags-content .tag').contains('test 2');
-    cy.get('.tags .tags-content a[target="_blank"].tag').contains('test 2');
+    cy.get('.tags .tags-content a[target="_blank"]').contains('test 2');
 
     cy.createContent({
       contentType: 'Document',

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-tags-block",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "@eeacms/volto-tags-block: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

diff --git a/src/Tags/Tags.jsx b/src/Tags/Tags.jsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import cx from 'classnames';
 import { Icon } from 'semantic-ui-react';
-import { UniversalLink } from '@plone/volto/components';
+import { ConditionalLink } from '@plone/volto/components';
 import { getFieldURL } from '@eeacms/volto-tags-block/helpers';
 
 function TagList({ children, position }) {
@@ -18,14 +18,16 @@ TagList.Content = ({ children }) => (
 
 TagList.Tag = ({ children, href, openLinkInNewTab, showTagIcon }) => {
   return (
-    <UniversalLink
-      className="tag"
-      href={getFieldURL(href)}
-      openLinkInNewTab={openLinkInNewTab}
-    >
-      {showTagIcon && <Icon className={`icon`} name="hashtag" />}
-      <span className="name">{children}</span>
-    </UniversalLink>
+    <div className={`tag ${href ? 'link' : ''}`}>
+      <ConditionalLink
+        condition={href}
+        to={href ? getFieldURL(href) : null}
+        openLinkInNewTab={openLinkInNewTab}
+      >
+        {showTagIcon && <Icon className={`icon`} name="hashtag" />}
+        <span className="name">{children}</span>
+      </ConditionalLink>
+    </div>
   );
 };