Merge branch 'ee-setup' of github.com:lowcoder-org/lowcoder into ui/environments

Author: iamfaran

client/packages/lowcoder/package.json

@@ -6,7 +6,7 @@
   "main": "src/index.sdk.ts",
   "types": "src/index.sdk.ts",
   "dependencies": {
-    "@ant-design/icons": "^6.0.0",
+    "@ant-design/icons": "^5.3.0",
     "@codemirror/autocomplete": "^6.11.1",
     "@codemirror/commands": "^6.3.2",
     "@codemirror/lang-css": "^6.2.1",

client/packages/lowcoder/src/app.tsx

@@ -85,7 +85,13 @@ const Wrapper = React.memo((props: {
     return {
       hashed: false,
       token: {
-        fontFamily: `${props.fontFamily ? props.fontFamily.split('+').join(' ') : 'Roboto'}, sans-serif`,
+        fontFamily: `${
+          props.fontFamily
+          ? props.fontFamily.split('+').join(' ')
+          : `-apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, "Segoe UI", "PingFang SC",
+            "Microsoft Yahei", "Hiragino Sans GB", sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
+            "Segoe UI Symbol", "Noto Color Emoji"`
+        }, sans-serif`,
       },
     }
   }, [props.fontFamily]);

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

@@ -112,18 +112,27 @@ const SignatureCanvas = React.lazy(() => import("react-signature-canvas"));
 
 let SignatureTmpComp = (function () {
   return new UICompBuilder(childrenMap, (props, dispatch) => {
-    let canvas: SignatureCanvasType | null = null;
+    const canvasRef = useRef<SignatureCanvasType | null>(null);
     const [isBegin, setIsBegin] = useState(false);
     const [canvasSize, setCanvasSize] = useState([0, 0]);
     const conRef = useRef<HTMLDivElement>(null);
 
     const updateValue = (isClear: boolean = false) => {
-      const clear = isClear || canvas?.toData().length === 0;
-      if (canvas) {
-        clear && canvas?.clear();
+      if (!canvasRef.current) return;
+      
+      const clear = isClear || canvasRef.current.toData().length === 0;
+      if (clear) {
+        canvasRef.current.clear();
+        setIsBegin(false);
         dispatch(
           multiChangeAction({
-            value: changeValueAction(clear ? "" : canvas.toDataURL(), false),
+            value: changeValueAction("", false),
+          })
+        );
+      } else {
+        dispatch(
+          multiChangeAction({
+            value: changeValueAction(canvasRef.current.toDataURL(), false),
           })
         );
       }
@@ -132,15 +141,27 @@ let SignatureTmpComp = (function () {
     useResizeDetector({
       targetRef: conRef,
       onResize: ({width, height}: ResizePayload) => {
-        width && height && setCanvasSize([width, height]);
-        updateValue(true);
+        if (width && height) {
+          setCanvasSize([width, height]);
+          // Don't clear on resize as it breaks the drawing functionality
+          // updateValue(true);
+        }
       },
     });
 
+    // Cleanup on unmount
+    useEffect(() => {
+      return () => {
+        if (canvasRef.current) {
+          canvasRef.current.clear();
+        }
+      };
+    }, []);
+
     return props.label({
       style: props.style,
       labelStyle: props.labelStyle,
-      inputFieldStyle:props.inputFieldStyle,
+      inputFieldStyle: props.inputFieldStyle,
       children: (
         <Wrapper
           ref={conRef}
@@ -153,9 +174,7 @@ let SignatureTmpComp = (function () {
           <div key="signature" className="signature">
             <Suspense fallback={<Skeleton />}>
               <SignatureCanvas
-                ref={(ref) => {
-                  canvas = ref;
-                }}
+                ref={canvasRef}
                 penColor={props.inputFieldStyle.pen}
                 clearOnResize={false}
                 canvasProps={{
@@ -168,7 +187,9 @@ let SignatureTmpComp = (function () {
                   setIsBegin(false);
                   props.onEvent("change");
                 }}
-                onBegin={() => setIsBegin(true)}
+                onBegin={() => {
+                  setIsBegin(true);
+                }}
               />
             </Suspense>
           </div>
@@ -178,10 +199,11 @@ let SignatureTmpComp = (function () {
                 <span className="anticon">
                   <UndoIcon
                     onClick={() => {
-                      const data = canvas?.toData();
-                      if (data) {
-                        data?.pop();
-                        canvas?.fromData(data);
+                      if (!canvasRef.current) return;
+                      const data = canvasRef.current.toData();
+                      if (data && data.length > 0) {
+                        data.pop();
+                        canvasRef.current.fromData(data);
                         updateValue();
                         props.onEvent("change");
                       }

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

@@ -12,6 +12,9 @@ import {
   MultiBaseComp,
   wrapChildAction,
   evalFunc,
+  changeValueAction,
+  multiChangeAction,
+  isDynamicSegment,
 } from "lowcoder-core";
 import {
   Dropdown,
@@ -39,6 +42,9 @@ import { toQueryView } from "./queryCompUtils";
 import { getGlobalSettings } from "comps/utils/globalSettings";
 import { QUERY_EXECUTION_ERROR, QUERY_EXECUTION_OK } from "../../constants/queryConstants";
 import type { SandBoxOption } from "lowcoder-core/src/eval/utils/evalScript";
+import { QueryLibraryApi } from "@lowcoder-ee/api/queryLibraryApi";
+import { validateResponse } from "@lowcoder-ee/api/apiUtils";
+import { JSONValue } from "@lowcoder-ee/util/jsonTypes";
 
 const NoInputsWrapper = styled.div`
   color: ${GreyTextColor};
@@ -126,6 +132,8 @@ type QueryLibraryUpdateAction = {
 const childrenMap = {
   libraryQueryId: valueComp<string>(""),
   libraryQueryRecordId: valueComp<string>("latest"),
+  libraryQueryType: valueComp<string>(""),
+  libraryQueryDSL: valueComp<JSONValue>(null),
   inputs: InputsComp,
   error: stateComp<string>(""),
 };
@@ -147,23 +155,26 @@ export const LibraryQuery = class extends LibraryQueryBase {
 
   override getView() {
     // Check if this is a JS query
-    if (this.queryInfo?.query?.compType === "js") {
+    const queryInfo = this.children.libraryQueryDSL.getView() as any;
+    const queryType = this.children.libraryQueryType.getView() as any;
+    if (queryType === "js") {
       return async (props: any) => {
         try {
           const { orgCommonSettings } = getGlobalSettings();
           const runInHost = !!orgCommonSettings?.runJavaScriptInHost;
           const timer = performance.now();
-          const script = this.queryInfo.query.comp.script || "";
+          const script = queryInfo.query.comp.script || "";
           const options: SandBoxOption = { disableLimit: runInHost };
 
           // Get input values from the inputs component and resolve any variables
           const inputValues = Object.entries(this.children.inputs.children).reduce((acc, [name, input]) => {
             // Get the raw value from the input component's text property
+            let { unevaledValue } = input.children.text;
             let value = input.children.text.getView();
-            
+
             // Resolve any variables in the value
-            if (typeof value === 'string') {
-              value = value.replace(/\{\{([^}]+)\}\}/g, (match, path) => {
+            if (typeof unevaledValue === 'string') {
+              unevaledValue = unevaledValue.replace(/\{\{([^}]+)\}\}/g, (match, path) => {
                 const parts = path.split('.');
                 let current = props.args || {};
                 for (const part of parts) {
@@ -173,17 +184,14 @@ export const LibraryQuery = class extends LibraryQueryBase {
                     return match; // Return original if path not found
                   }
                 }
-                return current?.value ?? match;
+                return current ?? match;
               });
             }
 
-            acc[name] = value;
+            acc[name] = isDynamicSegment(unevaledValue) ? value : unevaledValue;
             return acc;
           }, {} as Record<string, any>);
 
-          console.log("script: " + script);
-          console.log("inputValues: ", inputValues);
-
           const data = await evalFunc(script, inputValues, undefined, options);
           return {
             data: data,
@@ -223,10 +231,13 @@ export const LibraryQuery = class extends LibraryQueryBase {
 
   override reduce(action: CompAction): this {
     if (isMyCustomAction<QueryLibraryUpdateAction>(action, "queryLibraryUpdate")) {
-      this.queryInfo = action.value?.dsl;
+      const isJSQuery = this.children.libraryQueryType.getView() === 'js'
+      const queryDSL = isJSQuery ? action.value?.dsl : null;
+      const queryDSLValue  = this.children.libraryQueryDSL.reduce(this.children.libraryQueryDSL.changeValueAction(queryDSL))
+      
       const inputs = this.children.inputs.setInputs(action.value?.dsl?.["inputs"] ?? []);
       return setFieldsNoTypeCheck(this, {
-        children: { ...this.children, inputs: inputs },
+        children: { ...this.children, inputs: inputs, libraryQueryDSL: queryDSLValue },
         isReady: true,
       });
     }
@@ -315,7 +326,17 @@ const PropertyView = (props: { comp: InstanceType<typeof LibraryQuery> }) => {
               value: meta.libraryQueryMetaView.id,
             }))}
             value={queryId ?? queryLibraryMeta[0]?.libraryQueryMetaView.id}
-            onChange={(value) => dispatch(props.comp.changeChildAction("libraryQueryId", value))}
+            onChange={(value) => {
+              const queryDSL = queryLibraryMeta[value]?.libraryQueryMetaView || null;
+              const { datasourceType } = queryDSL as any;
+
+              props.comp.dispatch(
+                multiChangeAction({
+                  libraryQueryId: changeValueAction(value, false),
+                  libraryQueryType: changeValueAction(datasourceType, false),
+                })
+              )
+            }}
           />
         </div>
         <QueryTutorialButton

client/packages/lowcoder/src/constants/themeConstants.ts

@@ -186,6 +186,11 @@ const tree = {
 
 }
 
+const signature = {
+  inputFieldStyle: {
+    pen: "#222222",
+  }
+}
 
 export const defaultTheme: ThemeDetail = {
   ...theme,
@@ -219,6 +224,7 @@ export const defaultTheme: ThemeDetail = {
     select: select,
     multiSelect: select,
     treeSelect: select,
-    tree:tree
+    tree:tree,
+    signature,
   },
 };

client/packages/lowcoder/src/i18n/locales/en.ts

@@ -3112,7 +3112,9 @@ export const en = {
     "whatsNewSection": "Documentation Settings",
     "whatsNewLink": "What's New Link",
     "whatsNewLinkPlaceholder": "Enter the URL for your documentation...",
-    "whatsNewLinkHelp": "Provide a valid URL that users can visit for your news."
+    "whatsNewLinkHelp": "Provide a valid URL that users can visit for your news.",
+    "deleteBranding": "Delete Branding",
+    "deleteBrandingContent": "Are you sure you want to delete \"{orgName}\" branding?"
   },
   "networkMessage": {
     "200": "Success",