opensource/dify
2
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-04-28 20:17:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: when mouseover add btn of edges display error

Browse Source
This commit is contained in:
hjlarry 2026-04-10 13:35:46 +08:00
parent 1aa16821c1
commit 10193179cf
2 changed files with 12 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
web/app/components/workflow/custom-edge.tsx
View File

@ -55,6 +55,7 @@ const CustomEdge = ({
curvature: 0.16, curvature: 0.16,
}) })
const [open, setOpen] = useState(false) const [open, setOpen] = useState(false)
const [isTriggerHovered, setIsTriggerHovered] = useState(false)
const { handleNodeAdd } = useNodesInteractions() const { handleNodeAdd } = useNodesInteractions()
const { availablePrevBlocks } = useAvailableBlocks((data as Edge['data'])!.targetType, (data as Edge['data'])?.isInIteration || (data as Edge['data'])?.isInLoop) const { availablePrevBlocks } = useAvailableBlocks((data as Edge['data'])!.targetType, (data as Edge['data'])?.isInIteration || (data as Edge['data'])?.isInLoop)
const { availableNextBlocks } = useAvailableBlocks((data as Edge['data'])!.sourceType, (data as Edge['data'])?.isInIteration || (data as Edge['data'])?.isInLoop) const { availableNextBlocks } = useAvailableBlocks((data as Edge['data'])!.sourceType, (data as Edge['data'])?.isInIteration || (data as Edge['data'])?.isInLoop)
@ -142,8 +143,8 @@ const CustomEdge = ({
<EdgeLabelRenderer> <EdgeLabelRenderer>
<div <div
className={cn( className={cn(
'nopan nodrag hover:scale-125', 'nopan nodrag',
data?._hovering ? 'block' : 'hidden', (data?._hovering || isTriggerHovered) ? 'block' : 'hidden',
open && 'block!', open && 'block!',
data.isInIteration && `z-[${ITERATION_CHILDREN_Z_INDEX}]`, data.isInIteration && `z-[${ITERATION_CHILDREN_Z_INDEX}]`,
data.isInLoop && `z-[${LOOP_CHILDREN_Z_INDEX}]`, data.isInLoop && `z-[${LOOP_CHILDREN_Z_INDEX}]`,
@ -154,6 +155,8 @@ const CustomEdge = ({
pointerEvents: 'all', pointerEvents: 'all',
opacity: data._waitingRun ? 0.7 : 1, opacity: data._waitingRun ? 0.7 : 1,
}} }}
onMouseEnter={() => setIsTriggerHovered(true)}
onMouseLeave={() => setIsTriggerHovered(false)}
> >
<BlockSelector <BlockSelector
open={open} open={open}

12
web/app/components/workflow/hooks/use-edges-interactions.ts
View File

@ -4,8 +4,9 @@ import type {
} from 'reactflow' } from 'reactflow'
import { produce } from 'immer' import { produce } from 'immer'
import { useCallback } from 'react' import { useCallback } from 'react'
import { useCollaborativeWorkflow } from './use-collaborative-workflow' import { useStoreApi } from 'reactflow'
import { useWorkflowStore } from '../store' import { useWorkflowStore } from '../store'
import { useCollaborativeWorkflow } from './use-collaborative-workflow'
import { import {
applyConnectedHandleNodeData, applyConnectedHandleNodeData,
buildContextMenuEdges, buildContextMenuEdges,
@ -19,6 +20,7 @@ import { useNodesReadOnly } from './use-workflow'
import { useWorkflowHistory, WorkflowHistoryEvent } from './use-workflow-history' import { useWorkflowHistory, WorkflowHistoryEvent } from './use-workflow-history'
export const useEdgesInteractions = () => { export const useEdgesInteractions = () => {
const store = useStoreApi()
const { handleSyncWorkflowDraft } = useNodesSyncDraft() const { handleSyncWorkflowDraft } = useNodesSyncDraft()
const { getNodesReadOnly } = useNodesReadOnly() const { getNodesReadOnly } = useNodesReadOnly()
const { saveStateToHistory } = useWorkflowHistory() const { saveStateToHistory } = useWorkflowHistory()
@ -53,17 +55,17 @@ export const useEdgesInteractions = () => {
if (getNodesReadOnly()) if (getNodesReadOnly())
return return
const { edges, setEdges } = collaborativeWorkflow.getState() const { edges, setEdges } = store.getState()
setEdges(updateEdgeHoverState(edges, edge.id, true)) setEdges(updateEdgeHoverState(edges, edge.id, true))
}, [collaborativeWorkflow, getNodesReadOnly]) }, [getNodesReadOnly, store])
const handleEdgeLeave = useCallback<EdgeMouseHandler>((_, edge) => { const handleEdgeLeave = useCallback<EdgeMouseHandler>((_, edge) => {
if (getNodesReadOnly()) if (getNodesReadOnly())
return return
const { edges, setEdges } = collaborativeWorkflow.getState() const { edges, setEdges } = store.getState()
setEdges(updateEdgeHoverState(edges, edge.id, false)) setEdges(updateEdgeHoverState(edges, edge.id, false))
}, [collaborativeWorkflow, getNodesReadOnly]) }, [getNodesReadOnly, store])
const handleEdgeDeleteByDeleteBranch = useCallback((nodeId: string, branchId: string) => { const handleEdgeDeleteByDeleteBranch = useCallback((nodeId: string, branchId: string) => {
if (getNodesReadOnly()) if (getNodesReadOnly())