@griddo/ax 11.0.22 → 11.0.23

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@griddo/ax",
   "description": "Griddo Author Experience",
-  "version": "11.0.22",
+  "version": "11.0.23",
   "authors": [
     "Álvaro Sánchez' <alvaro.sanches@secuoyas.com>",
     "Carlos Torres <carlos.torres@secuoyas.com>",
@@ -225,5 +225,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "f47b8da5bc98f03f7f23a65d471a0429785c280d"
+  "gitHead": "eec9df5df565f610ec25cfb4b48bf737e9073990"
 }

package/src/containers/PageEditor/actions.tsx

@@ -30,7 +30,7 @@ import {
   parseValidationErrors,
   findPackagesActivationErrors,
   checkMaxModules,
-  evalueComputedFields,
+  evaluateComputedFields,
 } from "@ax/forms";
 import { appActions } from "@ax/containers/App";
 import { navigationActions } from "@ax/containers/Navigation";
@@ -430,7 +430,7 @@ function savePage(
 
       const rootEditorID = 0;
       const { values: page, id } = getPageData(getState, false);
-      const values = evalueComputedFields(page);
+      const values = await evaluateComputedFields(page, "save");
 
       const isNewPage = !id;
 
@@ -1064,8 +1064,8 @@ function updateEditorContent(
       clearTimeout(lastTimeout);
     }
 
-    const timeoutId = setTimeout(() => {
-      updatedEditorContent = evalueComputedFields(updatedEditorContent);
+    const timeoutId = setTimeout(async () => {
+      updatedEditorContent = await evaluateComputedFields(updatedEditorContent, "refresh");
       generatePageContent(updatedEditorContent)(dispatch, getState);
     }, 1500);
 

package/src/containers/StructuredData/actions.tsx

@@ -42,7 +42,7 @@ import {
   getTaxonomies,
   filterStructuredDataByID,
   getTypes,
-  evalueDataComputedFields,
+  evaluateDataComputedFields,
 } from "./utils";
 import {
   IStructuredData,
@@ -333,7 +333,7 @@ function createStructuredDataContent(
       const isCategory = currentStructuredData?.taxonomy === true;
       let dataContent = prepareStructuredDataContent(structuredDataContent);
       if (Array.isArray(schema.fields) && !isCategory) {
-        dataContent = evalueDataComputedFields(structuredDataContent, schema.fields);
+        dataContent = await evaluateDataComputedFields(structuredDataContent, schema.fields);
       }
 
       dataContent = {
@@ -370,7 +370,7 @@ function updateStructuredDataContent(
       const isCategory = currentStructuredData?.taxonomy === true;
       let dataContent = prepareStructuredDataContent(structuredDataContent);
       if (Array.isArray(schema.fields) && !isCategory) {
-        dataContent = evalueDataComputedFields(structuredDataContent, schema.fields);
+        dataContent = await evaluateDataComputedFields(structuredDataContent, schema.fields);
       }
 
       const responseActions = {

package/src/containers/StructuredData/utils.tsx

@@ -32,12 +32,17 @@ const getTaxonomies = (data: IStructuredData[]) => data.filter((item: IStructure
 const getTypes = (data: IStructuredData[]) => data.filter((item: IStructuredData) => !item.taxonomy);
 const filterStructuredDataByID = (data: any, id: string) => data.find((item: any) => item.id === id);
 
-const evalueDataComputedFields = (structuredData: any, fields: any[]) => {
+const evaluateDataComputedFields = (structuredData: any, fields: any[]) => {
   const updatedData = deepClone(structuredData);
-  fields.forEach((field: ISchemaField) => {
+  const data = {
+    operation: "save",
+    apiUrl: process.env.REACT_APP_API_ENDPOINT,
+    publicApiUrl: process.env.REACT_APP_PUBLIC_API_ENDPOINT,
+  };
+  fields.forEach(async (field: ISchemaField) => {
     if (Object.prototype.hasOwnProperty.call(field, "computed")) {
       const computedFunction = eval(`(${field.computed})`);
-      updatedData.content[field.key] = computedFunction(structuredData.content);
+      updatedData.content[field.key] = await computedFunction(structuredData.content, data);
     }
   });
   return updatedData;
@@ -50,5 +55,5 @@ export {
   getTaxonomies,
   getTypes,
   filterStructuredDataByID,
-  evalueDataComputedFields,
+  evaluateDataComputedFields,
 };

package/src/forms/editor.tsx

@@ -199,12 +199,18 @@ const checkMaxModules = (content: any, type: string): { isMaxModules: boolean; e
   };
 };
 
-const evalueComputedFields = (page: any) => {
+const evaluateComputedFields = (page: any, operation: "save" | "refresh") => {
   const updatedPage = deepClone(page);
   const pageSchemaContent = getTemplate(page.template.templateType).content;
-  pageSchemaContent.forEach((field: any) => {
+  const data = {
+    operation,
+    apiUrl: process.env.REACT_APP_API_ENDPOINT,
+    publicApiUrl: process.env.REACT_APP_PUBLIC_API_ENDPOINT,
+  };
+  pageSchemaContent.forEach(async (field: any) => {
     if (Object.prototype.hasOwnProperty.call(field, "computed")) {
-      updatedPage.template[field.key] = field.computed(page);
+      const computedFunction = eval(`(${field.computed})`);
+      updatedPage.template[field.key] = await computedFunction(page, data);
     }
   });
 
@@ -225,5 +231,5 @@ export {
   getLastComponentEditorID,
   getParentKey,
   checkMaxModules,
-  evalueComputedFields,
+  evaluateComputedFields,
 };

package/src/forms/index.tsx

@@ -11,7 +11,7 @@ import {
   getLastComponentEditorID,
   getParentKey,
   checkMaxModules,
-  evalueComputedFields,
+  evaluateComputedFields,
 } from "./editor";
 import {
   getUpdatedComponents,
@@ -66,5 +66,5 @@ export {
   checkH1content,
   parseValidationErrors,
   checkMaxModules,
-  evalueComputedFields,
+  evaluateComputedFields,
 };

package/src/modules/StructuredData/Form/ConnectedField/index.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { connect } from "react-redux";
 
 import { IErrorItem, IRootState } from "@ax/types";
@@ -15,14 +15,35 @@ const ConnectedField = (props: IProps) => {
   const isArrayGroup = field.type === "ArrayFieldGroup";
   const isComputedField = Object.prototype.hasOwnProperty.call(field, "computed");
   const isFieldDisabled = disabled || isComputedField;
-
-  let value = form?.content && form.content[fieldKey];
   const error = errors.find((err: any) => err.key === field.key);
 
-  if(isComputedField && form?.content) {
-    const computedFunction = eval(`(${field.computed})`);
-    value = computedFunction(form.content);
-  }
+  const [value, setValue] = useState(form?.content && form.content[fieldKey]);
+  const [timeOut, setTimeOut] = useState(form?.content && form.content[fieldKey]);
+
+  useEffect(() => {
+    const evaluateDataComputedFields = async () => {
+      const data = {
+        operation: "refresh",
+        apiUrl: process.env.REACT_APP_API_ENDPOINT,
+        publicApiUrl: process.env.REACT_APP_PUBLIC_API_ENDPOINT,
+      };
+      const computedFunction = eval(`(${field.computed})`);
+      const value = await computedFunction(form.content, data);
+      setValue(value);
+    };
+
+    if (isComputedField && form?.content) {
+      if (timeOut) {
+        clearTimeout(timeOut);
+      }
+      const timeoutId = setTimeout(async () => {
+        evaluateDataComputedFields();
+      }, 1500);
+
+      setTimeOut(timeoutId);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [form?.content]);
 
   const handleChange = (newValue: any) => updateFormValue({ [fieldKey]: newValue });