feat(web): support rename functions using dragging (#1762)

* feat(server): ban / in the begin or end of the func name * feat(web): support rename functions using dragging Co-authored-by: maslow <wangfugen@126.com>
labring · Jan 2, 2024 · f108ea8 · f108ea8
1 parent 4e47d04
commit f108ea8
Show file tree

Hide file tree

Showing 13 changed files with 422 additions and 113 deletions.
diff --git a/server/src/function-template/dto/create-function-template.dto.ts b/server/src/function-template/dto/create-function-template.dto.ts
@@ -21,8 +21,7 @@ export class FunctionTemplateItemDto {
     description: 'FunctionTemplate item name',
   })
   @IsNotEmpty()
-  @MaxLength(48)
-  @Matches(/^[a-zA-Z0-9_.\-\/]{1,256}$/)
+  @Matches(/^[a-zA-Z0-9_.\-](?:[a-zA-Z0-9_.\-/]{0,254}[a-zA-Z0-9_.\-])?$/)
   name: string
 
   @ApiPropertyOptional()

diff --git a/server/src/function/dto/create-function.dto.ts b/server/src/function/dto/create-function.dto.ts
@@ -15,7 +15,7 @@ export class CreateFunctionDto {
     description: 'Function name is unique in the application',
   })
   @IsNotEmpty()
-  @Matches(/^[a-zA-Z0-9_.\-\/]{1,256}$/)
+  @Matches(/^[a-zA-Z0-9_.\-](?:[a-zA-Z0-9_.\-/]{0,254}[a-zA-Z0-9_.\-])?$/)
   name: string
 
   @ApiPropertyOptional()

diff --git a/server/src/function/dto/update-function.dto.ts b/server/src/function/dto/update-function.dto.ts
@@ -16,7 +16,7 @@ export class UpdateFunctionDto {
     description: 'Function name is unique in the application',
   })
   @IsOptional()
-  @Matches(/^[a-zA-Z0-9_.\-\/]{1,256}$/)
+  @Matches(/^[a-zA-Z0-9_.\-](?:[a-zA-Z0-9_.\-/]{0,254}[a-zA-Z0-9_.\-])?$/)
   newName?: string
 
   @ApiPropertyOptional()

diff --git a/server/src/recycle-bin/cloud-function/dto/get-recycle-bin-functions.dto.ts b/server/src/recycle-bin/cloud-function/dto/get-recycle-bin-functions.dto.ts
@@ -41,7 +41,7 @@ export class FunctionRecycleBinItemsDto {
     description: 'Function name is unique in the application',
   })
   @IsNotEmpty()
-  @Matches(/^[a-zA-Z0-9_.\-\/]{1,256}$/)
+  @Matches(/^[a-zA-Z0-9_.\-](?:[a-zA-Z0-9_.\-/]{0,254}[a-zA-Z0-9_.\-])?$/)
   name: string
 
   @ApiProperty({ type: CloudFunctionSourceDto })

diff --git a/web/public/locales/en/translation.json b/web/public/locales/en/translation.json
@@ -119,7 +119,7 @@
     "SystemDependence": "Built-In",
     "Value": "Value",
     "isSupport": "Whether to support",
-    "FunctionNameRule": "Function names must consist of letters, numbers, periods (.), and hyphens (-), matching the regex: /^[a-zA-Z0-9.-]{1,128}$/.",
+    "FunctionNameRule": "Function names must consist of letters, numbers, periods (.), and hyphens (-), matching the regex: /^[a-zA-Z0-9_.\\-](?:[a-zA-Z0-9_.\\-/]{0,254}[a-zA-Z0-9_.\\-])?$/.",
     "EmptyDebugTip": "No results yet",
     "EmptyFunctionTip": "You have not created the function",
     "UploadButton": "upload",
@@ -135,7 +135,10 @@
     "HistoryTips": "No historical versions available",
     "NoDesc": "No Description",
     "CurrentVersion": "Current Version",
-    "HistoryVersion": "History version"
+    "HistoryVersion": "History version",
+    "MoveFunctionTip": "Are you sure to move {{srcFunc}} to {{targetDir}} directory?",
+    "MoveFunctionToRootTip": "Are you sure to move {{srcFunc}} to the root directory?",
+    "MovingFunction": "Moving functions..."
   },
   "HomePanel": {
     "APP": "Android or iOS app",
@@ -702,8 +705,10 @@
   },
   "Deprecated": "Deprecated",
   "All": "All",
+  "MoveFunction": "Move function",
   "UpgradeVersionTip": {
     "Title": "Laf is ready to update!",
     "Description": "Click to update"
   }
-}
+}
+
diff --git a/web/public/locales/zh-CN/translation.json b/web/public/locales/zh-CN/translation.json
@@ -119,7 +119,7 @@
     "SystemDependence": "内置依赖",
     "Value": "值",
     "isSupport": "是否支持",
-    "FunctionNameRule": "函数名须由字母、数字、点（.）和划线(-_)组成，匹配正则：/^[a-zA-Z0-9_.-/]{1,256}$/",
+    "FunctionNameRule": "函数名须由字母、数字、点（.）和划线(-_)组成，匹配正则：/^[a-zA-Z0-9_.\\-](?:[a-zA-Z0-9_.\\-/]{0,254}[a-zA-Z0-9_.\\-])?$/",
     "EmptyDebugTip": "暂无运行结果",
     "EmptyFunctionTip": "您还没有创建函数",
     "UploadButton": "上传",
@@ -135,7 +135,10 @@
     "HistoryTips": "暂无历史版本",
     "NoDesc": "暂无描述",
     "CurrentVersion": "当前版本",
-    "HistoryVersion": "历史版本"
+    "HistoryVersion": "历史版本",
+    "MoveFunctionTip": "是否要将 {{srcFunc}} 移动到 {{targetDir}} 目录？",
+    "MoveFunctionToRootTip": "是否要将 {{srcFunc}} 移动到根目录？",
+    "MovingFunction": "移动函数中..."
   },
   "HomePanel": {
     "APP": "Android or iOS 应用",
@@ -702,8 +705,9 @@
   },
   "Deprecated": "已弃用",
   "All": "全部",
+  "MoveFunction": "移动函数",
   "UpgradeVersionTip": {
     "Title": "Laf 新版本已经准备好了！",
     "Description": "点击立即更新"
   }
-}
+}
diff --git a/web/public/locales/zh/translation.json b/web/public/locales/zh/translation.json
@@ -119,7 +119,7 @@
     "SystemDependence": "内置依赖",
     "Value": "值",
     "isSupport": "是否支持",
-    "FunctionNameRule": "函数名须由字母、数字、点（.）和划线(-_)组成，匹配正则：/^[a-zA-Z0-9_.-/]{1,256}$/",
+    "FunctionNameRule": "函数名须由字母、数字、点（.）和划线(-_)组成，匹配正则：/^[a-zA-Z0-9_.\\-](?:[a-zA-Z0-9_.\\-/]{0,254}[a-zA-Z0-9_.\\-])?$/",
     "EmptyDebugTip": "暂无运行结果",
     "EmptyFunctionTip": "您还没有创建函数",
     "UploadButton": "上传",
@@ -135,7 +135,10 @@
     "HistoryTips": "暂无历史版本",
     "NoDesc": "暂无描述",
     "CurrentVersion": "当前版本",
-    "HistoryVersion": "历史版本"
+    "HistoryVersion": "历史版本",
+    "MoveFunctionTip": "是否要将 {{srcFunc}} 移动到 {{targetDir}} 目录？",
+    "MoveFunctionToRootTip": "是否要将 {{srcFunc}} 移动到根目录？",
+    "MovingFunction": "移动函数中..."
   },
   "HomePanel": {
     "APP": "Android or iOS 应用",
@@ -702,8 +705,10 @@
   },
   "Deprecated": "已弃用",
   "All": "全部",
+  "MoveFunction": "移动函数",
   "UpgradeVersionTip": {
     "Title": "Laf 新版本已经准备好了！",
     "Description": "点击立即更新"
   }
-}
+}
+
diff --git a/web/src/components/FileTypeIcon/index.tsx b/web/src/components/FileTypeIcon/index.tsx
@@ -144,7 +144,7 @@ export default function FileTypeIcon(props: {
       );
     case FileType.folderOpen:
       return (
-        <Icon width="4" height="4" viewBox="0 0 25 24">
+        <Icon width="4" height="4" marginLeft="-2px" viewBox="0 0 25 24">
           <path
             d="M20 8.25V9H6.4025C5.89631 9.00372 5.40465 9.16962 4.99969 9.47334C4.59473 9.77706 4.2978 10.2026 4.1525 10.6875L2.75 15.375V6C2.75178 5.40381 2.98941 4.83255 3.41098 4.41098C3.83255 3.98941 4.40381 3.75178 5 3.75H10.235C10.3576 3.75134 10.478 3.78199 10.5863 3.8394C10.6946 3.89681 10.7876 3.97931 10.8575 4.08L12.1475 6H17.75C18.3462 6.00178 18.9175 6.2394 19.339 6.66098C19.7606 7.08255 19.9982 7.65381 20 8.25Z"
             fill="#47C8BF"

diff --git a/web/src/components/SectionList/index.tsx b/web/src/components/SectionList/index.tsx
@@ -4,37 +4,41 @@ import SimpleBar from "simplebar-react";
 
 import styles from "./index.module.scss";
 
-function SectionList(props: {
-  children: React.ReactNode;
-  style?: React.CSSProperties;
-  className?: string;
-}) {
+function SectionList(
+  props: { children: React.ReactNode; className?: string } & Omit<
+    React.HTMLAttributes<HTMLDivElement>,
+    "children"
+  >,
+) {
+  const { className, children, ...restProps } = props;
+
   return (
     <SimpleBar
-      className={styles.sectionList + " flex flex-col overflow-y-auto " + props.className}
-      style={props.style || {}}
+      className={clsx(styles.sectionList, "flex flex-col overflow-y-auto", className || "")}
+      {...restProps}
     >
-      {props.children}
+      {children}
     </SimpleBar>
   );
 }
 
-function Item(props: {
-  children: React.ReactNode;
-  isActive: boolean;
-  className?: string;
-  key: string;
-  size?: "small" | "default";
-  onClick?: () => void;
-}) {
-  const { children, isActive, onClick, className, size = "default" } = props;
+function Item(
+  props: {
+    children: React.ReactNode;
+    isActive: boolean;
+    className?: string;
+    size?: "small" | "default";
+  } & Omit<React.HTMLAttributes<HTMLLIElement>, "children">,
+) {
+  const { children, isActive, className, size = "default", ...restProps } = props;
+
   return (
     <li
       className={clsx(className, {
         [styles.active]: isActive,
         [styles.small]: size === "small",
       })}
-      onClick={onClick && onClick}
+      {...restProps}
     >
       {children}
     </li>

diff --git a/web/src/pages/app/functions/mods/FunctionPanel/CreateModal/index.tsx b/web/src/pages/app/functions/mods/FunctionPanel/CreateModal/index.tsx
@@ -160,7 +160,7 @@ const CreateModal = (props: {
                   <input
                     {...register("name", {
                       pattern: {
-                        value: /^[a-zA-Z0-9_.\-/]{1,256}$/,
+                        value: /^[a-zA-Z0-9_.\-](?:[a-zA-Z0-9_.\-/]{0,254}[a-zA-Z0-9_.\-])?$/,
                         message: t("FunctionPanel.FunctionNameRule"),
                       },
                     })}