feat: add enlarge option for tableau

eea · Nov 15, 2023 · 4af7c29 · 4af7c29
1 parent 4ae1623
commit 4af7c29
Show file tree

Hide file tree

Showing 8 changed files with 45 additions and 2 deletions.
diff --git a/src/Blocks/EmbedTableauVisualization/View.jsx b/src/Blocks/EmbedTableauVisualization/View.jsx
@@ -14,6 +14,7 @@ const View = (props) => {
     with_more_info = true,
     with_download = true,
     with_share = true,
+    with_enlarge = true,
     tableau_height = 700,
   } = data;
   const { figure_note = [], data_provenance = {}, tableau_visualization } =
@@ -51,6 +52,7 @@ const View = (props) => {
                   with_more_info,
                   with_download,
                   with_share,
+                  with_enlarge,
                   tableau_height,
                   tableau_vis_url,
                 }}

diff --git a/src/Blocks/EmbedTableauVisualization/schema.js b/src/Blocks/EmbedTableauVisualization/schema.js
@@ -58,6 +58,7 @@ export default () => {
           'with_more_info',
           'with_download',
           'with_share',
+          'with_enlarge',
         ],
       },
       {
@@ -87,6 +88,11 @@ export default () => {
         type: 'boolean',
         defaultValue: true,
       },
+      with_enlarge: {
+        title: 'Show enlarge button',
+        type: 'boolean',
+        defaultValue: true,
+      },
       with_download: {
         title: 'Show download button',
         type: 'boolean',

diff --git a/src/Blocks/TableauBlock/View.jsx b/src/Blocks/TableauBlock/View.jsx
@@ -22,6 +22,7 @@ const View = React.forwardRef((props, ref) => {
     with_sources = true,
     with_download = true,
     with_share = true,
+    with_enlarge = true,
     sources,
   } = data;
 
@@ -75,7 +76,13 @@ const View = React.forwardRef((props, ref) => {
         ref={viz}
         mode={mode}
         block={block}
-        data={{ ...data, with_sources, with_download, with_share }}
+        data={{
+          ...data,
+          with_sources,
+          with_download,
+          with_share,
+          with_enlarge,
+        }}
         sources={sources}
         extraFilters={extraFilters}
         extraOptions={extraOptions}

diff --git a/src/Blocks/TableauBlock/schema.js b/src/Blocks/TableauBlock/schema.js
@@ -100,6 +100,7 @@ export default (config, viz, vizState) => {
           'with_sources',
           'with_download',
           'with_share',
+          'with_enlarge',
         ],
       },
       {
@@ -147,6 +148,11 @@ export default (config, viz, vizState) => {
         type: 'boolean',
         defaultValue: true,
       },
+      with_enlarge: {
+        title: 'Show enlarge button',
+        type: 'boolean',
+        defaultValue: true,
+      },
       with_sources: {
         title: 'Show sources',
         type: 'boolean',

diff --git a/src/Tableau/Tableau.jsx b/src/Tableau/Tableau.jsx
@@ -19,6 +19,7 @@ import {
   Sources,
   MoreInfo,
   Share,
+  Enlarge,
 } from '@eeacms/volto-embed/Toolbar';
 import { useTableau } from '@eeacms/volto-tableau/hooks';
 import { JsonCodeSnippet, Download } from '@eeacms/volto-tableau/Utils';
@@ -107,6 +108,7 @@ const Tableau = forwardRef((props, ref) => {
     with_more_info = true,
     with_download = true,
     with_share = true,
+    with_enlarge = true,
     tableau_height = 700,
   } = data;
   const device = useMemo(
@@ -444,6 +446,22 @@ const Tableau = forwardRef((props, ref) => {
             {with_more_info && <MoreInfo href={tableau_vis_url || data.url} />}
           </div>
           <div className="right-col">
+            {with_enlarge && loaded && (
+              <Enlarge>
+                <Tableau
+                  {...props}
+                  data={{
+                    ...props.data,
+                    with_notes: false,
+                    with_sources: false,
+                    with_more_info: false,
+                    with_enlarge: false,
+                    with_share: false,
+                    with_download: false,
+                  }}
+                />
+              </Enlarge>
+            )}
             {with_download && loaded && <Download viz={viz.current} />}
             {with_share && loaded && (
               <Share href={tableau_vis_url || data.url} />

diff --git a/src/Views/VisualizationView.jsx b/src/Views/VisualizationView.jsx
@@ -21,6 +21,7 @@ const VisualizationView = (props) => {
             with_sources: false,
             with_more_info: false,
             with_share: false,
+            with_enlarge: false,
             with_download: true,
           }}
           breakpoints={

diff --git a/src/Widgets/VisualizationViewWidget.jsx b/src/Widgets/VisualizationViewWidget.jsx
@@ -10,8 +10,9 @@ export default function VisualizationViewWidget(props) {
         ...value,
         with_notes: false,
         with_sources: false,
-        with_more_info: true,
+        with_more_info: false,
         with_share: true,
+        with_enlarge: true,
         with_download: true,
       }}
       breakpoints={

diff --git a/src/Widgets/VisualizationWidget.jsx b/src/Widgets/VisualizationWidget.jsx
@@ -78,6 +78,7 @@ const VisualizationWidget = (props) => {
                   with_sources: false,
                   with_more_info: false,
                   with_share: false,
+                  with_enlarge: false,
                   with_download: false,
                 }}
                 mode="edit"
@@ -127,6 +128,7 @@ const VisualizationWidget = (props) => {
           with_sources: false,
           with_more_info: false,
           with_share: false,
+          with_enlarge: false,
           with_download: false,
         }}
         breakpoints={