From f97b7a1bfa220a0947f2cd63c23f4faa9fcd42e7 Mon Sep 17 00:00:00 2001 From: blackhao <13851610112@163.com> Date: Mon, 8 Dec 2025 15:07:12 -0600 Subject: merge logic --- frontend/src/components/edges/MergedEdge.tsx | 77 ++++++++++++++++++++++++++++ 1 file changed, 77 insertions(+) create mode 100644 frontend/src/components/edges/MergedEdge.tsx (limited to 'frontend/src/components/edges/MergedEdge.tsx') diff --git a/frontend/src/components/edges/MergedEdge.tsx b/frontend/src/components/edges/MergedEdge.tsx new file mode 100644 index 0000000..06c2bf8 --- /dev/null +++ b/frontend/src/components/edges/MergedEdge.tsx @@ -0,0 +1,77 @@ +import { BaseEdge, getBezierPath } from 'reactflow'; +import type { EdgeProps } from 'reactflow'; + +interface MergedEdgeData { + gradient?: string; + isMerged?: boolean; + colors?: string[]; +} + +const MergedEdge = ({ + id, + sourceX, + sourceY, + targetX, + targetY, + sourcePosition, + targetPosition, + style = {}, + data, + markerEnd, +}: EdgeProps) => { + const [edgePath] = getBezierPath({ + sourceX, + sourceY, + sourcePosition, + targetX, + targetY, + targetPosition, + }); + + // If this is a merged trace, create a gradient + const isMerged = data?.isMerged; + const colors = data?.colors || []; + + if (isMerged && colors.length >= 2) { + const gradientId = `gradient-${id}`; + + return ( + <> + + + {colors.map((color, idx) => ( + + ))} + + + + + ); + } + + // Regular edge + return ( + + ); +}; + +export default MergedEdge; + -- cgit v1.2.3