diff --git a/web/app/components/workflow/hooks.ts b/web/app/components/workflow/hooks.ts index 0f4e1162d3..bab7ce0a90 100644 --- a/web/app/components/workflow/hooks.ts +++ b/web/app/components/workflow/hooks.ts @@ -206,7 +206,7 @@ export const useWorkflow = () => { data: NodeInitialData[nodeType], position: { x: currentNode.position.x + 304, - y: 0, + y: currentNode.position.y, }, selected: true, } diff --git a/web/app/components/workflow/nodes/_base/node.tsx b/web/app/components/workflow/nodes/_base/node.tsx index 465d3dd0d9..9848dddf0f 100644 --- a/web/app/components/workflow/nodes/_base/node.tsx +++ b/web/app/components/workflow/nodes/_base/node.tsx @@ -9,7 +9,6 @@ import { import type { NodeProps } from 'reactflow' import BlockIcon from '../../block-icon' import { useWorkflow } from '../../hooks' -import NodeControl from './components/node-control' type BaseNodeProps = { children: ReactElement @@ -32,7 +31,6 @@ const BaseNode: FC = ({ `} onClick={() => handleSelectNode(id)} > -
= ({ return (
-
+
= ({ onChange={handleTitleChange} />
+ { + canRunBySingle(data.type) && ( + +
+ +
+
+ ) + }
{ const nodeData = props.data @@ -40,6 +42,13 @@ const CustomNode = memo((props: NodeProps) => { /> ) } + { + nodeData.hovering + && canRunBySingle(nodeData.type) + && ( + + ) + } ) }) diff --git a/web/app/components/workflow/style.css b/web/app/components/workflow/style.css index 3cabb3e7ff..29d13acb6b 100644 --- a/web/app/components/workflow/style.css +++ b/web/app/components/workflow/style.css @@ -1,3 +1,3 @@ .react-flow__node { - transition: transform 0.2s ease-in-out; + transition: transform 0.1s ease-in-out; } \ No newline at end of file diff --git a/web/app/components/workflow/utils.ts b/web/app/components/workflow/utils.ts index 812604d4ef..f41a1fcb3c 100644 --- a/web/app/components/workflow/utils.ts +++ b/web/app/components/workflow/utils.ts @@ -125,7 +125,7 @@ export const getLayoutByDagre = (nodes: Node[], edges: Edge[]) => { dagreGraph.setGraph({ rankdir: 'LR', align: 'UL', - nodesep: 40, + nodesep: 64, ranksep: 64, }) nodes.forEach((node) => { @@ -142,3 +142,14 @@ export const getLayoutByDagre = (nodes: Node[], edges: Edge[]) => { return dagreGraph } + +export const canRunBySingle = (nodeType: BlockEnum) => { + return nodeType === BlockEnum.LLM + || nodeType === BlockEnum.KnowledgeRetrieval + || nodeType === BlockEnum.IfElse + || nodeType === BlockEnum.Code + || nodeType === BlockEnum.TemplateTransform + || nodeType === BlockEnum.QuestionClassifier + || nodeType === BlockEnum.HttpRequest + || nodeType === BlockEnum.Tool +}