chore: replace all cn comments of fe to en version by volc api (#320)

frontend/packages/common/biz-components/src/parameters/components/custom-tree-node/components/line-component/index.module.less

@@ -1,4 +1,4 @@
-/** 基本组件样式 */
+/** basic component style */
 .dot {
   width: 4px;
   height: 4px;
@@ -26,7 +26,7 @@
   }
 }
 
-/** 业务组件样式 */
+/** Business Component Style */
 .half-top-root {
   flex: 1;
   position: relative;

frontend/packages/common/biz-components/src/parameters/components/custom-tree-node/components/line-component/index.tsx

@@ -184,7 +184,7 @@ export default function LevelLine({
   style,
   multiInfo = { multiline: false },
 }: LevelLineProps) {
-  // getLineShowResult 返回数据，暂时没涉及到 root 画线
+  // getLineShowResult returns data, no root drawing is involved for the time being
   const lineShowResult = getLineShowResult({ level, data });
   const showMap: Record<LineShowResult, React.ReactNode> = {
     [LineShowResult.HalfTopRoot]: (
@@ -203,7 +203,7 @@ export default function LevelLine({
     [LineShowResult.FullRootWithChildren]: (
       <FullRootWithChildren className={className} style={style} />
     ),
-    // 在 output tree 中，暂时没涉及到 root 画线
+    // In the output tree, there is no root drawing involved for the time being
     [LineShowResult.HalfTopChild]: (
       <HalfTopChild
         className={classNames(

frontend/packages/common/biz-components/src/parameters/components/custom-tree-node/components/param-description/index.tsx

@@ -56,7 +56,7 @@ export default function ParamDescription({
         )}
         value={data.description}
         ellipsis={true}
-        // 好像不生效
+        // It doesn't seem to work.
         disabled={disabled}
         handleBlur={() => {
           setInputFocus(false);

frontend/packages/common/biz-components/src/parameters/components/custom-tree-node/components/param-operator/index.tsx

@@ -48,7 +48,7 @@ export default function ParamOperator({
 }: ParamOperatorProps) {
   // eslint-disable-next-line @typescript-eslint/no-magic-numbers
   const isLimited = level >= 3;
-  // 是否展示新增子项的按钮
+  // Whether to display the button for adding a child item
   const needRenderAppendChild =
     ObjectLikeTypes.includes(data.type) && !isLimited;
   const computedOperatorStyle = (): React.CSSProperties => {

frontend/packages/common/biz-components/src/parameters/components/custom-tree-node/components/param-type/index.tsx

@@ -34,7 +34,7 @@ interface ParamTypeProps {
   level: number;
   onSelectChange?: SelectProps['onChange'];
   disabled?: boolean;
-  // 不支持使用的类型
+  // Types not supported
   disabledTypes?: ParamTypeAlias[];
 }
 

frontend/packages/common/biz-components/src/parameters/components/custom-tree-node/components/workflow-sl-textarea/index.tsx

@@ -54,8 +54,8 @@ export type WorkflowSLTextAreaProps = ComponentProps<typeof TextArea> & {
 };
 
 /**
- * @component TextArea 在 Workflow 场景下的二次封装;
- * focus(inputting) 的时候提供多行滚动输入能力，blur 的时候提供 ellipsis 和 tooltip 提示能力
+ * @Component TextArea secondary encapsulation in Workflow scenarios;
+ * When focusing (inputting), it provides multi-line scrolling input capability, and when blur, it provides ellipsis and tooltip prompt capability.
  */
 export default function WorkflowSLTextArea(props: WorkflowSLTextAreaProps) {
   const { ellipsis = true } = props;
@@ -84,7 +84,7 @@ export default function WorkflowSLTextArea(props: WorkflowSLTextAreaProps) {
     $state.inputOnFocus = false;
     props?.handleBlur?.($state.value || '');
     props?.onBlur?.(e);
-    // 失焦的时候，滚动到最顶端
+    // When out of focus, scroll to the top
     if (textAreaRef?.current) {
       textAreaRef.current.scrollTop = 0;
     }
@@ -95,7 +95,7 @@ export default function WorkflowSLTextArea(props: WorkflowSLTextAreaProps) {
     props?.handleChange?.(v);
   };
 
-  // 输入法输入结束
+  // Input method input end
   const onCompositionEnd = (e: React.CompositionEvent<HTMLTextAreaElement>) => {
     const target = e.target as HTMLTextAreaElement;
 
@@ -126,7 +126,7 @@ export default function WorkflowSLTextArea(props: WorkflowSLTextAreaProps) {
     $state.value = props.value;
   }, [props.value]);
 
-  /** 是否处于失焦缩略状态 */
+  /** Is it in an out-of-focus thumbnail state? */
   const ellipsisWithBlur = useMemo(
     () => !$state.inputOnFocus && hasEllipsis,
     [hasEllipsis, $state.inputOnFocus],

frontend/packages/common/biz-components/src/parameters/components/custom-tree-node/index.tsx

@@ -36,10 +36,10 @@ import styles from './index.module.less';
 
 export interface CustomTreeNodeProps extends RenderFullLabelProps {
   onChange: (mode: ChangeMode, param: TreeNodeCustomData) => void;
-  // Description 组件变换为多行时，其下面第一个 child 需被记录
+  // When the Description component is transformed into multiple rows, the first child below it needs to be recorded
   onActiveMultiInfoChange?: (info: ActiveMultiInfo) => void;
   activeMultiInfo?: ActiveMultiInfo;
-  // 不支持使用的类型
+  // Types not supported
   disabledTypes?: ParamTypeAlias[];
 }
 
@@ -59,7 +59,7 @@ export default function CustomTreeNode(props: CustomTreeNodeProps) {
   } = props;
   const { allowValueEmpty, readonly, hasObjectLike, withDescription } =
     useConfig();
-  // 当前值
+  // current value
   const value = data as TreeNodeCustomData;
   const isTopLevel = level === 0;
   const isOnlyOneData = value.isSingle && isTopLevel;
@@ -71,15 +71,15 @@ export default function CustomTreeNode(props: CustomTreeNodeProps) {
   const disableDelete = Boolean(
     !allowValueEmpty && isOnlyOneData && isTopLevel,
   );
-  // 删除时
+  // When deleting
   const onDelete = () => {
     onChange(ChangeMode.Delete, value);
   };
-  // 新增子项时
+  // When adding a child
   const onAppend = () => {
     onChange(ChangeMode.Append, value);
   };
-  // 类型切换时
+  // When switching types
   const onSelectChange = (
     val?: string | number | Array<unknown> | Record<string, unknown>,
   ) => {
@@ -90,7 +90,7 @@ export default function CustomTreeNode(props: CustomTreeNodeProps) {
     if (isNumber(val)) {
       const isObjectLike = ObjectLikeTypes.includes(val);
       if (!isObjectLike) {
-        // 如果不是类Object，判断是否有children，如果有，删除掉
+        // If it is not a class Object, determine whether there are children. If so, delete it
         if (value.children && value.children.length > 0) {
           delete value.children;
         }
@@ -99,14 +99,14 @@ export default function CustomTreeNode(props: CustomTreeNodeProps) {
       onChange(ChangeMode.Update, { ...value, type: val });
     }
 
-    // 更新type
+    // Update type
   };
-  // 更新
+  // update
   const onNameChange = (name: string) => {
     onChange(ChangeMode.Update, { ...value, name });
   };
 
-  // 更新
+  // update
   const onDescriptionChange = useCallback(
     (description: string) => {
       onChange(ChangeMode.Update, { ...value, description });
@@ -115,7 +115,7 @@ export default function CustomTreeNode(props: CustomTreeNodeProps) {
   );
 
   /**
-   * Description 组件单行 / 多行变换时，其下面第一个 child 的竖线需要缩短 / 延长
+   * Description When the component converts single/multiple rows, the vertical line of the first child below it needs to be shortened/lengthened
    */
   const onDescriptionLineChange = useCallback(
     (type: DescriptionLine) => {
@@ -140,7 +140,7 @@ export default function CustomTreeNode(props: CustomTreeNodeProps) {
 
   if (readonly) {
     return (
-      // 提高class的css 权重
+      // Increase the CSS weight of the class
       <div
         className={classNames(
           styles['readonly-icon-container'],
@@ -170,7 +170,7 @@ export default function CustomTreeNode(props: CustomTreeNodeProps) {
         })}
         ref={treeNodeRef}
       >
-        {/* 每增加一级多15长度 */}
+        {/* 15 more lengths for each additional level */}
         <div
           style={{ width: IndentationWidth }}
           className={styles['level-icon']}
@@ -196,7 +196,7 @@ export default function CustomTreeNode(props: CustomTreeNodeProps) {
             level={level}
             disabledTypes={disabledTypes}
           />
-          {/* LLM 节点输出才有 description */}
+          {/* The LLM node output has a description. */}
           {withDescription ? (
             <ParamDescription
               data={value}

frontend/packages/common/biz-components/src/parameters/components/custom-tree-node/type.ts

@@ -29,22 +29,22 @@ export type TreeNodeCustomData = TreeNodeData &
     | 'quotedValue'
     | 'fieldRandomKey'
   > & {
-    // 行唯一值
+    // row unique value
     key: string;
-    // Form的field
+    // Formed fields
     field?: string;
-    // 是否是第一项
+    // Is it the first item?
     isFirst?: boolean;
-    // 是否是最后一项
+    // Is it the last item?
     isLast?: boolean;
-    // 是否只有该项一条数据
+    // Is there only one item of data?
     isSingle?: boolean;
-    // 该项的嵌套层级，从0开始
+    // The nesting level of the item, starting at 0
     level?: number;
-    // 辅助线展示的字段
+    // Fields displayed by the auxiliary line
     helpLineShow?: Array<boolean>;
     children?: Array<TreeNodeCustomData>;
-    // 变量描述，用于作为隐藏的引导
+    // Variable descriptions, used as hidden bootstraps
     description?: string;
   };
 
@@ -52,24 +52,24 @@ export interface CustomTreeNodeFuncRef {
   data: TreeNodeCustomData;
   level: number;
   readonly: boolean;
-  // 通用change方法
+  // General change method
   onChange: (mode: ChangeMode, param: TreeNodeCustomData) => void;
-  // 定制的类型改变的change方法，主要用于自定义render使用
-  // 添加子项
+  // Customized type change method, mainly used for custom rendering
+  // Add child item
   onAppend: () => void;
-  // 删除该项
+  // Delete this item
   onDelete: () => void;
-  // 删除该项下面的所有子项
+  // Delete all children under this item
   onDeleteChildren: () => void;
-  // 类型改变时内部的调用方法，主要用于从类Object类型转为其他类型时需要删除所有子项
+  // The internal call method when the type changes, mainly used to delete all children when converting from the class Object type to other types
   onSelectChange: (
     val?: string | number | Array<unknown> | Record<string, unknown>,
   ) => void;
 }
 
 export interface ActiveMultiInfo {
-  // 当前行是否处于多行状态，多行状态竖线需要延长
+  // Whether the current line is in a multi-line state, and the vertical line in the multi-line state needs to be extended
   activeMultiKey: string;
-  // 当前行paramName数据是否出现错误信息
+  // Is there an error message for the current row paramName data?
   withNameError?: boolean;
 }

frontend/packages/common/biz-components/src/parameters/components/header/index.tsx

@@ -67,7 +67,7 @@ export default function Header() {
         </span>
       </div>
 
-      {/* description 目前只在 LLM 的 output 中存在 */}
+      {/* Description currently only exists in LLM output */}
       {withDescription ? (
         <div className={styles.description}>
           <span className={styles.text}>

frontend/packages/common/biz-components/src/parameters/constants.ts

@@ -15,12 +15,12 @@
  */
  
 /* eslint-disable @typescript-eslint/naming-convention */
-// 类型选择控件基础宽度
+// Type selection control base width
 export const OperatorTypeBaseWidth = 155;
 
-// 61 = 删除按钮 + 添加按钮 的上层容器宽度
+// 61 = Remove button + Add button, upper container width
 export const OperatorLargeSize = 61;
-// 31 = 删除按钮 的上层容器宽度
+// 31 = Remove button, upper container width
 export const OperatorSmallSize = 31;
-// 8 = 删除按钮与变量类型中间的 margin 距离
+// 8 = Remove the margin distance between the button and the variable type
 export const SpacingSize = 8;

frontend/packages/common/biz-components/src/parameters/parameters.tsx

@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
- 
+
 /* eslint-disable @coze-arch/max-line-per-function */
 import React, { type PropsWithChildren, useState } from 'react';
 
@@ -56,26 +56,26 @@ export function Parameters(props: PropsWithChildren<ParametersProps>) {
     allowValueEmpty = true,
     onChange,
   } = props;
-  // 监听该值的变化
+  // Monitor for changes in this value
   const isValueEmpty = !value || value.length === 0;
   const { data: formattedTreeData, hasObjectLike } = formatTreeData(
     cloneDeep(value) as TreeNodeCustomData[],
   );
 
   /**
-   * 表示当前哪一行的父亲节点的 description 处于多行状态(LLM节点)
-   * 用于渲染树形竖线，处于多行文本的下一行竖线应该延长
-   * 若 param name 有错误信息，竖线从错误信息下方延展，长度有所变化
+   * The description of the parent node of which row is currently in a multi-row state (LLM node)
+   * For rendering tree vertical lines, the next vertical line in multiple lines of text should be extended
+   * If the param name has an error message, the vertical bar extends below the error message and the length changes
    */
   const [activeMultiInfo, setActiveMultiInfo] = useState<ActiveMultiInfo>({
     activeMultiKey: '',
   });
 
-  // 该组件的 change 方法
+  // How to change this component
   const onValueChange = (freshValue?: Array<TreeNodeCustomData>) => {
     if (onChange) {
       freshValue = (freshValue || []).concat([]);
-      // 清理掉无用字段
+      // Clean up useless fields
       traverse<TreeNodeCustomData>(freshValue, node => {
         const { key, name, type, description, children } = node;
         // eslint-disable-next-line guard-for-in
@@ -95,9 +95,9 @@ export function Parameters(props: PropsWithChildren<ParametersProps>) {
     }
   };
 
-  // 树节点的 change 方法
+  // Tree node change method
   const onTreeNodeChange = (mode: ChangeMode, param: TreeNodeCustomData) => {
-    // 先clone一份，因为Tree内部会对treeData执行isEqual，克隆一份一定是false
+    // Clone one first, because the Tree will execute isEqual on treeData, cloning one must be false.
     const cloneDeepTreeData = cloneDeep(
       formattedTreeData,
     ) as Array<TreeNodeCustomData>;
@@ -108,13 +108,13 @@ export function Parameters(props: PropsWithChildren<ParametersProps>) {
     if (findResult) {
       switch (mode) {
         case ChangeMode.Append: {
-          // 新增不可以用 parentData 做标准，要在当前 data 下新增
+          // You can't use parentData as a standard for adding, you need to add it under the current data.
           const { data } = findResult;
           const currentChildren = data.children || [];
-          // @ts-expect-error 有些值不需要此时指定，因为在 rerender 的时候会执行 format
+          // @ts-expect-error Some values do not need to be specified at this time because format is executed during rerender
           data.children = currentChildren.concat({
             ...getDefaultAppendValue(),
-            // 增加 field
+            // Add field
             field: `${data.field}.children[${currentChildren.length}]`,
           });
           onValueChange(cloneDeepTreeData);

frontend/packages/common/biz-components/src/parameters/types.ts

@@ -19,10 +19,10 @@ export enum ParamTypeAlias {
   Integer,
   Boolean,
   Number,
-  /** 理论上没有 List 了，此项仅作兼容 */
+  /** Theoretically there is no List, this item is only for compatibility */
   List = 5,
   Object = 6,
-  // 上面是 api 中定义的 InputType。下面是整合后的。从 99 开始，避免和后端定义撞车
+  // The above is the InputType defined in the api. The following is the integrated one. Start from 99 to avoid collisions with the backend definition.
   ArrayString = 99,
   ArrayInteger,
   ArrayBoolean,
@@ -51,20 +51,20 @@ export enum ParamValueType {
 
 export interface RecursedParamDefinition {
   name?: string;
-  /** Tree 组件要求每一个节点都有 key，而 key 不适合用名称（前后缀）等任何方式赋值，最终确定由接口转换层一次性提供随机 key */
+  /** The Tree component requires each node to have a key, and the key is not suitable for assignment in any way such as name (before and after). Finally, the interface conversion layer provides a random key at one time. */
   fieldRandomKey?: string;
   desc?: string;
   required?: boolean;
   type: ParamTypeAlias;
   children?: RecursedParamDefinition[];
-  // region 参数值定义
-  // 输入参数的值可以来自上游变量引用，也可以是用户输入的定值（复杂类型则只允许引用）
-  // 如果是定值，传 fixedValue
-  // 如果是引用，传 quotedValue
+  // Region parameter value definition
+  // The value of the input parameter can come from an upstream variable reference, or it can be a fixed value entered by the user (for complex types, only references are allowed).
+  // If it is a fixed value, pass the fixedValue.
+  // If it is a reference, pass the quotedValue.
   isQuote?: ParamValueType;
-  /** 参数定值 */
+  /** parameter setting */
   fixedValue?: string;
-  /** 参数引用 */
+  /** parameter reference */
   quotedValue?: [nodeId: string, ...path: string[]]; // string[]
   // endregion
 }
@@ -89,9 +89,9 @@ export interface ParametersProps {
   className?: string;
   style?: React.CSSProperties;
   withDescription?: boolean;
-  // 不支持使用的类型
+  // Types not supported
   disabledTypes?: ParamTypeAlias[];
   errors?: ParametersError[];
-  // 支持空值 & 空数组
+  // Support null value & empty array
   allowValueEmpty?: boolean;
 }

frontend/packages/common/biz-components/src/parameters/utils/convert-map-to-options.ts

@@ -17,9 +17,9 @@
 import { isFunction } from 'lodash-es';
 
 /**
- * 将 { value: label } 形式的结构体转成Select需要的options Array<{ label, value }>
- *   computedValue：将value值转化一次作为options的value
- *   passItem：判断当前value值是否需要跳过遍历
+ * Convert a structure of the form {value: label} into the options Array < {label, value} > required by Select
+ *   computedValue: Convert the value value once as the value of options
+ *   passItem: Determine whether the current value needs to skip the traversal
  */
 export default function convertMaptoOptions<Value = number>(
   map: Record<string, unknown>,
@@ -27,9 +27,9 @@ export default function convertMaptoOptions<Value = number>(
     computedValue?: (val: unknown) => Value;
     passItem?: (val: unknown) => boolean;
     /**
-     * 由于 i18n 的实现方式问题，写成常量的文案需要惰性加载
-     * 因此涉及到 i18n 的 { value: label } 结构一律需要写成 { value: () => label }
-     * 该属性启用时，会额外进行一次惰性加载
+     * Due to the implementation of i18n, the copy written as a constant needs to be loaded lazily
+     * Therefore, the {value: label} structure involving i18n needs to be written as {value : () => label}
+     * When this property is enabled, an additional lazy load is performed
      * @default false
      * @link 
      */

frontend/packages/common/biz-components/src/parameters/utils/utils.ts

@@ -32,7 +32,7 @@ interface ChildrenFindResult {
 
 export type FindDataResult = RootFindResult | ChildrenFindResult | null;
 /**
- * 根据target数组，找到key在该项的值和位置，主要是获取位置，方便操作parent的children
+ * According to the target array, find the value and position of the key in the item, mainly to obtain the position, which is convenient for operating the children of the parent.
  */
 export function findCustomTreeNodeDataResult(
   target: Array<TreeNodeCustomData>,
@@ -40,7 +40,7 @@ export function findCustomTreeNodeDataResult(
 ): FindDataResult {
   const dataInRoot = target.find(item => item.field === findField);
   if (dataInRoot) {
-    // 如果是根节点
+    // If it is the root node
     return {
       isRoot: true,
       parentData: null,
@@ -87,7 +87,7 @@ export function formatTreeData(data: Array<TreeNodeCustomData>) {
   function resolveActionParamList(
     list: Array<TreeNodeCustomData>,
     field: string,
-    // 主要是用来辅助展示线的判断的
+    // It is mainly used to assist the judgment of the display line.
     {
       parentData,
       level,
@@ -99,16 +99,16 @@ export function formatTreeData(data: Array<TreeNodeCustomData>) {
     list?.forEach((item, index) => {
       const keyField = field ? `${field}.${index}` : `${index}`;
       hasObjectLike = hasObjectLike || ObjectLikeTypes.includes(item.type);
-      // 赋值children
+      // Assignment children
       item.key = item.key ?? item.fieldRandomKey ?? nanoid();
       item.field = keyField;
       item.isFirst = index === 0;
       item.isLast = index === list.length - 1;
       item.isSingle = item.isFirst && item.isLast;
       item.level = level;
-      // 第一级不展示辅助线，需要判断level
-      // 也就是第二级（level = 1）只需要自身的层级线
-      // 在第三级（level = 2）之后需要辅助线展示上一级的辅助线
+      // The first level does not show the auxiliary line, you need to judge the level
+      // That is, the second level (level = 1) only needs its own level line
+      // After the third level (level = 2), the guide line is required to show the guide line of the previous level
       item.helpLineShow =
         parentData && level >= MAX_LINE_LEVEL
           ? (parentData.helpLineShow || []).concat(!parentData.isLast)
@@ -165,7 +165,7 @@ export function getLineShowResult({
       item ? LineShowResult.HelpLineBlock : LineShowResult.EmptyBlock,
     ) || [];
   const isRoot = isRootWithoutChildren || isRootWithChildren;
-  // 根节点不需要展示线，只有非根节点才需要辅助线
+  // The root node does not need a display line, only non-root nodes need auxiliary lines.
   if (!isRoot) {
     if (isChildWithChildren) {
       if (data.isLast) {