Skip to content

Commit

Permalink
Merge pull request #43 from eea/develop
Browse files Browse the repository at this point in the history
257682 Toolbar
  • Loading branch information
razvanMiu authored Nov 6, 2023
2 parents d18d1c8 + 73b8b7f commit 18cffb1
Show file tree
Hide file tree
Showing 28 changed files with 985 additions and 683 deletions.
20 changes: 20 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,26 @@ 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).

### [7.0.0](https://github.com/eea/volto-embed/compare/6.0.1...7.0.0) - 6 November 2023

#### :rocket: New Features

- feat: add toolbar + refactor [Miu Razvan - [`d439f87`](https://github.com/eea/volto-embed/commit/d439f87045cfea1554319fe05ec2a9d8b0c141cf)]

#### :house: Internal changes

- style: Automated code fix [eea-jenkins - [`c34d6f4`](https://github.com/eea/volto-embed/commit/c34d6f47fd33f728d40254a12c05fe385b27f2e9)]
- chore: husky, lint-staged use fixed versions [valentinab25 - [`31169f7`](https://github.com/eea/volto-embed/commit/31169f73887837463daee76d63b6516046ad49aa)]

#### :hammer_and_wrench: Others

- update tests [Miu Razvan - [`c906b79`](https://github.com/eea/volto-embed/commit/c906b79149e853f718d924871ce2e633e5e427c8)]
- update tests [Miu Razvan - [`11625b6`](https://github.com/eea/volto-embed/commit/11625b65846388a846d1bdf7ebb2e1f8bd103c91)]
- Release 7.0.0 [Alin Voinea - [`cbc5c79`](https://github.com/eea/volto-embed/commit/cbc5c79f1b66daf0d599d9de5a1bc7d137bafed8)]
- add act in unit tests [Miu Razvan - [`ecf5b2f`](https://github.com/eea/volto-embed/commit/ecf5b2fe553d99ad6a11570d3d34852d557fbe85)]
- update [Miu Razvan - [`049cc14`](https://github.com/eea/volto-embed/commit/049cc140bb6ffea4eb3f1555e693e9973ef63d0e)]
- update [Miu Razvan - [`124acea`](https://github.com/eea/volto-embed/commit/124acea1784d25c562d3271cba295927d38de8f8)]
- update unit tests [Miu Razvan - [`52c3be5`](https://github.com/eea/volto-embed/commit/52c3be5b0b56ba5b17fd88e3ff99949b3636e727)]
### [6.0.1](https://github.com/eea/volto-embed/compare/6.0.0...6.0.1) - 12 October 2023

#### :house: Internal changes
Expand Down
2 changes: 1 addition & 1 deletion Dockerfile
Original file line number Diff line number Diff line change
@@ -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
Expand Down
286 changes: 152 additions & 134 deletions Jenkinsfile

Large diffs are not rendered by default.

37 changes: 35 additions & 2 deletions Makefile
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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
Expand Down Expand Up @@ -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


6 changes: 3 additions & 3 deletions cypress.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@ const { defineConfig } = require('cypress');

module.exports = defineConfig({
viewportWidth: 1280,
defaultCommandTimeout: 5000,
defaultCommandTimeout: 8888,
chromeWebSecurity: false,
reporter: 'junit',
video: true,
video: false,
retries: {
runMode: 1,
runMode: 2,
openMode: 0,
},
reporterOptions: {
Expand Down
8 changes: 4 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@eeacms/volto-embed",
"version": "6.0.1",
"version": "7.0.0",
"description": "Embed external content",
"main": "src/index.js",
"author": "European Environment Agency: IDM2 A-Team",
Expand All @@ -27,8 +27,8 @@
"@cypress/code-coverage": "^3.10.0",
"@plone/scripts": "*",
"babel-plugin-transform-class-properties": "^6.24.1",
"husky": "*",
"lint-staged": "*",
"husky": "^8.0.3",
"lint-staged": "^14.0.1",
"md5": "^2.3.0"
},
"lint-staged": {
Expand Down Expand Up @@ -72,4 +72,4 @@
"cypress:open": "make cypress-open",
"prepare": "husky install"
}
}
}
52 changes: 30 additions & 22 deletions src/Iframe/EditIframe.jsx → src/Blocks/Maps/Edit.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,17 +9,15 @@ import PropTypes from 'prop-types';
import { Button, Input, Message } from 'semantic-ui-react';
import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';
import cx from 'classnames';

import { isEqual } from 'lodash';
import { withBlockExtensions } from '@plone/volto/helpers';
import { compose } from 'redux';
import { Icon, SidebarPortal } from '@plone/volto/components';
import InlineForm from '@plone/volto/components/manage/Form/InlineForm';
import clearSVG from '@plone/volto/icons/clear.svg';
import aheadSVG from '@plone/volto/icons/ahead.svg';
import mapsBlockSVG from '@plone/volto/components/manage/Blocks/Maps/block-maps.svg';
import schema from './schema';
import {
PrivacyProtection,
addPrivacyProtectionToSchema,
} from '../PrivacyProtection';
import PrivacyProtection from '@eeacms/volto-embed/PrivacyProtection/PrivacyProtection';
import MapsSidebar from './MapsSidebar';

const messages = defineMessages({
MapsBlockInputPlaceholder: {
Expand Down Expand Up @@ -90,6 +88,19 @@ class Edit extends Component {
this.onKeyDownVariantMenuForm = this.onKeyDownVariantMenuForm.bind(this);
}

/**
* @param {*} nextProps
* @returns {boolean}
* @memberof Edit
*/
shouldComponentUpdate(nextProps) {
return (
this.props.selected ||
nextProps.selected ||
!isEqual(this.props.data, nextProps.data)
);
}

/**
* Backward compatibility
* @method componentDidMount
Expand Down Expand Up @@ -196,6 +207,9 @@ class Edit extends Component {
* @returns {string} Markup for the component.
*/
render() {
const placeholder =
this.props.data.placeholder ||
this.props.intl.formatMessage(messages.MapsBlockInputPlaceholder);
return (
<div
className={cx(
Expand Down Expand Up @@ -224,6 +238,11 @@ class Edit extends Component {
className="google-map"
frameBorder="0"
allowFullScreen
style={
this.props.data.height
? { height: this.props.data.height }
: {}
}
/>
</PrivacyProtection>
</div>
Expand All @@ -235,9 +254,7 @@ class Edit extends Component {
<Input
onKeyDown={this.onKeyDownVariantMenuForm}
onChange={this.onChangeUrl}
placeholder={this.props.intl.formatMessage(
messages.MapsBlockInputPlaceholder,
)}
placeholder={placeholder}
value={this.state.url}
// Prevents propagation to the Dropzone and the opening
// of the upload browser dialog
Expand Down Expand Up @@ -287,22 +304,13 @@ class Edit extends Component {
</center>
</Message>
)}
{!this.props.selected && <div className="map-overlay" />}
<SidebarPortal selected={this.props.selected}>
<InlineForm
schema={addPrivacyProtectionToSchema(schema)}
title={schema.title}
onChangeField={(id, value) => {
this.props.onChangeBlock(this.props.block, {
...this.props.data,
[id]: value,
});
}}
formData={this.props.data}
/>
<MapsSidebar {...this.props} resetSubmitUrl={this.resetSubmitUrl} />
</SidebarPortal>
</div>
);
}
}

export default injectIntl(Edit);
export default compose(injectIntl, withBlockExtensions)(Edit);
119 changes: 119 additions & 0 deletions src/Blocks/Maps/Edit.test.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,119 @@
/* eslint-disable no-unused-vars */
import React from 'react';
import config from '@plone/volto/registry';
import { render, fireEvent, screen } from '@testing-library/react';
import { Provider } from 'react-intl-redux';
import configureStore from 'redux-mock-store';
import Edit from './Edit';
import '@testing-library/jest-dom/extend-expect';

const mockStore = configureStore();

const store = mockStore(() => ({
connected_data_parameters: {},
router: {
location: {
pathname: '',
},
},
intl: {
locale: 'en',
messages: {},
},
}));

config.blocks.blocksConfig = {
...config.blocks.blocksConfig,
maps: {
id: 'maps',
title: 'Maps',
group: 'media',
extensions: {},
variations: [],
restricted: false,
mostUsed: true,
sidebarTab: 1,
security: {
addPermission: [],
view: [],
},
},
};

jest.mock(
'@eeacms/volto-embed/PrivacyProtection/PrivacyProtection',
() => ({ children }) => children,
);

describe('Edit', () => {
it('renders without crashing', () => {
render(
<Provider store={store}>
<Edit
selected={false}
block="block"
index={1}
data={{
'@type': 'maps',
url:
'https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3027.7835278268726!2d14.38842915203974!3d40.634655679238854!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x133b994881d943cb%3A0x6ab93db57d3272f0!2sHotel+Mediterraneo+Sorrento!5e0!3m2!1sen!2ses!4v1550168740166',
}}
pathname="/"
onChangeBlock={() => {}}
onSelectBlock={() => {}}
onDeleteBlock={() => {}}
onFocusPreviousBlock={() => {}}
onFocusNextBlock={() => {}}
handleKeyDown={() => {}}
/>
</Provider>,
);
});

it('submits url when button is clicked', async () => {
const url =
'https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3027.7835278268726!2d14.38842915203974!3d40.634655679238854!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x133b994881d943cb%3A0x6ab93db57d3272f0!2sHotel+Mediterraneo+Sorrento!5e0!3m2!1sen!2ses!4v1550168740166';

const { container, getByPlaceholderText } = render(
<Provider store={store}>
<Edit
selected={false}
block="block"
index={1}
data={{
'@type': 'maps',
dataprotection: {
privacy_statement: 'test',
},
}}
pathname="/"
onChangeBlock={() => {}}
onSelectBlock={() => {}}
onDeleteBlock={() => {}}
onFocusPreviousBlock={() => {}}
onFocusNextBlock={() => {}}
handleKeyDown={() => {}}
/>
</Provider>,
);

const input = getByPlaceholderText('Enter map Embed Code');

fireEvent.click(input);
fireEvent.change(input, { target: { value: url } });
// screen.debug();
// expect(input.value).toBe(url);

// fireEvent.click(container.querySelector('button.cancel'));

// fireEvent.keyDown(input, { key: 'Enter', code: 'Enter' });
// fireEvent.keyDown(input, { key: 'Escape', code: 'Escape' });
// fireEvent.keyDown(input, { key: 'KeyA', code: 'KeyA' });

// fireEvent.change(input, { target: { value: '<iframe src="test"/>' } });
// fireEvent.keyDown(input, { key: 'Enter', code: 'Enter' });

// const button = container.querySelector('button.ui.basic.primary.button');
// fireEvent.click(button);
});
});
Loading

0 comments on commit 18cffb1

Please sign in to comment.