Merge pull request #2 from eea/develop

fix(call-to-action): Icon right for link theme

CHANGELOG.md

@@ -4,8 +4,15 @@ 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).
 
+#### [0.2.1](https://github.com/eea/volto-call-to-action-block/compare/0.2.0...0.2.1)
+
+- fix(call-to-action): Icon right for link theme [`b69ca24`](https://github.com/eea/volto-call-to-action-block/commit/b69ca24ba8b0ce75b8da4df5cc5e2adf5ec7d0f6)
+
 #### [0.2.0](https://github.com/eea/volto-call-to-action-block/compare/0.1.0...0.2.0)
 
+> 31 May 2022
+
+- Release [`#1`](https://github.com/eea/volto-call-to-action-block/pull/1)
 - Release 0.2.0 [`ae6c18d`](https://github.com/eea/volto-call-to-action-block/commit/ae6c18d84f502829f254ac62d0792040a9854418)
 - Add cypress basic tests [`fd5b04b`](https://github.com/eea/volto-call-to-action-block/commit/fd5b04b43cfcd01e6ddd32b7c16e5db4a8cadb22)
 - Cleanup: style defaults [`f682eca`](https://github.com/eea/volto-call-to-action-block/commit/f682eca484fe3aab0ab7ab774115df6548290f41)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-call-to-action-block",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "@eeacms/volto-call-to-action-block: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

src/components/View.jsx

@@ -4,6 +4,19 @@ import cx from 'classnames';
 import { Link } from 'react-router-dom';
 import { flattenToAppURL, isInternalURL } from '@plone/volto/helpers';
 
+const Content = ({ data }) =>
+  data.styles?.rightIcon ? (
+    <>
+      {data.text}
+      {data.styles?.icon ? <Icon className={data.styles?.icon} /> : ''}
+    </>
+  ) : (
+    <>
+      {data.styles?.icon ? <Icon className={data.styles?.icon} /> : ''}
+      {data.text}
+    </>
+  );
+
 const View = ({ data, isEditMode }) => {
   const [hasLink, setHasLink] = React.useState(false);
 
@@ -23,7 +36,6 @@ const View = ({ data, isEditMode }) => {
   }, [isEditMode, data.href]);
 
   const As = hasLink && isInternalURL(data.href[0]['@id']) ? Link : 'a';
-
   return (
     <div className={cx('block call-to-action align', data.styles?.align)}>
       <As
@@ -42,8 +54,7 @@ const View = ({ data, isEditMode }) => {
         title={hasLink ? data.href[0]['title'] : ''}
         target={data.target}
       >
-        {data.styles?.icon && <Icon className={data.styles?.icon} />}
-        {data.text}
+        <Content data={data} />
       </As>
     </div>
   );