Summary

• Preserve local-only selector nodes and temporary selector edges when backend graph hydration/refetches run.
• Keep canvas nodes and edges in one state object so hydration uses the latest queued graph state without ref-synced effects.
• Optimize the selector action list by sorting/filtering once and skipping fuzzysort for the initial empty query.

Root Cause

The action selector is an ephemeral React Flow node that is not persisted in the backend graph. When the first graph hydration/refetch completed after a drag, the canvas replaced local nodes/edges with only the hydrated backend graph, dropping the just-created selector.

Validation

• pnpm -C frontend exec biome check --write src/components/builder/canvas/canvas.tsx src/components/builder/canvas/graph-layout.ts tests/graph-layout.test.ts
• pnpm -C frontend test -- graph-layout.test.ts
• pnpm -C frontend exec biome check --write src/components/builder/canvas/selector-node.tsx
• pnpm -C frontend run typecheck
• uv run ruff check .
• git diff --check

Summary by cubic

Fixes a race that removed the action selector after the first graph hydration by preserving ephemeral nodes/edges and updating canvas state handling. Also speeds up selector filtering for a snappier first keystroke.

• Bug Fixes

  • Preserve local-only selector nodes and their temporary edges during backend hydration/refetch by merging hydrated data with ephemeral elements.
  • Reset ephemeral elements when switching workflows to avoid leaking state.
  • Use applyNodeChanges/applyEdgeChanges from @xyflow/react with unified state to avoid stale updates.

• Refactors

  • Keep canvas nodes and edges in a single state object; add mergeHydratedNodes/mergeHydratedEdges with optional ephemeral preservation.
  • Optimize selector filtering: pre-sort actions, skip fuzzysort for empty queries, and compute results once per input.
  • Add tests for node/edge merge behavior with ephemeral nodes.

^{Written for commit 8f65f0f. Summary will update on new commits.}