Merge pull request #781 from raheeliftikhar5/module_loading_issues

Module loading issues

Author: FalkWolsky

client/packages/lowcoder-design/src/components/ScrollBar.tsx

@@ -5,7 +5,7 @@ import styled from "styled-components";
 import { DebouncedFunc } from 'lodash'; // Assuming you're using lodash's DebouncedFunc type
 
 
-const ScrollBarWrapper = styled.div<{ hidePlaceholder?: boolean }>`
+const ScrollBarWrapper = styled.div<{ $hideplaceholder?: boolean }>`
   min-height: 0;
   height: 100%;
   width: 100%;
@@ -37,7 +37,7 @@ const ScrollBarWrapper = styled.div<{ hidePlaceholder?: boolean }>`
     bottom: 10px;
   }
 
-  ${props => props.hidePlaceholder && `
+  ${props => Boolean(props.$hideplaceholder) && `
     .simplebar-placeholder {
       display: none !important;
     }
@@ -54,11 +54,20 @@ interface IProps {
   scrollableNodeProps?: {
     onScroll: DebouncedFunc<(e: any) => void>;
   };
-  hidePlaceholder?: boolean;
+  $hideplaceholder?: boolean;
   hideScrollbar?: boolean;
 }
 
-export const ScrollBar = ({ height = "100%", className, children, style, scrollableNodeProps, hideScrollbar = false, ...otherProps }: IProps) => {
+export const ScrollBar = ({
+  height = "100%",
+  className,
+  children,
+  style,
+  scrollableNodeProps,
+  hideScrollbar = false,
+  $hideplaceholder = false,
+  ...otherProps
+}: IProps) => {
   // You can now use the style prop directly or pass it to SimpleBar
   const combinedStyle = { ...style, height }; // Example of combining height with passed style
 

client/packages/lowcoder-design/src/components/Section.tsx

@@ -106,7 +106,7 @@ export const BaseSection = (props: ISectionConfig<ReactNode>) => {
   const { compName, state, toggle } = useContext(PropertySectionContext);
   const open = props.open !== undefined ? props.open : name ? state[compName]?.[name] !== false : true;
 
-  console.log("open", open, props.open);
+  // console.log("open", open, props.open);
 
   const handleToggle = () => {
     if (!name) {

client/packages/lowcoder/src/appView/AppView.tsx

@@ -1,3 +1,5 @@
+import { default as App } from "antd/es/app";
+import GlobalInstances from "components/GlobalInstances";
 import { RootComp } from "comps/comps/rootComp";
 import { GetContainerParams, useCompInstance } from "comps/utils/useCompInstance";
 import { createBrowserHistory } from "history";
@@ -88,19 +90,22 @@ export function AppView(props: AppViewProps) {
   }, [moduleInputs]);
 
   return (
-    <Provider store={reduxStore}>
-      <ExternalEditorContext.Provider
-        value={{
-          applicationId: appId,
-          appType: 1,
-          readOnly: true,
-          hideHeader: true,
-        }}
-      >
-        <Router history={browserHistory}>
-          <Route path="/" render={() => comp?.getView()} />
-        </Router>
-      </ExternalEditorContext.Provider>
-    </Provider>
+    <App>
+      <GlobalInstances />
+      <Provider store={reduxStore}>
+        <ExternalEditorContext.Provider
+          value={{
+            applicationId: appId,
+            appType: 1,
+            readOnly: true,
+            hideHeader: true,
+          }}
+        >
+          <Router history={browserHistory}>
+            <Route path="/" render={() => comp?.getView()} />
+          </Router>
+        </ExternalEditorContext.Provider>
+      </Provider>
+    </App>
   );
 }

client/packages/lowcoder/src/comps/comps/moduleContainerComp/moduleLayoutComp.tsx

@@ -116,7 +116,7 @@ export class ModuleLayoutComp extends ModuleLayoutCompBase implements IContainer
     const rowCount = this.children.containerRowCount.getView();
     return (
       <div>
-        <ScrollBar style={{ height: "100%", margin: "0px", padding: "0px" }} hidePlaceholder={false}>
+        <ScrollBar style={{ height: "100%", margin: "0px", padding: "0px" }} $hideplaceholder={false}>
           <ModuleLayoutView
             positionParams={this.children.positionParams.getView()}
             containerSize={this.children.containerSize.getView()}

client/packages/lowcoder/src/comps/queries/queryComp.tsx

@@ -282,7 +282,7 @@ function QueryView(props: QueryViewProps) {
     ) {
       setTimeout(() => {
         comp.dispatch(deferAction(executeQueryAction({})));
-      });
+      }, 100);
     }
   }, []);
 

client/packages/lowcoder/src/comps/queries/queryComp/queryNotificationControl.tsx

@@ -23,7 +23,7 @@ const SuccessMessageAction = new MultiCompBuilder(
   {
     text: StringControl,
   },
-  (props) => (duration: number) => props.text && messageInstance.success(props.text, duration)
+  (props) => (duration: number) => props.text && messageInstance?.success(props.text, duration)
 )
   .setPropertyViewFn((children) => (
     <>
@@ -109,14 +109,14 @@ const QueryNotificationTmpControl = new MultiCompBuilder(
       props.fail.forEach((item) => {
         const props = (item.getView() as any)({ data: result.data });
         if (props.condition && props.text) {
-          messageInstance.error(props.text, duration);
+          messageInstance?.error(props.text, duration);
           hasNoticed = true;
         }
       });
 
       // Execute system notification if triggered manually without custom notification and query fails
       if (!result.success && !hasNoticed) {
-        hasNoticed = !!messageInstance.error(
+        hasNoticed = !!messageInstance?.error(
           trans("query.failMessageWithName", {
             name,
             result: JSON.stringify(pick(result, ["code", "message"])),