feat(web): 优化节点展现

service-web/client/src/components/flow/FlowEditor.tsx

@@ -8,11 +8,7 @@ import styled from 'styled-components'
 import '@xyflow/react/dist/style.css'
 import {commonInfo} from '../../util/amis.tsx'
 import {checkAddConnection, checkAddNode, checkSave} from './FlowChecker.tsx'
-import CodeNode from './node/CodeNode.tsx'
-import KnowledgeNode from './node/KnowledgeNode.tsx'
-import LlmNode from './node/LlmNode.tsx'
-import OutputNode from './node/OutputNode.tsx'
-import SwitchNode from './node/SwitchNode.tsx'
+import NodeRegistry from './NodeRegistry.tsx'
 import {useContextStore} from './store/ContextStore.ts'
 import {useDataStore} from './store/DataStore.ts'
 import {useFlowStore} from './store/FlowStore.ts'
@@ -52,46 +48,6 @@ const FlowableDiv = styled.div`
     }
 `
 
-type NodeDefine = {
-  key: string,
-  name: string,
-  description: string,
-  component: any,
-}
-
-const nodeDefine: Record<string, NodeDefine> = {
-  'output-node': {
-    key: 'output-node',
-    name: '输出',
-    description: '定义输出变量',
-    component: OutputNode,
-  },
-  'llm-node': {
-    key: 'llm-node',
-    name: '大模型',
-    description: '使用大模型对话',
-    component: LlmNode,
-  },
-  'knowledge-node': {
-    key: 'knowledge-node',
-    name: '知识库',
-    description: '',
-    component: KnowledgeNode,
-  },
-  'code-node': {
-    key: 'code-node',
-    name: '代码执行',
-    description: '执行自定义的处理代码',
-    component: CodeNode,
-  },
-  'switch-node': {
-    key: 'switch-node',
-    name: '分支节点',
-    description: '根据不同的情况前往不同的分支',
-    component: SwitchNode,
-  },
-}
-
 export type GraphData = { nodes: Node[], edges: Edge[], data: any }
 
 export type FlowEditorProps = {
@@ -139,7 +95,7 @@ function FlowEditor(props: FlowEditorProps) {
       <Space className="toolbar">
         <Dropdown
           menu={{
-            items: Object.keys(nodeDefine).map(key => ({key: key, label: nodeDefine[key]!.name})),
+            items: Object.keys(NodeRegistry).map(key => ({key: key, label: NodeRegistry[key]!.name})),
             onClick: ({key}) => {
               try {
                 if (commonInfo.debug) {
@@ -148,7 +104,7 @@ function FlowEditor(props: FlowEditorProps) {
                 checkAddNode(key, nodes, edges)
 
                 let nodeId = randomId(10, 'qwertyuiopasdfghjklzxcvbnmQWERTYUIOPASDFGHJKLZXCVBNM')
-                let define = nodeDefine[key]
+                let define = NodeRegistry[key]
 
                 setDataById(
                   nodeId,
@@ -222,7 +178,7 @@ function FlowEditor(props: FlowEditorProps) {
           }
         }}
         // @ts-ignore
-        nodeTypes={arrToMap(Object.keys(nodeDefine), key => nodeDefine[key]!.component)}
+        nodeTypes={arrToMap(Object.keys(NodeRegistry), key => NodeRegistry[key]!.component)}
       >
         <Controls/>
         <MiniMap/>