add middleware

eea · Aug 5, 2024 · 2480fad · 2480fad
1 parent 96794da
commit 2480fad
Show file tree

Hide file tree

Showing 4 changed files with 87 additions and 12 deletions.
diff --git a/src/Arcgis/Layer/Layer.jsx b/src/Arcgis/Layer/Layer.jsx
@@ -146,15 +146,15 @@ class $Layer extends EventEmitter {
       this.#layer.when(async () => {
         const data = await this.#layer.queryExtent();
         if (!$map.view) return;
-        $map.view.goTo(data.extent).then(() => {
-          if (!$map.view) return;
-          const homeWidget = $map.view.ui.find('Home');
-          if (!homeWidget) return;
-          homeWidget.viewpoint = new $map.modules.AgViewpoint({
-            center: $map.view.center,
-            zoom: $map.view.zoom,
-          });
-        });
+        // $map.view.goTo(data.extent).then(() => {
+        //   if (!$map.view) return;
+        //   const homeWidget = $map.view.ui.find('Home');
+        //   if (!homeWidget) return;
+        //   homeWidget.viewpoint = new $map.modules.AgViewpoint({
+        //     center: $map.view.center,
+        //     zoom: $map.view.zoom,
+        //   });
+        // });
       });
     }
 

diff --git a/src/Widgets/VisualizationWidget.jsx b/src/Widgets/VisualizationWidget.jsx
@@ -179,9 +179,13 @@ const VisualizationWidget = (props) => {
         if (updating || !$map.current.view) return;
         debounce(
           async () => {
-            console.log(
-              await $map.current.view.takeScreenshot({ format: 'png' }),
-            );
+            const preview = await $map.current.view.takeScreenshot({
+              format: 'png',
+            });
+            props.onChange(props.id, {
+              ...value,
+              preview: preview.dataUrl,
+            });
           },
           300,
           'visualization-widget-screenshot',

diff --git a/src/index.js b/src/index.js
@@ -15,6 +15,7 @@ import ArcgisViewpointWidget from './Widgets/ArcgisViewpointWidget';
 import VisualizationViewWidget from './Widgets/VisualizationViewWidget';
 
 import VisualizationView from './Views/VisualizationView';
+import { preview_image } from './middlewares/preview_image';
 
 const applyConfig = (config) => {
   config.settings.allowed_cors_destinations = [
@@ -63,6 +64,10 @@ const applyConfig = (config) => {
     ],
     'id',
   );
+  config.settings.storeExtenders = [
+    ...(config.settings.storeExtenders || []),
+    preview_image,
+  ];
 
   config.views.contentTypesViews.map_visualization = VisualizationView;
 

diff --git a/src/middlewares/preview_image.js b/src/middlewares/preview_image.js
@@ -0,0 +1,66 @@
+import {
+  CREATE_CONTENT,
+  UPDATE_CONTENT,
+} from '@plone/volto/constants/ActionTypes';
+
+export const preview_image = (middlewares) => [
+  (store) => (next) => async (action) => {
+    if (![CREATE_CONTENT, UPDATE_CONTENT].includes(action.type)) {
+      return next(action);
+    }
+    const state = store.getState();
+    const contentData = state.content.data;
+    console.log({ action });
+    if (
+      !contentData ||
+      contentData['@type'] !== 'map_visualization' ||
+      contentData.preview_image_saved ||
+      !action?.request?.data?.map_visualization_data?.preview
+    ) {
+      return next(action);
+    }
+
+    if (
+      contentData?.preview_image &&
+      contentData?.preview_image?.filename !==
+        'preview_image_generated_map_simple.png'
+    ) {
+      return next(action);
+    }
+
+    try {
+      const previewImage = {
+        preview_image: {
+          data: action.request.data.map_visualization_data.preview.split(
+            ',',
+          )[1],
+          encoding: 'base64',
+          'content-type': 'image/png',
+          filename: 'preview_image_generated_map_simple.png',
+        },
+        preview_image_saved: true,
+      };
+
+      const mapVisualizationData = {
+        ...action.request.data.map_visualization_data,
+      };
+      delete mapVisualizationData.preview;
+
+      return next({
+        ...action,
+        request: {
+          ...action.request,
+          data: {
+            ...action.request.data,
+            ...previewImage,
+            map_visualization_data: mapVisualizationData,
+          },
+        },
+      });
+    } catch (error) {
+      console.error(error);
+      return next(action);
+    }
+  },
+  ...middlewares,
+];