feat: separate plugin node and the other node

Onelevenvy · Oct 6, 2024 · e57abf2 · e57abf2
1 parent a09b92b
commit e57abf2
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 15 deletions.
diff --git a/web/src/components/WorkFlow/FlowVisualizer.tsx b/web/src/components/WorkFlow/FlowVisualizer.tsx
@@ -235,23 +235,26 @@ const FlowVisualizer: React.FC<FlowVisualizerProps> = ({
 
       let newNode: CustomNode;
 
-      if (type === 'plugin') {
-        newNode = {
-          id: `${tool.display_name}-${nodes.length + 1}`, // 确保每个插件节点唯一
-          type: "plugin",
-          position,
-          data: {
-            label: tool.display_name,
-            toolName: tool.display_name,
-            args: {},
-            ...tool.initialData,
-          },
-        };
+      if (type !== 'plugin') {
+        const baseLabel = `${nodeConfig[type].display}`;
+      const uniqueName = generateUniqueName(baseLabel);
+      newNode = {
+        id: `${type}-${nodes.length + 1}`,
+        type,
+        position,
+        data: {
+          label: uniqueName, // 使用生成的唯一名称
+          customName: uniqueName,
+          onChange: (key: string, value: any) =>
+            onNodeDataChange(`${type}-${nodes.length + 1}`, key, value),
+          ...nodeConfig[type].initialData,
+        },
+      };
       } else {
         // 处理其他类型的节点（如 tools）
         newNode = {
-          id: `${tool.name}-${nodes.length + 1}`, // 确保每个工具节点唯一
-          type: "tool", // 假设工具节点的类型为 "tool"
+          id: `${tool.display_name}-${nodes.length + 1}`, // 确保每个插件节点唯一
+          type: "plugin",
           position,
           data: {
             label: tool.display_name,

diff --git a/web/src/components/WorkFlow/NodePalette.tsx b/web/src/components/WorkFlow/NodePalette.tsx
@@ -11,6 +11,7 @@ const NodePalette: React.FC = () => {
   const onDragStart = (event: React.DragEvent, tool: any, type: string) => {
     event.dataTransfer.setData("application/reactflow", JSON.stringify({ tool, type })); // 传递工具的完整信息和类型
     event.dataTransfer.effectAllowed = "move";
+    console.log(`Dragging type: ${type}`); // 添加调试信息
   };
 
   return (
@@ -42,7 +43,7 @@ const NodePalette: React.FC = () => {
                     textAlign="left"
                     cursor="move"
                     draggable
-                    onDragStart={(event) => onDragStart(event, nodeType, 'node')} // 传递节点类型
+                    onDragStart={(event) => onDragStart(event, nodeType, nodeType)} // 确保传递 nodeType
                   >
                     <IconButton
                       aria-label={display}