Merge pull request #3724 from illacloud/beta

Release/4.5.8
illacloud · Feb 28, 2024 · 2a9df68 · 2a9df68
2 parents 9a287b6 + f39bf95
commit 2a9df68
Show file tree

Hide file tree

Showing 15 changed files with 90 additions and 54 deletions.
diff --git a/apps/builder/package.json b/apps/builder/package.json
@@ -5,7 +5,7 @@
   "private": true,
   "author": "ILLA Cloud <[email protected]>",
   "license": "Apache-2.0",
-  "version": "4.5.7",
+  "version": "4.5.8",
   "scripts": {
     "dev": "vite --strictPort --force",
     "build-cloud": "NODE_OPTIONS=--max-old-space-size=12288  vite build --mode cloud",

diff --git a/apps/builder/src/components/Guide/WidgetStepMask/index.tsx b/apps/builder/src/components/Guide/WidgetStepMask/index.tsx
@@ -16,7 +16,7 @@ import {
   UNIT_HEIGHT,
 } from "@/page/App/components/DotPanel/constant/canvas"
 import { getCanvasShape } from "@/redux/config/configSelector"
-import { WidgetConfigMap } from "@/widgetLibrary/widgetBuilder"
+import { widgetBuilder } from "@/widgetLibrary/widgetBuilder"
 
 export interface StepMaskProps {
   currentStep: number
@@ -34,7 +34,7 @@ export const WidgetStepMask: FC<StepMaskProps> = (props) => {
 
   const widgetShape = useMemo(() => {
     return GUIDE_SELECT_WIDGET.map((widget) => {
-      const { w, h } = WidgetConfigMap[widget].config
+      const { w, h } = widgetBuilder(widget).config
       return {
         width: w * unitWidth,
         height: h * UNIT_HEIGHT,

diff --git a/apps/builder/src/config/guide/config.tsx b/apps/builder/src/config/guide/config.tsx
@@ -9,20 +9,20 @@ import { componentsActions } from "@/redux/currentApp/components/componentsSlice
 import { guideActions } from "@/redux/guide/guideSlice"
 import store from "@/store"
 import { DisplayNameGenerator } from "@/utils/generators/generateDisplayName"
-import { WidgetConfigMap } from "@/widgetLibrary/widgetBuilder"
+import { widgetBuilder } from "@/widgetLibrary/widgetBuilder"
 
 export const SELECT_WIDGET_ITEM = {
   INPUT_WIDGET: {
     highlightIcon: InputHighlightIcon,
-    ...WidgetConfigMap["INPUT_WIDGET"].config,
+    ...widgetBuilder("INPUT_WIDGET").config,
   },
   BUTTON_WIDGET: {
     highlightIcon: ButtonHighlightIcon,
-    ...WidgetConfigMap["BUTTON_WIDGET"].config,
+    ...widgetBuilder("BUTTON_WIDGET").config,
   },
   DATA_GRID_WIDGET: {
     highlightIcon: TableHighlightIcon,
-    ...WidgetConfigMap["DATA_GRID_WIDGET"].config,
+    ...widgetBuilder("DATA_GRID_WIDGET").config,
   },
 }
 

diff --git a/apps/builder/src/page/App/components/InspectPanel/PanelSetters/OptionListSetter/index.tsx b/apps/builder/src/page/App/components/InspectPanel/PanelSetters/OptionListSetter/index.tsx
@@ -15,7 +15,7 @@ const OptionListSetter: FC<OptionListSetterProps> = (props) => {
     widgetDisplayName,
     childrenSetter,
     handleUpdateMultiAttrDSL,
-    itemName,
+    itemName = "Option",
   } = props
 
   const execResult = useSelector(getExecutionResult)

diff --git a/apps/builder/src/page/App/components/ScaleSquare/components/WrapperContainer/index.tsx b/apps/builder/src/page/App/components/ScaleSquare/components/WrapperContainer/index.tsx
@@ -13,7 +13,7 @@ import { WrapperContainerProps } from "./interface"
 import { applyWrapperPendingStyle, hoverHotSpotStyle } from "./style"
 
 const WrapperContainer: FC<WrapperContainerProps> = (props) => {
-  const { displayName, parentNodeDisplayName, widgetHeight, children } = props
+  const { displayName, widgetHeight, children } = props
   const executionResult = useSelector(getExecutionResult)
 
   const selectedComponents = useSelector(getSelectedComponentDisplayNames)
@@ -39,11 +39,7 @@ const WrapperContainer: FC<WrapperContainerProps> = (props) => {
       realProps?.dynamicMinHeight === widgetHeight)
 
   return (
-    <div
-      css={hoverHotSpotStyle}
-      data-displayname={displayName}
-      data-parentnode={parentNodeDisplayName}
-    >
+    <div css={hoverHotSpotStyle}>
       <div
         css={applyWrapperPendingStyle({
           hasError,

diff --git a/apps/builder/src/page/App/components/ScaleSquare/components/WrapperContainer/interface.ts b/apps/builder/src/page/App/components/ScaleSquare/components/WrapperContainer/interface.ts
@@ -2,7 +2,6 @@ import { ReactNode } from "react"
 
 export interface WrapperContainerProps {
   displayName: string
-  parentNodeDisplayName: string
   widgetHeight: number
   children: ReactNode
 }
diff --git a/apps/builder/src/page/App/components/ScaleSquare/index.tsx b/apps/builder/src/page/App/components/ScaleSquare/index.tsx
@@ -46,11 +46,7 @@ const ScaleSquare: FC<ScaleSquareProps> = (props) => {
       widgetType={widgetType}
       columnNumber={columnNumber}
     >
-      <WrapperContainer
-        displayName={displayName}
-        parentNodeDisplayName={parentNodeDisplayName}
-        widgetHeight={height}
-      >
+      <WrapperContainer displayName={displayName} widgetHeight={height}>
         <TransformWidgetWrapper
           displayName={displayName}
           widgetType={widgetType}

diff --git a/apps/builder/src/page/App/components/ScaleSquare/modalScaleSquare.tsx b/apps/builder/src/page/App/components/ScaleSquare/modalScaleSquare.tsx
@@ -125,11 +125,7 @@ export const ModalScaleSquare: FC<ScaleSquareProps> = (props) => {
           columnNumber={columnNumber}
           unitWidth={unitW}
         >
-          <WrapperContainer
-            displayName={displayName}
-            parentNodeDisplayName={parentNodeDisplayName}
-            widgetHeight={height}
-          >
+          <WrapperContainer displayName={displayName} widgetHeight={height}>
             <TransformWidgetWrapper
               displayName={displayName}
               widgetType={widgetType}

diff --git a/apps/builder/src/redux/currentApp/executionTree/executionListener.ts b/apps/builder/src/redux/currentApp/executionTree/executionListener.ts
@@ -79,8 +79,11 @@ async function handleStartExecution(
     const isAddAction =
       action.type.startsWith("components/add") ||
       action.type.startsWith("action/add") ||
-      action.type.startsWith("action/batchAdd")
-
+      action.type.startsWith("action/batchAdd") ||
+      componentsActions.batchUpdateMultiComponentSlicePropsReducer.match(
+        action,
+      ) ||
+      actionActions.batchUpdateMultiActionSlicePropsReducer.match(action)
     const executionResult = executionTree.updateTree(
       rawTree,
       isDeleteAction,

diff --git a/apps/builder/src/utils/executionTreeHelper/executionTreeFactory.ts b/apps/builder/src/utils/executionTreeHelper/executionTreeFactory.ts
@@ -26,6 +26,7 @@ import { RawTreeShape } from "@/utils/executionTreeHelper/interface"
 import {
   extractReferencesFromScript,
   getImmediateParentsOfPropertyPaths,
+  getObjectPaths,
   isAction,
   isWidget,
   removeParentPath,
@@ -133,6 +134,7 @@ export class ExecutionTreeFactory {
         getContainerListDisplayNameMappedChildrenNodeDisplayName(
           store.getState(),
         )
+
       const listWidgetDisplayNames = Object.keys(listWidgets)
       let currentListDisplayName = ""
       for (let i = 0; i < listWidgetDisplayNames.length; i++) {
@@ -141,11 +143,13 @@ export class ExecutionTreeFactory {
           break
         }
       }
+
       if (isObject(validationPaths)) {
-        Object.keys(validationPaths).forEach((validationPath) => {
-          const validationType = validationPaths[
-            validationPath
-          ] as VALIDATION_TYPES
+        getObjectPaths(validationPaths).forEach((validationPath) => {
+          const validationType = get(
+            validationPaths,
+            validationPath,
+          ) as VALIDATION_TYPES
           const fullPath = `${displayName}.${validationPath}`
           const validationFunc = validationFactory[validationType]
           const value = get(widgetOrAction, validationPath)
@@ -377,6 +381,7 @@ export class ExecutionTreeFactory {
     this.oldRawTree = klona(currentRawTree)
     const updatePaths = this.getUpdatePathFromDifferences(differences)
     const walkedPath = new Set<string>()
+
     let currentExecution = this.updateExecutionTreeByUpdatePaths(
       updatePaths,
       this.executedTree,
@@ -401,6 +406,7 @@ export class ExecutionTreeFactory {
       path,
       -1,
     )
+
     this.mergeErrorTree(errorTree, [...updatePaths, ...path], isDeleteAction)
     this.mergeDebugDataTree(
       debuggerData,

diff --git a/apps/builder/src/utils/executionTreeHelper/generateRawWidget.ts b/apps/builder/src/utils/executionTreeHelper/generateRawWidget.ts
@@ -11,6 +11,7 @@ export const generateRawWidget = (widget: WidgetShape) => {
     panelConfig,
     widget,
   )
+
   return {
     ...widget,
     $validationPaths: validationPaths,

diff --git a/apps/builder/src/utils/executionTreeHelper/utils.ts b/apps/builder/src/utils/executionTreeHelper/utils.ts
@@ -136,3 +136,25 @@ export const removeWidgetOrActionMethods = (
     {},
   )
 }
+
+export function getObjectPaths(obj: Record<string, unknown>, currentPath = "") {
+  let paths: string[] = []
+
+  if (typeof obj === "object" && obj !== null) {
+    Object.keys(obj).forEach((key) => {
+      const value = obj[key]
+      const newPath = Array.isArray(obj)
+        ? `${currentPath}.${key}`
+        : `${currentPath ? currentPath + "." : ""}${key}`
+      if (typeof value === "object" && value !== null) {
+        paths = paths.concat(
+          getObjectPaths(value as Record<string, unknown>, newPath),
+        )
+      } else {
+        paths.push(newPath)
+      }
+    })
+  }
+
+  return paths.map((path) => (path.startsWith(".") ? path.substr(1) : path))
+}
diff --git a/apps/builder/src/utils/generators/generateAllTypePathsFromWidgetConfig.ts b/apps/builder/src/utils/generators/generateAllTypePathsFromWidgetConfig.ts
@@ -1,5 +1,5 @@
 import { convertPathToString } from "@illa-public/dynamic-string"
-import { get, toPath } from "lodash-es"
+import { get, set, toPath } from "lodash-es"
 import {
   PanelConfig,
   PanelFieldGroupConfig,
@@ -23,21 +23,21 @@ export const generateAllTypePathsFromWidgetConfig = (
           const expectedType = filedConfig.expectedType
           if (Array.isArray(expectedType)) {
             attrPath.forEach((path, i) => {
-              configValidationPaths[path] = expectedType[i]
+              set(configValidationPaths, path, expectedType[i])
             })
           } else if (expectedType) {
             attrPath.forEach((path) => {
-              configValidationPaths[path] = expectedType
+              set(configValidationPaths, path, expectedType)
             })
           }
         } else {
           if (filedConfig.expectedType) {
             const expectedType = filedConfig.expectedType
 
             if (Array.isArray(expectedType)) {
-              configValidationPaths[attrPath] = expectedType[0]
+              set(configValidationPaths, attrPath, expectedType[0])
             } else if (expectedType) {
-              configValidationPaths[attrPath] = expectedType
+              set(configValidationPaths, attrPath, expectedType)
             }
           }
         }
@@ -56,35 +56,43 @@ export const generateAllTypePathsFromWidgetConfig = (
                 if (Array.isArray(childAttrPath)) {
                   if (Array.isArray(expectedType)) {
                     childAttrPath.forEach((path, i) => {
-                      configValidationPaths[
+                      set(
+                        configValidationPaths,
                         convertPathToString(
                           toPath(`${objectIndexPropertyPath}.${path}`),
-                        )
-                      ] = expectedType[i]
+                        ),
+                        expectedType[i],
+                      )
                     })
                   } else if (expectedType) {
                     childAttrPath.forEach((path) => {
-                      configValidationPaths[
+                      set(
+                        configValidationPaths,
                         convertPathToString(
                           toPath(`${objectIndexPropertyPath}.${path}`),
-                        )
-                      ] = expectedType
+                        ),
+                        expectedType,
+                      )
                     })
                   }
                 } else {
                   if (expectedType) {
                     if (Array.isArray(expectedType)) {
-                      configValidationPaths[
+                      set(
+                        configValidationPaths,
                         convertPathToString(
                           toPath(`${objectIndexPropertyPath}.${childAttrPath}`),
-                        )
-                      ] = expectedType[0]
+                        ),
+                        expectedType[0],
+                      )
                     } else if (expectedType) {
-                      configValidationPaths[
+                      set(
+                        configValidationPaths,
                         convertPathToString(
                           toPath(`${objectIndexPropertyPath}.${childAttrPath}`),
-                        )
-                      ] = expectedType
+                        ),
+                        expectedType,
+                      )
                     }
                   }
                 }
@@ -99,7 +107,11 @@ export const generateAllTypePathsFromWidgetConfig = (
               filedConfig.childrenSetter?.forEach((childConfig) => {
                 const expectedType = childConfig.expectedType
                 if (!Array.isArray(expectedType) && expectedType) {
-                  configValidationPaths[objectIndexPropertyPath] = expectedType
+                  set(
+                    configValidationPaths,
+                    objectIndexPropertyPath,
+                    expectedType,
+                  )
                 }
               })
             })

diff --git a/apps/builder/src/widgetLibrary/GridListWidget/gridList.tsx b/apps/builder/src/widgetLibrary/GridListWidget/gridList.tsx
@@ -10,6 +10,7 @@ import {
   getRawTree,
 } from "@/redux/currentApp/executionTree/executionSelector"
 import { evaluateDynamicString } from "@/utils/evaluateDynamicString"
+import { getObjectPaths } from "@/utils/executionTreeHelper/utils"
 import { isObject } from "@/utils/typeHelper"
 import { VALIDATION_TYPES, validationFactory } from "@/utils/validationFactory"
 import ListWidgetWithAutoPagination from "./components/ListWidgetWithAutoPagination"
@@ -85,7 +86,7 @@ export const GridListWidget: FC<GridListWidgetProps> = (props) => {
                     const rawWidget = rawTree[displayName]
                     if (rawWidget && isObject(rawWidget.$validationPaths)) {
                       const validationPaths = rawWidget.$validationPaths
-                      const validationType = validationPaths[finalPath]
+                      const validationType = get(validationPaths, finalPath)
                       if (validationType === VALIDATION_TYPES.ARRAY) {
                         const validationFunc = validationFactory[validationType]
                         const res = validationFunc?.(evalResult, "")
@@ -121,7 +122,7 @@ export const GridListWidget: FC<GridListWidgetProps> = (props) => {
             const rawWidget = rawTree[realDisplayName as string]
             const validationPaths = rawWidget.$validationPaths
             if (isObject(validationPaths)) {
-              Object.keys(validationPaths).forEach((path) => {
+              getObjectPaths(validationPaths).forEach((path) => {
                 const validationType = validationPaths[path] as VALIDATION_TYPES
                 const validationFunc = validationFactory[validationType]
                 const currentValue = get(item, `props.${path}`, "")

diff --git a/apps/builder/src/widgetLibrary/ListWidget/list.tsx b/apps/builder/src/widgetLibrary/ListWidget/list.tsx
@@ -10,6 +10,7 @@ import {
   getRawTree,
 } from "@/redux/currentApp/executionTree/executionSelector"
 import { evaluateDynamicString } from "@/utils/evaluateDynamicString"
+import { getObjectPaths } from "@/utils/executionTreeHelper/utils"
 import { isObject } from "@/utils/typeHelper"
 import { VALIDATION_TYPES, validationFactory } from "@/utils/validationFactory"
 import { ListWidgetProps } from "@/widgetLibrary/ListWidget/interface"
@@ -86,7 +87,7 @@ export const ListWidget: FC<ListWidgetProps> = (props) => {
                     const rawWidget = rawTree[displayName]
                     if (rawWidget && isObject(rawWidget.$validationPaths)) {
                       const validationPaths = rawWidget.$validationPaths
-                      const validationType = validationPaths[finalPath]
+                      const validationType = get(validationPaths, finalPath)
                       if (validationType === VALIDATION_TYPES.ARRAY) {
                         const validationFunc = validationFactory[validationType]
                         const res = validationFunc?.(evalResult, "")
@@ -122,8 +123,11 @@ export const ListWidget: FC<ListWidgetProps> = (props) => {
             const rawWidget = rawTree[realDisplayName as string]
             const validationPaths = rawWidget.$validationPaths
             if (isObject(validationPaths)) {
-              Object.keys(validationPaths).forEach((path) => {
-                const validationType = validationPaths[path] as VALIDATION_TYPES
+              getObjectPaths(validationPaths).forEach((path) => {
+                const validationType = get(
+                  validationPaths,
+                  path,
+                ) as VALIDATION_TYPES
                 const validationFunc = validationFactory[validationType]
                 const currentValue = get(item, `props.${path}`, "")
                 const res = validationFunc?.(currentValue, "")