Merge pull request #5 from eea/develop

Release

.gitignore

@@ -1,3 +1,25 @@
+.vscode/
+.history
+.eslintrc.js
+project
+logs
 *.log
-node_modules/*
+npm-debug.log*
+.DS_Store
+*.swp
+yarn-error.log
+yarn.lock
+package-lock.json
+
+node_modules
+build
+dist
+cypress/videos
+cypress/reports
+screenshots
+videos
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
 *~

.project.eslintrc.js

@@ -0,0 +1,46 @@
+const fs = require('fs');
+const path = require('path');
+
+const projectRootPath = fs.realpathSync('./project');    // __dirname
+const packageJson = require(path.join(projectRootPath, 'package.json'));
+const jsConfig = require(path.join(projectRootPath, 'jsconfig.json')).compilerOptions;
+
+const pathsConfig = jsConfig.paths;
+
+let voltoPath = path.join(projectRootPath, 'node_modules/@plone/volto');
+
+Object.keys(pathsConfig).forEach(pkg => {
+  if (pkg === '@plone/volto') {
+    voltoPath = `./${jsConfig.baseUrl}/${pathsConfig[pkg][0]}`;
+  }
+});
+const AddonConfigurationRegistry = require(`${voltoPath}/addon-registry.js`);
+const reg = new AddonConfigurationRegistry(projectRootPath);
+
+// Extends ESlint configuration for adding the aliases to `src` directories in Volto addons
+const addonAliases = Object.keys(reg.packages).map(o => [
+  o,
+  reg.packages[o].modulePath,
+]);
+
+
+module.exports = {
+  extends: `${projectRootPath}/node_modules/@plone/volto/.eslintrc`,
+  settings: {
+    'import/resolver': {
+      alias: {
+        map: [
+          ['@plone/volto', '@plone/volto/src'],
+          ...addonAliases,
+          ['@package', `${__dirname}/src`],
+          ['~', `${__dirname}/src`],
+        ],
+        extensions: ['.js', '.jsx', '.json'],
+      },
+      'babel-plugin-root-import': {
+        rootPathSuffix: 'src',
+      },
+    },
+  },
+};
+

CHANGELOG.md

@@ -4,9 +4,19 @@ 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).
 
+#### [3.0.0](https://github.com/eea/volto-widgets-view/compare/2.1.2...3.0.0)
+
+- Code cleanup [`2becdc5`](https://github.com/eea/volto-widgets-view/commit/2becdc5a196edaa9db8d1741cd7752fdac39013f)
+- Release 3.0.0 [`95a63b3`](https://github.com/eea/volto-widgets-view/commit/95a63b3745100fe1bf59bf6e63258554d2685239)
+- Fix config.widgets.views in order to be able to register views from other add-ons [`1c01da9`](https://github.com/eea/volto-widgets-view/commit/1c01da963a43339422019ab2a07ec46db1abed82)
+- Add Sonarqube tag using frontend addons list [`8274ffb`](https://github.com/eea/volto-widgets-view/commit/8274ffb7e96066c21680b2addfcd131a52aaa461)
+- Add Sonarqube tag using frontend addons list [`852108b`](https://github.com/eea/volto-widgets-view/commit/852108bf32a2e16e0f1212f993a2c467ada89a69)
+
 #### [2.1.2](https://github.com/eea/volto-widgets-view/compare/2.1.1...2.1.2)
 
-- Cypress coverage [`6bceb95`](https://github.com/eea/volto-widgets-view/commit/6bceb950df49d6d2aaa406f607293f810c92a43e)
+> 27 May 2021
+
+- Cypress coverage [`#4`](https://github.com/eea/volto-widgets-view/pull/4)
 
 #### [2.1.1](https://github.com/eea/volto-widgets-view/compare/2.1.0...2.1.1)
 

DEVELOP.md

@@ -6,14 +6,12 @@ Before starting make sure your development environment is properly set. See [Vol
 
 1.  Make sure you have installed `yo`, `@plone/generator-volto` and `mrs-developer`
 
-        $ npm install -g yo
-        $ npm install -g @plone/generator-volto
-        $ npm install -g mrs-developer
+        npm install -g yo @plone/generator-volto mrs-developer
 
 1.  Create new volto app
 
-        $ yo @plone/volto my-volto-project --addon @eeacms/volto-widgets-view
-        $ cd my-volto-project
+        yo @plone/volto my-volto-project --addon @eeacms/volto-widgets-view --skip-install
+        cd my-volto-project
 
 1.  Add the following to `mrs.developer.json`:
 
@@ -28,25 +26,26 @@ Before starting make sure your development environment is properly set. See [Vol
 
 1.  Install
 
-        $ yarn develop
-        $ yarn
+        yarn develop
+        yarn
 
 1.  Start backend
 
-        $ docker run -d --name plone -p 8080:8080 -e SITE=Plone plone
+        docker pull plone
+        docker run -d --name plone -p 8080:8080 -e SITE=Plone -e PROFILES="profile-plone.restapi:blocks" plone
 
     ...wait for backend to setup and start - `Ready to handle requests`:
 
-        $ docker logs -f plone
+        docker logs -f plone
 
     ...you can also check http://localhost:8080/Plone
 
 1.  Start frontend
 
-        $ yarn start
+        yarn start
 
 1.  Go to http://localhost:3000
 
 1.  Happy hacking!
 
-        $ cd src/addons/volto-widgets-view/
+        cd src/addons/volto-widgets-view/

Jenkinsfile

@@ -4,7 +4,7 @@ pipeline {
   environment {
         GIT_NAME = "volto-widgets-view"
         NAMESPACE = "@eeacms"
-        SONARQUBE_TAGS = "volto.eea.europa.eu"
+        SONARQUBE_TAGS = "volto.eea.europa.eu,forest.eea.europa.eu,biodiversity.europa.eu"
         DEPENDENCIES = ""
     }
 

Makefile

@@ -0,0 +1,49 @@
+SHELL=/bin/bash
+
+DIR=$(shell basename $$(pwd))
+ADDON ?= "@eeacms/volto-widgets-view"
+
+# We like colors
+# From: https://coderwall.com/p/izxssa/colored-makefile-for-golang-projects
+RED=`tput setaf 1`
+GREEN=`tput setaf 2`
+RESET=`tput sgr0`
+YELLOW=`tput setaf 3`
+
+project:
+	npm install -g yo
+	npm install -g @plone/generator-volto
+	npm install -g mrs-developer
+	yo @plone/volto project --addon ${ADDON} --workspace "src/addons/${DIR}" --no-interactive
+	ln -sf $$(pwd) project/src/addons/
+	cp .project.eslintrc.js .eslintrc.js
+	cd project && yarn
+	@echo "-------------------"
+	@echo "$(GREEN)Volto project is ready!$(RESET)"
+	@echo "$(RED)Now run: cd project && yarn start$(RESET)"
+
+all: project
+
+.PHONY: start-test-backend
+start-test-backend: ## Start Test Plone Backend
+	@echo "$(GREEN)==> Start Test Plone Backend$(RESET)"
+	docker run -i --rm -e ZSERVER_HOST=0.0.0.0 -e ZSERVER_PORT=55001 -p 55001:55001 -e SITE=plone -e APPLY_PROFILES=plone.app.contenttypes:plone-content,plone.restapi:default,kitconcept.volto:default-homepage -e CONFIGURE_PACKAGES=plone.app.contenttypes,plone.restapi,kitconcept.volto,kitconcept.volto.cors -e ADDONS='plone.app.robotframework plone.app.contenttypes plone.restapi kitconcept.volto' plone ./bin/robot-server plone.app.robotframework.testing.PLONE_ROBOT_TESTING
+
+.PHONY: start-backend-docker
+start-backend-docker:		## Starts a Docker-based backend
+	@echo "$(GREEN)==> Start Docker-based Plone Backend$(RESET)"
+	docker run -it --rm --name=plone -p 8080:8080 -e SITE=Plone -e ADDONS="kitconcept.volto" -e ZCML="kitconcept.volto.cors" plone
+
+.PHONY: test
+test:
+	docker pull plone/volto-addon-ci
+	docker run -it --rm -e NAMESPACE="@eeacms" -e GIT_NAME="${DIR}" -e RAZZLE_JEST_CONFIG=jest-addon.config.js -v "$$(pwd):/opt/frontend/my-volto-project/src/addons/${DIR}" plone/volto-addon-ci yarn test --watchAll=false
+
+.PHONY: test-update
+test-update:
+	docker pull plone/volto-addon-ci
+	docker run -it --rm -e NAMESPACE="@eeacms" -e GIT_NAME="${DIR}" -e RAZZLE_JEST_CONFIG=jest-addon.config.js -v "$$(pwd):/opt/frontend/my-volto-project/src/addons/${DIR}" plone/volto-addon-ci yarn test --watchAll=false -u
+
+.PHONY: help
+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 :)"

jest-addon.config.js

@@ -25,4 +25,12 @@ module.exports = {
     '^.+\\.(jpg)$': 'jest-file',
     '^.+\\.(svg)$': './node_modules/@plone/volto/jest-svgsystem-transform.js',
   },
+  coverageThreshold: {
+    global: {
+      branches: 5,
+      functions: 5,
+      lines: 5,
+      statements: 5,
+    },
+  },
 };

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-widgets-view",
-  "version": "2.1.2",
+  "version": "3.0.0",
   "description": "Volto Widgets in View mode",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",
@@ -26,14 +26,18 @@
   "scripts": {
     "release": "release-it",
     "bootstrap": "npm install -g ejs; npm link ejs; node bootstrap",
-    "stylelint": "../../../node_modules/stylelint/bin/stylelint.js --allow-empty-input 'src/**/*.{css,less}'",
-    "stylelint:overrides": "../../../node_modules/.bin/stylelint --syntax less --allow-empty-input 'theme/**/*.overrides' 'src/**/*.overrides'",
+    "test": "make test",
+    "test:fix": "make test-update",
+    "i18n": "rm -rf build/messages && NODE_ENV=production node src/i18n.js",
+    "pre-commit": "yarn stylelint:fix && yarn prettier:fix && yarn lint:fix",
+    "stylelint": "if [ -d ./project ]; then ./project/node_modules/stylelint/bin/stylelint.js --allow-empty-input 'src/**/*.{css,less}'; else ../../../node_modules/stylelint/bin/stylelint.js --allow-empty-input 'src/**/*.{css,less}'; fi",
+    "stylelint:overrides": "if [ -d ./project ]; then ./project/node_modules/.bin/stylelint --syntax less --allow-empty-input 'theme/**/*.overrides' 'src/**/*.overrides'; else ../../../node_modules/.bin/stylelint --syntax less --allow-empty-input 'theme/**/*.overrides' 'src/**/*.overrides'; fi",
     "stylelint:fix": "yarn stylelint --fix && yarn stylelint:overrides --fix",
-    "prettier": "../../../node_modules/.bin/prettier --single-quote --check 'src/**/*.{js,jsx,json,css,less,md}'",
-    "prettier:fix": "../../../node_modules/.bin/prettier --single-quote --write 'src/**/*.{js,jsx,json,css,less,md}'",
-    "lint": "../../../node_modules/eslint/bin/eslint.js --max-warnings=0 'src/**/*.{js,jsx}'",
-    "lint:fix": "../../../node_modules/eslint/bin/eslint.js --fix 'src/**/*.{js,jsx}'",
-    "cypress:run": "../../../node_modules/cypress/bin/cypress run",
-    "cypress:open": "../../../node_modules/cypress/bin/cypress open"
+    "prettier": "if [ -d ./project ]; then ./project/node_modules/.bin/prettier --single-quote --check 'src/**/*.{js,jsx,json,css,less,md}'; else ../../../node_modules/.bin/prettier --single-quote --check 'src/**/*.{js,jsx,json,css,less,md}'; fi",
+    "prettier:fix": "if [ -d ./project ]; then ./project/node_modules/.bin/prettier --single-quote --write 'src/**/*.{js,jsx,json,css,less,md}'; else ../../../node_modules/.bin/prettier --single-quote --write 'src/**/*.{js,jsx,json,css,less,md}'; fi",
+    "lint": "if [ -d ./project ]; then ./project/node_modules/eslint/bin/eslint.js --max-warnings=0 'src/**/*.{js,jsx}'; else ../../../node_modules/eslint/bin/eslint.js --max-warnings=0 'src/**/*.{js,jsx}'; fi",
+    "lint:fix": "if [ -d ./project ]; then ./project/node_modules/eslint/bin/eslint.js --fix 'src/**/*.{js,jsx}'; else ../../../node_modules/eslint/bin/eslint.js --fix 'src/**/*.{js,jsx}'; fi",
+    "cypress:run": "if [ -d ./project ]; then ./project/node_modules/cypress/bin/cypress run; else ../../../node_modules/cypress/bin/cypress run; fi",
+    "cypress:open": "if [ -d ./project ]; then ./project/node_modules/cypress/bin/cypress open; else ../../../node_modules/cypress/bin/cypress open; fi"
   }
 }

src/helpers/Widget.js

@@ -15,10 +15,7 @@ const getWidgetByFieldId = (id) => config.widgets.views.id[id] || null;
  * @returns {string} Widget component.
  */
 const getWidgetByName = (widget) =>
-  typeof widget === 'string'
-    ? config.widgets.views.widget[widget] || getWidgetDefault()
-    : null;
-
+  typeof widget === 'string' ? config.widgets.views.widget[widget] : null;
 /**
  * Get widget by field's `vocabulary` attribute
  * @method getWidgetByVocabulary

src/index.js

@@ -19,14 +19,14 @@ import { UrlWidget } from '@eeacms/volto-widgets-view/components';
 
 const applyConfig = (config) => {
   config.widgets.views = {
-    ...config.widgets.views,
     getWidget: getWidgetView,
     default: TextWidget,
     id: {
       file: FileWidget,
       image: ImageWidget,
       relatedItems: RelationsWidget,
       subjects: TokenWidget,
+      ...(config.widgets.views?.id || {}),
     },
     widget: {
       array: ArrayWidget,
@@ -47,12 +47,14 @@ const applyConfig = (config) => {
       textarea: TextWidget,
       title: TitleWidget,
       url: UrlWidget,
+      ...(config.widgets.views?.widget || {}),
     },
     vocabulary: {},
     choices: SelectWidget,
     type: {
       array: ArrayWidget,
       boolean: BooleanWidget,
+      ...(config.widgets.views?.type || {}),
     },
   };