mirror of
https://github.com/langgenius/dify.git
synced 2026-07-24 13:08:34 +08:00
2472 lines
87 KiB
TypeScript
2472 lines
87 KiB
TypeScript
import type { MouseEvent } from 'react'
|
|
import type {
|
|
NodeDragHandler,
|
|
NodeMouseHandler,
|
|
OnConnect,
|
|
OnConnectEnd,
|
|
OnConnectStart,
|
|
ResizeParamsWithDirection,
|
|
} from 'reactflow'
|
|
import type { BlockDefaultValue } from '../block-selector/types'
|
|
import type { IterationNodeType } from '../nodes/iteration/types'
|
|
import type { LoopNodeType } from '../nodes/loop/types'
|
|
import type { VariableAssignerNodeType } from '../nodes/variable-assigner/types'
|
|
import type { Edge, Node, OnNodeAdd } from '../types'
|
|
import type { RAGPipelineVariables } from '@/models/pipeline'
|
|
import { toast } from '@langgenius/dify-ui/toast'
|
|
import { useQuery } from '@tanstack/react-query'
|
|
import { produce } from 'immer'
|
|
import { useCallback, useRef, useState } from 'react'
|
|
import { useTranslation } from 'react-i18next'
|
|
import { getConnectedEdges, getOutgoers, useReactFlow } from 'reactflow'
|
|
import { consoleQuery } from '@/service/client'
|
|
import { collaborationManager } from '../collaboration/core/collaboration-manager'
|
|
import {
|
|
CUSTOM_EDGE,
|
|
ITERATION_PADDING,
|
|
LOOP_PADDING,
|
|
NESTED_ELEMENT_Z_INDEX,
|
|
NODE_WIDTH_X_OFFSET,
|
|
X_OFFSET,
|
|
Y_OFFSET,
|
|
} from '../constants'
|
|
import { getNodeUsedVars } from '../nodes/_base/components/variable/utils'
|
|
import { useCreateInlineAgentBinding } from '../nodes/agent-v2/hooks'
|
|
import { isAgentV2NodeData, needsInlineAgentBindingCreation } from '../nodes/agent-v2/types'
|
|
import { CUSTOM_ITERATION_START_NODE } from '../nodes/iteration-start/constants'
|
|
import { useNodeIterationInteractions } from '../nodes/iteration/use-interactions'
|
|
import { CUSTOM_LOOP_START_NODE } from '../nodes/loop-start/constants'
|
|
import { useNodeLoopInteractions } from '../nodes/loop/use-interactions'
|
|
import { CUSTOM_NOTE_NODE } from '../note-node/constants'
|
|
import { useWorkflowStore } from '../store'
|
|
import { BlockEnum, ControlMode, isTriggerNode } from '../types'
|
|
import {
|
|
generateNewNode,
|
|
genNewNodeTitleFromOld,
|
|
getNestedNodePosition,
|
|
getNodeCatalogType,
|
|
getNodeCustomTypeByNodeDataType,
|
|
getNodesConnectedSourceOrTargetHandleIdsMap,
|
|
getNodesWithSameDefaultDataType,
|
|
getTopLeftNodePosition,
|
|
isClipboardEdgeStructurallyValid,
|
|
isClipboardNodeStructurallyValid,
|
|
isClipboardValueCompatibleWithDefault,
|
|
readWorkflowClipboard,
|
|
sanitizeClipboardValueByDefault,
|
|
writeWorkflowClipboard,
|
|
} from '../utils'
|
|
import { useWorkflowHistoryStore } from '../workflow-history-store'
|
|
import { useAutoGenerateWebhookUrl } from './use-auto-generate-webhook-url'
|
|
import { useCollaborativeWorkflow } from './use-collaborative-workflow'
|
|
import { useHelpline } from './use-helpline'
|
|
import useInspectVarsCrud from './use-inspect-vars-crud'
|
|
import { useNodesMetaData } from './use-nodes-meta-data'
|
|
import { useNodesSyncDraft } from './use-nodes-sync-draft'
|
|
import { useNodesReadOnly, useWorkflow, useWorkflowReadOnly } from './use-workflow'
|
|
import { useWorkflowHistory, WorkflowHistoryEvent } from './use-workflow-history'
|
|
|
|
// Entry node deletion restriction has been removed to allow empty workflows
|
|
|
|
// Entry node (Start/Trigger) wrapper offsets for alignment
|
|
// Must match the values in use-helpline.ts
|
|
const ENTRY_NODE_WRAPPER_OFFSET = {
|
|
x: 0,
|
|
y: 21, // Adjusted based on visual testing feedback
|
|
} as const
|
|
|
|
function needsPendingInlineAgentBinding(defaultValue?: unknown) {
|
|
if (!defaultValue || typeof defaultValue !== 'object' || !('agent_binding' in defaultValue))
|
|
return false
|
|
|
|
const binding = (
|
|
defaultValue as {
|
|
agent_binding?: {
|
|
agent_id?: string
|
|
binding_type?: string
|
|
current_snapshot_id?: string
|
|
}
|
|
}
|
|
).agent_binding
|
|
|
|
return (
|
|
binding?.binding_type === 'inline_agent' && (!binding.agent_id || !binding.current_snapshot_id)
|
|
)
|
|
}
|
|
|
|
function agentV2NodeDefaultsNeedInlineBinding(
|
|
defaultValue?: unknown,
|
|
pluginDefaultValue?: unknown,
|
|
) {
|
|
return needsPendingInlineAgentBinding({
|
|
...(defaultValue && typeof defaultValue === 'object' ? defaultValue : {}),
|
|
...(pluginDefaultValue && typeof pluginDefaultValue === 'object' ? pluginDefaultValue : {}),
|
|
})
|
|
}
|
|
|
|
const pruneClipboardNodesWithFilteredAncestors = (
|
|
sourceNodes: Node[],
|
|
candidateNodes: Node[],
|
|
): Node[] => {
|
|
const candidateNodeIds = new Set(candidateNodes.map((node) => node.id))
|
|
const filteredRootIds = sourceNodes
|
|
.filter((node) => !candidateNodeIds.has(node.id))
|
|
.map((node) => node.id)
|
|
|
|
if (!filteredRootIds.length) return candidateNodes
|
|
|
|
const childrenByParent = new Map<string, string[]>()
|
|
sourceNodes.forEach((node) => {
|
|
if (!node.parentId) return
|
|
|
|
const children = childrenByParent.get(node.parentId) ?? []
|
|
children.push(node.id)
|
|
childrenByParent.set(node.parentId, children)
|
|
})
|
|
|
|
const filteredNodeIds = new Set(filteredRootIds)
|
|
const queue = [...filteredRootIds]
|
|
|
|
while (queue.length) {
|
|
const currentNodeId = queue.shift()!
|
|
const children = childrenByParent.get(currentNodeId) ?? []
|
|
children.forEach((childId) => {
|
|
if (filteredNodeIds.has(childId)) return
|
|
|
|
filteredNodeIds.add(childId)
|
|
queue.push(childId)
|
|
})
|
|
}
|
|
|
|
return candidateNodes.filter((node) => !filteredNodeIds.has(node.id))
|
|
}
|
|
|
|
const getUniquePastedNodeTitle = (sourceTitle: string, reservedTitles: Set<string>) => {
|
|
let titleCandidate = sourceTitle
|
|
|
|
while (reservedTitles.has(titleCandidate)) titleCandidate = genNewNodeTitleFromOld(titleCandidate)
|
|
|
|
reservedTitles.add(titleCandidate)
|
|
return titleCandidate
|
|
}
|
|
|
|
const isNoteLinkClickTarget = (target: EventTarget | null, node: Node) => {
|
|
return (
|
|
node.type === CUSTOM_NOTE_NODE &&
|
|
target instanceof HTMLElement &&
|
|
!!target.closest('.note-editor-theme_link')
|
|
)
|
|
}
|
|
|
|
export const useNodesInteractions = () => {
|
|
const { t } = useTranslation()
|
|
const { data: appDslVersion = '' } = useQuery(
|
|
consoleQuery.appDslVersion.get.queryOptions({
|
|
staleTime: Infinity,
|
|
select: (data) => data.app_dsl_version,
|
|
}),
|
|
)
|
|
const collaborativeWorkflow = useCollaborativeWorkflow()
|
|
const workflowStore = useWorkflowStore()
|
|
const reactflow = useReactFlow()
|
|
const { store: workflowHistoryStore } = useWorkflowHistoryStore()
|
|
const { handleSyncWorkflowDraft } = useNodesSyncDraft()
|
|
const { getAfterNodesInSameBranch } = useWorkflow()
|
|
const { getNodesReadOnly } = useNodesReadOnly()
|
|
const { getWorkflowReadOnly } = useWorkflowReadOnly()
|
|
const { handleSetHelpline } = useHelpline()
|
|
const { handleNodeIterationChildDrag, handleNodeIterationChildrenCopy } =
|
|
useNodeIterationInteractions()
|
|
const { handleNodeLoopChildDrag, handleNodeLoopChildrenCopy } = useNodeLoopInteractions()
|
|
const dragNodeStartPosition = useRef({ x: 0, y: 0 } as {
|
|
x: number
|
|
y: number
|
|
})
|
|
const { nodesMap: nodesMetaDataMap } = useNodesMetaData()
|
|
|
|
const { saveStateToHistory, undo, redo } = useWorkflowHistory()
|
|
const autoGenerateWebhookUrl = useAutoGenerateWebhookUrl()
|
|
const { createInlineAgentBinding } = useCreateInlineAgentBinding()
|
|
|
|
const createInlineAgentBindingForNode = useCallback(
|
|
(
|
|
nodeId: string,
|
|
options?: {
|
|
onError?: () => void
|
|
},
|
|
) => {
|
|
workflowStore.getState().setOpenInlineAgentPanelNodeId(nodeId)
|
|
handleSyncWorkflowDraft(true, true)
|
|
createInlineAgentBinding(nodeId, {
|
|
onError: () => {
|
|
options?.onError?.()
|
|
},
|
|
onSuccess: (binding) => {
|
|
const { nodes, setNodes } = collaborativeWorkflow.getState()
|
|
setNodes(
|
|
produce(nodes, (draft) => {
|
|
const node = draft.find((node) => node.id === nodeId)
|
|
if (node) {
|
|
if (isAgentV2NodeData(node.data) && needsInlineAgentBindingCreation(node.data))
|
|
node.data.agent_binding = binding
|
|
node.data._openInlineAgentPanel = true
|
|
delete node.data._isTempNode
|
|
}
|
|
}),
|
|
)
|
|
handleSyncWorkflowDraft(true, true)
|
|
},
|
|
})
|
|
},
|
|
[collaborativeWorkflow, createInlineAgentBinding, handleSyncWorkflowDraft, workflowStore],
|
|
)
|
|
|
|
const handleNodeDragStart = useCallback<NodeDragHandler>(
|
|
(_, node) => {
|
|
workflowStore.setState({ nodeAnimation: false })
|
|
|
|
if (getNodesReadOnly()) return
|
|
|
|
if (node.type === CUSTOM_ITERATION_START_NODE || node.type === CUSTOM_NOTE_NODE) {
|
|
return
|
|
}
|
|
|
|
if (node.type === CUSTOM_LOOP_START_NODE || node.type === CUSTOM_NOTE_NODE) {
|
|
return
|
|
}
|
|
|
|
dragNodeStartPosition.current = {
|
|
x: node.position.x,
|
|
y: node.position.y,
|
|
}
|
|
},
|
|
[workflowStore, getNodesReadOnly],
|
|
)
|
|
|
|
const handleNodeDrag = useCallback<NodeDragHandler>(
|
|
(e, node: Node) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
if (node.type === CUSTOM_ITERATION_START_NODE) return
|
|
|
|
if (node.type === CUSTOM_LOOP_START_NODE) return
|
|
|
|
e.stopPropagation()
|
|
|
|
const { nodes, setNodes } = collaborativeWorkflow.getState()
|
|
|
|
const { restrictPosition } = handleNodeIterationChildDrag(node)
|
|
const { restrictPosition: restrictLoopPosition } = handleNodeLoopChildDrag(node)
|
|
|
|
const { showHorizontalHelpLineNodes, showVerticalHelpLineNodes } = handleSetHelpline(node)
|
|
const showHorizontalHelpLineNodesLength = showHorizontalHelpLineNodes.length
|
|
const showVerticalHelpLineNodesLength = showVerticalHelpLineNodes.length
|
|
|
|
const newNodes = produce(nodes, (draft) => {
|
|
const currentNode = draft.find((n) => n.id === node.id)!
|
|
|
|
// Check if current dragging node is an entry node
|
|
const isCurrentEntryNode =
|
|
isTriggerNode(node.data.type as BlockEnum) || node.data.type === BlockEnum.Start
|
|
|
|
// X-axis alignment with offset consideration
|
|
if (showVerticalHelpLineNodesLength > 0) {
|
|
const targetNode = showVerticalHelpLineNodes[0]
|
|
const isTargetEntryNode =
|
|
isTriggerNode(targetNode!.data.type as BlockEnum) ||
|
|
targetNode!.data.type === BlockEnum.Start
|
|
|
|
// Calculate the wrapper position needed to align the inner nodes
|
|
// Target inner position = target.position + target.offset
|
|
// Current inner position should equal target inner position
|
|
// So: current.position + current.offset = target.position + target.offset
|
|
// Therefore: current.position = target.position + target.offset - current.offset
|
|
const targetOffset = isTargetEntryNode ? ENTRY_NODE_WRAPPER_OFFSET.x : 0
|
|
const currentOffset = isCurrentEntryNode ? ENTRY_NODE_WRAPPER_OFFSET.x : 0
|
|
currentNode.position.x = targetNode!.position.x + targetOffset - currentOffset
|
|
} else if (restrictPosition.x !== undefined) {
|
|
currentNode.position.x = restrictPosition.x
|
|
} else if (restrictLoopPosition.x !== undefined) {
|
|
currentNode.position.x = restrictLoopPosition.x
|
|
} else {
|
|
currentNode.position.x = node.position.x
|
|
}
|
|
|
|
// Y-axis alignment with offset consideration
|
|
if (showHorizontalHelpLineNodesLength > 0) {
|
|
const targetNode = showHorizontalHelpLineNodes[0]
|
|
const isTargetEntryNode =
|
|
isTriggerNode(targetNode!.data.type as BlockEnum) ||
|
|
targetNode!.data.type === BlockEnum.Start
|
|
|
|
const targetOffset = isTargetEntryNode ? ENTRY_NODE_WRAPPER_OFFSET.y : 0
|
|
const currentOffset = isCurrentEntryNode ? ENTRY_NODE_WRAPPER_OFFSET.y : 0
|
|
currentNode.position.y = targetNode!.position.y + targetOffset - currentOffset
|
|
} else if (restrictPosition.y !== undefined) {
|
|
currentNode.position.y = restrictPosition.y
|
|
} else if (restrictLoopPosition.y !== undefined) {
|
|
currentNode.position.y = restrictLoopPosition.y
|
|
} else {
|
|
currentNode.position.y = node.position.y
|
|
}
|
|
})
|
|
setNodes(newNodes)
|
|
},
|
|
[
|
|
getNodesReadOnly,
|
|
collaborativeWorkflow,
|
|
handleNodeIterationChildDrag,
|
|
handleNodeLoopChildDrag,
|
|
handleSetHelpline,
|
|
],
|
|
)
|
|
|
|
const handleNodeDragStop = useCallback<NodeDragHandler>(
|
|
(_, node) => {
|
|
const { setHelpLineHorizontal, setHelpLineVertical } = workflowStore.getState()
|
|
|
|
if (getNodesReadOnly()) return
|
|
|
|
const { x, y } = dragNodeStartPosition.current
|
|
if (!(x === node.position.x && y === node.position.y)) {
|
|
setHelpLineHorizontal()
|
|
setHelpLineVertical()
|
|
handleSyncWorkflowDraft()
|
|
|
|
if (x !== 0 && y !== 0) {
|
|
// selecting a note will trigger a drag stop event with x and y as 0
|
|
saveStateToHistory(WorkflowHistoryEvent.NodeDragStop, {
|
|
nodeId: node.id,
|
|
})
|
|
}
|
|
}
|
|
},
|
|
[workflowStore, getNodesReadOnly, saveStateToHistory, handleSyncWorkflowDraft],
|
|
)
|
|
|
|
const handleNodeEnter = useCallback<NodeMouseHandler>(
|
|
(_, node) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
if (node.type === CUSTOM_NOTE_NODE || node.type === CUSTOM_ITERATION_START_NODE) {
|
|
return
|
|
}
|
|
|
|
if (node.type === CUSTOM_LOOP_START_NODE || node.type === CUSTOM_NOTE_NODE) {
|
|
return
|
|
}
|
|
|
|
const { nodes, edges, setNodes, setEdges } = collaborativeWorkflow.getState()
|
|
const { connectingNodePayload, setEnteringNodePayload } = workflowStore.getState()
|
|
if (connectingNodePayload) {
|
|
if (connectingNodePayload.nodeId === node.id) return
|
|
const connectingNode: Node = nodes.find((n) => n.id === connectingNodePayload.nodeId)!
|
|
const sameLevel = connectingNode.parentId === node.parentId
|
|
|
|
if (sameLevel) {
|
|
setEnteringNodePayload({
|
|
nodeId: node.id,
|
|
nodeData: node.data as VariableAssignerNodeType,
|
|
})
|
|
const fromType = connectingNodePayload.handleType
|
|
|
|
const newNodes = produce(nodes, (draft) => {
|
|
draft.forEach((n) => {
|
|
if (
|
|
n.id === node.id &&
|
|
fromType === 'source' &&
|
|
(node.data.type === BlockEnum.VariableAssigner ||
|
|
node.data.type === BlockEnum.VariableAggregator)
|
|
) {
|
|
if (!node.data.advanced_settings?.group_enabled) n.data._isEntering = true
|
|
}
|
|
if (
|
|
n.id === node.id &&
|
|
fromType === 'target' &&
|
|
(connectingNode.data.type === BlockEnum.VariableAssigner ||
|
|
connectingNode.data.type === BlockEnum.VariableAggregator) &&
|
|
node.data.type !== BlockEnum.IfElse &&
|
|
node.data.type !== BlockEnum.QuestionClassifier &&
|
|
node.data.type !== BlockEnum.HumanInput
|
|
) {
|
|
n.data._isEntering = true
|
|
}
|
|
})
|
|
})
|
|
setNodes(newNodes, false)
|
|
}
|
|
}
|
|
const newEdges = produce(edges, (draft) => {
|
|
const connectedEdges = getConnectedEdges([node], edges)
|
|
|
|
connectedEdges.forEach((edge) => {
|
|
const currentEdge = draft.find((e) => e.id === edge.id)
|
|
if (currentEdge) currentEdge.data._connectedNodeIsHovering = true
|
|
})
|
|
})
|
|
setEdges(newEdges, false)
|
|
},
|
|
[collaborativeWorkflow, workflowStore, getNodesReadOnly],
|
|
)
|
|
|
|
const handleNodeLeave = useCallback<NodeMouseHandler>(
|
|
(_, node) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
if (node.type === CUSTOM_NOTE_NODE || node.type === CUSTOM_ITERATION_START_NODE) {
|
|
return
|
|
}
|
|
|
|
if (node.type === CUSTOM_NOTE_NODE || node.type === CUSTOM_LOOP_START_NODE) {
|
|
return
|
|
}
|
|
|
|
const { setEnteringNodePayload } = workflowStore.getState()
|
|
setEnteringNodePayload(undefined)
|
|
const { nodes, setNodes, edges, setEdges } = collaborativeWorkflow.getState()
|
|
const newNodes = produce(nodes, (draft) => {
|
|
draft.forEach((node) => {
|
|
node.data._isEntering = false
|
|
})
|
|
})
|
|
setNodes(newNodes, false)
|
|
const newEdges = produce(edges, (draft) => {
|
|
draft.forEach((edge) => {
|
|
edge.data._connectedNodeIsHovering = false
|
|
})
|
|
})
|
|
setEdges(newEdges, false)
|
|
},
|
|
[collaborativeWorkflow, workflowStore, getNodesReadOnly],
|
|
)
|
|
|
|
const handleNodeSelect = useCallback(
|
|
(nodeId: string, cancelSelection?: boolean, initShowLastRunTab?: boolean) => {
|
|
if (initShowLastRunTab) workflowStore.setState({ initShowLastRunTab: true })
|
|
const { nodes, setNodes, edges, setEdges } = collaborativeWorkflow.getState()
|
|
|
|
const newNodes = produce(nodes, (draft) => {
|
|
draft.forEach((node) => {
|
|
const selected = node.id === nodeId && !cancelSelection
|
|
node.selected = selected
|
|
node.data.selected = selected
|
|
})
|
|
})
|
|
setNodes(newNodes, false)
|
|
|
|
const connectedEdges = getConnectedEdges([{ id: nodeId } as Node], edges).map(
|
|
(edge) => edge.id,
|
|
)
|
|
const newEdges = produce(edges, (draft) => {
|
|
draft.forEach((edge) => {
|
|
if (connectedEdges.includes(edge.id)) {
|
|
edge.data = {
|
|
...edge.data,
|
|
_connectedNodeIsSelected: !cancelSelection,
|
|
}
|
|
} else {
|
|
edge.data = {
|
|
...edge.data,
|
|
_connectedNodeIsSelected: false,
|
|
}
|
|
}
|
|
})
|
|
})
|
|
setEdges(newEdges, false)
|
|
},
|
|
[collaborativeWorkflow],
|
|
)
|
|
|
|
const handleNodeClick = useCallback<NodeMouseHandler>(
|
|
(event, node) => {
|
|
const { controlMode } = workflowStore.getState()
|
|
if (controlMode === ControlMode.Comment) return
|
|
if (isNoteLinkClickTarget(event.target, node)) return
|
|
if (node.type === CUSTOM_ITERATION_START_NODE) return
|
|
if (node.type === CUSTOM_LOOP_START_NODE) return
|
|
if (node.data.type === BlockEnum.DataSourceEmpty) return
|
|
handleNodeSelect(node.id)
|
|
},
|
|
[handleNodeSelect, workflowStore],
|
|
)
|
|
|
|
const handleNodeConnect = useCallback<OnConnect>(
|
|
({ source, sourceHandle, target, targetHandle }) => {
|
|
if (source === target) return
|
|
if (getNodesReadOnly()) return
|
|
|
|
const { nodes, edges, setNodes, setEdges } = collaborativeWorkflow.getState()
|
|
const targetNode = nodes.find((node) => node.id === target!)
|
|
const sourceNode = nodes.find((node) => node.id === source!)
|
|
|
|
if (targetNode?.parentId !== sourceNode?.parentId) return
|
|
|
|
if (sourceNode?.type === CUSTOM_NOTE_NODE || targetNode?.type === CUSTOM_NOTE_NODE) {
|
|
return
|
|
}
|
|
|
|
if (
|
|
edges.some(
|
|
(edge) =>
|
|
edge.source === source &&
|
|
edge.sourceHandle === sourceHandle &&
|
|
edge.target === target &&
|
|
edge.targetHandle === targetHandle,
|
|
)
|
|
) {
|
|
return
|
|
}
|
|
|
|
const parendNode = nodes.find((node) => node.id === targetNode?.parentId)
|
|
const isInIteration = parendNode && parendNode.data.type === BlockEnum.Iteration
|
|
const isInLoop = !!parendNode && parendNode.data.type === BlockEnum.Loop
|
|
|
|
const newEdge = {
|
|
id: `${source}-${sourceHandle}-${target}-${targetHandle}`,
|
|
type: CUSTOM_EDGE,
|
|
source: source!,
|
|
target: target!,
|
|
sourceHandle,
|
|
targetHandle,
|
|
data: {
|
|
sourceType: nodes.find((node) => node.id === source)!.data.type,
|
|
targetType: nodes.find((node) => node.id === target)!.data.type,
|
|
isInIteration,
|
|
iteration_id: isInIteration ? targetNode?.parentId : undefined,
|
|
isInLoop,
|
|
loop_id: isInLoop ? targetNode?.parentId : undefined,
|
|
},
|
|
zIndex: targetNode?.parentId ? NESTED_ELEMENT_Z_INDEX : 0,
|
|
}
|
|
const nodesConnectedSourceOrTargetHandleIdsMap = getNodesConnectedSourceOrTargetHandleIdsMap(
|
|
[{ type: 'add', edge: newEdge }],
|
|
nodes,
|
|
)
|
|
const newNodes = produce(nodes, (draft: Node[]) => {
|
|
draft.forEach((node) => {
|
|
if (nodesConnectedSourceOrTargetHandleIdsMap[node.id]) {
|
|
node.data = {
|
|
...node.data,
|
|
...nodesConnectedSourceOrTargetHandleIdsMap[node.id],
|
|
}
|
|
}
|
|
})
|
|
})
|
|
const newEdges = produce(edges, (draft) => {
|
|
draft.push(newEdge)
|
|
})
|
|
|
|
setNodes(newNodes)
|
|
setEdges(newEdges)
|
|
|
|
handleSyncWorkflowDraft()
|
|
saveStateToHistory(WorkflowHistoryEvent.NodeConnect, {
|
|
nodeId: targetNode?.id,
|
|
})
|
|
},
|
|
[
|
|
getNodesReadOnly,
|
|
collaborativeWorkflow,
|
|
workflowStore,
|
|
handleSyncWorkflowDraft,
|
|
saveStateToHistory,
|
|
],
|
|
)
|
|
|
|
const handleNodeConnectStart = useCallback<OnConnectStart>(
|
|
(_, { nodeId, handleType, handleId }) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
if (nodeId && handleType) {
|
|
const { setConnectingNodePayload } = workflowStore.getState()
|
|
const { nodes } = collaborativeWorkflow.getState()
|
|
const node = nodes.find((n) => n.id === nodeId)!
|
|
|
|
if (node.type === CUSTOM_NOTE_NODE) return
|
|
|
|
if (
|
|
node.data.type === BlockEnum.VariableAggregator ||
|
|
node.data.type === BlockEnum.VariableAssigner
|
|
) {
|
|
if (handleType === 'target') return
|
|
}
|
|
|
|
setConnectingNodePayload({
|
|
nodeId,
|
|
nodeType: node.data.type,
|
|
handleType,
|
|
handleId,
|
|
})
|
|
}
|
|
},
|
|
[collaborativeWorkflow, workflowStore, getNodesReadOnly],
|
|
)
|
|
|
|
const handleNodeConnectEnd = useCallback<OnConnectEnd>(
|
|
(e) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
const {
|
|
connectingNodePayload,
|
|
setConnectingNodePayload,
|
|
enteringNodePayload,
|
|
setEnteringNodePayload,
|
|
} = workflowStore.getState()
|
|
if (connectingNodePayload && enteringNodePayload) {
|
|
const { setShowAssignVariablePopup, hoveringAssignVariableGroupId } =
|
|
workflowStore.getState()
|
|
const { screenToFlowPosition } = reactflow
|
|
const { nodes, setNodes } = collaborativeWorkflow.getState()
|
|
const fromHandleType = connectingNodePayload.handleType
|
|
const fromHandleId = connectingNodePayload.handleId
|
|
const fromNode = nodes.find((n) => n.id === connectingNodePayload.nodeId)!
|
|
const toNode = nodes.find((n) => n.id === enteringNodePayload.nodeId)!
|
|
const toParentNode = nodes.find((n) => n.id === toNode.parentId)
|
|
|
|
if (fromNode.parentId !== toNode.parentId) return
|
|
|
|
const pointer = e as { x: number; y: number }
|
|
const { x, y } = screenToFlowPosition({ x: pointer.x, y: pointer.y })
|
|
|
|
if (
|
|
fromHandleType === 'source' &&
|
|
(toNode.data.type === BlockEnum.VariableAssigner ||
|
|
toNode.data.type === BlockEnum.VariableAggregator)
|
|
) {
|
|
const groupEnabled = toNode.data.advanced_settings?.group_enabled
|
|
const firstGroupId = toNode.data.advanced_settings?.groups[0].groupId
|
|
let handleId = 'target'
|
|
|
|
if (groupEnabled) {
|
|
if (hoveringAssignVariableGroupId) handleId = hoveringAssignVariableGroupId
|
|
else handleId = firstGroupId
|
|
}
|
|
const newNodes = produce(nodes, (draft) => {
|
|
draft.forEach((node) => {
|
|
if (node.id === toNode.id) {
|
|
node.data._showAddVariablePopup = true
|
|
node.data._holdAddVariablePopup = true
|
|
}
|
|
})
|
|
})
|
|
setNodes(newNodes)
|
|
setShowAssignVariablePopup({
|
|
nodeId: fromNode.id,
|
|
nodeData: fromNode.data,
|
|
variableAssignerNodeId: toNode.id,
|
|
variableAssignerNodeData: toNode.data,
|
|
variableAssignerNodeHandleId: handleId,
|
|
parentNode: toParentNode,
|
|
x: x - toNode.positionAbsolute!.x,
|
|
y: y - toNode.positionAbsolute!.y,
|
|
})
|
|
handleNodeConnect({
|
|
source: fromNode.id,
|
|
sourceHandle: fromHandleId,
|
|
target: toNode.id,
|
|
targetHandle: 'target',
|
|
})
|
|
}
|
|
}
|
|
setConnectingNodePayload(undefined)
|
|
setEnteringNodePayload(undefined)
|
|
},
|
|
[collaborativeWorkflow, handleNodeConnect, getNodesReadOnly, workflowStore, reactflow],
|
|
)
|
|
|
|
const { deleteNodeInspectorVars } = useInspectVarsCrud()
|
|
const handleNodeDelete = useCallback(
|
|
(nodeId: string) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
const { nodes, setNodes, edges, setEdges } = collaborativeWorkflow.getState()
|
|
const currentNodeIndex = nodes.findIndex((node) => node.id === nodeId)
|
|
const currentNode = nodes[currentNodeIndex]
|
|
|
|
if (!currentNode) return
|
|
|
|
if (nodesMetaDataMap?.[getNodeCatalogType(currentNode.data)]?.metaData.isUndeletable) {
|
|
return
|
|
}
|
|
|
|
deleteNodeInspectorVars(nodeId)
|
|
if (currentNode.data.type === BlockEnum.Iteration) {
|
|
const iterationChildren = nodes.filter((node) => node.parentId === currentNode.id)
|
|
|
|
if (iterationChildren.length) {
|
|
if (currentNode.data._isBundled) {
|
|
iterationChildren.forEach((child) => {
|
|
handleNodeDelete(child.id)
|
|
})
|
|
return handleNodeDelete(nodeId)
|
|
} else {
|
|
if (iterationChildren.length === 1) {
|
|
handleNodeDelete(iterationChildren[0]!.id)
|
|
handleNodeDelete(nodeId)
|
|
|
|
return
|
|
}
|
|
const { setShowConfirm, showConfirm } = workflowStore.getState()
|
|
|
|
if (!showConfirm) {
|
|
setShowConfirm({
|
|
title: t(($) => $['nodes.iteration.deleteTitle'], { ns: 'workflow' }),
|
|
desc: t(($) => $['nodes.iteration.deleteDesc'], { ns: 'workflow' }) || '',
|
|
onConfirm: () => {
|
|
iterationChildren.forEach((child) => {
|
|
handleNodeDelete(child.id)
|
|
})
|
|
handleNodeDelete(nodeId)
|
|
handleSyncWorkflowDraft()
|
|
setShowConfirm(undefined)
|
|
},
|
|
})
|
|
return
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
if (currentNode.data.type === BlockEnum.Loop) {
|
|
const loopChildren = nodes.filter((node) => node.parentId === currentNode.id)
|
|
|
|
if (loopChildren.length) {
|
|
if (currentNode.data._isBundled) {
|
|
loopChildren.forEach((child) => {
|
|
handleNodeDelete(child.id)
|
|
})
|
|
return handleNodeDelete(nodeId)
|
|
} else {
|
|
if (loopChildren.length === 1) {
|
|
handleNodeDelete(loopChildren[0]!.id)
|
|
handleNodeDelete(nodeId)
|
|
|
|
return
|
|
}
|
|
const { setShowConfirm, showConfirm } = workflowStore.getState()
|
|
|
|
if (!showConfirm) {
|
|
setShowConfirm({
|
|
title: t(($) => $['nodes.loop.deleteTitle'], { ns: 'workflow' }),
|
|
desc: t(($) => $['nodes.loop.deleteDesc'], { ns: 'workflow' }) || '',
|
|
onConfirm: () => {
|
|
loopChildren.forEach((child) => {
|
|
handleNodeDelete(child.id)
|
|
})
|
|
handleNodeDelete(nodeId)
|
|
handleSyncWorkflowDraft()
|
|
setShowConfirm(undefined)
|
|
},
|
|
})
|
|
return
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
if (currentNode.data.type === BlockEnum.DataSource) {
|
|
const { id } = currentNode
|
|
const { ragPipelineVariables, setRagPipelineVariables } = workflowStore.getState()
|
|
if (ragPipelineVariables && setRagPipelineVariables) {
|
|
const newRagPipelineVariables: RAGPipelineVariables = []
|
|
ragPipelineVariables.forEach((variable) => {
|
|
if (variable.belong_to_node_id === id) return
|
|
newRagPipelineVariables.push(variable)
|
|
})
|
|
setRagPipelineVariables(newRagPipelineVariables)
|
|
}
|
|
}
|
|
|
|
const connectedEdges = getConnectedEdges([{ id: nodeId } as Node], edges)
|
|
const nodesConnectedSourceOrTargetHandleIdsMap = getNodesConnectedSourceOrTargetHandleIdsMap(
|
|
connectedEdges.map((edge) => ({ type: 'remove', edge })),
|
|
nodes,
|
|
)
|
|
const newNodes = produce(nodes, (draft: Node[]) => {
|
|
draft.forEach((node) => {
|
|
if (nodesConnectedSourceOrTargetHandleIdsMap[node.id]) {
|
|
node.data = {
|
|
...node.data,
|
|
...nodesConnectedSourceOrTargetHandleIdsMap[node.id],
|
|
}
|
|
}
|
|
|
|
if (node.id === currentNode.parentId) {
|
|
node.data._children = node.data._children?.filter((child) => child.nodeId !== nodeId)
|
|
}
|
|
})
|
|
draft.splice(currentNodeIndex, 1)
|
|
})
|
|
setNodes(newNodes, true, 'nodes:perform-batch-cascade-delete')
|
|
const newEdges = produce(edges, (draft) => {
|
|
return draft.filter(
|
|
(edge) => !connectedEdges.some((connectedEdge) => connectedEdge.id === edge.id),
|
|
)
|
|
})
|
|
setEdges(newEdges)
|
|
handleSyncWorkflowDraft()
|
|
|
|
if (currentNode.type === CUSTOM_NOTE_NODE) {
|
|
saveStateToHistory(WorkflowHistoryEvent.NoteDelete, {
|
|
nodeId: currentNode.id,
|
|
})
|
|
} else {
|
|
saveStateToHistory(WorkflowHistoryEvent.NodeDelete, {
|
|
nodeId: currentNode.id,
|
|
})
|
|
}
|
|
},
|
|
[
|
|
getNodesReadOnly,
|
|
collaborativeWorkflow,
|
|
handleSyncWorkflowDraft,
|
|
saveStateToHistory,
|
|
workflowStore,
|
|
t,
|
|
nodesMetaDataMap,
|
|
deleteNodeInspectorVars,
|
|
],
|
|
)
|
|
|
|
const handleNodeAdd = useCallback<OnNodeAdd>(
|
|
(
|
|
{ nodeType, sourceHandle = 'source', targetHandle = 'target', pluginDefaultValue },
|
|
{ prevNodeId, prevNodeSourceHandle, nextNodeId, nextNodeTargetHandle },
|
|
) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
const { nodes, setNodes, edges, setEdges } = collaborativeWorkflow.getState()
|
|
const nodeMetaData = nodesMetaDataMap?.[nodeType]
|
|
if (!nodeMetaData) return
|
|
const { defaultValue } = nodeMetaData
|
|
const nodesWithSameType = getNodesWithSameDefaultDataType(nodes, nodeType, defaultValue)
|
|
const shouldCreateInlineAgentBinding =
|
|
nodeType === BlockEnum.AgentV2 &&
|
|
agentV2NodeDefaultsNeedInlineBinding(defaultValue, pluginDefaultValue)
|
|
const { newNode, newIterationStartNode, newLoopStartNode } = generateNewNode({
|
|
type: getNodeCustomTypeByNodeDataType(nodeType),
|
|
data: {
|
|
...(defaultValue as Node['data']),
|
|
title:
|
|
nodesWithSameType.length > 0
|
|
? `${defaultValue.title} ${nodesWithSameType.length + 1}`
|
|
: defaultValue.title,
|
|
...pluginDefaultValue,
|
|
selected: true,
|
|
...(shouldCreateInlineAgentBinding ? { _isTempNode: true } : {}),
|
|
_showAddVariablePopup:
|
|
(nodeType === BlockEnum.VariableAssigner ||
|
|
nodeType === BlockEnum.VariableAggregator) &&
|
|
!!prevNodeId,
|
|
_holdAddVariablePopup: false,
|
|
},
|
|
position: {
|
|
x: 0,
|
|
y: 0,
|
|
},
|
|
})
|
|
if (prevNodeId && !nextNodeId) {
|
|
const prevNodeIndex = nodes.findIndex((node) => node.id === prevNodeId)
|
|
const prevNode = nodes[prevNodeIndex]
|
|
const outgoers = getOutgoers(prevNode!, nodes, edges).sort(
|
|
(a, b) => a.position.y - b.position.y,
|
|
)
|
|
const lastOutgoer = outgoers.at(-1)
|
|
|
|
newNode.data._connectedTargetHandleIds =
|
|
nodeType === BlockEnum.DataSource ? [] : [targetHandle]
|
|
newNode.data._connectedSourceHandleIds = []
|
|
newNode.position = {
|
|
x: lastOutgoer
|
|
? lastOutgoer.position.x
|
|
: prevNode!.position.x + prevNode!.width! + X_OFFSET,
|
|
y: lastOutgoer
|
|
? lastOutgoer.position.y + lastOutgoer.height! + Y_OFFSET
|
|
: prevNode!.position.y,
|
|
}
|
|
newNode.parentId = prevNode!.parentId
|
|
newNode.extent = prevNode!.extent
|
|
|
|
const parentNode = nodes.find((node) => node.id === prevNode!.parentId) || null
|
|
const isInIteration = !!parentNode && parentNode.data.type === BlockEnum.Iteration
|
|
const isInLoop = !!parentNode && parentNode.data.type === BlockEnum.Loop
|
|
|
|
if (prevNode!.parentId) {
|
|
newNode.data.isInIteration = isInIteration
|
|
newNode.data.isInLoop = isInLoop
|
|
if (isInIteration) {
|
|
newNode.data.iteration_id = parentNode.id
|
|
newNode.zIndex = NESTED_ELEMENT_Z_INDEX
|
|
}
|
|
if (isInLoop) {
|
|
newNode.data.loop_id = parentNode.id
|
|
newNode.zIndex = NESTED_ELEMENT_Z_INDEX
|
|
}
|
|
if (
|
|
isInIteration &&
|
|
(newNode.data.type === BlockEnum.Answer ||
|
|
newNode.data.type === BlockEnum.Tool ||
|
|
newNode.data.type === BlockEnum.Assigner)
|
|
) {
|
|
const iterNodeData: IterationNodeType = parentNode.data
|
|
iterNodeData._isShowTips = true
|
|
}
|
|
if (
|
|
isInLoop &&
|
|
(newNode.data.type === BlockEnum.Answer ||
|
|
newNode.data.type === BlockEnum.Tool ||
|
|
newNode.data.type === BlockEnum.Assigner)
|
|
) {
|
|
const iterNodeData: IterationNodeType = parentNode.data
|
|
iterNodeData._isShowTips = true
|
|
}
|
|
}
|
|
|
|
let newEdge = null
|
|
if (nodeType !== BlockEnum.DataSource) {
|
|
newEdge = {
|
|
id: `${prevNodeId}-${prevNodeSourceHandle}-${newNode.id}-${targetHandle}`,
|
|
type: CUSTOM_EDGE,
|
|
source: prevNodeId,
|
|
sourceHandle: prevNodeSourceHandle,
|
|
target: newNode.id,
|
|
targetHandle,
|
|
data: {
|
|
sourceType: prevNode!.data.type,
|
|
targetType: newNode.data.type,
|
|
isInIteration,
|
|
isInLoop,
|
|
iteration_id: isInIteration ? prevNode!.parentId : undefined,
|
|
loop_id: isInLoop ? prevNode!.parentId : undefined,
|
|
_connectedNodeIsSelected: true,
|
|
},
|
|
zIndex: prevNode!.parentId ? NESTED_ELEMENT_Z_INDEX : 0,
|
|
}
|
|
}
|
|
|
|
const nodesConnectedSourceOrTargetHandleIdsMap =
|
|
getNodesConnectedSourceOrTargetHandleIdsMap(
|
|
newEdge ? [{ type: 'add', edge: newEdge }] : [],
|
|
nodes,
|
|
)
|
|
const newNodes = produce(nodes, (draft: Node[]) => {
|
|
draft.forEach((node) => {
|
|
node.data.selected = false
|
|
|
|
if (nodesConnectedSourceOrTargetHandleIdsMap[node.id]) {
|
|
node.data = {
|
|
...node.data,
|
|
...nodesConnectedSourceOrTargetHandleIdsMap[node.id],
|
|
}
|
|
}
|
|
|
|
if (node.data.type === BlockEnum.Iteration && prevNode!.parentId === node.id) {
|
|
node.data._children?.push({
|
|
nodeId: newNode.id,
|
|
nodeType: newNode.data.type,
|
|
})
|
|
}
|
|
|
|
if (node.data.type === BlockEnum.Loop && prevNode!.parentId === node.id) {
|
|
node.data._children?.push({
|
|
nodeId: newNode.id,
|
|
nodeType: newNode.data.type,
|
|
})
|
|
}
|
|
})
|
|
draft.push(newNode)
|
|
|
|
if (newIterationStartNode) draft.push(newIterationStartNode)
|
|
|
|
if (newLoopStartNode) draft.push(newLoopStartNode)
|
|
})
|
|
|
|
if (
|
|
newNode.data.type === BlockEnum.VariableAssigner ||
|
|
newNode.data.type === BlockEnum.VariableAggregator
|
|
) {
|
|
const { setShowAssignVariablePopup } = workflowStore.getState()
|
|
|
|
setShowAssignVariablePopup({
|
|
nodeId: prevNode!.id,
|
|
nodeData: prevNode!.data,
|
|
variableAssignerNodeId: newNode.id,
|
|
variableAssignerNodeData: newNode.data as VariableAssignerNodeType,
|
|
variableAssignerNodeHandleId: targetHandle,
|
|
parentNode: nodes.find((node) => node.id === newNode.parentId),
|
|
x: -25,
|
|
y: 44,
|
|
})
|
|
}
|
|
const newEdges = produce(edges, (draft) => {
|
|
draft.forEach((item) => {
|
|
item.data = {
|
|
...item.data,
|
|
_connectedNodeIsSelected: false,
|
|
}
|
|
})
|
|
if (newEdge) draft.push(newEdge)
|
|
})
|
|
|
|
setNodes(newNodes)
|
|
setEdges(newEdges)
|
|
}
|
|
if (!prevNodeId && nextNodeId) {
|
|
const nextNodeIndex = nodes.findIndex((node) => node.id === nextNodeId)
|
|
const nextNode = nodes[nextNodeIndex]!
|
|
if (
|
|
nodeType !== BlockEnum.IfElse &&
|
|
nodeType !== BlockEnum.QuestionClassifier &&
|
|
nodeType !== BlockEnum.HumanInput
|
|
) {
|
|
newNode.data._connectedSourceHandleIds = [sourceHandle]
|
|
}
|
|
newNode.data._connectedTargetHandleIds = []
|
|
newNode.position = {
|
|
x: nextNode.position.x,
|
|
y: nextNode.position.y,
|
|
}
|
|
newNode.parentId = nextNode.parentId
|
|
newNode.extent = nextNode.extent
|
|
|
|
const parentNode = nodes.find((node) => node.id === nextNode.parentId) || null
|
|
const isInIteration = !!parentNode && parentNode.data.type === BlockEnum.Iteration
|
|
const isInLoop = !!parentNode && parentNode.data.type === BlockEnum.Loop
|
|
|
|
if (parentNode && nextNode.parentId) {
|
|
newNode.data.isInIteration = isInIteration
|
|
newNode.data.isInLoop = isInLoop
|
|
if (isInIteration) {
|
|
newNode.data.iteration_id = parentNode.id
|
|
newNode.zIndex = NESTED_ELEMENT_Z_INDEX
|
|
}
|
|
if (isInLoop) {
|
|
newNode.data.loop_id = parentNode.id
|
|
newNode.zIndex = NESTED_ELEMENT_Z_INDEX
|
|
}
|
|
}
|
|
|
|
let newEdge
|
|
|
|
if (
|
|
nodeType !== BlockEnum.IfElse &&
|
|
nodeType !== BlockEnum.QuestionClassifier &&
|
|
nodeType !== BlockEnum.HumanInput &&
|
|
nodeType !== BlockEnum.LoopEnd
|
|
) {
|
|
newEdge = {
|
|
id: `${newNode.id}-${sourceHandle}-${nextNodeId}-${nextNodeTargetHandle}`,
|
|
type: CUSTOM_EDGE,
|
|
source: newNode.id,
|
|
sourceHandle,
|
|
target: nextNodeId,
|
|
targetHandle: nextNodeTargetHandle,
|
|
data: {
|
|
sourceType: newNode.data.type,
|
|
targetType: nextNode.data.type,
|
|
isInIteration,
|
|
isInLoop,
|
|
iteration_id: isInIteration ? nextNode.parentId : undefined,
|
|
loop_id: isInLoop ? nextNode.parentId : undefined,
|
|
_connectedNodeIsSelected: true,
|
|
},
|
|
zIndex: nextNode.parentId ? NESTED_ELEMENT_Z_INDEX : 0,
|
|
}
|
|
}
|
|
|
|
let nodesConnectedSourceOrTargetHandleIdsMap: ReturnType<
|
|
typeof getNodesConnectedSourceOrTargetHandleIdsMap
|
|
>
|
|
if (newEdge) {
|
|
nodesConnectedSourceOrTargetHandleIdsMap = getNodesConnectedSourceOrTargetHandleIdsMap(
|
|
[{ type: 'add', edge: newEdge }],
|
|
nodes,
|
|
)
|
|
}
|
|
|
|
const afterNodesInSameBranch = getAfterNodesInSameBranch(nextNodeId!)
|
|
const afterNodesInSameBranchIds = afterNodesInSameBranch.map((node) => node.id)
|
|
const newNodes = produce(nodes, (draft) => {
|
|
draft.forEach((node) => {
|
|
node.data.selected = false
|
|
|
|
if (afterNodesInSameBranchIds.includes(node.id)) node.position.x += NODE_WIDTH_X_OFFSET
|
|
|
|
if (nodesConnectedSourceOrTargetHandleIdsMap?.[node.id]) {
|
|
node.data = {
|
|
...node.data,
|
|
...nodesConnectedSourceOrTargetHandleIdsMap[node.id],
|
|
}
|
|
}
|
|
|
|
if (node.data.type === BlockEnum.Iteration && nextNode.parentId === node.id) {
|
|
node.data._children?.push({
|
|
nodeId: newNode.id,
|
|
nodeType: newNode.data.type,
|
|
})
|
|
}
|
|
|
|
if (node.data.type === BlockEnum.Iteration && node.data.start_node_id === nextNodeId) {
|
|
node.data.start_node_id = newNode.id
|
|
node.data.startNodeType = newNode.data.type
|
|
}
|
|
|
|
if (node.data.type === BlockEnum.Loop && nextNode.parentId === node.id) {
|
|
node.data._children?.push({
|
|
nodeId: newNode.id,
|
|
nodeType: newNode.data.type,
|
|
})
|
|
}
|
|
|
|
if (node.data.type === BlockEnum.Loop && node.data.start_node_id === nextNodeId) {
|
|
node.data.start_node_id = newNode.id
|
|
node.data.startNodeType = newNode.data.type
|
|
}
|
|
})
|
|
draft.push(newNode)
|
|
if (newIterationStartNode) draft.push(newIterationStartNode)
|
|
if (newLoopStartNode) draft.push(newLoopStartNode)
|
|
})
|
|
if (newEdge) {
|
|
const newEdges = produce(edges, (draft) => {
|
|
draft.forEach((item) => {
|
|
item.data = {
|
|
...item.data,
|
|
_connectedNodeIsSelected: false,
|
|
}
|
|
})
|
|
draft.push(newEdge)
|
|
})
|
|
|
|
setNodes(newNodes)
|
|
setEdges(newEdges)
|
|
} else {
|
|
setNodes(newNodes)
|
|
}
|
|
}
|
|
if (prevNodeId && nextNodeId) {
|
|
const prevNode = nodes.find((node) => node.id === prevNodeId)!
|
|
const nextNode = nodes.find((node) => node.id === nextNodeId)!
|
|
|
|
newNode.data._connectedTargetHandleIds =
|
|
nodeType === BlockEnum.DataSource ? [] : [targetHandle]
|
|
newNode.data._connectedSourceHandleIds = [sourceHandle]
|
|
newNode.position = {
|
|
x: nextNode.position.x,
|
|
y: nextNode.position.y,
|
|
}
|
|
newNode.parentId = prevNode.parentId
|
|
newNode.extent = prevNode.extent
|
|
|
|
const parentNode = nodes.find((node) => node.id === prevNode.parentId) || null
|
|
const isInIteration = !!parentNode && parentNode.data.type === BlockEnum.Iteration
|
|
const isInLoop = !!parentNode && parentNode.data.type === BlockEnum.Loop
|
|
|
|
if (parentNode && prevNode.parentId) {
|
|
newNode.data.isInIteration = isInIteration
|
|
newNode.data.isInLoop = isInLoop
|
|
if (isInIteration) {
|
|
newNode.data.iteration_id = parentNode.id
|
|
newNode.zIndex = NESTED_ELEMENT_Z_INDEX
|
|
}
|
|
if (isInLoop) {
|
|
newNode.data.loop_id = parentNode.id
|
|
newNode.zIndex = NESTED_ELEMENT_Z_INDEX
|
|
}
|
|
}
|
|
|
|
const currentEdgeIndex = edges.findIndex(
|
|
(edge) => edge.source === prevNodeId && edge.target === nextNodeId,
|
|
)
|
|
let newPrevEdge = null
|
|
|
|
if (nodeType !== BlockEnum.DataSource) {
|
|
newPrevEdge = {
|
|
id: `${prevNodeId}-${prevNodeSourceHandle}-${newNode.id}-${targetHandle}`,
|
|
type: CUSTOM_EDGE,
|
|
source: prevNodeId,
|
|
sourceHandle: prevNodeSourceHandle,
|
|
target: newNode.id,
|
|
targetHandle,
|
|
data: {
|
|
sourceType: prevNode.data.type,
|
|
targetType: newNode.data.type,
|
|
isInIteration,
|
|
isInLoop,
|
|
iteration_id: isInIteration ? prevNode.parentId : undefined,
|
|
loop_id: isInLoop ? prevNode.parentId : undefined,
|
|
_connectedNodeIsSelected: true,
|
|
},
|
|
zIndex: prevNode.parentId ? NESTED_ELEMENT_Z_INDEX : 0,
|
|
}
|
|
}
|
|
|
|
let newNextEdge: Edge | null = null
|
|
|
|
const nextNodeParentNode = nodes.find((node) => node.id === nextNode.parentId) || null
|
|
const isNextNodeInIteration =
|
|
!!nextNodeParentNode && nextNodeParentNode.data.type === BlockEnum.Iteration
|
|
const isNextNodeInLoop =
|
|
!!nextNodeParentNode && nextNodeParentNode.data.type === BlockEnum.Loop
|
|
|
|
if (
|
|
nodeType !== BlockEnum.IfElse &&
|
|
nodeType !== BlockEnum.QuestionClassifier &&
|
|
nodeType !== BlockEnum.HumanInput &&
|
|
nodeType !== BlockEnum.LoopEnd
|
|
) {
|
|
newNextEdge = {
|
|
id: `${newNode.id}-${sourceHandle}-${nextNodeId}-${nextNodeTargetHandle}`,
|
|
type: CUSTOM_EDGE,
|
|
source: newNode.id,
|
|
sourceHandle,
|
|
target: nextNodeId,
|
|
targetHandle: nextNodeTargetHandle,
|
|
data: {
|
|
sourceType: newNode.data.type,
|
|
targetType: nextNode.data.type,
|
|
isInIteration: isNextNodeInIteration,
|
|
isInLoop: isNextNodeInLoop,
|
|
iteration_id: isNextNodeInIteration ? nextNode.parentId : undefined,
|
|
loop_id: isNextNodeInLoop ? nextNode.parentId : undefined,
|
|
_connectedNodeIsSelected: true,
|
|
},
|
|
zIndex: nextNode.parentId ? NESTED_ELEMENT_Z_INDEX : 0,
|
|
}
|
|
}
|
|
const nodesConnectedSourceOrTargetHandleIdsMap =
|
|
getNodesConnectedSourceOrTargetHandleIdsMap(
|
|
[
|
|
{ type: 'remove', edge: edges[currentEdgeIndex]! },
|
|
...(newPrevEdge ? [{ type: 'add', edge: newPrevEdge }] : []),
|
|
...(newNextEdge ? [{ type: 'add', edge: newNextEdge }] : []),
|
|
],
|
|
[...nodes, newNode],
|
|
)
|
|
|
|
const afterNodesInSameBranch = getAfterNodesInSameBranch(nextNodeId!)
|
|
const afterNodesInSameBranchIds = afterNodesInSameBranch.map((node) => node.id)
|
|
const newNodes = produce(nodes, (draft) => {
|
|
draft.forEach((node) => {
|
|
node.data.selected = false
|
|
|
|
if (nodesConnectedSourceOrTargetHandleIdsMap[node.id]) {
|
|
node.data = {
|
|
...node.data,
|
|
...nodesConnectedSourceOrTargetHandleIdsMap[node.id],
|
|
}
|
|
}
|
|
if (afterNodesInSameBranchIds.includes(node.id)) node.position.x += NODE_WIDTH_X_OFFSET
|
|
|
|
if (node.data.type === BlockEnum.Iteration && prevNode.parentId === node.id) {
|
|
node.data._children?.push({
|
|
nodeId: newNode.id,
|
|
nodeType: newNode.data.type,
|
|
})
|
|
}
|
|
if (node.data.type === BlockEnum.Loop && prevNode.parentId === node.id) {
|
|
node.data._children?.push({
|
|
nodeId: newNode.id,
|
|
nodeType: newNode.data.type,
|
|
})
|
|
}
|
|
})
|
|
draft.push(newNode)
|
|
if (newIterationStartNode) draft.push(newIterationStartNode)
|
|
if (newLoopStartNode) draft.push(newLoopStartNode)
|
|
})
|
|
setNodes(newNodes)
|
|
if (
|
|
newNode.data.type === BlockEnum.VariableAssigner ||
|
|
newNode.data.type === BlockEnum.VariableAggregator
|
|
) {
|
|
const { setShowAssignVariablePopup } = workflowStore.getState()
|
|
|
|
setShowAssignVariablePopup({
|
|
nodeId: prevNode.id,
|
|
nodeData: prevNode.data,
|
|
variableAssignerNodeId: newNode.id,
|
|
variableAssignerNodeData: newNode.data as VariableAssignerNodeType,
|
|
variableAssignerNodeHandleId: targetHandle,
|
|
parentNode: nodes.find((node) => node.id === newNode.parentId),
|
|
x: -25,
|
|
y: 44,
|
|
})
|
|
}
|
|
const newEdges = produce(edges, (draft) => {
|
|
draft.splice(currentEdgeIndex, 1)
|
|
draft.forEach((item) => {
|
|
item.data = {
|
|
...item.data,
|
|
_connectedNodeIsSelected: false,
|
|
}
|
|
})
|
|
if (newPrevEdge) draft.push(newPrevEdge)
|
|
|
|
if (newNextEdge) draft.push(newNextEdge)
|
|
})
|
|
setEdges(newEdges)
|
|
}
|
|
if (isAgentV2NodeData(newNode.data) && needsInlineAgentBindingCreation(newNode.data)) {
|
|
saveStateToHistory(WorkflowHistoryEvent.NodeAdd, { nodeId: newNode.id })
|
|
createInlineAgentBindingForNode(newNode.id, {
|
|
onError: () => {
|
|
const { nodes, setNodes, edges, setEdges } = collaborativeWorkflow.getState()
|
|
setNodes(nodes.filter((node) => node.id !== newNode.id))
|
|
setEdges(
|
|
edges.filter((edge) => edge.source !== newNode.id && edge.target !== newNode.id),
|
|
)
|
|
},
|
|
})
|
|
return
|
|
}
|
|
|
|
handleSyncWorkflowDraft()
|
|
saveStateToHistory(WorkflowHistoryEvent.NodeAdd, { nodeId: newNode.id })
|
|
},
|
|
[
|
|
getNodesReadOnly,
|
|
collaborativeWorkflow,
|
|
handleSyncWorkflowDraft,
|
|
createInlineAgentBindingForNode,
|
|
saveStateToHistory,
|
|
workflowStore,
|
|
getAfterNodesInSameBranch,
|
|
nodesMetaDataMap,
|
|
],
|
|
)
|
|
|
|
const handleNodeChange = useCallback(
|
|
(
|
|
currentNodeId: string,
|
|
nodeType: BlockEnum,
|
|
sourceHandle: string,
|
|
pluginDefaultValue?: BlockDefaultValue,
|
|
) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
const { nodes, setNodes, edges, setEdges } = collaborativeWorkflow.getState()
|
|
const currentNode = nodes.find((node) => node.id === currentNodeId)!
|
|
const connectedEdges = getConnectedEdges([currentNode], edges)
|
|
const nodeMetaData = nodesMetaDataMap?.[nodeType]
|
|
if (!nodeMetaData) return
|
|
const { defaultValue } = nodeMetaData
|
|
const nodesWithSameType = getNodesWithSameDefaultDataType(nodes, nodeType, defaultValue)
|
|
const shouldCreateInlineAgentBinding =
|
|
nodeType === BlockEnum.AgentV2 &&
|
|
agentV2NodeDefaultsNeedInlineBinding(defaultValue, pluginDefaultValue)
|
|
const {
|
|
newNode: newCurrentNode,
|
|
newIterationStartNode,
|
|
newLoopStartNode,
|
|
} = generateNewNode({
|
|
type: getNodeCustomTypeByNodeDataType(nodeType),
|
|
data: {
|
|
...(defaultValue as Node['data']),
|
|
title:
|
|
nodesWithSameType.length > 0
|
|
? `${defaultValue.title} ${nodesWithSameType.length + 1}`
|
|
: defaultValue.title,
|
|
...pluginDefaultValue,
|
|
...(shouldCreateInlineAgentBinding ? { _isTempNode: true } : {}),
|
|
_connectedSourceHandleIds: [],
|
|
_connectedTargetHandleIds: [],
|
|
selected: currentNode.data.selected,
|
|
isInIteration: currentNode.data.isInIteration,
|
|
isInLoop: currentNode.data.isInLoop,
|
|
iteration_id: currentNode.data.iteration_id,
|
|
loop_id: currentNode.data.loop_id,
|
|
},
|
|
position: {
|
|
x: currentNode.position.x,
|
|
y: currentNode.position.y,
|
|
},
|
|
parentId: currentNode.parentId,
|
|
extent: currentNode.extent,
|
|
zIndex: currentNode.zIndex,
|
|
})
|
|
const parentNode = nodes.find((node) => node.id === currentNode.parentId)
|
|
const newNodeIsInIteration = !!parentNode && parentNode.data.type === BlockEnum.Iteration
|
|
const newNodeIsInLoop = !!parentNode && parentNode.data.type === BlockEnum.Loop
|
|
const outgoingEdges = connectedEdges.filter((edge) => edge.source === currentNodeId)
|
|
const normalizedSourceHandle = sourceHandle || 'source'
|
|
const outgoingHandles = new Set(outgoingEdges.map((edge) => edge.sourceHandle || 'source'))
|
|
const branchSourceHandle = currentNode.data._targetBranches?.[0]?.id
|
|
let outgoingHandleToPreserve = normalizedSourceHandle
|
|
if (!outgoingHandles.has(outgoingHandleToPreserve)) {
|
|
if (branchSourceHandle && outgoingHandles.has(branchSourceHandle))
|
|
outgoingHandleToPreserve = branchSourceHandle
|
|
else if (outgoingHandles.has('source')) outgoingHandleToPreserve = 'source'
|
|
else outgoingHandleToPreserve = outgoingEdges[0]?.sourceHandle || 'source'
|
|
}
|
|
const outgoingEdgesToPreserve = outgoingEdges.filter(
|
|
(edge) => (edge.sourceHandle || 'source') === outgoingHandleToPreserve,
|
|
)
|
|
const outgoingEdgeIds = new Set(outgoingEdgesToPreserve.map((edge) => edge.id))
|
|
const newNodeSourceHandle = newCurrentNode.data._targetBranches?.[0]?.id || 'source'
|
|
const reconnectedEdges = connectedEdges.reduce<Edge[]>((acc, edge) => {
|
|
if (outgoingEdgeIds.has(edge.id)) {
|
|
const originalTargetNode = nodes.find((node) => node.id === edge.target)
|
|
const targetNodeForEdge =
|
|
originalTargetNode && originalTargetNode.id !== currentNodeId
|
|
? originalTargetNode
|
|
: newCurrentNode
|
|
if (!targetNodeForEdge) return acc
|
|
|
|
const targetHandle = edge.targetHandle || 'target'
|
|
const targetParentNode =
|
|
targetNodeForEdge.id === newCurrentNode.id
|
|
? parentNode || null
|
|
: nodes.find((node) => node.id === targetNodeForEdge.parentId) || null
|
|
const isInIteration =
|
|
!!targetParentNode && targetParentNode.data.type === BlockEnum.Iteration
|
|
const isInLoop = !!targetParentNode && targetParentNode.data.type === BlockEnum.Loop
|
|
|
|
acc.push({
|
|
...edge,
|
|
id: `${newCurrentNode.id}-${newNodeSourceHandle}-${targetNodeForEdge.id}-${targetHandle}`,
|
|
source: newCurrentNode.id,
|
|
sourceHandle: newNodeSourceHandle,
|
|
target: targetNodeForEdge.id,
|
|
targetHandle,
|
|
type: CUSTOM_EDGE,
|
|
data: {
|
|
...edge.data,
|
|
sourceType: newCurrentNode.data.type,
|
|
targetType: targetNodeForEdge.data.type,
|
|
isInIteration,
|
|
iteration_id: isInIteration ? targetNodeForEdge.parentId : undefined,
|
|
isInLoop,
|
|
loop_id: isInLoop ? targetNodeForEdge.parentId : undefined,
|
|
_connectedNodeIsSelected: false,
|
|
},
|
|
zIndex: targetNodeForEdge.parentId ? NESTED_ELEMENT_Z_INDEX : 0,
|
|
})
|
|
}
|
|
|
|
if (
|
|
edge.target === currentNodeId &&
|
|
edge.source !== currentNodeId &&
|
|
!outgoingEdgeIds.has(edge.id)
|
|
) {
|
|
const sourceNode = nodes.find((node) => node.id === edge.source)
|
|
if (!sourceNode) return acc
|
|
|
|
const targetHandle = edge.targetHandle || 'target'
|
|
const sourceHandle = edge.sourceHandle || 'source'
|
|
|
|
acc.push({
|
|
...edge,
|
|
id: `${sourceNode.id}-${sourceHandle}-${newCurrentNode.id}-${targetHandle}`,
|
|
source: sourceNode.id,
|
|
sourceHandle,
|
|
target: newCurrentNode.id,
|
|
targetHandle,
|
|
type: CUSTOM_EDGE,
|
|
data: {
|
|
...edge.data,
|
|
sourceType: sourceNode.data.type,
|
|
targetType: newCurrentNode.data.type,
|
|
isInIteration: newNodeIsInIteration,
|
|
iteration_id: newNodeIsInIteration ? newCurrentNode.parentId : undefined,
|
|
isInLoop: newNodeIsInLoop,
|
|
loop_id: newNodeIsInLoop ? newCurrentNode.parentId : undefined,
|
|
_connectedNodeIsSelected: false,
|
|
},
|
|
zIndex: newCurrentNode.parentId ? NESTED_ELEMENT_Z_INDEX : 0,
|
|
})
|
|
}
|
|
|
|
return acc
|
|
}, [])
|
|
const nodesWithNewNode = produce(nodes, (draft) => {
|
|
draft.forEach((node) => {
|
|
node.data.selected = false
|
|
})
|
|
const index = draft.findIndex((node) => node.id === currentNodeId)
|
|
|
|
draft.splice(index, 1, newCurrentNode)
|
|
if (newIterationStartNode) draft.push(newIterationStartNode)
|
|
if (newLoopStartNode) draft.push(newLoopStartNode)
|
|
})
|
|
const nodesConnectedSourceOrTargetHandleIdsMap = getNodesConnectedSourceOrTargetHandleIdsMap(
|
|
[
|
|
...connectedEdges.map((edge) => ({ type: 'remove', edge })),
|
|
...reconnectedEdges.map((edge) => ({ type: 'add', edge })),
|
|
],
|
|
nodesWithNewNode,
|
|
)
|
|
const newNodes = produce(nodesWithNewNode, (draft) => {
|
|
draft.forEach((node) => {
|
|
if (nodesConnectedSourceOrTargetHandleIdsMap[node.id]) {
|
|
node.data = {
|
|
...node.data,
|
|
...nodesConnectedSourceOrTargetHandleIdsMap[node.id],
|
|
}
|
|
}
|
|
})
|
|
})
|
|
setNodes(newNodes)
|
|
const remainingEdges = edges.filter(
|
|
(edge) => !connectedEdges.some((connectedEdge) => connectedEdge.id === edge.id),
|
|
)
|
|
setEdges([...remainingEdges, ...reconnectedEdges])
|
|
if (nodeType === BlockEnum.TriggerWebhook) {
|
|
handleSyncWorkflowDraft(true, true, {
|
|
onSuccess: () => autoGenerateWebhookUrl(newCurrentNode.id),
|
|
})
|
|
} else if (
|
|
isAgentV2NodeData(newCurrentNode.data) &&
|
|
needsInlineAgentBindingCreation(newCurrentNode.data)
|
|
) {
|
|
createInlineAgentBindingForNode(newCurrentNode.id, {
|
|
onError: () => {
|
|
const { setNodes, setEdges } = collaborativeWorkflow.getState()
|
|
setNodes(nodes)
|
|
setEdges(edges)
|
|
},
|
|
})
|
|
} else {
|
|
handleSyncWorkflowDraft()
|
|
}
|
|
|
|
saveStateToHistory(WorkflowHistoryEvent.NodeChange, {
|
|
nodeId: currentNodeId,
|
|
})
|
|
},
|
|
[
|
|
getNodesReadOnly,
|
|
collaborativeWorkflow,
|
|
handleSyncWorkflowDraft,
|
|
createInlineAgentBindingForNode,
|
|
saveStateToHistory,
|
|
nodesMetaDataMap,
|
|
autoGenerateWebhookUrl,
|
|
],
|
|
)
|
|
|
|
const handleNodesCancelSelected = useCallback(() => {
|
|
const { nodes, setNodes } = collaborativeWorkflow.getState()
|
|
const newNodes = produce(nodes, (draft) => {
|
|
draft.forEach((node) => {
|
|
node.data.selected = false
|
|
})
|
|
})
|
|
setNodes(newNodes)
|
|
}, [collaborativeWorkflow])
|
|
|
|
const handleNodeContextMenu = useCallback(
|
|
(e: MouseEvent, node: Node) => {
|
|
if (node.type === CUSTOM_NOTE_NODE || node.type === CUSTOM_ITERATION_START_NODE) {
|
|
e.stopPropagation()
|
|
return
|
|
}
|
|
|
|
if (node.type === CUSTOM_NOTE_NODE || node.type === CUSTOM_LOOP_START_NODE) {
|
|
e.stopPropagation()
|
|
return
|
|
}
|
|
|
|
e.preventDefault()
|
|
workflowStore.setState({
|
|
contextMenuTarget: {
|
|
type: 'node',
|
|
nodeId: node.id,
|
|
},
|
|
})
|
|
handleNodeSelect(node.id, true)
|
|
},
|
|
[workflowStore, handleNodeSelect],
|
|
)
|
|
|
|
const isNodeCopyable = useCallback(
|
|
(node: Node) => {
|
|
if (node.type === CUSTOM_ITERATION_START_NODE || node.type === CUSTOM_LOOP_START_NODE) {
|
|
return false
|
|
}
|
|
|
|
if (
|
|
node.data.type === BlockEnum.Start ||
|
|
node.data.type === BlockEnum.LoopEnd ||
|
|
node.data.type === BlockEnum.KnowledgeBase ||
|
|
node.data.type === BlockEnum.DataSourceEmpty
|
|
) {
|
|
return false
|
|
}
|
|
|
|
if (node.type === CUSTOM_NOTE_NODE) return true
|
|
|
|
const nodeMeta = nodesMetaDataMap?.[getNodeCatalogType(node.data)]
|
|
if (!nodeMeta) return false
|
|
|
|
const { metaData } = nodeMeta
|
|
return !metaData.isSingleton
|
|
},
|
|
[nodesMetaDataMap],
|
|
)
|
|
|
|
const getNodeDefaultValueForPaste = useCallback(
|
|
(node: Node) => {
|
|
if (node.type === CUSTOM_NOTE_NODE) return {}
|
|
|
|
const nodeMeta = nodesMetaDataMap?.[getNodeCatalogType(node.data)]
|
|
return nodeMeta?.defaultValue
|
|
},
|
|
[nodesMetaDataMap],
|
|
)
|
|
|
|
const handleNodesCopy = useCallback(
|
|
(nodeId?: string) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
const { setClipboardData } = workflowStore.getState()
|
|
const { nodes, edges } = collaborativeWorkflow.getState()
|
|
let nodesToCopy: Node[] = []
|
|
|
|
if (nodeId) {
|
|
const nodeToCopy = nodes.find((node) => node.id === nodeId && isNodeCopyable(node))
|
|
if (nodeToCopy) nodesToCopy = [nodeToCopy]
|
|
} else {
|
|
const bundledNodes = nodes.filter((node) => {
|
|
if (!node.data._isBundled) return false
|
|
|
|
if (!isNodeCopyable(node)) return false
|
|
|
|
if (node.type === CUSTOM_NOTE_NODE) return true
|
|
return !node.data.isInIteration && !node.data.isInLoop
|
|
})
|
|
|
|
if (bundledNodes.length) {
|
|
nodesToCopy = bundledNodes
|
|
} else {
|
|
const selectedNodes = nodes.filter((node) => node.data.selected && isNodeCopyable(node))
|
|
|
|
if (selectedNodes.length) nodesToCopy = selectedNodes
|
|
}
|
|
}
|
|
|
|
if (!nodesToCopy.length) return
|
|
|
|
const copiedNodesMap = new Map(nodesToCopy.map((node) => [node.id, node]))
|
|
const queue = nodesToCopy
|
|
.filter(
|
|
(node) => node.data.type === BlockEnum.Iteration || node.data.type === BlockEnum.Loop,
|
|
)
|
|
.map((node) => node.id)
|
|
|
|
while (queue.length) {
|
|
const parentId = queue.shift()!
|
|
nodes.forEach((node) => {
|
|
if (node.parentId !== parentId || copiedNodesMap.has(node.id)) return
|
|
|
|
copiedNodesMap.set(node.id, node)
|
|
if (node.data.type === BlockEnum.Iteration || node.data.type === BlockEnum.Loop)
|
|
queue.push(node.id)
|
|
})
|
|
}
|
|
|
|
const copiedNodes = [...copiedNodesMap.values()]
|
|
const copiedNodeIds = new Set(copiedNodes.map((node) => node.id))
|
|
const copiedEdges = edges.filter(
|
|
(edge) => copiedNodeIds.has(edge.source) && copiedNodeIds.has(edge.target),
|
|
)
|
|
|
|
const clipboardData = {
|
|
nodes: copiedNodes,
|
|
edges: copiedEdges,
|
|
}
|
|
|
|
setClipboardData(clipboardData)
|
|
void writeWorkflowClipboard(clipboardData, appDslVersion).catch(() => {})
|
|
},
|
|
[getNodesReadOnly, workflowStore, collaborativeWorkflow, isNodeCopyable, appDslVersion],
|
|
)
|
|
|
|
const handleNodesPaste = useCallback(async () => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
const {
|
|
clipboardElements: storeClipboardElements,
|
|
clipboardEdges: storeClipboardEdges,
|
|
mousePosition,
|
|
setClipboardData,
|
|
} = workflowStore.getState()
|
|
const clipboardData = await readWorkflowClipboard(appDslVersion)
|
|
const hasSystemClipboard = clipboardData.nodes.length > 0
|
|
const shouldRunCompatibilityCheck = hasSystemClipboard && clipboardData.isVersionMismatch
|
|
|
|
const clipboardElements = hasSystemClipboard ? clipboardData.nodes : storeClipboardElements
|
|
const clipboardEdges = hasSystemClipboard ? clipboardData.edges : storeClipboardEdges
|
|
|
|
if (hasSystemClipboard) setClipboardData(clipboardData)
|
|
|
|
const validatedClipboardElements = clipboardElements.filter(isClipboardNodeStructurallyValid)
|
|
const validatedClipboardEdges = clipboardEdges.filter(isClipboardEdgeStructurallyValid)
|
|
|
|
if (!validatedClipboardElements.length) return
|
|
|
|
const { nodes, setNodes, edges, setEdges } = collaborativeWorkflow.getState()
|
|
const reservedNodeTitles = new Set(
|
|
nodes
|
|
.map((node) => node.data.title)
|
|
.filter((title): title is string => typeof title === 'string'),
|
|
)
|
|
|
|
const nodesToPaste: Node[] = []
|
|
const edgesToPaste: Edge[] = []
|
|
|
|
let compatibleClipboardElements = validatedClipboardElements.filter((node) => {
|
|
if (node.type === CUSTOM_NOTE_NODE) return true
|
|
|
|
const nodeDefaultValue = getNodeDefaultValueForPaste(node)
|
|
if (!nodeDefaultValue) return false
|
|
|
|
if (
|
|
shouldRunCompatibilityCheck &&
|
|
!isClipboardValueCompatibleWithDefault(nodeDefaultValue, node.data)
|
|
) {
|
|
return false
|
|
}
|
|
|
|
return true
|
|
})
|
|
|
|
if (shouldRunCompatibilityCheck) {
|
|
compatibleClipboardElements = pruneClipboardNodesWithFilteredAncestors(
|
|
validatedClipboardElements,
|
|
compatibleClipboardElements,
|
|
)
|
|
}
|
|
|
|
const compatibleClipboardNodeIds = new Set(compatibleClipboardElements.map((node) => node.id))
|
|
const filteredNodeCount = shouldRunCompatibilityCheck
|
|
? validatedClipboardElements.length - compatibleClipboardElements.length
|
|
: 0
|
|
const filteredEdgeCount = shouldRunCompatibilityCheck
|
|
? validatedClipboardEdges.filter(
|
|
(edge) =>
|
|
!compatibleClipboardNodeIds.has(edge.source) ||
|
|
!compatibleClipboardNodeIds.has(edge.target),
|
|
).length
|
|
: 0
|
|
|
|
if (shouldRunCompatibilityCheck && (filteredNodeCount > 0 || filteredEdgeCount > 0)) {
|
|
toast.warning(
|
|
t(($) => $['common.clipboardVersionCompatibilityWarning'], {
|
|
ns: 'workflow',
|
|
}),
|
|
)
|
|
}
|
|
|
|
if (!compatibleClipboardElements.length) return
|
|
|
|
const rootClipboardNodes = compatibleClipboardElements.filter(
|
|
(node) => !node.parentId || !compatibleClipboardNodeIds.has(node.parentId),
|
|
)
|
|
const positionReferenceNodes = rootClipboardNodes.length
|
|
? rootClipboardNodes
|
|
: compatibleClipboardElements
|
|
const { x, y } = getTopLeftNodePosition(positionReferenceNodes)
|
|
const { screenToFlowPosition } = reactflow
|
|
const currentPosition = screenToFlowPosition({
|
|
x: mousePosition.pageX,
|
|
y: mousePosition.pageY,
|
|
})
|
|
const offsetX = currentPosition.x - x
|
|
const offsetY = currentPosition.y - y
|
|
let idMapping: Record<string, string> = {}
|
|
const pastedNodesMap: Record<string, Node> = {}
|
|
const parentChildrenToAppend: { parentId: string; childId: string; childType: BlockEnum }[] = []
|
|
const selectedNodes = nodes.filter((node) => node.selected)
|
|
// Keep this list aligned with availableBlocksFilter(inContainer)
|
|
// in use-available-blocks.ts.
|
|
const commonNestedDisallowPasteNodes = [
|
|
BlockEnum.End,
|
|
BlockEnum.Iteration,
|
|
BlockEnum.Loop,
|
|
BlockEnum.DataSource,
|
|
BlockEnum.KnowledgeBase,
|
|
BlockEnum.HumanInput,
|
|
]
|
|
// Same-canvas copy keeps the source container selected, so only treat a
|
|
// selected container as the paste target when it is not part of the clipboard.
|
|
const selectedContainerNode =
|
|
selectedNodes.length === 1 &&
|
|
(selectedNodes[0]?.data.type === BlockEnum.Iteration ||
|
|
selectedNodes[0]?.data.type === BlockEnum.Loop) &&
|
|
!compatibleClipboardNodeIds.has(selectedNodes[0].id)
|
|
? selectedNodes[0]
|
|
: undefined
|
|
|
|
rootClipboardNodes.forEach((nodeToPaste, index) => {
|
|
const nodeDefaultValue = getNodeDefaultValueForPaste(nodeToPaste)
|
|
if (nodeToPaste.type !== CUSTOM_NOTE_NODE && !nodeDefaultValue) return
|
|
|
|
if (selectedContainerNode && commonNestedDisallowPasteNodes.includes(nodeToPaste.data.type))
|
|
return
|
|
|
|
const mergedData = shouldRunCompatibilityCheck
|
|
? (sanitizeClipboardValueByDefault(nodeDefaultValue ?? {}, nodeToPaste.data) as Record<
|
|
string,
|
|
unknown
|
|
>)
|
|
: {
|
|
...(nodeToPaste.type !== CUSTOM_NOTE_NODE ? nodeDefaultValue : {}),
|
|
...nodeToPaste.data,
|
|
}
|
|
const sourceTitle =
|
|
typeof mergedData.title === 'string'
|
|
? mergedData.title
|
|
: typeof nodeToPaste.data.title === 'string'
|
|
? nodeToPaste.data.title
|
|
: 'Node'
|
|
const sourceDesc =
|
|
typeof mergedData.desc === 'string'
|
|
? mergedData.desc
|
|
: typeof nodeToPaste.data.desc === 'string'
|
|
? nodeToPaste.data.desc
|
|
: ''
|
|
|
|
const { newNode, newIterationStartNode, newLoopStartNode } = generateNewNode({
|
|
type: nodeToPaste.type,
|
|
data: {
|
|
...mergedData,
|
|
type: nodeToPaste.data.type,
|
|
desc: sourceDesc,
|
|
selected: false,
|
|
_isBundled: false,
|
|
_connectedSourceHandleIds: [],
|
|
_connectedTargetHandleIds: [],
|
|
_dimmed: false,
|
|
isInIteration: false,
|
|
iteration_id: undefined,
|
|
isInLoop: false,
|
|
loop_id: undefined,
|
|
title: getUniquePastedNodeTitle(sourceTitle, reservedNodeTitles),
|
|
},
|
|
position: {
|
|
x: nodeToPaste.position.x + offsetX,
|
|
y: nodeToPaste.position.y + offsetY,
|
|
},
|
|
extent: nodeToPaste.extent,
|
|
zIndex: 0,
|
|
})
|
|
newNode.id = newNode.id + index
|
|
|
|
let newChildren: Node[] = []
|
|
if (nodeToPaste.data.type === BlockEnum.Iteration) {
|
|
if (newIterationStartNode) {
|
|
newIterationStartNode.parentId = newNode.id
|
|
const iterationNodeData = newNode.data as IterationNodeType
|
|
iterationNodeData.start_node_id = newIterationStartNode.id
|
|
}
|
|
|
|
const oldIterationStartNodeInClipboard = compatibleClipboardElements.find(
|
|
(n) => n.parentId === nodeToPaste.id && n.type === CUSTOM_ITERATION_START_NODE,
|
|
)
|
|
if (oldIterationStartNodeInClipboard && newIterationStartNode)
|
|
idMapping[oldIterationStartNodeInClipboard.id] = newIterationStartNode.id
|
|
|
|
const copiedIterationChildren = compatibleClipboardElements.filter(
|
|
(n) => n.parentId === nodeToPaste.id && n.type !== CUSTOM_ITERATION_START_NODE,
|
|
)
|
|
if (copiedIterationChildren.length) {
|
|
copiedIterationChildren.forEach((child, childIndex) => {
|
|
const childType = child.data.type
|
|
const childDefaultValue = getNodeDefaultValueForPaste(child)
|
|
if (child.type !== CUSTOM_NOTE_NODE && !childDefaultValue) return
|
|
|
|
const mergedChildData = shouldRunCompatibilityCheck
|
|
? (sanitizeClipboardValueByDefault(childDefaultValue ?? {}, child.data) as Record<
|
|
string,
|
|
unknown
|
|
>)
|
|
: {
|
|
...(child.type !== CUSTOM_NOTE_NODE ? childDefaultValue : {}),
|
|
...child.data,
|
|
}
|
|
const childSourceTitle =
|
|
typeof mergedChildData.title === 'string'
|
|
? mergedChildData.title
|
|
: typeof child.data.title === 'string'
|
|
? child.data.title
|
|
: 'Node'
|
|
const childSourceDesc =
|
|
typeof mergedChildData.desc === 'string'
|
|
? mergedChildData.desc
|
|
: typeof child.data.desc === 'string'
|
|
? child.data.desc
|
|
: ''
|
|
|
|
const { newNode: newChild } = generateNewNode({
|
|
type: child.type,
|
|
data: {
|
|
...mergedChildData,
|
|
desc: childSourceDesc,
|
|
selected: false,
|
|
_isBundled: false,
|
|
_connectedSourceHandleIds: [],
|
|
_connectedTargetHandleIds: [],
|
|
_dimmed: false,
|
|
title: getUniquePastedNodeTitle(childSourceTitle, reservedNodeTitles),
|
|
isInIteration: true,
|
|
iteration_id: newNode.id,
|
|
isInLoop: false,
|
|
loop_id: undefined,
|
|
type: childType,
|
|
},
|
|
position: child.position,
|
|
positionAbsolute: child.positionAbsolute,
|
|
parentId: newNode.id,
|
|
extent: child.extent,
|
|
zIndex: NESTED_ELEMENT_Z_INDEX,
|
|
})
|
|
newChild.id = `${newNode.id}${newChild.id + childIndex}`
|
|
idMapping[child.id] = newChild.id
|
|
newChildren.push(newChild)
|
|
})
|
|
} else {
|
|
const oldIterationStartNode = nodes.find(
|
|
(n) => n.parentId === nodeToPaste.id && n.type === CUSTOM_ITERATION_START_NODE,
|
|
)
|
|
if (oldIterationStartNode && newIterationStartNode)
|
|
idMapping[oldIterationStartNode.id] = newIterationStartNode.id
|
|
|
|
const { copyChildren, newIdMapping } = handleNodeIterationChildrenCopy(
|
|
nodeToPaste.id,
|
|
newNode.id,
|
|
idMapping,
|
|
)
|
|
newChildren = copyChildren
|
|
idMapping = newIdMapping
|
|
}
|
|
|
|
newChildren.forEach((child) => {
|
|
newNode.data._children?.push({
|
|
nodeId: child.id,
|
|
nodeType: child.data.type,
|
|
})
|
|
})
|
|
if (newIterationStartNode) newChildren.push(newIterationStartNode)
|
|
} else if (nodeToPaste.data.type === BlockEnum.Loop) {
|
|
if (newLoopStartNode) {
|
|
newLoopStartNode.parentId = newNode.id
|
|
const loopNodeData = newNode.data as LoopNodeType
|
|
loopNodeData.start_node_id = newLoopStartNode.id
|
|
}
|
|
|
|
const oldLoopStartNodeInClipboard = compatibleClipboardElements.find(
|
|
(n) => n.parentId === nodeToPaste.id && n.type === CUSTOM_LOOP_START_NODE,
|
|
)
|
|
if (oldLoopStartNodeInClipboard && newLoopStartNode)
|
|
idMapping[oldLoopStartNodeInClipboard.id] = newLoopStartNode.id
|
|
|
|
const copiedLoopChildren = compatibleClipboardElements.filter(
|
|
(n) => n.parentId === nodeToPaste.id && n.type !== CUSTOM_LOOP_START_NODE,
|
|
)
|
|
if (copiedLoopChildren.length) {
|
|
copiedLoopChildren.forEach((child, childIndex) => {
|
|
const childType = child.data.type
|
|
const childDefaultValue = getNodeDefaultValueForPaste(child)
|
|
if (child.type !== CUSTOM_NOTE_NODE && !childDefaultValue) return
|
|
|
|
const mergedChildData = shouldRunCompatibilityCheck
|
|
? (sanitizeClipboardValueByDefault(childDefaultValue ?? {}, child.data) as Record<
|
|
string,
|
|
unknown
|
|
>)
|
|
: {
|
|
...(child.type !== CUSTOM_NOTE_NODE ? childDefaultValue : {}),
|
|
...child.data,
|
|
}
|
|
const childSourceTitle =
|
|
typeof mergedChildData.title === 'string'
|
|
? mergedChildData.title
|
|
: typeof child.data.title === 'string'
|
|
? child.data.title
|
|
: 'Node'
|
|
const childSourceDesc =
|
|
typeof mergedChildData.desc === 'string'
|
|
? mergedChildData.desc
|
|
: typeof child.data.desc === 'string'
|
|
? child.data.desc
|
|
: ''
|
|
|
|
const { newNode: newChild } = generateNewNode({
|
|
type: child.type,
|
|
data: {
|
|
...mergedChildData,
|
|
desc: childSourceDesc,
|
|
selected: false,
|
|
_isBundled: false,
|
|
_connectedSourceHandleIds: [],
|
|
_connectedTargetHandleIds: [],
|
|
_dimmed: false,
|
|
title: getUniquePastedNodeTitle(childSourceTitle, reservedNodeTitles),
|
|
isInIteration: false,
|
|
iteration_id: undefined,
|
|
isInLoop: true,
|
|
loop_id: newNode.id,
|
|
type: childType,
|
|
},
|
|
position: child.position,
|
|
positionAbsolute: child.positionAbsolute,
|
|
parentId: newNode.id,
|
|
extent: child.extent,
|
|
zIndex: NESTED_ELEMENT_Z_INDEX,
|
|
})
|
|
newChild.id = `${newNode.id}${newChild.id + childIndex}`
|
|
idMapping[child.id] = newChild.id
|
|
newChildren.push(newChild)
|
|
})
|
|
} else {
|
|
const oldLoopStartNode = nodes.find(
|
|
(n) => n.parentId === nodeToPaste.id && n.type === CUSTOM_LOOP_START_NODE,
|
|
)
|
|
if (oldLoopStartNode && newLoopStartNode)
|
|
idMapping[oldLoopStartNode.id] = newLoopStartNode.id
|
|
|
|
const { copyChildren, newIdMapping } = handleNodeLoopChildrenCopy(
|
|
nodeToPaste.id,
|
|
newNode.id,
|
|
idMapping,
|
|
)
|
|
newChildren = copyChildren
|
|
idMapping = newIdMapping
|
|
}
|
|
|
|
newChildren.forEach((child) => {
|
|
newNode.data._children?.push({
|
|
nodeId: child.id,
|
|
nodeType: child.data.type,
|
|
})
|
|
})
|
|
if (newLoopStartNode) newChildren.push(newLoopStartNode)
|
|
} else if (selectedContainerNode) {
|
|
if (
|
|
selectedContainerNode.data.type === BlockEnum.Iteration ||
|
|
selectedContainerNode.data.type === BlockEnum.Loop
|
|
) {
|
|
const isIteration = selectedContainerNode.data.type === BlockEnum.Iteration
|
|
|
|
newNode.data.isInIteration = isIteration
|
|
newNode.data.iteration_id = isIteration ? selectedContainerNode.id : undefined
|
|
newNode.data.isInLoop = !isIteration
|
|
newNode.data.loop_id = !isIteration ? selectedContainerNode.id : undefined
|
|
|
|
newNode.parentId = selectedContainerNode.id
|
|
newNode.zIndex = NESTED_ELEMENT_Z_INDEX
|
|
newNode.positionAbsolute = {
|
|
x: newNode.position.x,
|
|
y: newNode.position.y,
|
|
}
|
|
newNode.position = getNestedNodePosition(newNode, selectedContainerNode)
|
|
parentChildrenToAppend.push({
|
|
parentId: selectedContainerNode.id,
|
|
childId: newNode.id,
|
|
childType: newNode.data.type,
|
|
})
|
|
}
|
|
}
|
|
|
|
idMapping[nodeToPaste.id] = newNode.id
|
|
nodesToPaste.push(newNode)
|
|
pastedNodesMap[newNode.id] = newNode
|
|
|
|
if (newChildren.length) {
|
|
newChildren.forEach((child) => {
|
|
pastedNodesMap[child.id] = child
|
|
})
|
|
nodesToPaste.push(...newChildren)
|
|
}
|
|
})
|
|
|
|
const sourceEdges = validatedClipboardEdges
|
|
|
|
sourceEdges.forEach((edge) => {
|
|
const sourceId = idMapping[edge.source]
|
|
const targetId = idMapping[edge.target]
|
|
|
|
if (sourceId && targetId) {
|
|
const sourceNode = pastedNodesMap[sourceId]
|
|
const targetNode = pastedNodesMap[targetId]
|
|
if (!sourceNode || !targetNode) return
|
|
|
|
const parentNode =
|
|
sourceNode.parentId && sourceNode.parentId === targetNode.parentId
|
|
? (pastedNodesMap[sourceNode.parentId] ??
|
|
nodes.find((n) => n.id === sourceNode.parentId))
|
|
: null
|
|
const isInIteration = parentNode?.data.type === BlockEnum.Iteration
|
|
const isInLoop = parentNode?.data.type === BlockEnum.Loop
|
|
const newEdge: Edge = {
|
|
...edge,
|
|
id: `${sourceId}-${edge.sourceHandle}-${targetId}-${edge.targetHandle}`,
|
|
source: sourceId,
|
|
target: targetId,
|
|
data: {
|
|
...(edge.data || {}),
|
|
sourceType: sourceNode.data.type,
|
|
targetType: targetNode.data.type,
|
|
isInIteration,
|
|
iteration_id: isInIteration ? parentNode?.id : undefined,
|
|
isInLoop,
|
|
loop_id: isInLoop ? parentNode?.id : undefined,
|
|
_connectedNodeIsSelected: false,
|
|
},
|
|
zIndex: parentNode && (isInIteration || isInLoop) ? NESTED_ELEMENT_Z_INDEX : 0,
|
|
}
|
|
edgesToPaste.push(newEdge)
|
|
}
|
|
})
|
|
|
|
const newNodes = produce(nodes, (draft: Node[]) => {
|
|
parentChildrenToAppend.forEach(({ parentId, childId, childType }) => {
|
|
const p = draft.find((n) => n.id === parentId)
|
|
if (p) p.data._children?.push({ nodeId: childId, nodeType: childType })
|
|
})
|
|
draft.push(...nodesToPaste)
|
|
})
|
|
|
|
setNodes(newNodes)
|
|
setEdges([...edges, ...edgesToPaste])
|
|
saveStateToHistory(WorkflowHistoryEvent.NodePaste, {
|
|
nodeId: nodesToPaste?.[0]?.id,
|
|
})
|
|
handleSyncWorkflowDraft()
|
|
}, [
|
|
getNodesReadOnly,
|
|
workflowStore,
|
|
collaborativeWorkflow,
|
|
reactflow,
|
|
t,
|
|
saveStateToHistory,
|
|
handleSyncWorkflowDraft,
|
|
handleNodeIterationChildrenCopy,
|
|
handleNodeLoopChildrenCopy,
|
|
getNodeDefaultValueForPaste,
|
|
appDslVersion,
|
|
])
|
|
|
|
const handleNodesDuplicate = useCallback(
|
|
(nodeId?: string) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
handleNodesCopy(nodeId)
|
|
handleNodesPaste()
|
|
},
|
|
[getNodesReadOnly, handleNodesCopy, handleNodesPaste],
|
|
)
|
|
|
|
const handleNodesDelete = useCallback(() => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
const { nodes, edges } = collaborativeWorkflow.getState()
|
|
|
|
const bundledNodes = nodes.filter((node) => node.data._isBundled)
|
|
|
|
if (bundledNodes.length) {
|
|
bundledNodes.forEach((node) => handleNodeDelete(node.id))
|
|
|
|
return
|
|
}
|
|
|
|
const edgeSelected = edges.some((edge) => edge.selected)
|
|
if (edgeSelected) return
|
|
|
|
const selectedNode = nodes.find((node) => node.data.selected)
|
|
|
|
if (selectedNode) handleNodeDelete(selectedNode.id)
|
|
}, [collaborativeWorkflow, getNodesReadOnly, handleNodeDelete])
|
|
|
|
const handleNodeResize = useCallback(
|
|
(nodeId: string, params: ResizeParamsWithDirection) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
const { nodes, setNodes } = collaborativeWorkflow.getState()
|
|
const { x, y, width, height } = params
|
|
|
|
const currentNode = nodes.find((n) => n.id === nodeId)!
|
|
const childrenNodes = nodes.filter((n) =>
|
|
currentNode.data._children?.find(
|
|
(child: NonNullable<Node['data']['_children']>[number]) => child.nodeId === n.id,
|
|
),
|
|
)
|
|
let rightNode: Node
|
|
let bottomNode: Node
|
|
|
|
childrenNodes.forEach((n) => {
|
|
if (rightNode) {
|
|
if (n.position.x + n.width! > rightNode.position.x + rightNode.width!) rightNode = n
|
|
} else {
|
|
rightNode = n
|
|
}
|
|
if (bottomNode) {
|
|
if (n.position.y + n.height! > bottomNode.position.y + bottomNode.height!) {
|
|
bottomNode = n
|
|
}
|
|
} else {
|
|
bottomNode = n
|
|
}
|
|
})
|
|
|
|
if (rightNode! && bottomNode!) {
|
|
const parentNode = nodes.find((n) => n.id === rightNode.parentId)
|
|
const paddingMap =
|
|
parentNode?.data.type === BlockEnum.Iteration ? ITERATION_PADDING : LOOP_PADDING
|
|
|
|
if (width < rightNode!.position.x + rightNode.width! + paddingMap.right) return
|
|
if (height < bottomNode.position.y + bottomNode.height! + paddingMap.bottom) {
|
|
return
|
|
}
|
|
}
|
|
const newNodes = produce(nodes, (draft) => {
|
|
draft.forEach((n) => {
|
|
if (n.id === nodeId) {
|
|
n.data.width = width
|
|
n.data.height = height
|
|
n.width = width
|
|
n.height = height
|
|
n.position.x = x
|
|
n.position.y = y
|
|
}
|
|
})
|
|
})
|
|
setNodes(newNodes)
|
|
handleSyncWorkflowDraft()
|
|
saveStateToHistory(WorkflowHistoryEvent.NodeResize, { nodeId })
|
|
},
|
|
[getNodesReadOnly, collaborativeWorkflow, handleSyncWorkflowDraft, saveStateToHistory],
|
|
)
|
|
|
|
const handleNodeDisconnect = useCallback(
|
|
(nodeId: string) => {
|
|
if (getNodesReadOnly()) return
|
|
|
|
const { nodes, setNodes, edges, setEdges } = collaborativeWorkflow.getState()
|
|
const currentNode = nodes.find((node) => node.id === nodeId)!
|
|
const connectedEdges = getConnectedEdges([currentNode], edges)
|
|
const nodesConnectedSourceOrTargetHandleIdsMap = getNodesConnectedSourceOrTargetHandleIdsMap(
|
|
connectedEdges.map((edge) => ({ type: 'remove', edge })),
|
|
nodes,
|
|
)
|
|
const newNodes = produce(nodes, (draft: Node[]) => {
|
|
draft.forEach((node) => {
|
|
if (nodesConnectedSourceOrTargetHandleIdsMap[node.id]) {
|
|
node.data = {
|
|
...node.data,
|
|
...nodesConnectedSourceOrTargetHandleIdsMap[node.id],
|
|
}
|
|
}
|
|
})
|
|
})
|
|
setNodes(newNodes)
|
|
const newEdges = produce(edges, (draft) => {
|
|
return draft.filter(
|
|
(edge) => !connectedEdges.some((connectedEdge) => connectedEdge.id === edge.id),
|
|
)
|
|
})
|
|
setEdges(newEdges)
|
|
handleSyncWorkflowDraft()
|
|
saveStateToHistory(WorkflowHistoryEvent.EdgeDelete)
|
|
},
|
|
[collaborativeWorkflow, getNodesReadOnly, handleSyncWorkflowDraft, saveStateToHistory],
|
|
)
|
|
|
|
const handleHistoryBack = useCallback(() => {
|
|
if (getNodesReadOnly() || getWorkflowReadOnly()) return
|
|
|
|
undo()
|
|
const { edges, nodes } = workflowHistoryStore.getState()
|
|
if (edges.length === 0 && nodes.length === 0) return
|
|
const { setNodes, setEdges } = collaborativeWorkflow.getState()
|
|
|
|
const shouldBroadcast = collaborationManager.isConnected()
|
|
setEdges(edges, shouldBroadcast)
|
|
setNodes(nodes, shouldBroadcast, 'nodes:history-back')
|
|
if (shouldBroadcast) collaborationManager.emitHistoryAction('undo')
|
|
workflowStore.setState({ contextMenuTarget: undefined })
|
|
}, [
|
|
collaborativeWorkflow,
|
|
workflowStore,
|
|
undo,
|
|
workflowHistoryStore,
|
|
getNodesReadOnly,
|
|
getWorkflowReadOnly,
|
|
])
|
|
|
|
const handleHistoryForward = useCallback(() => {
|
|
if (getNodesReadOnly() || getWorkflowReadOnly()) return
|
|
|
|
redo()
|
|
const { edges, nodes } = workflowHistoryStore.getState()
|
|
if (edges.length === 0 && nodes.length === 0) return
|
|
const { setNodes, setEdges } = collaborativeWorkflow.getState()
|
|
|
|
const shouldBroadcast = collaborationManager.isConnected()
|
|
setEdges(edges, shouldBroadcast)
|
|
setNodes(nodes, shouldBroadcast, 'nodes:history-forward')
|
|
if (shouldBroadcast) collaborationManager.emitHistoryAction('redo')
|
|
workflowStore.setState({ contextMenuTarget: undefined })
|
|
}, [
|
|
collaborativeWorkflow,
|
|
redo,
|
|
workflowStore,
|
|
workflowHistoryStore,
|
|
getNodesReadOnly,
|
|
getWorkflowReadOnly,
|
|
])
|
|
|
|
const [isDimming, setIsDimming] = useState(false)
|
|
/** Add opacity-30 to all nodes except the nodeId */
|
|
const dimOtherNodes = useCallback(() => {
|
|
if (isDimming) return
|
|
const { nodes, setNodes, edges, setEdges } = collaborativeWorkflow.getState()
|
|
|
|
const selectedNode = nodes.find((n) => n.data.selected)
|
|
if (!selectedNode) return
|
|
|
|
setIsDimming(true)
|
|
|
|
// const workflowNodes = useStore(s => s.getNodes())
|
|
const workflowNodes = nodes
|
|
|
|
const usedVars = getNodeUsedVars(selectedNode)
|
|
const dependencyNodes: Node[] = []
|
|
usedVars.forEach((valueSelector) => {
|
|
const node = workflowNodes.find((node) => node.id === valueSelector?.[0])
|
|
if (node) {
|
|
if (!dependencyNodes.includes(node)) dependencyNodes.push(node)
|
|
}
|
|
})
|
|
|
|
const outgoers = getOutgoers(selectedNode as Node, nodes as Node[], edges)
|
|
for (let currIdx = 0; currIdx < outgoers.length; currIdx++) {
|
|
const node = outgoers[currIdx]
|
|
const outgoersForNode = getOutgoers(node!, nodes as Node[], edges)
|
|
outgoersForNode.forEach((item) => {
|
|
const existed = outgoers.some((v) => v.id === item.id)
|
|
if (!existed) outgoers.push(item)
|
|
})
|
|
}
|
|
|
|
const dependentNodes: Node[] = []
|
|
outgoers.forEach((node) => {
|
|
const usedVars = getNodeUsedVars(node)
|
|
const used = usedVars.some((v) => v?.[0] === selectedNode.id)
|
|
if (used) {
|
|
const existed = dependentNodes.some((v) => v.id === node.id)
|
|
if (!existed) dependentNodes.push(node)
|
|
}
|
|
})
|
|
|
|
const dimNodes = [...dependencyNodes, ...dependentNodes, selectedNode]
|
|
|
|
const newNodes = produce(nodes, (draft) => {
|
|
draft.forEach((n) => {
|
|
const dimNode = dimNodes.find((v) => v.id === n.id)
|
|
if (!dimNode) n.data._dimmed = true
|
|
})
|
|
})
|
|
|
|
setNodes(newNodes)
|
|
|
|
const tempEdges: Edge[] = []
|
|
|
|
dependencyNodes.forEach((n) => {
|
|
tempEdges.push({
|
|
id: `tmp_${n.id}-source-${selectedNode.id}-target`,
|
|
type: CUSTOM_EDGE,
|
|
source: n.id,
|
|
sourceHandle: 'source_tmp',
|
|
target: selectedNode.id,
|
|
targetHandle: 'target_tmp',
|
|
animated: true,
|
|
data: {
|
|
sourceType: n.data.type,
|
|
targetType: selectedNode.data.type,
|
|
_isTemp: true,
|
|
_connectedNodeIsHovering: true,
|
|
},
|
|
})
|
|
})
|
|
dependentNodes.forEach((n) => {
|
|
tempEdges.push({
|
|
id: `tmp_${selectedNode.id}-source-${n.id}-target`,
|
|
type: CUSTOM_EDGE,
|
|
source: selectedNode.id,
|
|
sourceHandle: 'source_tmp',
|
|
target: n.id,
|
|
targetHandle: 'target_tmp',
|
|
animated: true,
|
|
data: {
|
|
sourceType: selectedNode.data.type,
|
|
targetType: n.data.type,
|
|
_isTemp: true,
|
|
_connectedNodeIsHovering: true,
|
|
},
|
|
})
|
|
})
|
|
|
|
const newEdges = produce(edges, (draft) => {
|
|
draft.forEach((e) => {
|
|
e.data._dimmed = true
|
|
})
|
|
draft.push(...tempEdges)
|
|
})
|
|
setEdges(newEdges)
|
|
}, [isDimming, collaborativeWorkflow])
|
|
|
|
/** Restore all nodes to full opacity */
|
|
const undimAllNodes = useCallback(() => {
|
|
const { nodes, setNodes, edges, setEdges } = collaborativeWorkflow.getState()
|
|
setIsDimming(false)
|
|
|
|
const newNodes = produce(nodes, (draft) => {
|
|
draft.forEach((n) => {
|
|
n.data._dimmed = false
|
|
})
|
|
})
|
|
|
|
setNodes(newNodes)
|
|
|
|
const newEdges = produce(
|
|
edges.filter((e) => !e.data._isTemp),
|
|
(draft) => {
|
|
draft.forEach((e) => {
|
|
e.data._dimmed = false
|
|
})
|
|
},
|
|
)
|
|
setEdges(newEdges)
|
|
}, [collaborativeWorkflow])
|
|
|
|
return {
|
|
handleNodeDragStart,
|
|
handleNodeDrag,
|
|
handleNodeDragStop,
|
|
handleNodeEnter,
|
|
handleNodeLeave,
|
|
handleNodeSelect,
|
|
handleNodeClick,
|
|
handleNodeConnect,
|
|
handleNodeConnectStart,
|
|
handleNodeConnectEnd,
|
|
handleNodeDelete,
|
|
handleNodeChange,
|
|
handleNodeAdd,
|
|
handleNodesCancelSelected,
|
|
handleNodeContextMenu,
|
|
handleNodesCopy,
|
|
handleNodesPaste,
|
|
handleNodesDuplicate,
|
|
handleNodesDelete,
|
|
handleNodeResize,
|
|
handleNodeDisconnect,
|
|
handleHistoryBack,
|
|
handleHistoryForward,
|
|
dimOtherNodes,
|
|
undimAllNodes,
|
|
}
|
|
}
|