fix(web): function name regex (#1092)

* fix(web): update function name regex * refactor(web): function panel margin
labring · Apr 27, 2023 · 0b933c9 · 0b933c9
1 parent 0e72123
commit 0b933c9
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 4 deletions.
diff --git a/web/src/components/Editor/FunctionEditor.tsx b/web/src/components/Editor/FunctionEditor.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useRef } from "react";
+import { CSSProperties, useEffect, useRef } from "react";
 import { debounce } from "lodash";
 import * as monaco from "monaco-editor/esm/vs/editor/editor.api";
 
@@ -93,6 +93,7 @@ const updateModel = (path: string, value: string, editorRef: any) => {
 function FunctionEditor(props: {
   value: string;
   className?: string;
+  style?: CSSProperties;
   onChange?: (value: string | undefined) => void;
   path: string;
   height?: string;
@@ -105,6 +106,7 @@ function FunctionEditor(props: {
     path,
     height = "100%",
     className,
+    style = {},
     colorMode = COLOR_MODE.light,
     readOnly = false,
   } = props;
@@ -182,7 +184,7 @@ function FunctionEditor(props: {
     }
   }, [onChange]);
 
-  return <div style={{ height: height }} className={className} ref={monacoEl}></div>;
+  return <div style={{ height: height, ...style }} className={className} ref={monacoEl}></div>;
 }
 
 export default FunctionEditor;
diff --git a/web/src/pages/app/functions/mods/EditorPanel/index.tsx b/web/src/pages/app/functions/mods/EditorPanel/index.tsx
@@ -31,7 +31,7 @@ function EditorPanel() {
     <Panel className="flex-1 flex-grow px-0">
       {currentFunction?.name ? (
         <Panel.Header
-          className={clsx("!mb-3 h-[50px] px-2", {
+          className={clsx("!mb-0 h-[50px] px-2", {
             "border-b-2": !darkMode,
             "border-lafWhite-400": !darkMode,
           })}
@@ -89,6 +89,10 @@ function EditorPanel() {
         <FunctionEditor
           colorMode={colorMode}
           className="flex-grow overflow-hidden"
+          style={{
+            marginLeft: -14,
+            marginRight: -14,
+          }}
           path={currentFunction?.id || ""}
           value={functionCache.getCache(currentFunction!.id, currentFunction!.source?.code)}
           onChange={(value) => {

diff --git a/web/src/pages/app/functions/mods/FunctionPanel/CreateModal/index.tsx b/web/src/pages/app/functions/mods/FunctionPanel/CreateModal/index.tsx
@@ -118,7 +118,7 @@ const CreateModal = (props: { functionItem?: any; children?: React.ReactElement
                 <Input
                   {...register("name", {
                     pattern: {
-                      value: /^[_A-Za-z][A-Za-z0-9-_]+$/,
+                      value: /^[a-zA-Z0-9_.-]{1,128}$/,
                       message: t("FunctionPanel.FunctionNameRule"),
                     },
                   })}