feat: added text aligment option

CHANGELOG.md

@@ -4,11 +4,28 @@ 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.2.1](https://github.com/eea/volto-statistic-block/compare/1.2.0...1.2.1) - 22 May 2023
+### [1.3.0](https://github.com/eea/volto-statistic-block/compare/1.2.1...1.3.0) - 9 June 2023
+
+#### :rocket: New Features
+
+- feat: added text aligment option [Miu Razvan - [`10dc32d`](https://github.com/eea/volto-statistic-block/commit/10dc32ded0890409ec4e316222c9ff6001a25597)]
 
 #### :bug: Bug Fixes
 
-- fix: serialize nodes as it should be done [Miu Razvan - [`ebbf6f7`](https://github.com/eea/volto-statistic-block/commit/ebbf6f7e10540a409626a19d7eb6b20e286c3b07)]
+- fix: fixed text-alignment [Miu Razvan - [`a2dc67f`](https://github.com/eea/volto-statistic-block/commit/a2dc67fcb3a0aacb4851a847803179994448c6a0)]
+- fix: use computed href instead of plain href [Miu Razvan - [`6657284`](https://github.com/eea/volto-statistic-block/commit/6657284b4dc852ba39df18138c5a0cc1d9c6edc9)]
+
+#### :house: Internal changes
+
+
+#### :hammer_and_wrench: Others
+
+- test: jest should look for addons in node_modules Refs #253277 [valentinab25 - [`ebec353`](https://github.com/eea/volto-statistic-block/commit/ebec353a06dbca878d00ccafb55d05311c4023e6)]
+- test: Fix test config, coverage Refs #253277 [valentinab25 - [`4d35869`](https://github.com/eea/volto-statistic-block/commit/4d35869e6c5c6fd79f84fa8afa4742214d7efcb1)]
+- bump version [Miu Razvan - [`f707d99`](https://github.com/eea/volto-statistic-block/commit/f707d99e9ebb5fdb3e2ce3361d7d0678c5c5dc46)]
+- merge master into this branch [Miu Razvan - [`67f1eec`](https://github.com/eea/volto-statistic-block/commit/67f1eecfe5900a6585ae109bc141e37f9d4f03c7)]
+- refactor code [tedw87 - [`df7fcd4`](https://github.com/eea/volto-statistic-block/commit/df7fcd475d4b36c2e4f370f727a5468b52a1950d)]
+### [1.2.1](https://github.com/eea/volto-statistic-block/compare/1.2.0...1.2.1) - 22 May 2023
 
 #### :hammer_and_wrench: Others
 
@@ -24,30 +41,16 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
 - use countup.js@2.5.0 [Miu Razvan - [`9dad099`](https://github.com/eea/volto-statistic-block/commit/9dad099fb6519688752bf4788023712bd9719671)]
 - bump version [Miu Razvan - [`e886513`](https://github.com/eea/volto-statistic-block/commit/e886513e63bf480dcdb5c9e0a627b31c6b4e989d)]
-- Add Sonarqube tag using industry-frontend addons list [EEA Jenkins - [`7cf6d5b`](https://github.com/eea/volto-statistic-block/commit/7cf6d5b1427a9f17bb1c740d019130e323668286)]
 ### [1.1.0](https://github.com/eea/volto-statistic-block/compare/1.0.1...1.1.0) - 27 March 2023
 
 #### :hammer_and_wrench: Others
 
-- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`1ecdcec`](https://github.com/eea/volto-statistic-block/commit/1ecdcec0ef98c891d9157db9592365fc10760b59)]
-- Add Sonarqube tag using ims-frontend addons list [EEA Jenkins - [`e5f76cc`](https://github.com/eea/volto-statistic-block/commit/e5f76cc8f90dfa21ba1f2bb25b2491ae0e1b102d)]
-- Add Sonarqube tag using advisory-board-frontend addons list [EEA Jenkins - [`439ba7f`](https://github.com/eea/volto-statistic-block/commit/439ba7f0016eb5ba86ef267309e0ddef7b81f379)]
-- Add Sonarqube tag using advisory-board-frontend addons list [EEA Jenkins - [`1e72601`](https://github.com/eea/volto-statistic-block/commit/1e72601f1f9a7e8023c9130407d9ce28f1d7b6f9)]
-- Add Sonarqube tag using climate-energy-frontend addons list [EEA Jenkins - [`9ab65ad`](https://github.com/eea/volto-statistic-block/commit/9ab65ad0f5b300a14590f5f260659749f4831956)]
 - test(Jenkins): Run tests and cypress with latest canary @plone/volto [Alin Voinea - [`75e506f`](https://github.com/eea/volto-statistic-block/commit/75e506fd7cf92296871ddf52f9b1c82a053ec931)]
-- Add Sonarqube tag using cca-frontend addons list [EEA Jenkins - [`9297e9f`](https://github.com/eea/volto-statistic-block/commit/9297e9fb8a638a1564d7d7a6d2ebbea0056d775e)]
-- Add Sonarqube tag using bise-frontend addons list [EEA Jenkins - [`6dde4aa`](https://github.com/eea/volto-statistic-block/commit/6dde4aae3c87bfe434a28719479e37078db11099)]
-- yarn 3 [Alin Voinea - [`b4949e1`](https://github.com/eea/volto-statistic-block/commit/b4949e18f23a7965c76ef97a5790607a587987dc)]
-- Add Sonarqube tag using marine-frontend addons list [EEA Jenkins - [`8820afa`](https://github.com/eea/volto-statistic-block/commit/8820afa4ab8fcebd17e90522196c1fde8b246e21)]
-- Add Sonarqube tag using clms-frontend addons list [EEA Jenkins - [`8eb5b8d`](https://github.com/eea/volto-statistic-block/commit/8eb5b8de3f87152cb57faeb960233791b328c900)]
-- Add Sonarqube tag using demo-kitkat-frontend addons list [EEA Jenkins - [`58f36bd`](https://github.com/eea/volto-statistic-block/commit/58f36bd4ae9dcdccbef182789957dbf0bb97da74)]
-- Add Sonarqube tag using forests-frontend addons list [EEA Jenkins - [`3bb9a21`](https://github.com/eea/volto-statistic-block/commit/3bb9a2128a88c1196258722112a1957f60d332fc)]
 ### [1.0.1](https://github.com/eea/volto-statistic-block/compare/1.0.0...1.0.1) - 16 November 2022
 
 #### :hammer_and_wrench: Others
 
 - test(estlint): Fix .project.eslintrc.js [Alin Voinea - [`d81878f`](https://github.com/eea/volto-statistic-block/commit/d81878fff2ba1be4446dd330560c46d8161f8bc2)]
-- Add Sonarqube tag using circularity-frontend addons list [EEA Jenkins - [`a58f436`](https://github.com/eea/volto-statistic-block/commit/a58f436c5bb052fcdd13b213895c497881e48c67)]
 ## [1.0.0](https://github.com/eea/volto-statistic-block/compare/0.3.0...1.0.0) - 28 October 2022
 
 #### :nail_care: Enhancements
@@ -59,7 +62,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 #### :hammer_and_wrench: Others
 
 - Cleanup [Alin Voinea - [`6d5f4a6`](https://github.com/eea/volto-statistic-block/commit/6d5f4a6d8048689e97e567316f24902d0865de88)]
-- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`5fd7ba7`](https://github.com/eea/volto-statistic-block/commit/5fd7ba7a4595e157bdb0ebb0932f1d3afd64b369)]
 ### [0.3.0](https://github.com/eea/volto-statistic-block/compare/0.2.0...0.3.0) - 19 September 2022
 
 #### :nail_care: Enhancements
@@ -90,7 +92,6 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 #### :hammer_and_wrench: Others
 
 - Remove useless  from block title [Alin Voinea - [`a3daf0a`](https://github.com/eea/volto-statistic-block/commit/a3daf0ad63666d0cd87eef465f42f525a5a307bc)]
-- Add Sonarqube tag using eea-website-frontend addons list [EEA Jenkins - [`4a9ea35`](https://github.com/eea/volto-statistic-block/commit/4a9ea35d0717941e9d96a29e46dc85717140fccf)]
 ### [0.1.1](https://github.com/eea/volto-statistic-block/compare/0.1.0...0.1.1) - 10 March 2022
 
 #### :hammer_and_wrench: Others
@@ -101,5 +102,4 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
 #### :hammer_and_wrench: Others
 
-- yarn bootstrap [Alin Voinea - [`ba85706`](https://github.com/eea/volto-statistic-block/commit/ba857067b16dc04f9bc970b0c0d4afd479bb7528)]
 - Initial commit [Alin Voinea - [`2e19fe2`](https://github.com/eea/volto-statistic-block/commit/2e19fe2708f89887d2d79f88696e197643ea10f4)]

Jenkinsfile

@@ -4,7 +4,7 @@ pipeline {
   environment {
         GIT_NAME = "volto-statistic-block"
         NAMESPACE = "@eeacms"
-        SONARQUBE_TAGS = "volto.eea.europa.eu,demo-www.eea.europa.eu,circularity.eea.europa.eu,forest.eea.europa.eu,clmsdemo.devel6cph.eea.europa.eu,water.europa.eu-marine,biodiversity.europa.eu,climate-adapt.eea.europa.eu,climate-energy.eea.europa.eu,climate-advisory-board.devel4cph.eea.europa.eu,climate-advisory-board.europa.eu,www.eea.europa.eu-ims,www.eea.europa.eu-en,industry.eea.europa.eu"
+        SONARQUBE_TAGS = "volto.eea.europa.eu,demo-www.eea.europa.eu,forest.eea.europa.eu,clmsdemo.devel6cph.eea.europa.eu,water.europa.eu-marine,biodiversity.europa.eu,climate-adapt.eea.europa.eu,climate-energy.eea.europa.eu,climate-advisory-board.devel4cph.eea.europa.eu,climate-advisory-board.europa.eu,www.eea.europa.eu-ims,www.eea.europa.eu-en,industry.eea.europa.eu"
         DEPENDENCIES = ""
         VOLTO = ""
     }
@@ -188,6 +188,7 @@ pipeline {
             def nodeJS = tool 'NodeJS';
             withSonarQubeEnv('Sonarqube') {
               sh '''sed -i "s#/opt/frontend/my-volto-project/src/addons/${GIT_NAME}/##g" xunit-reports/coverage/lcov.info'''
+              sh '''sed -i "s#src/addons/${GIT_NAME}/##g" xunit-reports/coverage/lcov.info'''
               sh "export PATH=${scannerHome}/bin:${nodeJS}/bin:$PATH; sonar-scanner -Dsonar.javascript.lcov.reportPaths=./xunit-reports/coverage/lcov.info,./cypress-coverage/coverage/lcov.info -Dsonar.sources=./src -Dsonar.projectKey=$GIT_NAME-$BRANCH_NAME -Dsonar.projectVersion=$BRANCH_NAME-$BUILD_NUMBER"
               sh '''try=2; while [ \$try -gt 0 ]; do curl -s -XPOST -u "${SONAR_AUTH_TOKEN}:" "${SONAR_HOST_URL}api/project_tags/set?project=${GIT_NAME}-${BRANCH_NAME}&tags=${SONARQUBE_TAGS},${BRANCH_NAME}" > set_tags_result; if [ \$(grep -ic error set_tags_result ) -eq 0 ]; then try=0; else cat set_tags_result; echo "... Will retry"; sleep 60; try=\$(( \$try - 1 )); fi; done'''
             }

jest-addon.config.js

@@ -5,19 +5,19 @@ module.exports = {
     '!src/**/*.d.ts',
   ],
   moduleNameMapper: {
+    '\\.(css|less|scss|sass)$': 'identity-obj-proxy',
     '@plone/volto/cypress': '<rootDir>/node_modules/@plone/volto/cypress',
     '@plone/volto/babel': '<rootDir>/node_modules/@plone/volto/babel',
     '@plone/volto/(.*)$': '<rootDir>/node_modules/@plone/volto/src/$1',
     '@package/(.*)$': '<rootDir>/src/$1',
     '@root/(.*)$': '<rootDir>/src/$1',
     '@plone/volto-quanta/(.*)$': '<rootDir>/src/addons/volto-quanta/src/$1',
-    '@eeacms/(.*?)/(.*)$': '<rootDir>/src/addons/$1/src/$2',
+    '@eeacms/(.*?)/(.*)$': '<rootDir>/node_modules/@eeacms/$1/src/$2',
     '@plone/volto-slate':
       '<rootDir>/node_modules/@plone/volto/packages/volto-slate/src',
     '~/(.*)$': '<rootDir>/src/$1',
     'load-volto-addons':
       '<rootDir>/node_modules/@plone/volto/jest-addons-loader.js',
-    '\\.(css|less|scss|sass)$': 'identity-obj-proxy',
   },
   transform: {
     '^.+\\.js(x)?$': 'babel-jest',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-statistic-block",
-  "version": "1.2.1",
+  "version": "1.3.0",
   "description": "@eeacms/volto-statistic-block: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

src/StatisticBlock/View.jsx

@@ -11,6 +11,7 @@ import {
   serializeNodesToText,
 } from '@plone/volto-slate/editor/render';
 import {
+  getFieldURL,
   serializeToNodes,
   serializeNodes,
 } from '@eeacms/volto-statistic-block/helpers';
@@ -47,6 +48,7 @@ const View = ({ data, mode }) => {
     animation = {},
   } = data;
   const {
+    textAlign = 'center',
     backgroundInverted = 'primary',
     valueVariation = 'secondary',
     labelVariation = 'tertiary',
@@ -69,21 +71,22 @@ const View = ({ data, mode }) => {
         valuevariation={valueVariation}
         labelvariation={labelVariation}
         extravariation={extraVariation}
-        className={styles.align === 'full' ? 'ui container' : ''}
+        className={cx(textAlign, { 'ui container': styles.align === 'full' })}
       >
         {items.map((item, index) => {
-          const StatisticWrapper = item.href ? UniversalLink : Statistic;
+          const href = getFieldURL(item.href);
+          const StatisticWrapper = href ? UniversalLink : Statistic;
           const valueNodes = serializeToNodes(item.value);
           const valueNo = Number(serializeNodesToText(valueNodes));
 
           return (
             <StatisticWrapper
               key={`${index}-${item.label}`}
-              {...(item.href
-                ? { className: 'ui statistic', href: item.href }
-                : {})}
+              {...(href ? { className: 'ui statistic', href } : {})}
             >
-              <Statistic.Value className={cx('slate', valueVariation)}>
+              <Statistic.Value
+                className={cx('slate', `text-${textAlign}`, valueVariation)}
+              >
                 {animation.enabled && isNumber(valueNo) && !isNaN(valueNo) ? (
                   <CountUp
                     end={valueNo}
@@ -98,10 +101,12 @@ const View = ({ data, mode }) => {
                   _serializeNodes(valueNodes)
                 )}
               </Statistic.Value>
-              <Statistic.Label className={cx('slate', labelVariation)}>
+              <Statistic.Label
+                className={cx('slate', `text-${textAlign}`, labelVariation)}
+              >
                 {serializeNodes(item.label)}
               </Statistic.Label>
-              <div className={cx('slate text-center', extraVariation)}>
+              <div className={cx('slate', `text-${textAlign}`, extraVariation)}>
                 {serializeNodes(item.info)}
               </div>
             </StatisticWrapper>

src/StatisticBlock/styles.less

@@ -1,8 +1,28 @@
-.ui.statistic {
-  .slate {
-    p {
-      margin-bottom: 0;
-      color: inherit;
+.ui.statistics {
+  .ui.statistic {
+    .slate {
+      p {
+        margin-bottom: 0;
+        color: inherit;
+      }
+    }
+  }
+
+  &.left {
+    .ui.statistic {
+      align-items: flex-start;
+    }
+  }
+
+  &.center {
+    .ui.statistic {
+      align-items: center;
+    }
+  }
+
+  &.right {
+    .ui.statistic {
+      align-items: flex-end;
     }
   }
 }

src/StatisticBlock/stylesSchema.js

@@ -6,6 +6,7 @@ export default () => {
         title: 'Default',
         fields: [
           'align',
+          'textAlign',
           'backgroundInverted',
           'valueVariation',
           'labelVariation',
@@ -20,6 +21,11 @@ export default () => {
         title: 'Align',
         actions: ['center', 'wide', 'full'],
       },
+      textAlign: {
+        title: 'Text align',
+        widget: 'style_text_align',
+        default: 'center',
+      },
       backgroundInverted: {
         title: 'Background when inverted',
         choices: [

src/helpers.js

@@ -1,7 +1,9 @@
+import { Node } from 'slate';
 import isArray from 'lodash/isArray';
+import isObject from 'lodash/isObject';
 import isString from 'lodash/isString';
-import { Node } from 'slate';
 import config from '@plone/volto/registry';
+import { isInternalURL, flattenToAppURL } from '@plone/volto/helpers';
 import { serializeNodes as _serializeNodes } from '@plone/volto-slate/editor/render';
 
 function isValidNodesArray(value) {
@@ -25,3 +27,18 @@ export function serializeNodes(value) {
   const nodes = serializeToNodes(value);
   return _serializeNodes(nodes);
 }
+
+export const getFieldURL = (data) => {
+  let url = data;
+  const _isObject = data && isObject(data) && !isArray(data);
+  if (_isObject && data['@type'] === 'URL') {
+    url = data['value'] ?? data['url'] ?? data['href'] ?? data;
+  } else if (_isObject) {
+    url = data['@id'] ?? data['url'] ?? data['href'] ?? data;
+  }
+  if (isArray(data)) {
+    url = data.map((item) => getFieldURL(item));
+  }
+  if (isString(url) && isInternalURL(url)) return flattenToAppURL(url);
+  return url;
+};