@eeacms/volto-tableau 5.0.2 → 6.0.1

package/CHANGELOG.md

@@ -4,7 +4,31 @@ 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).
 
-### [5.0.2](https://github.com/eea/volto-tableau/compare/5.0.1...5.0.2) - 23 October 2023
+### [6.0.1](https://github.com/eea/volto-tableau/compare/6.0.0...6.0.1) - 10 November 2023
+
+#### :house: Internal changes
+
+- chore: [JENKINS] Refactor automated testing [valentinab25 - [`903b90a`](https://github.com/eea/volto-tableau/commit/903b90a2df0abc183aa68d99a89bb688de3a0c73)]
+
+#### :hammer_and_wrench: Others
+
+- tests: add missing imports [kreafox - [`68289f0`](https://github.com/eea/volto-tableau/commit/68289f0a0d95388751487635cfefbf992cd2f3ee)]
+- tests: add missing imports [kreafox - [`fc5adc2`](https://github.com/eea/volto-tableau/commit/fc5adc2ab4d6fa56ac2b83d88a3a812dde427188)]
+- tests: update volto version in Jenkinsfile [kreafox - [`3271a6c`](https://github.com/eea/volto-tableau/commit/3271a6c611d19511d5db67be9e29104c03b3f027)]
+- tests: increase coverage [kreafox - [`ecb9262`](https://github.com/eea/volto-tableau/commit/ecb92625a44365faf4c39f0ff3f02ccc4ca21656)]
+- Fix tableau height [kreafox - [`6194c24`](https://github.com/eea/volto-tableau/commit/6194c2405e2bd93aba9865caed76292cd55193d3)]
+- Show share & download button on widget view [kreafox - [`a66e253`](https://github.com/eea/volto-tableau/commit/a66e2537d08dc7129e249c28e1daa27246c88815)]
+- test: [JENKINS] Add cpu limit on cypress docker [valentinab25 - [`9d2189d`](https://github.com/eea/volto-tableau/commit/9d2189d4edb13dd449d75cd6dd9052bbed67304d)]
+- test: [JENKINS] Increase shm-size to cypress docker [valentinab25 - [`f2fa3f9`](https://github.com/eea/volto-tableau/commit/f2fa3f9ccabab918586179ac16ead44e2eba8498)]
+- test: [JENKINS] Improve cypress time [valentinab25 - [`5748183`](https://github.com/eea/volto-tableau/commit/5748183c27dae18a4ebbc067d659cbc24cad8f71)]
+- use toolbar from volto-embed [Miu Razvan - [`1a232a1`](https://github.com/eea/volto-tableau/commit/1a232a15f2bbe05da75307800590d0a0a1c4996b)]
+## [6.0.0](https://github.com/eea/volto-tableau/compare/5.0.2...6.0.0) - 30 October 2023
+
+#### :house: Documentation changes
+
+- docs: add demo gif [ana-oprea - [`a9ccb11`](https://github.com/eea/volto-tableau/commit/a9ccb1194ba6bcac99649b586113fe4f7c26a7eb)]
+
+### [5.0.2](https://github.com/eea/volto-tableau/compare/5.0.1...5.0.2) - 24 October 2023
 
 #### :rocket: New Features
 

package/Dockerfile

@@ -1,6 +1,6 @@
 # syntax=docker/dockerfile:1
 ARG VOLTO_VERSION
-FROM plone/frontend-builder:${VOLTO_VERSION}
+FROM eeacms/frontend-builder:${VOLTO_VERSION}
 
 ARG ADDON_NAME
 ARG ADDON_PATH

package/Jenkinsfile

@@ -1,16 +1,20 @@
 pipeline {
-  agent any
+  agent {
+    node { label 'docker-host' }
+  }
 
   environment {
-        GIT_NAME = "volto-tableau"
-        NAMESPACE = "@eeacms"
-        SONARQUBE_TAGS = "volto.eea.europa.eu,climate-energy.eea.europa.eu,forest.eea.europa.eu,biodiversity.europa.eu,water.europa.eu-freshwater,water.europa.eu-marine,industry.eea.europa.eu,demo-www.eea.europa.eu,www.eea.europa.eu-en"
-        DEPENDENCIES = ""
-        VOLTO = "16"
-    }
+    GIT_NAME = "volto-tableau"
+    NAMESPACE = "@eeacms"
+    SONARQUBE_TAGS = "volto.eea.europa.eu,climate-energy.eea.europa.eu,forest.eea.europa.eu,biodiversity.europa.eu,water.europa.eu-freshwater,water.europa.eu-marine,industry.eea.europa.eu,demo-www.eea.europa.eu,www.eea.europa.eu-en"
+    DEPENDENCIES = ""
+    BACKEND_PROFILES = "eea.kitkat:testing"
+    BACKEND_ADDONS = ""
+    VOLTO = "16.24.0"
+    IMAGE_NAME = BUILD_TAG.toLowerCase()
+  }
 
   stages {
-
     stage('Release') {
       when {
         allOf {
@@ -20,52 +24,41 @@ pipeline {
       }
       steps {
         node(label: 'docker') {
-          withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN'),string(credentialsId: 'eea-jenkins-npm-token', variable: 'NPM_TOKEN')]) {
-            sh '''docker pull eeacms/gitflow'''
-            sh '''docker run -i --rm --name="$BUILD_TAG-gitflow-master" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_NAME="$GIT_NAME" -e GIT_TOKEN="$GITHUB_TOKEN" -e NPM_TOKEN="$NPM_TOKEN" -e LANGUAGE=javascript eeacms/gitflow'''
+          withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN'), string(credentialsId: 'eea-jenkins-npm-token', variable: 'NPM_TOKEN')]) {
+            sh '''docker run -i --rm --pull always --name="$IMAGE_NAME-gitflow-master" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_NAME="$GIT_NAME" -e GIT_TOKEN="$GITHUB_TOKEN" -e NPM_TOKEN="$NPM_TOKEN" -e LANGUAGE=javascript eeacms/gitflow'''
           }
         }
       }
     }
 
-    stage('Code') {
+    stage('Check if testing needed') {
       when {
         allOf {
-          environment name: 'CHANGE_ID', value: ''
-          not { changelog '.*^Automated release [0-9\\.]+$' }
           not { branch 'master' }
+          not { branch 'develop' }
+          environment name: 'CHANGE_ID', value: ''
         }
       }
       steps {
-        parallel(
-
-          "ES lint": {
-            node(label: 'docker') {
-              sh '''docker run -i --rm --name="$BUILD_TAG-eslint" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e VOLTO=$VOLTO plone/volto-addon-ci eslint'''
-            }
-          },
-
-          "Style lint": {
-            node(label: 'docker') {
-              sh '''docker run -i --rm --name="$BUILD_TAG-stylelint" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e VOLTO=$VOLTO plone/volto-addon-ci stylelint'''
-            }
-          },
+        script {
+            withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN')]) {
+              check_result = sh script: '''docker run --pull always -i --rm --name="$IMAGE_NAME-gitflow-check" -e GIT_TOKEN="$GITHUB_TOKEN" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_ORG="$GIT_ORG" -e GIT_NAME="$GIT_NAME" eeacms/gitflow /check_if_testing_needed.sh''', returnStatus: true
 
-          "Prettier": {
-            node(label: 'docker') {
-              sh '''docker run -i --rm --name="$BUILD_TAG-prettier" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e VOLTO=$VOLTO plone/volto-addon-ci prettier'''
+              if (check_result == 0) {
+                env.SKIP_TESTS = 'yes'
+              }
             }
-          }
-        )
+        }
       }
     }
 
-    stage('Tests') {
+    stage('Testing') {
       when {
         anyOf {
           allOf {
             not { environment name: 'CHANGE_ID', value: '' }
             environment name: 'CHANGE_TARGET', value: 'develop'
+            environment name: 'SKIP_TESTS', value: ''
           }
           allOf {
             environment name: 'CHANGE_ID', value: ''
@@ -73,26 +66,76 @@ pipeline {
               not { changelog '.*^Automated release [0-9\\.]+$' }
               branch 'master'
             }
+            environment name: 'SKIP_TESTS', value: ''
           }
         }
       }
-      steps {
-        parallel(
+      stages {
+        stage('Build test image') {
+          steps {
+            checkout scm
+            sh '''docker build --pull --build-arg="VOLTO_VERSION=$VOLTO" --build-arg="ADDON_NAME=$NAMESPACE/$GIT_NAME"  --build-arg="ADDON_PATH=$GIT_NAME" . -t $IMAGE_NAME-frontend'''
+          }
+        }
+        
+        stage('Fix code') {
+          when {
+              environment name: 'CHANGE_ID', value: ''
+              not { branch 'master' }
+          }
+          steps {
+            script {
+              fix_result = sh(script: '''docker run --name="$IMAGE_NAME-fix" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME  $IMAGE_NAME-frontend ci-fix''', returnStatus: true)
+              sh '''docker cp $IMAGE_NAME-fix:/app/src/addons/$GIT_NAME/src .'''
+              sh '''docker rm -v $IMAGE_NAME-fix'''
+              FOUND_FIX = sh(script: '''git diff | wc -l''', returnStdout: true).trim()
 
-          "Volto": {
-            node(label: 'docker') {
-              script {
-                try {
-                  sh '''docker pull plone/volto-addon-ci'''
-                  sh '''docker run -i --name="$BUILD_TAG-volto" -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e VOLTO=$VOLTO plone/volto-addon-ci'''
-                  sh '''rm -rf xunit-reports'''
-                  sh '''mkdir -p xunit-reports'''
-                  sh '''docker cp $BUILD_TAG-volto:/opt/frontend/my-volto-project/coverage xunit-reports/'''
-                  sh '''docker cp $BUILD_TAG-volto:/opt/frontend/my-volto-project/junit.xml xunit-reports/'''
-                  sh '''docker cp $BUILD_TAG-volto:/opt/frontend/my-volto-project/unit_tests_log.txt xunit-reports/'''
-                  stash name: "xunit-reports", includes: "xunit-reports/**"
-                  archiveArtifacts artifacts: "xunit-reports/unit_tests_log.txt", fingerprint: true
-                  publishHTML (target : [
+              if (FOUND_FIX != '0') {
+                withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN')]) {
+                  sh '''sed -i "s|url = .*|url = https://eea-jenkins:$GITHUB_TOKEN@github.com/eea/$GIT_NAME.git|" .git/config'''
+                }
+                sh '''git fetch origin $GIT_BRANCH:$GIT_BRANCH'''
+                sh '''git checkout $GIT_BRANCH'''
+                sh '''git add src/'''
+                sh '''git commit -m "style: Automated code fix" '''
+                sh '''git push --set-upstream origin $GIT_BRANCH'''
+                sh '''exit 1'''
+              }
+            }
+          }
+        }
+
+        stage('ES lint') {
+          steps {
+            sh '''docker run --rm --name="$IMAGE_NAME-eslint" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME $IMAGE_NAME-frontend lint'''
+          }
+        }
+
+        stage('Style lint') {
+          steps {
+            sh '''docker run --rm --name="$IMAGE_NAME-stylelint" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME  $IMAGE_NAME-frontend stylelint'''
+          }
+        }
+
+        stage('Prettier') {
+          steps {
+            sh '''docker run --rm --name="$IMAGE_NAME-prettier" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME  $IMAGE_NAME-frontend prettier'''
+          }
+        }
+
+        stage('Coverage Tests') {
+          parallel {
+            
+            stage('Unit tests') {
+              steps {
+                script {
+                  try {
+                    sh '''docker run --name="$IMAGE_NAME-volto" --entrypoint=make --workdir=/app/src/addons/$GIT_NAME $IMAGE_NAME-frontend test-ci'''
+                    sh '''rm -rf xunit-reports'''
+                    sh '''mkdir -p xunit-reports'''
+                    sh '''docker cp $IMAGE_NAME-volto:/app/coverage xunit-reports/'''
+                    sh '''docker cp $IMAGE_NAME-volto:/app/junit.xml xunit-reports/'''
+                    publishHTML(target : [
                     allowMissing: false,
                     alwaysLinkToLastBuild: true,
                     keepAll: true,
@@ -105,75 +148,62 @@ pipeline {
                     catchError(buildResult: 'SUCCESS', stageResult: 'SUCCESS') {
                         junit testResults: 'xunit-reports/junit.xml', allowEmptyResults: true
                     }
-                   sh script: '''docker rm -v $BUILD_TAG-volto''', returnStatus: true
+                    sh script: '''docker rm -v $IMAGE_NAME-volto''', returnStatus: true
+                  }
                 }
               }
             }
-          }
-        )
-      }
-    }
+            
+            stage('Integration tests') {
+              steps {
+                script {
+                  try {
+                    sh '''docker run --pull always --rm -d --name="$IMAGE_NAME-plone" -e SITE="Plone" -e PROFILES="$BACKEND_PROFILES" -e ADDONS="$BACKEND_ADDONS" eeacms/plone-backend'''
+                    sh '''timeout -s 9 3600 docker run --shm-size=2g --cpu-quota=150000 --link $IMAGE_NAME-plone:plone --entrypoint=make --name="$IMAGE_NAME-cypress" --workdir=/app/src/addons/${GIT_NAME} -e "RAZZLE_INTERNAL_API_PATH=http://plone:8080/Plone" $IMAGE_NAME-frontend cypress-ci'''
+                  } finally {
+                    try {
+                      sh '''rm -rf cypress-videos cypress-results cypress-coverage cypress-screenshots'''
+                      sh '''mkdir -p cypress-videos cypress-results cypress-coverage cypress-screenshots'''
+                      videos = sh script: '''docker cp $IMAGE_NAME-cypress:/app/src/addons/$GIT_NAME/cypress/videos cypress-videos/''', returnStatus: true
+                      sh '''docker cp $IMAGE_NAME-cypress:/app/src/addons/$GIT_NAME/cypress/reports cypress-results/'''
+                      screenshots = sh script: '''docker cp $IMAGE_NAME-cypress:/app/src/addons/$GIT_NAME/cypress/screenshots cypress-screenshots''', returnStatus: true
 
-    stage('Integration tests') {
-      when {
-        anyOf {
-          allOf {
-            not { environment name: 'CHANGE_ID', value: '' }
-            environment name: 'CHANGE_TARGET', value: 'develop'
-          }
-          allOf {
-            environment name: 'CHANGE_ID', value: ''
-            anyOf {
-              not { changelog '.*^Automated release [0-9\\.]+$' }
-              branch 'master'
-            }
-          }
-        }
-      }
-      steps {
-        parallel(
+                      archiveArtifacts artifacts: 'cypress-screenshots/**', fingerprint: true, allowEmptyArchive: true
 
-          "Cypress": {
-            node(label: 'docker') {
-              script {
-                try {
-                  sh '''docker pull eeacms/plone-backend; docker run --rm -d --name="$BUILD_TAG-plone" -e SITE="Plone" -e PROFILES="eea.kitkat:testing" eeacms/plone-backend'''
-                  sh '''docker pull plone/volto-addon-ci; docker run -i --name="$BUILD_TAG-cypress" --link $BUILD_TAG-plone:plone -e NAMESPACE="$NAMESPACE" -e GIT_NAME=$GIT_NAME -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e DEPENDENCIES="$DEPENDENCIES" -e NODE_ENV=development -e VOLTO=$VOLTO plone/volto-addon-ci cypress'''
-                } finally {
-                  try {
-                    sh '''rm -rf cypress-reports cypress-results cypress-coverage'''
-                    sh '''mkdir -p cypress-reports cypress-results cypress-coverage'''
-                    sh '''docker cp $BUILD_TAG-cypress:/opt/frontend/my-volto-project/src/addons/$GIT_NAME/cypress/videos cypress-reports/'''
-                    sh '''docker cp $BUILD_TAG-cypress:/opt/frontend/my-volto-project/src/addons/$GIT_NAME/cypress/reports cypress-results/'''
-                    coverage = sh script: '''docker cp $BUILD_TAG-cypress:/opt/frontend/my-volto-project/src/addons/$GIT_NAME/coverage cypress-coverage/''', returnStatus: true
-                    if ( coverage == 0 ) {
-                         publishHTML (target : [allowMissing: false,
+                      coverage = sh script: '''docker cp $IMAGE_NAME-cypress:/app/src/addons/$GIT_NAME/coverage cypress-coverage''', returnStatus: true
+
+                      if ( coverage == 0 ) {
+                        publishHTML(target : [allowMissing: false,
                              alwaysLinkToLastBuild: true,
                              keepAll: true,
                              reportDir: 'cypress-coverage/coverage/lcov-report',
                              reportFiles: 'index.html',
                              reportName: 'CypressCoverage',
                              reportTitles: 'Integration Tests Code Coverage'])
-                    }
-                    sh '''touch empty_file; for ok_test in $(grep -E 'file=.*failures="0"' $(grep 'testsuites .*failures="0"' $(find cypress-results -name *.xml) empty_file | awk -F: '{print $1}') empty_file | sed 's/.* file="\\(.*\\)" time.*/\\1/' | sed 's#^cypress/integration/##g' | sed 's#^../../../node_modules/@eeacms/##g'); do rm -f cypress-reports/videos/$ok_test.mp4; rm -f cypress-reports/$ok_test.mp4; done'''
-                    archiveArtifacts artifacts: 'cypress-reports/**/*.mp4', fingerprint: true, allowEmptyArchive: true
-                    stash name: "cypress-coverage", includes: "cypress-coverage/**", allowEmpty: true
-                  }
-                  finally {
-                    catchError(buildResult: 'SUCCESS', stageResult: 'SUCCESS') {
+                      }
+                      if ( videos == 0 ) {
+                        sh '''for file in $(find cypress-results -name *.xml); do if [ $(grep -E 'failures="[1-9].*"' $file | wc -l) -eq 0 ]; then testname=$(grep -E 'file=.*failures="0"' $file | sed 's#.* file=".*\\/\\(.*\\.[jsxt]\\+\\)" time.*#\\1#' );  rm -f cypress-videos/videos/$testname.mp4; fi; done'''
+                        archiveArtifacts artifacts: 'cypress-videos/**/*.mp4', fingerprint: true, allowEmptyArchive: true
+                      }
+                    } finally {
+                      catchError(buildResult: 'SUCCESS', stageResult: 'SUCCESS') {
                         junit testResults: 'cypress-results/**/*.xml', allowEmptyResults: true
+                      }
+                      sh script: "docker stop $IMAGE_NAME-plone", returnStatus: true
+                      sh script: "docker rm -v $IMAGE_NAME-plone", returnStatus: true
+                      sh script: "docker rm -v $IMAGE_NAME-cypress", returnStatus: true
                     }
-                    sh script: "docker stop $BUILD_TAG-plone", returnStatus: true
-                    sh script: "docker rm -v $BUILD_TAG-plone", returnStatus: true
-                    sh script: "docker rm -v $BUILD_TAG-cypress", returnStatus: true
-
                   }
                 }
               }
             }
           }
-
-        )
+        }
+      }
+      post {
+        always {
+            sh script: "docker rmi $IMAGE_NAME-frontend", returnStatus: true
+        }
       }
     }
 
@@ -197,19 +227,14 @@ pipeline {
         }
       }
       steps {
-        node(label: 'swarm') {
-          script{
-            checkout scm
-            unstash "xunit-reports"
-            unstash "cypress-coverage"
-            def scannerHome = tool 'SonarQubeScanner';
-            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'''
-            }
+        script {
+          def scannerHome = tool 'SonarQubeScanner'
+          def nodeJS = tool 'NodeJS'
+          withSonarQubeEnv('Sonarqube') {
+            sh '''sed -i "s#/app/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=5; 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 15; try=\$(( \$try - 1 )); fi; done'''
           }
         }
       }
@@ -230,18 +255,15 @@ pipeline {
         }
       }
       steps {
-        node(label: 'docker') {
-          script {
-            sh '''docker pull eeacms/gitflow'''
-            sh '''echo "Error" > checkresult.txt'''
-            catchError(buildResult: 'FAILURE', stageResult: 'FAILURE') {
-               sh '''set -o pipefail; docker run -i --rm --name="$BUILD_TAG-gitflow-sn" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_NAME="$GIT_NAME" eeacms/gitflow /checkSonarqubemaster.sh | grep -v "Found script" | tee checkresult.txt'''
-             }
-
-            publishChecks name: 'SonarQube', title: 'Sonarqube Code Quality Check', summary: "Quality check on the SonarQube metrics from branch develop, comparing it with the ones from master branch. No bugs are allowed",
-                          text: readFile(file: 'checkresult.txt'), conclusion: "${currentBuild.currentResult}",
-                          detailsURL: "${env.BUILD_URL}display/redirect"
+        script {
+          sh '''echo "Error" > checkresult.txt'''
+          catchError(buildResult: 'FAILURE', stageResult: 'FAILURE') {
+            sh '''set -o pipefail; docker run -i --rm --pull always --name="$IMAGE_NAME-gitflow-sn" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_NAME="$GIT_NAME" eeacms/gitflow /checkSonarqubemaster.sh | grep -v "Found script" | tee checkresult.txt'''
           }
+
+          publishChecks name: 'SonarQube', title: 'Sonarqube Code Quality Check', summary: 'Quality check on the SonarQube metrics from branch develop, comparing it with the ones from master branch. No bugs are allowed',
+                        text: readFile(file: 'checkresult.txt'), conclusion: "${currentBuild.currentResult}",
+                        detailsURL: "${env.BUILD_URL}display/redirect"
         }
       }
     }
@@ -254,20 +276,16 @@ pipeline {
         environment name: 'CHANGE_TARGET', value: 'master'
       }
       steps {
-        node(label: 'docker') {
-          script {
-            if ( env.CHANGE_BRANCH != "develop" ) {
-                error "Pipeline aborted due to PR not made from develop branch"
-            }
-           withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN')]) {
-            sh '''docker pull eeacms/gitflow'''
-            sh '''docker run -i --rm --name="$BUILD_TAG-gitflow-pr" -e GIT_CHANGE_TARGET="$CHANGE_TARGET" -e GIT_CHANGE_BRANCH="$CHANGE_BRANCH" -e GIT_CHANGE_AUTHOR="$CHANGE_AUTHOR" -e GIT_CHANGE_TITLE="$CHANGE_TITLE" -e GIT_TOKEN="$GITHUB_TOKEN" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e GIT_ORG="$GIT_ORG" -e GIT_NAME="$GIT_NAME" -e LANGUAGE=javascript eeacms/gitflow'''
-           }
+        script {
+          if (env.CHANGE_BRANCH != 'develop') {
+            error 'Pipeline aborted due to PR not made from develop branch'
+          }
+          withCredentials([string(credentialsId: 'eea-jenkins-token', variable: 'GITHUB_TOKEN')]) {
+            sh '''docker run --pull always -i --rm --name="$IMAGE_NAME-gitflow-pr" -e GIT_CHANGE_TARGET="$CHANGE_TARGET" -e GIT_CHANGE_BRANCH="$CHANGE_BRANCH" -e GIT_CHANGE_AUTHOR="$CHANGE_AUTHOR" -e GIT_CHANGE_TITLE="$CHANGE_TITLE" -e GIT_TOKEN="$GITHUB_TOKEN" -e GIT_BRANCH="$BRANCH_NAME" -e GIT_CHANGE_ID="$CHANGE_ID" -e GIT_ORG="$GIT_ORG" -e GIT_NAME="$GIT_NAME" -e LANGUAGE=javascript eeacms/gitflow'''
           }
         }
       }
     }
-
   }
 
   post {
@@ -289,4 +307,4 @@ pipeline {
       }
     }
   }
-}
+}

package/Makefile

@@ -50,6 +50,11 @@ VOLTO_VERSION?=16
 ADDON_PATH="${DIR}"
 ADDON_NAME="@eeacms/${ADDON_PATH}"
 DOCKER_COMPOSE=PLONE_VERSION=${PLONE_VERSION} VOLTO_VERSION=${VOLTO_VERSION} ADDON_NAME=${ADDON_NAME} ADDON_PATH=${ADDON_PATH} docker compose
+RAZZLE_INTERNAL_API_PATH?="http://localhost:8080/Plone"
+RAZZLE_DEV_PROXY_API_PATH?="${RAZZLE_INTERNAL_API_PATH}"
+CYPRESS_API_PATH="${RAZZLE_DEV_PROXY_API_PATH}"
+
+
 
 # Top-level targets
 .PHONY: all
@@ -77,11 +82,11 @@ shell:			## Start a shell in the frontend container
 
 .PHONY: cypress-open
 cypress-open:		## Open cypress integration tests
-	NODE_ENV=development  $(NODE_MODULES)/cypress/bin/cypress open
+	CYPRESS_API_PATH="${RAZZLE_DEV_PROXY_API_PATH}" NODE_ENV=development  $(NODE_MODULES)/cypress/bin/cypress open
 
 .PHONY: cypress-run
 cypress-run:	## Run cypress integration tests
-	NODE_ENV=development  $(NODE_MODULES)/cypress/bin/cypress run
+	CYPRESS_API_PATH="${RAZZLE_DEV_PROXY_API_PATH}" NODE_ENV=development  $(NODE_MODULES)/cypress/bin/cypress run --browser chromium
 
 .PHONY: test
 test:			## Run jest tests
@@ -129,3 +134,31 @@ i18n:			## i18n
 help:                   ## Show this help.
 	@echo -e "$$(grep -hE '^\S+:.*##' $(MAKEFILE_LIST) | sed -e 's/:.*##\s*/:/' -e 's/^\(.\+\):\(.*\)/\\x1b[36m\1\\x1b[m:\2/' | column -c2 -t -s :)"
 	head -n 14 Makefile
+
+.PHONY: ci-fix
+ci-fix:
+	echo "Running lint-fix"
+	make lint-fix
+	echo "Running prettier-fix"
+	make prettier-fix
+	echo "Running stylelint-fix"
+	make stylelint-fix
+
+.PHONY: test-ci
+test-ci:
+	cd /app
+	RAZZLE_JEST_CONFIG=src/addons/${ADDON_PATH}/jest-addon.config.js CI=true yarn test src/addons/${ADDON_PATH}/src --watchAll=false --reporters=default --reporters=jest-junit --collectCoverage --coverageReporters lcov cobertura text
+
+.PHONY: start-ci
+start-ci:
+	cd ../..
+	yarn start &
+
+.PHONY: cypress-ci
+cypress-ci:
+	cp .coverage.babel.config.js /app/babel.config.js
+	make start-ci
+	$(NODE_MODULES)/.bin/wait-on -t 240000  http://localhost:3000
+	NODE_ENV=development make cypress-run
+
+

package/README.md

@@ -20,6 +20,8 @@
 
 Registers a VisualizationView component for a content type named 'tableau_visualization'.
 
+![Tableau](https://raw.githubusercontent.com/eea/volto-tableau/master/docs/volto-tableau.gif)
+
 ## Getting started
 
 ### Try volto-tableau with Docker

package/cypress.config.js

@@ -5,9 +5,9 @@ module.exports = defineConfig({
   defaultCommandTimeout: 8888,
   chromeWebSecurity: false,
   reporter: 'junit',
-  video: true,
+  video: false,
   retries: {
-    runMode: 1,
+    runMode: 2,
     openMode: 0,
   },
   reporterOptions: {

package/package.json

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

package/src/Blocks/EmbedTableauVisualization/View.jsx

@@ -1,12 +1,10 @@
 import React from 'react';
-import { PrivacyProtection } from '@eeacms/volto-embed';
-import Tableau from '@eeacms/volto-tableau/Tableau/Tableau';
-
-import { flattenToAppURL } from '@plone/volto/helpers';
-import { getContent } from '@plone/volto/actions';
-
 import { connect } from 'react-redux';
 import { compose } from 'redux';
+import { flattenToAppURL } from '@plone/volto/helpers';
+import { getContent } from '@plone/volto/actions';
+import { PrivacyProtection } from '@eeacms/volto-embed';
+import Tableau from '@eeacms/volto-tableau/Tableau/Tableau';
 
 const View = (props) => {
   const data = props.data;
@@ -16,7 +14,7 @@ const View = (props) => {
     with_more_info = true,
     with_download = true,
     with_share = true,
-    tableau_height = '700',
+    tableau_height,
   } = data;
   const { figure_note = [], data_provenance = {}, tableau_visualization } =
     props.tableau_visualization_data || {};
@@ -31,7 +29,7 @@ const View = (props) => {
   }, [tableau_vis_url]);
 
   return (
-    <div className="embed-container">
+    <div className="embed-tableau">
       <PrivacyProtection
         {...props}
         data={{ ...data, url: tableau_visualization?.url }}

package/src/Blocks/EmbedTableauVisualization/View.test.jsx

@@ -39,6 +39,6 @@ describe('View', () => {
         <View data={data} />
       </Provider>,
     );
-    expect(container.querySelector('.embed-container')).toBeInTheDocument();
+    expect(container.querySelector('.embed-tableau')).toBeInTheDocument();
   });
 });

package/src/Tableau/Tableau.jsx

@@ -14,17 +14,21 @@ import isUndefined from 'lodash/isUndefined';
 import cx from 'classnames';
 import { Button } from 'semantic-ui-react';
 import { Toast, Icon } from '@plone/volto/components';
+import {
+  FigureNote,
+  Sources,
+  MoreInfo,
+  Share,
+} from '@eeacms/volto-embed/Toolbar';
 import { useTableau } from '@eeacms/volto-tableau/hooks';
-import JsonCodeSnippet from '@eeacms/volto-tableau/Utils/JsonCodeSnippet/JsonCodeSnippet';
-import FigureNote from '@eeacms/volto-tableau/Utils/FigureNote/FigureNote';
-import Sources from '@eeacms/volto-tableau/Utils/Sources/Sources';
-import MoreInfoLink from '@eeacms/volto-tableau/Utils/MoreInfoLink/MoreInfoLink';
-import Download from '@eeacms/volto-tableau/Utils/Download/Download';
-import Share from '@eeacms/volto-tableau/Utils/Share/Share';
+import { JsonCodeSnippet, Download } from '@eeacms/volto-tableau/Utils';
+
 import { getSheetnames, getActiveSheetname, getDevice } from './helpers';
 
 import resetSVG from '@plone/volto/icons/reset.svg';
 
+import '@eeacms/volto-embed/Toolbar/styles.less';
+
 const TableauDebug = ({ mode, data, vizState, url, version, clearData }) => {
   const { loaded, error } = vizState;
   const { filters = {}, parameters = {} } = data;
@@ -96,12 +100,12 @@ const Tableau = forwardRef((props, ref) => {
     toolbarPosition = 'Top',
     breakpointUrls = [],
     tableau_vis_url,
-    with_note,
-    with_sources,
-    with_more_info,
-    with_download,
-    with_share,
-    tableau_height = '700',
+    with_note = true,
+    with_sources = true,
+    with_more_info = true,
+    with_download = true,
+    with_share = true,
+    tableau_height,
   } = data;
   const device = useMemo(
     () => getDevice(breakpoints, screen.page?.width || Infinity),
@@ -412,25 +416,27 @@ const Tableau = forwardRef((props, ref) => {
         clearData={clearData}
       />
       <div
-        style={{ height: tableau_height + 'px' }}
+        style={{ height: tableau_height ? tableau_height + 'px' : '100%' }}
         className={cx('tableau', `tableau-${version}`, {
           'tableau-autoscale': autoScale,
         })}
         ref={vizEl}
       />
-      <div className="visualization-info-container">
-        <div className="visualization-info">
-          {with_note && loaded && <FigureNote note={figure_note || []} />}
-          {with_sources && loaded && <Sources sources={sources} />}
-          {with_more_info && loaded && (
-            <MoreInfoLink contentTypeLink={tableau_vis_url} />
-          )}
+      {loaded && (
+        <div className="visualization-toolbar">
+          <div className="left-col">
+            {with_note && <FigureNote note={figure_note || []} />}
+            {with_sources && <Sources sources={sources} />}
+            {with_more_info && <MoreInfo href={tableau_vis_url || data.url} />}
+          </div>
+          <div className="right-col">
+            {with_download && loaded && <Download viz={viz.current} />}
+            {with_share && loaded && (
+              <Share href={tableau_vis_url || data.url} />
+            )}
+          </div>
         </div>
-        <div className="visualization-info">
-          {with_download && loaded && <Download viz={viz.current} />}
-          {with_share && loaded && <Share contentTypeLink={tableau_vis_url} />}
-        </div>
-      </div>
+      )}
     </div>
   );
 });

package/src/Utils/{Download/Download.jsx → Download.jsx}

@@ -3,37 +3,37 @@ import { Popup } from 'semantic-ui-react';
 import cx from 'classnames';
 
 const Download = ({ viz }) => {
-  const [expanded, setExpanded] = React.useState(false);
+  const [open, setOpen] = React.useState(false);
   const popupRef = React.useRef();
 
   return (
     <Popup
-      popper={{ id: 'tableau-download-popup' }}
-      trigger={
-        <div className="tableau-download-container">
-          <button className={cx('tableau-download-button', { expanded })}>
-            Download <i class="ri-download-fill"></i>
-          </button>
-        </div>
-      }
+      popper={{ id: 'vis-toolbar-popup', className: 'download-popup' }}
       position="bottom left"
       on="click"
+      open={open}
       onClose={() => {
-        setExpanded(false);
+        setOpen(false);
       }}
       onOpen={() => {
-        setExpanded(true);
+        setOpen(true);
       }}
       ref={popupRef}
-    >
-      <ul className="no-bullets">
-        <li>
-          Data formats
-          <div className="visualization-wrapper">
-            <div className="visualization-info">
-              <div>
+      trigger={
+        <div className="tableau-download-container">
+          <button className={cx('trigger-button', { open })}>
+            <i className="ri-download-fill" />
+            Download
+          </button>
+        </div>
+      }
+      content={
+        <>
+          <div className="item">
+            <span className="label">Data formats</span>
+            <div className="types">
+              <div className="type">
                 <button
-                  className="tableau-download-button tableau-format-download"
                   onClick={() => {
                     viz.showExportCrossTabDialog();
                     popupRef.current.triggerRef.current.click();
@@ -42,9 +42,8 @@ const Download = ({ viz }) => {
                   <span>CSV</span>
                 </button>
               </div>
-              <div>
+              <div className="type">
                 <button
-                  className="tableau-download-button tableau-format-download"
                   onClick={() => {
                     viz.exportCrossTabToExcel();
                     popupRef.current.triggerRef.current.click();
@@ -55,14 +54,11 @@ const Download = ({ viz }) => {
               </div>
             </div>
           </div>
-        </li>
-        <li>
-          Image formats
-          <div className="visualization-wrapper">
-            <div className="visualization-info">
-              <div>
+          <div className="item">
+            <span className="label">Image formats</span>
+            <div className="types">
+              <div className="type">
                 <button
-                  className="tableau-download-button tableau-format-download"
                   onClick={() => {
                     viz.showExportImageDialog();
                     popupRef.current.triggerRef.current.click();
@@ -73,14 +69,11 @@ const Download = ({ viz }) => {
               </div>
             </div>
           </div>
-        </li>
-        <li>
-          Other formats
-          <div className="visualization-wrapper">
-            <div className="visualization-info">
-              <div>
+          <div className="item">
+            <span className="label">Other formats</span>
+            <div className="types">
+              <div className="type">
                 <button
-                  className="tableau-download-button tableau-format-download"
                   onClick={() => {
                     viz.showExportPDFDialog();
                     popupRef.current.triggerRef.current.click();
@@ -91,9 +84,9 @@ const Download = ({ viz }) => {
               </div>
             </div>
           </div>
-        </li>
-      </ul>
-    </Popup>
+        </>
+      }
+    />
   );
 };
 

package/src/Utils/index.js

@@ -0,0 +1,2 @@
+export { default as Download } from './Download';
+export { default as JsonCodeSnippet } from './JsonCodeSnippet';

package/src/Views/VisualizationView.jsx

@@ -17,6 +17,10 @@ const VisualizationView = (props) => {
         <Tableau
           data={{
             ...tableau_visualization,
+            with_note: false,
+            with_sources: false,
+            with_more_info: false,
+            with_share: false,
             with_download: true,
           }}
           breakpoints={

package/src/Widgets/VisualizationViewWidget.jsx

@@ -3,14 +3,19 @@ import config from '@plone/volto/registry';
 
 export default function VisualizationViewWidget(props) {
   const { value = {} } = props;
+
   return (
     <Tableau
       data={{
         ...value,
+        with_note: false,
+        with_sources: false,
+        with_more_info: true,
+        with_share: true,
         with_download: true,
       }}
       breakpoints={
-        config.blocks.blocksConfig.embed_tableau_visualization.breakpoints
+        config.blocks.blocksConfig?.embed_tableau_visualization?.breakpoints
       }
     />
   );

package/src/Widgets/VisualizationViewWidget.test.jsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import { Provider } from 'react-redux';
+import configureStore from 'redux-mock-store';
+import VisualizationViewWidget from './VisualizationViewWidget';
+
+const mockStore = configureStore([]);
+const store = mockStore({});
+
+jest.mock('@plone/volto/components', () => ({
+  Icon: ({ children }) => <img alt="incon">{children}</img>,
+  Toast: ({ children }) => <p>{children}</p>,
+}));
+
+describe('VisualizationViewWidget', () => {
+  it('should render the component', () => {
+    const data = {
+      url: 'http://localhost:3000/tableau-ct',
+      with_download: true,
+      with_more_info: true,
+      with_note: true,
+      with_share: true,
+    };
+
+    const { container } = render(
+      <Provider store={store}>
+        <VisualizationViewWidget data={data} />
+      </Provider>,
+    );
+    expect(container.querySelector('.tableau-wrapper')).toBeInTheDocument();
+  });
+});

package/src/Widgets/VisualizationWidget.jsx

@@ -72,11 +72,18 @@ const VisualizationWidget = (props) => {
             >
               <Tableau
                 ref={viz}
-                data={value}
+                data={{
+                  ...(value || {}),
+                  with_note: false,
+                  with_sources: false,
+                  with_more_info: false,
+                  with_share: false,
+                  with_download: false,
+                }}
                 mode="edit"
                 breakpoints={
-                  config.blocks.blocksConfig.embed_tableau_visualization
-                    .breakpoints
+                  config.blocks.blocksConfig?.embed_tableau_visualization
+                    ?.breakpoints
                 }
                 extraOptions={extraOptions}
                 setVizState={setVizState}
@@ -116,9 +123,14 @@ const VisualizationWidget = (props) => {
         data={{
           ...props.value,
           autoScale: true,
+          with_note: false,
+          with_sources: false,
+          with_more_info: false,
+          with_share: false,
+          with_download: false,
         }}
         breakpoints={
-          config.blocks.blocksConfig.embed_tableau_visualization.breakpoints
+          config.blocks.blocksConfig?.embed_tableau_visualization?.breakpoints
         }
         extraOptions={extraOptions}
       />

package/src/Widgets/VisualizationWidget.test.jsx

@@ -0,0 +1,45 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import '@testing-library/jest-dom/extend-expect';
+import { Provider } from 'react-redux';
+import configureStore from 'redux-mock-store';
+import VisualizationWidget from './VisualizationWidget';
+
+const mockStore = configureStore([]);
+const store = mockStore({});
+
+jest.mock('@plone/volto/components', () => ({
+  FormFieldWrapper: jest.fn(({ children }) => <>{children}</>),
+  InlineForm: jest.fn(() => <div>Mocked InlineForm</div>),
+  Icon: ({ children }) => <img alt="incon">{children}</img>,
+  Toast: ({ children }) => <p>{children}</p>,
+}));
+
+describe('VisualizationWidget', () => {
+  it('should render the component', () => {
+    const data = {
+      value: {
+        url: 'http://localhost:3000/tableau-ct',
+        with_download: true,
+        with_more_info: true,
+        with_note: true,
+        with_share: true,
+        hideTabs: false,
+        staticParameters: [
+          {
+            '@id': '1f050748-c020-4a48-8109-e99a25bf558d',
+            field: 'Tableau field',
+            value: 'Tableau value',
+          },
+        ],
+      },
+    };
+
+    const { container } = render(
+      <Provider store={store}>
+        <VisualizationWidget {...data} />
+      </Provider>,
+    );
+    expect(container.querySelector('.tableau-wrapper')).toBeInTheDocument();
+  });
+});

package/src/Widgets/schema.js

@@ -38,7 +38,8 @@ const staticParameters = {
 };
 
 const breakpointUrlSchema = (config) => {
-  const breakpoints = config.blocks.blocksConfig.tableau_block.breakpoints;
+  const breakpoints =
+    config.blocks.blocksConfig?.tableau_block?.breakpoints || {};
 
   return {
     title: 'URL',

package/src/helpers.js

@@ -1,5 +1,3 @@
-import React from 'react';
-
 export const loadTableauScript = (callback, version) => {
   if (!__CLIENT__) return;
   const source = `https://public.tableau.com/javascripts/api/tableau-${version}.min.js`;
@@ -34,25 +32,3 @@ export const loadTableauScript = (callback, version) => {
 // https://public.tableau.com/javascripts/api/tableau-2.2.2.min.js
 // https://public.tableau.com/javascripts/api/tableau-2.1.2.min.js
 // https://public.tableau.com/javascripts/api/tableau-2.0.3.min.js
-
-export const useCopyToClipboard = (text) => {
-  const [copyStatus, setCopyStatus] = React.useState('inactive');
-  const copy = React.useCallback(() => {
-    navigator.clipboard.writeText(text).then(
-      () => setCopyStatus('copied'),
-      () => setCopyStatus('failed'),
-    );
-  }, [text]);
-
-  React.useEffect(() => {
-    if (copyStatus === 'inactive') {
-      return;
-    }
-
-    const timeout = setTimeout(() => setCopyStatus('inactive'), 3000);
-
-    return () => clearTimeout(timeout);
-  }, [copyStatus]);
-
-  return [copyStatus, copy];
-};

package/src/Utils/Download/Download.test.jsx

@@ -1,22 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-
-import Download from './Download';
-
-window.URL.createObjectURL = jest.fn(() => 'test');
-
-jest.mock('@plone/volto/components', () => ({
-  Icon: ({ children }) => <img alt="incon">{children}</img>,
-}));
-
-describe('Download', () => {
-  const viz = {};
-
-  it('should render the component', () => {
-    const { container } = render(<Download viz={viz} />);
-    expect(
-      container.querySelector('.tableau-download-container'),
-    ).toBeInTheDocument();
-  });
-});

package/src/Utils/FigureNote/FigureNote.jsx

@@ -1,43 +0,0 @@
-import React from 'react';
-import cx from 'classnames';
-import { Popup } from 'semantic-ui-react';
-import {
-  serializeNodes,
-  serializeNodesToText,
-} from '@plone/volto-slate/editor/render';
-import { isArray } from 'lodash';
-
-export const serializeText = (note) => {
-  if (!serializeNodesToText(note))
-    return <p>There are no notes set for this visualization</p>;
-  return isArray(note) ? serializeNodes(note) : note;
-};
-
-const FigureNote = ({ note = [] }) => {
-  const [expanded, setExpanded] = React.useState(false);
-
-  return (
-    <div className="tableau-note-container">
-      <Popup
-        position="bottom left"
-        popper={{ id: 'tableau-note-popup' }}
-        trigger={
-          <button className={cx('tableau-note-button', { expanded })}>
-            Note
-          </button>
-        }
-        on="click"
-        onClose={() => {
-          setExpanded(false);
-        }}
-        onOpen={() => {
-          setExpanded(true);
-        }}
-      >
-        <Popup.Content>{serializeText(note)}</Popup.Content>
-      </Popup>
-    </div>
-  );
-};
-
-export default FigureNote;

package/src/Utils/FigureNote/FigureNote.test.jsx

@@ -1,25 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-
-import FigureNote from './FigureNote';
-
-window.URL.createObjectURL = jest.fn(() => 'test');
-
-const slateEditor = require('@plone/volto-slate/editor/render');
-slateEditor.serializeNodes = jest.fn();
-
-jest.mock('@plone/volto-slate/editor/render', () => ({
-  serializeNodesToText: ({ note = [] }) => note,
-}));
-
-describe('FigureNote', () => {
-  const note = [];
-
-  it('should render the component', () => {
-    const { container } = render(<FigureNote note={note} />);
-    expect(
-      container.querySelector('.tableau-note-container'),
-    ).toBeInTheDocument();
-  });
-});

package/src/Utils/MoreInfoLink/MoreInfoLink.jsx

@@ -1,22 +0,0 @@
-import React from 'react';
-import cx from 'classnames';
-import { UniversalLink } from '@plone/volto/components';
-
-const Link = ({ children, ...props }) => {
-  if (props.href) {
-    return <UniversalLink {...props}>{children}</UniversalLink>;
-  }
-  return <span {...props}>{children}</span>;
-};
-
-const MoreInfoLink = ({ contentTypeLink }) => {
-  return (
-    <Link href={contentTypeLink}>
-      <button className={cx('tableau-more-info-button')}>
-        More info <i class="ri-external-link-line"></i>
-      </button>
-    </Link>
-  );
-};
-
-export default MoreInfoLink;

package/src/Utils/MoreInfoLink/MoreInfoLink.test.jsx

@@ -1,24 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-
-import MoreInfoLink from './MoreInfoLink';
-
-window.URL.createObjectURL = jest.fn(() => 'test');
-
-jest.mock('@plone/volto/components', () => ({
-  UniversalLink: ({ children }) => <div>{children}</div>,
-}));
-
-describe('MoreInfoLink', () => {
-  const contentTypeLink = '/tableau-content-type';
-
-  it('should render the component', () => {
-    const { container } = render(
-      <MoreInfoLink contentTypeLink={contentTypeLink} />,
-    );
-    expect(
-      container.querySelector('.tableau-more-info-button'),
-    ).toBeInTheDocument();
-  });
-});

package/src/Utils/Share/Share.jsx

@@ -1,69 +0,0 @@
-import React from 'react';
-import { Popup, Input, Button } from 'semantic-ui-react';
-import { useCopyToClipboard } from '../../helpers.js';
-import cx from 'classnames';
-
-const Share = ({ contentTypeLink = '' }) => {
-  const [expanded, setExpanded] = React.useState(false);
-  const popupRef = React.useRef();
-
-  const CopyUrlButton = ({ className, url, buttonText }) => {
-    const [copyUrlStatus, copyUrl] = useCopyToClipboard(url);
-
-    if (copyUrlStatus === 'copied') {
-      buttonText = 'Copied!';
-    } else if (copyUrlStatus === 'failed') {
-      buttonText = 'Copy failed. Please try again.';
-    }
-
-    return (
-      <Button
-        primary
-        onClick={copyUrl}
-        className={cx('copy-button', className)}
-      >
-        {buttonText}
-      </Button>
-    );
-  };
-
-  return (
-    <Popup
-      popper={{ id: 'tableau-share-popup' }}
-      trigger={
-        <div className="tableau-share-container">
-          <button className={cx('tableau-share-button', { expanded })}>
-            <span>Share</span>
-            <i class="ri-share-fill"></i>
-          </button>
-        </div>
-      }
-      position="bottom left"
-      on="click"
-      onClose={() => {
-        setExpanded(false);
-      }}
-      onOpen={() => {
-        setExpanded(true);
-      }}
-      ref={popupRef}
-    >
-      <div>
-        <span className="tableau-share-popup-text">Copy link</span>
-        <div className="tableau-share-popup-container">
-          <Input
-            className="tableau-share-link"
-            defaultValue={contentTypeLink}
-          />
-          <CopyUrlButton
-            className="tableau-copy-button"
-            url={contentTypeLink}
-            buttonText="Copy"
-          />
-        </div>
-      </div>
-    </Popup>
-  );
-};
-
-export default Share;

package/src/Utils/Sources/Sources.jsx

@@ -1,67 +0,0 @@
-import React from 'react';
-import cx from 'classnames';
-import { Popup } from 'semantic-ui-react';
-import { UniversalLink } from '@plone/volto/components';
-
-const Link = ({ children, ...props }) => {
-  if (props.href) {
-    return <UniversalLink {...props}>{children}</UniversalLink>;
-  }
-  return <span {...props}>{children}</span>;
-};
-
-const Source = ({ source }) => {
-  return (
-    <>
-      <Link className="embed-sources-param-title" href={source.link}>
-        {source.title}
-      </Link>
-      ,
-      <span className="embed-sources-param-description">
-        {source.organisation}
-      </span>
-    </>
-  );
-};
-
-const SourcesWidget = ({ sources }) => {
-  const [expanded, setExpanded] = React.useState(false);
-
-  return (
-    <div className="tableau-sources-container">
-      <Popup
-        content={
-          sources?.length ? (
-            <ol className="sources-list">
-              {sources?.map((source, index) => {
-                return (
-                  <li key={index}>
-                    <Source source={source} />
-                  </li>
-                );
-              })}
-            </ol>
-          ) : (
-            <p>Data provenance is not set for this visualization.</p>
-          )
-        }
-        position="bottom left"
-        popper={{ id: 'tableau-sources-popup' }}
-        trigger={
-          <button className={cx('tableau-sources-button', { expanded })}>
-            Sources
-          </button>
-        }
-        on="click"
-        onClose={() => {
-          setExpanded(false);
-        }}
-        onOpen={() => {
-          setExpanded(true);
-        }}
-      />
-    </div>
-  );
-};
-
-export default SourcesWidget;