diff --git a/src/Blocks/EmbedEEATableauBlock/Edit.jsx b/src/Blocks/EmbedEEATableauBlock/Edit.jsx
new file mode 100644
index 0000000..5777b1d
--- /dev/null
+++ b/src/Blocks/EmbedEEATableauBlock/Edit.jsx
@@ -0,0 +1,53 @@
+import React from 'react';
+import BlockDataForm from '@plone/volto/components/manage/Form/BlockDataForm';
+import { SidebarPortal } from '@plone/volto/components';
+import { getContent } from '@plone/volto/actions';
+import View from './View';
+import Schema from './schema';
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+
+const Edit = (props) => {
+ const { data, block, onChangeBlock } = props;
+ const schema = React.useMemo(() => Schema(props), [props]);
+
+ React.useEffect(() => {
+ if (!Object.hasOwn(data, 'show_sources')) {
+ onChangeBlock(block, {
+ ...data,
+ show_sources: true,
+ });
+ }
+ }, [block, data, onChangeBlock]);
+
+ return (
+ <>
+
+
+ {
+ props.onChangeBlock(block, {
+ ...data,
+ [id]: value,
+ });
+ }}
+ formData={data}
+ />
+
+ >
+ );
+};
+
+export default compose(
+ connect(
+ (state, props) => ({
+ block_data: state.content.data,
+ }),
+ {
+ getContent,
+ },
+ ),
+)(Edit);
diff --git a/src/Blocks/EmbedEEATableauBlock/View.jsx b/src/Blocks/EmbedEEATableauBlock/View.jsx
new file mode 100644
index 0000000..f5dcc93
--- /dev/null
+++ b/src/Blocks/EmbedEEATableauBlock/View.jsx
@@ -0,0 +1,25 @@
+import React from 'react';
+import TableauView from '../../TableauBlock/View';
+import { Sources } from '../../Sources';
+
+const View = (props) => {
+ const { data } = props || {};
+ const { vis_url = '' } = data;
+ const with_sources = data?.with_sources ?? false;
+
+ React.useEffect(() => {
+ if (vis_url) {
+ props.getContent(vis_url, null);
+ }
+ }, [vis_url]);
+
+ return (
+ <>
+
+ {with_sources &&
+ (props.mode !== 'edit' ? : '')}
+ >
+ );
+};
+
+export default View;
diff --git a/src/Blocks/EmbedEEATableauBlock/schema.js b/src/Blocks/EmbedEEATableauBlock/schema.js
new file mode 100644
index 0000000..bac14e3
--- /dev/null
+++ b/src/Blocks/EmbedEEATableauBlock/schema.js
@@ -0,0 +1,71 @@
+const sourceSchema = {
+ title: 'Source',
+
+ fieldsets: [
+ {
+ id: 'default',
+ title: 'Default',
+ fields: ['source', 'source_link'],
+ },
+ ],
+
+ properties: {
+ source: {
+ title: 'Source',
+ widget: 'textarea',
+ },
+ source_link: {
+ title: 'Link',
+ type: 'string',
+ },
+ },
+
+ required: ['source'],
+};
+
+const Schema = (props) => {
+ return {
+ title: 'Embed EEA Tableau',
+ fieldsets: [
+ {
+ id: 'default',
+ title: 'Default',
+ fields: ['vis_url', 'height', 'show_sources'],
+ },
+ {
+ id: 'sources',
+ title: 'Sources',
+ fields: ['tableauSources', 'with_sources'],
+ },
+ ],
+ properties: {
+ vis_url: {
+ widget: 'object_by_path',
+ title: 'Visualization',
+ },
+ height: {
+ title: 'Height',
+ type: 'number',
+ default: 450,
+ },
+ tableauSources: {
+ widget: 'object_list',
+ title: 'Sources',
+ schema: sourceSchema,
+ },
+ show_sources: {
+ title: 'Toggle sources',
+ type: 'boolean',
+ },
+ with_sources: {
+ title: 'Sources visible',
+ type: 'boolean',
+ defaultValue: true,
+ },
+ },
+
+ required: ['vis_url'],
+ };
+};
+
+export default Schema;
diff --git a/src/Sources/Sources.jsx b/src/Sources/Sources.jsx
new file mode 100644
index 0000000..0a3085c
--- /dev/null
+++ b/src/Sources/Sources.jsx
@@ -0,0 +1,42 @@
+import React from 'react';
+import { UniversalLink, Icon } from '@plone/volto/components';
+
+import rightKeySVG from '@plone/volto/icons/right-key.svg';
+import downKeySVG from '@plone/volto/icons/down-key.svg';
+
+import './style.css';
+
+const SourcesWidget = ({ data }) => {
+ const [expand, setExpand] = React.useState(true);
+
+ return (
+
+ );
+};
+
+export default SourcesWidget;
diff --git a/src/Sources/index.js b/src/Sources/index.js
new file mode 100644
index 0000000..79775f1
--- /dev/null
+++ b/src/Sources/index.js
@@ -0,0 +1,3 @@
+import Sources from './Sources';
+
+export { Sources };
diff --git a/src/Sources/style.css b/src/Sources/style.css
new file mode 100644
index 0000000..768ef82
--- /dev/null
+++ b/src/Sources/style.css
@@ -0,0 +1,7 @@
+.embed-sources-header {
+ cursor: pointer;
+}
+
+.embed-sources-param-description {
+ margin-left: 5px;
+}
\ No newline at end of file
diff --git a/src/index.js b/src/index.js
index 0e6ac96..93c01c5 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,6 +1,8 @@
import sliderSVG from '@plone/volto/icons/slider.svg';
import TableauEdit from './TableauBlock/Edit';
import TableauView from './TableauBlock/View';
+import EmbedTableauView from './Blocks/EmbedEEATableauBlock/View';
+import EmbedTableauEdit from './Blocks/EmbedEEATableauBlock/Edit';
import tableauStore from './store';
@@ -44,6 +46,28 @@ const applyConfig = (config) => {
},
};
+ config.blocks.blocksConfig.embed_eea_tableau_block = {
+ id: 'embed_eea_tableau_block',
+ title: 'Embed EEA Tableau',
+ icon: sliderSVG,
+ group: 'common',
+ edit: EmbedTableauEdit,
+ view: EmbedTableauView,
+ restricted: false,
+ mostUsed: false,
+ sidebarTab: 1,
+ blocks: {},
+ security: {
+ addPermission: [],
+ view: [],
+ },
+ breakpoints: {
+ desktop: [Infinity, 982],
+ tablet: [981, 768],
+ mobile: [767, 0],
+ },
+ };
+
return config;
};