Skip to content

Commit

Permalink
Merge pull request #13 from eea/develop
Browse files Browse the repository at this point in the history
Release copy/paste fix
  • Loading branch information
avoinea authored Aug 13, 2021
2 parents 369388d + 475ba07 commit d7610ba
Show file tree
Hide file tree
Showing 19 changed files with 609 additions and 72 deletions.
6 changes: 6 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
.vscode/
.history
.eslintrc.js
project
logs
*.log
npm-debug.log*
Expand All @@ -10,6 +12,10 @@ yarn-error.log
node_modules
build
dist
cypress/videos
cypress/reports
screenshots
videos
.env.local
.env.development.local
.env.test.local
Expand Down
46 changes: 46 additions & 0 deletions .project.eslintrc.js
Original file line number Diff line number Diff line change
@@ -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',
},
},
},
};

13 changes: 12 additions & 1 deletion CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,20 @@ 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).

#### [2.4.0](https://github.com/eea/volto-slate-footnote/compare/2.3.1...2.4.0)

- Copy and improvements [`#11`](https://github.com/eea/volto-slate-footnote/pull/11)
- Cypress and tests [`#12`](https://github.com/eea/volto-slate-footnote/pull/12)
- Bump version to 2.4.0 [`bef0d34`](https://github.com/eea/volto-slate-footnote/commit/bef0d34c2b9c20915578ffaefb4fd30cbf42f0a1)
- Fix Slate point from DOM crash [`c852f79`](https://github.com/eea/volto-slate-footnote/commit/c852f7987ffe8db433235b70792002d40ade690f)
- Fix crash on copy&paste beforeInsert condition [`85172cf`](https://github.com/eea/volto-slate-footnote/commit/85172cff3e2ea95a86d4b4fb452f3c0287b80e8f)
- Add Sonarqube tag using frontend addons list [`b471c41`](https://github.com/eea/volto-slate-footnote/commit/b471c418d198b1bde95acfe0b256f642bacc6865)

#### [2.3.1](https://github.com/eea/volto-slate-footnote/compare/2.3.0...2.3.1)

- Make add-on dependencies more flexible [`5c68932`](https://github.com/eea/volto-slate-footnote/commit/5c68932aae25f376c87523e7ce63d9c8e516721c)
> 25 June 2021
- Make add-on dependencies more flexible [`#10`](https://github.com/eea/volto-slate-footnote/pull/10)

#### [2.3.0](https://github.com/eea/volto-slate-footnote/compare/2.2.2...2.3.0)

Expand Down
2 changes: 1 addition & 1 deletion Jenkinsfile
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ pipeline {
environment {
GIT_NAME = "volto-slate-footnote"
NAMESPACE = "@eeacms"
SONARQUBE_TAGS = "volto.eea.europa.eu"
SONARQUBE_TAGS = "volto.eea.europa.eu,biodiversity.europa.eu"
DEPENDENCIES = ""
}

Expand Down
49 changes: 49 additions & 0 deletions Makefile
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
SHELL=/bin/bash

DIR=$(shell basename $$(pwd))
ADDON ?= "@eeacms/volto-slate-footnote"

# 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: 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 :)"

.PHONY: test
test:
docker pull plone/volto-addon-ci
docker run -it --rm -e GIT_NAME=volto-slate -e RAZZLE_JEST_CONFIG=jest-addon.config.js -v "$$(pwd):/opt/frontend/my-volto-project/src/addons/volto-slate" plone/volto-addon-ci yarn test --watchAll=false

.PHONY: test-update
test-update:
docker pull plone/volto-addon-ci
docker run -it --rm -e GIT_NAME=volto-slate -e RAZZLE_JEST_CONFIG=jest-addon.config.js -v "$$(pwd):/opt/frontend/my-volto-project/src/addons/volto-slate" plone/volto-addon-ci yarn test --watchAll=false -u
Original file line number Diff line number Diff line change
Expand Up @@ -18,15 +18,19 @@ describe('Blocks Tests', () => {

// Add block
cy.get('.ui.basic.icon.button.block-add-button').first().click();
cy.get('.blocks-chooser .title').contains('Media').click();
cy.get('.content.active.media .button.image').contains('Image').click();
cy.get('.blocks-chooser .title').contains('Text').click();
cy.get('.content.active.text .button.slateFootnotes').contains('Footnotes').click();

// Configure block
cy.get('[id=sidebar-properties] [name=title]').click().type('Footnotes');
cy.get('[id=sidebar-properties] label[for=field-global]').click();

// Save
cy.get('#toolbar-save').click();
cy.url().should('eq', Cypress.config().baseUrl + '/cypress/my-page');

// then the page view should contain our changes
cy.contains('My Add-on Page');
cy.get('.block.image');
cy.contains('Footnotes');
});
});
63 changes: 63 additions & 0 deletions cypress/integration/02-block-slate.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
import { setupBeforeEach, tearDownAfterEach } from '../support';

describe('Blocks Tests', () => {
beforeEach(setupBeforeEach);
afterEach(tearDownAfterEach);

it('Add Block and create footnote', () => {
// Change page title
cy.get('.documentFirstHeading > .public-DraftStyleDefault-block')
.clear()
.type('My Add-on Page')
.get('.documentFirstHeading span[data-text]')
.contains('My Add-on Page');

cy.get('.documentFirstHeading > .public-DraftStyleDefault-block').type(
'{enter}',
);

// Add some text with footnotes
cy.get('.slate-editor [contenteditable=true]')
.focus()
.click()
.wait(1000)
.type('Colorless green ideas sleep furiously.');

cy.get('.slate-editor.selected [contenteditable=true]').setSelection(
'furiously',
);

cy.wait(500);

cy.get('.slate-inline-toolbar .button-wrapper a[title="Footnote"]').click();
cy.get('.sidebar-container [id=field-footnote]').click().type('Citation');
cy.get('.sidebar-container .form .header button:first-of-type').click();

// Add block
cy.get('.slate-editor [contenteditable=true]')
.focus()
.click()
.wait(1000)
.type('{enter}');

cy.get('.ui.basic.icon.button.block-add-button').first().click();
cy.get('.blocks-chooser .title').contains('Text').click();
cy.get('.content.active.text .button.slateFootnotes')
.contains('Footnotes')
.click();

// Configure block
cy.get('[id=sidebar-properties] [name=title]').click().type('Footnotes');
cy.get('[id=sidebar-properties] label[for=field-global]').click();

// Save
cy.get('#toolbar-save').click();
cy.url().should('eq', Cypress.config().baseUrl + '/cypress/my-page');

// then the page view should contain our changes
cy.contains('My Add-on Page');
cy.get('span.citation-item').contains('furiously');
cy.contains('Footnotes');
cy.contains('Citation');
});
});
8 changes: 5 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@eeacms/volto-slate-footnote",
"version": "2.3.1",
"version": "2.4.0",
"description": "volto-slate-footnote: Volto add-on",
"main": "src/index.js",
"author": "European Environment Agency: IDM2 A-Team",
Expand Down Expand Up @@ -31,14 +31,16 @@
"scripts": {
"release": "release-it",
"bootstrap": "npm install -g ejs; npm link ejs; node bootstrap",
"test": "make test",
"test:fix": "make test-update",
"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'",
"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"
"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"
}
}
1 change: 1 addition & 0 deletions src/Blocks/Footnote/FootnotesBlockEdit.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ const FootnotesBlockEdit = (props) => {
if (!instructions || instructions === '<p><br/></p>') {
instructions = props.formDescription;
}

return (
<>
<FootnotesBlockView {...props} properties={properties} />
Expand Down
88 changes: 42 additions & 46 deletions src/Blocks/Footnote/FootnotesBlockView.jsx
Original file line number Diff line number Diff line change
@@ -1,74 +1,70 @@
import React from 'react';
import { Node } from 'slate';
import config from '@plone/volto/registry';
import React, { useEffect, useState } from 'react';
import { getAllBlocks } from 'volto-slate/utils';
import './less/public.less';
import {
makeFootnoteListOfUniqueItems,
makeFootnote,
} from '@eeacms/volto-slate-footnote/editor/utils';

const makeFootnote = (footnote) => {
const free = footnote ? footnote.replace('<?xml version="1.0"?>', '') : '';

return free;
};
const alphabet = 'abcdefghijklmnopqrstuvwxyz';

/**
* @summary The React component that displays the list of footnotes inserted
* before in the current page.
* @param {object} props Contains the properties `data` and `properties` as
* Will show an indice for the footnote/citation but also numbers to indicate each
* text that has same reference
* @param {Object} props Contains the properties `data` and `properties` as
* received from the Volto form.
*/
const FootnotesBlockView = (props) => {
const { data, properties } = props;
const { title, global, placeholder = 'Footnotes' } = data;
const { footnotes } = config.settings;
const metadata = props.metadata || properties;
const [notesObj, setNodesObjs] = useState(null);
const metadata = props.metadata ? props.metadata : properties;

// console.log(properties);
const blocks = [];
if (global) {
getAllBlocks(metadata, blocks);
} else {
getAllBlocks(properties, blocks);
}
const notes = [];
// TODO: slice the blocks according to existing footnote listing blocks. A
// footnote listing block should reset the counter of the footnotes above it
// If so, then it should only include the footnotes between the last footnotes
// listing block and this block
blocks
.filter((b) => b['@type'] === 'slate')
.forEach(({ value }) => {
if (!value) return;
useEffect(() => {
if (properties) {
const globalMetadata = global ? metadata : properties;
const blocks = getAllBlocks(globalMetadata, []);
const notesObjResult = makeFootnoteListOfUniqueItems(blocks);

Array.from(Node.elements(value[0])).forEach(([node]) => {
if (
footnotes.includes(node.type) &&
// do not add duplicates coming from copy/paste of notes
notes.filter((note) => {
return node.data && note.data.uid === node.data.uid;
}).length === 0
) {
notes.push(node);
}
});
});
setNodesObjs(notesObjResult);
}
}, [properties]); // eslint-disable-line

return (
<div className="footnotes-listing-block">
<h3 title={placeholder}>{title}</h3>
{notes && (
{notesObj && (
<ol>
{notes.map(({ data }) => {
const { uid, footnote } = data;
{Object.keys(notesObj).map((noteId) => {
const note = notesObj[noteId];
const { uid, footnote, zoteroId } = note;
const { refs } = note;
const refsList = refs ? Object.keys(refs) : null;

return (
<li key={uid} id={`footnote-${uid}`}>
<li key={uid} id={`footnote-${zoteroId || uid}`}>
<div
dangerouslySetInnerHTML={{
__html: makeFootnote(footnote),
}}
/>
<a href={`#ref-${uid}`} aria-label="Back to content">
</a>
{refsList ? (
refsList.map((ref, index) => (
<sup id={`cite_ref-${ref}`} key={`indice-${ref}`}>
<a href={`#ref-${ref}`} aria-label="Back to content">
{alphabet[index]}
</a>{' '}
</sup>
))
) : (
<sup id={`cite_ref-${uid}`}>
<a href={`#ref-${uid}`} aria-label="Back to content">
</a>{' '}
</sup>
)}
</li>
);
})}
Expand Down
Loading

0 comments on commit d7610ba

Please sign in to comment.