feat: The workflow quickly adds applications (#4882)

* feat: add node by handle (#4860)

* feat: add node by handle

* fix

* fix edge filter

* fix

* move utils

* move context

* scale handle

* move postion to handle params & optimize handle scale (#4878)

* move position to handle params

* close button scale

* perf: node template ui

* remove handle scale (#4880)

* feat: handle connect

* add mouse down duration check (#4881)

* perf: long press time

* tool handle size

* optimize add node by handle (#4883)

---------

Co-authored-by: heheer <heheer@sealos.io>

packages/web/components/common/Tabs/FillRowTabs.tsx

@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
-import { Flex, Box, type BoxProps } from '@chakra-ui/react';
+import { Flex, Box, type BoxProps, HStack } from '@chakra-ui/react';
 import MyIcon from '../Icon';
 
 type Props<T = string> = Omit<BoxProps, 'onChange'> & {
@@ -10,9 +10,22 @@ type Props<T = string> = Omit<BoxProps, 'onChange'> & {
   }[];
   value: T;
   onChange: (e: T) => void;
+  iconSize?: string;
+  labelSize?: string;
+  iconGap?: number;
 };
 
-const FillRowTabs = ({ list, value, onChange, py = '7px', px = '12px', ...props }: Props) => {
+const FillRowTabs = ({
+  list,
+  value,
+  onChange,
+  py = '2.5',
+  px = '4',
+  iconSize = '18px',
+  labelSize = 'sm',
+  iconGap = 2,
+  ...props
+}: Props) => {
   return (
     <Box
       display={'inline-flex'}
@@ -28,7 +41,7 @@ const FillRowTabs = ({ list, value, onChange, py = '7px', px = '12px', ...props
       {...props}
     >
       {list.map((item) => (
-        <Flex
+        <HStack
           key={item.value}
           flex={'1 0 0'}
           alignItems={'center'}
@@ -39,6 +52,7 @@ const FillRowTabs = ({ list, value, onChange, py = '7px', px = '12px', ...props
           py={py}
           userSelect={'none'}
           whiteSpace={'noWrap'}
+          gap={iconGap}
           {...(value === item.value
             ? {
                 bg: 'white',
@@ -53,9 +67,9 @@ const FillRowTabs = ({ list, value, onChange, py = '7px', px = '12px', ...props
                 onClick: () => onChange(item.value)
               })}
         >
-          {item.icon && <MyIcon name={item.icon as any} mr={1.5} w={'18px'} />}
-          <Box>{item.label}</Box>
-        </Flex>
+          {item.icon && <MyIcon name={item.icon as any} w={iconSize} />}
+          <Box fontSize={labelSize}>{item.label}</Box>
+        </HStack>
       ))}
     </Box>
   );

packages/web/i18n/en/workflow.json

@@ -1,8 +1,10 @@
 {
   "Array_element": "Array element",
   "Array_element_index": "Index",
+  "Click": "Click ",
   "Code": "Code",
   "Confirm_sync_node": "It will be updated to the latest node configuration and fields that do not exist in the template will be deleted (including all custom fields).\n\nIf the fields are complex, it is recommended that you copy a node first and then update the original node to facilitate parameter copying.",
+  "Drag": "Drag ",
   "Node.Open_Node_Course": "Open node course",
   "Node_variables": "Node variables",
   "Quote_prompt_setting": "Quote prompt",
@@ -176,6 +178,8 @@
   "text_to_extract": "Text to Extract",
   "these_variables_will_be_input_parameters_for_code_execution": "These variables will be input parameters for code execution",
   "tool.tool_result": "Tool operation results",
+  "to_add_node": "to add",
+  "to_connect_node": "to connect",
   "tool_call_termination": "Stop ToolCall",
   "tool_custom_field": "Custom Tool",
   "tool_field": " Tool Field Parameter Configuration",

packages/web/i18n/zh-CN/workflow.json

@@ -1,8 +1,10 @@
 {
   "Array_element": "数组元素",
   "Array_element_index": "下标",
+  "Click": "点击",
   "Code": "代码",
   "Confirm_sync_node": "将会更新至最新的节点配置，不存在模板中的字段将会被删除（包括所有自定义字段）。\n如果字段较为复杂，建议您先复制一份节点，再更新原来的节点，便于参数复制。",
+  "Drag": "拖拽",
   "Node.Open_Node_Course": "查看节点教程",
   "Node_variables": "节点变量",
   "Quote_prompt_setting": "引用提示词配置",
@@ -175,6 +177,8 @@
   "text_content_extraction": "文本内容提取",
   "text_to_extract": "需要提取的文本",
   "these_variables_will_be_input_parameters_for_code_execution": "这些变量会作为代码的运行的输入参数",
+  "to_add_node": "添加节点",
+  "to_connect_node": "连接节点",
   "tool.tool_result": "工具运行结果",
   "tool_call_termination": "工具调用终止",
   "tool_custom_field": "自定义工具变量",

packages/web/i18n/zh-Hant/workflow.json

@@ -1,8 +1,10 @@
 {
   "Array_element": "陣列元素",
   "Array_element_index": "索引",
+  "Click": "點擊",
   "Code": "程式碼",
   "Confirm_sync_node": "將會更新至最新的節點設定，不存在於範本中的欄位將會被刪除（包含所有自訂欄位）。\n如果欄位比較複雜，建議您先複製一份節點，再更新原來的節點，以便複製參數。",
+  "Drag": "拖拽",
   "Node.Open_Node_Course": "開啟節點教學課程",
   "Node_variables": "節點變數",
   "Quote_prompt_setting": "引用提示詞設定",
@@ -176,6 +178,8 @@
   "text_to_extract": "要擷取的文字",
   "these_variables_will_be_input_parameters_for_code_execution": "這些變數會作為程式碼執行的輸入參數",
   "tool.tool_result": "工具運行結果",
+  "to_add_node": "添加節點",
+  "to_connect_node": "連接節點",
   "tool_call_termination": "工具呼叫終止",
   "tool_custom_field": "自訂工具變數",
   "tool_field": "工具參數設定",