Files
windmill/frontend/src/lib/components/graph/graphContext.ts
T
GuilhemandClaude Opus 5 b4be8bc535 fix(frontend): clear the flow graph selection through xyflow's store (#11056)
Selecting a step in the flow editor sometimes opened the Settings panel
instead of the step that was clicked.

SelectionManager.selectId() clears xyflow's own selection before setting
ours, and that clear was wired to clearFlowSelection(), which resets
offsetNodeCache and reassigns nodes. That hands xyflow node objects it
does not recognise, which is what makes it drop the flag — but it also
makes it re-create every node's DOM: 126 elements on a 25-node flow, on
every selection.

Graph nodes select on pointerdown. A click is dispatched on the closest
common ancestor of its pointerdown and pointerup targets, so when the
release lands in that teardown gap the browser hit-tests to the pane, the
click addresses the pane, and onpaneclick clears the selection back to the
settings sentinel.

Clear through store.unselectNodesAndEdges() instead, so no node object
changes identity and there is no gap to fall into. clearFlowSelection
keeps its two group-creation callers, which rebuild the graph anyway.


Claude-Session: https://claude.ai/code/session_01R7caEKonPr2DmvsWRR6bCK

Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>
2026-09-10 16:37:10 +02:00

30 lines
1.3 KiB
TypeScript

import { getContext, setContext } from 'svelte'
import type { SelectionManager } from './selectionUtils.svelte'
import type { NoteManager } from './noteManager.svelte'
import type { MoveManager } from './moveManager.svelte'
import type { Writable } from 'svelte/store'
import type { FlowDiffManager } from '../flows/flowDiffManager.svelte'
import type { GroupDisplayState } from './groupEditor.svelte'
export type GraphContext = {
selectionManager: SelectionManager
useDataflow: Writable<boolean | undefined>
showAssets: Writable<boolean | undefined>
noteManager?: NoteManager
moveManager?: MoveManager
/** Clears xyflow's selection by replacing every node object, so only for callers that rebuild
* the graph anyway. A selection change must use `selectionManager` instead. */
clearFlowSelection?: () => void
yOffset?: number
diffManager: FlowDiffManager
/** Current flow nodes for group validation (set by FlowGraphV2) */
getFlowNodes?: () => { id: string; parentIds?: string[] }[]
groupDisplayState?: GroupDisplayState
}
const graphContextKey = 'FlowGraphContext'
//TODO: use https://svelte.dev/docs/svelte/context#Type-safe-context after migrating svelte 5 to latest version
export const getGraphContext = () => getContext<GraphContext>(graphContextKey)
export const setGraphContext = (context: GraphContext) => setContext(graphContextKey, context)