Merge branch 'dev' into fix/style-issues

Author: FalkWolsky

client/packages/lowcoder/src/comps/comps/lazyLoadComp/lazyLoadComp.tsx

@@ -38,18 +38,18 @@ function ViewLoading(props: { padding?: number }) {
   );
 }
 
-interface RemoteCompReadyAction {
-  type: "RemoteCompReady";
+export interface LazyCompReadyAction {
+  type: "LazyCompReady";
   comp: Comp;
 }
 
-interface RemoteCompViewProps {
+interface LazyCompViewProps {
   loadComp: () => Promise<void>;
   loadingElement?: () => React.ReactNode;
   errorElement?: (error: any) => React.ReactNode;
 }
 
-function RemoteCompView(props: React.PropsWithChildren<RemoteCompViewProps>) {
+function LazyCompView(props: React.PropsWithChildren<LazyCompViewProps>) {
   const { loadComp, loadingElement, errorElement } = props;
   const [error, setError] = useState<any>("");
 
@@ -103,14 +103,14 @@ export function lazyLoadComp(
       if (!compPath) {
         return;
       }
-      let RemoteExportedComp;
+      let LazyExportedComp;
       if (!loader) {
         const module = await import(`../../${compPath}.tsx`);
-        RemoteExportedComp = module[compName!];
+        LazyExportedComp = module[compName!];
       } else {
-        RemoteExportedComp = await loader();
+        LazyExportedComp = await loader();
       }
-      if (!RemoteExportedComp) {
+      if (!LazyExportedComp) {
         log.error("loader not found, lazy load info:", compPath);
         return;
       }
@@ -122,12 +122,12 @@ export function lazyLoadComp(
       if (this.compValue) {
         params.value = this.compValue;
       }
-      const RemoteCompWithErrorBound = withErrorBoundary(RemoteExportedComp);
+      const LazyCompWithErrorBound = withErrorBoundary(LazyExportedComp);
       this.dispatch(
-        customAction<RemoteCompReadyAction>(
+        customAction<LazyCompReadyAction>(
           {
-            type: "RemoteCompReady",
-            comp: new RemoteCompWithErrorBound(params),
+            type: "LazyCompReady",
+            comp: new LazyCompWithErrorBound(params),
           },
           false
         )
@@ -138,7 +138,7 @@ export function lazyLoadComp(
       // const key = `${remoteInfo?.packageName}-${remoteInfo?.packageVersion}-${remoteInfo?.compName}`;
       const key = `${compName}`;
       return (
-        <RemoteCompView key={key} loadComp={() => this.load()} loadingElement={loadingElement} />
+        <LazyCompView key={key} loadComp={() => this.load()} loadingElement={loadingElement} />
       );
     }
 
@@ -147,7 +147,7 @@ export function lazyLoadComp(
     }
 
     reduce(action: CompAction<any>): this {
-      if (isCustomAction<RemoteCompReadyAction>(action, "RemoteCompReady")) {
+      if (isCustomAction<LazyCompReadyAction>(action, "LazyCompReady")) {
         // use real remote comp instance to replace RemoteCompLoader
         return action.value.comp as this;
       }

client/packages/lowcoder/src/comps/comps/moduleComp/moduleComp.tsx

@@ -68,7 +68,7 @@ type UpdateDslAction = {
   moduleDsl: Record<string, DSLType>;
 };
 
-type ModuleReadyAction = {
+export type ModuleReadyAction = {
   type: "moduleReady";
   comp: RootComp;
 };
@@ -263,7 +263,6 @@ class ModuleTmpComp extends ModuleCompBase {
 
   override reduce(action: CompAction<JSONValue>): this {
     const appId = this.children.appId.getView();
-
     // init
     if (isMyCustomAction<InitAction>(action, "init")) {
       if (getReduceContext().disableUpdateState) return this;

client/packages/lowcoder/src/comps/comps/tableComp/expansionControl.tsx

@@ -50,7 +50,7 @@ let ExpansionControlTmp = (function () {
       slot: ContextSlotControl,
     },
     () => ({ expandableConfig: {}, expandModalView: null })
-  )
+    )
     .setControlItemData({ filterText: label })
     .setPropertyViewFn((children, dispatch) => {
       return (

client/packages/lowcoder/src/comps/controls/slotControl.tsx

@@ -10,7 +10,7 @@ import { BackgroundColorContext } from "comps/utils/backgroundColorContext";
 import { CanvasContainerID } from "constants/domLocators";
 import { Layers } from "constants/Layers";
 import { trans } from "i18n";
-import { changeChildAction, ConstructorToView } from "lowcoder-core";
+import { changeChildAction, CompActionTypes, ConstructorToView } from "lowcoder-core";
 import { HintPlaceHolder, TacoButton } from "lowcoder-design";
 import { createContext, useContext } from "react";
 import styled from "styled-components";

client/packages/lowcoder/src/comps/generators/withMultiContext.tsx

@@ -87,7 +87,7 @@ export function withMultiContext<TCtor extends MultiCompConstructor>(VariantComp
     override parseChildrenFromValue(params: CompParams): ChildrenType {
       const dispatch = params.dispatch ?? _.noop;
       const newParams = { ...params, dispatch: wrapDispatch(dispatch, COMP_KEY) };
-
+      
       const comp: WithParamComp = new WithParamCompCtor(newParams) as unknown as WithParamComp;
       const mapComp = new MapCtor({ dispatch: wrapDispatch(dispatch, MAP_KEY) });
       return { [COMP_KEY]: comp, [MAP_KEY]: mapComp };

client/packages/lowcoder/src/comps/generators/withSelectedMultiContext.tsx

@@ -2,6 +2,7 @@ import _ from "lodash";
 import {
   CompAction,
   customAction,
+  isCustomAction,
   isMyCustomAction,
   MultiCompConstructor,
   wrapChildAction,
@@ -11,6 +12,8 @@ import { ReactNode } from "react";
 import { lastValueIfEqual, setFieldsNoTypeCheck } from "util/objectUtils";
 import { COMP_KEY, MAP_KEY, withMultiContext } from "./withMultiContext";
 import { paramsEqual } from "./withParams";
+import { LazyCompReadyAction } from "../comps/lazyLoadComp/lazyLoadComp";
+import { ModuleReadyAction } from "../comps/moduleComp/moduleComp";
 
 const SELECTED_KEY = "SELECTED";
 
@@ -69,19 +72,34 @@ export function withSelectedMultiContext<TCtor extends MultiCompConstructor>(
             comp.getOriginalComp().setParams(comp.cacheParamsMap.get(selection)!)
           );
         }
-      } else if (!action.editDSL || action.path[0] !== MAP_KEY || _.isNil(action.path[1])) {
+      } else if ((
+        !action.editDSL
+        && !isCustomAction<LazyCompReadyAction>(action, "LazyCompReady")
+        && !isCustomAction<ModuleReadyAction>(action, "moduleReady")
+        ) || action.path[0] !== MAP_KEY || _.isNil(action.path[1])
+      ) {
         if (action.path[0] === MAP_KEY && action.path[1] === SELECTED_KEY) {
           action.path[1] = this.selection;
         }
         comp = super.reduce(action);
-      } else if (action.editDSL && action.path[1] === SELECTED_KEY) {
+      } else if ((
+        action.editDSL
+        || isCustomAction<LazyCompReadyAction>(action, "LazyCompReady")
+        || isCustomAction<ModuleReadyAction>(action, "moduleReady")
+      ) && action.path[1] === SELECTED_KEY) {
         // broadcast
         const newAction = {
           ...action,
           path: action.path.slice(2),
         };
         comp = comp.reduce(WithMultiContextComp.forEachAction(newAction));
         comp = comp.reduce(wrapChildAction(COMP_KEY, newAction));
+      } else if (
+        !action.editDSL
+        && isCustomAction<ModuleReadyAction>(action, "moduleReady")
+        && action.path[0] === MAP_KEY
+      ) {
+        comp = super.reduce(action);
       }
 
       // console.info("exit withSelectedMultiContext reduce. action: ", action, "\nthis:", this, "\ncomp:", comp);