Highlighting a node is not rendering edges label on top

[jsjohann]

Describe the bug

When hovering a node to highlight it and its edges, the label of the node gets shifted to the front to ensure they're rendered on top of any edges. This is not the case for the labels of the edges when an edge is highlighted.

Thus it is possible that they're rendered underneath the path of the edge. This is especially a problem, if there are labels of different intersected edges rendered on top of each other. Then, the active edge label is not visible at all (see attached screenshot where the highlighted label is underneath the label of another edge).

Steps to Reproduce the Bug or Issue

1. Have a graph with intersecting edges
2. Set labelType={'all'} to the GraphCanvas and

   const {
       selections,
       actives,
       onCanvasClick,
       onNodePointerOver: onNodePointerOverSelection,
       onNodePointerOut: onNodePointerOutSelection,
   } = useSelection({
       ref: graphRef,
       nodes,
       edges,
       pathHoverType: 'all',
   });

3. Hover over a node to highlight its related edges/nodes.

Expected behavior

When hovering/selecting a node/edge, the corresponding labels of the edges should always be painted on top so ensure visibility like it's the case for the labels of the nodes.

Screenshots or Videos

Platform

• Reagraph Version: 4.15.26
• OS: macOS
• Browser: Chrome