Skip to content

Conversation

paula-stacho
Copy link
Collaborator

@paula-stacho paula-stacho commented Oct 10, 2025

External Links

COMPASS-9611

Description

Adding a new type of edges. This type will be used when the sourceFieldIndex and targetFieldIndex are provided. The goal is to improve readability, especially when the diagram is exported as an image.
While the vertical position is fixed at the field position, the horizontal flips between left/right based on a simple heuristic:

  • when the edges are next to each other, the edge is connecting the sides facing each other
  • when the nodes are above each other (horizontal distance is less then half of the node width), the nodes are connected on the same side

I've been looking into how other tools solve this, for example draw.io flips the sides depending on the position diff, but it's always using opposite sides (doesn't apply the second part) - see screenshot. If you find a tool that has a better heuristic, let me know!

Leaving self-referencing field-to-field edges out for now, might be a follow up.

📸 Screenshots/Screencasts

Storybook

Screenshot 2025-10-10 at 16 01 19

Example from draw.io

Screenshot 2025-10-10 at 16 15 09

@paula-stacho paula-stacho marked this pull request as ready for review October 10, 2025 15:27
Copy link
Contributor

@gribnoysup gribnoysup left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good as far as I can tell, I didn't check the math too closely, the general logic looks good on the preview and tests seem to cover it 🙂

Comment on lines 147 to 158
expect(result).toEqual({
id: 'e1',
source: 'node1',
target: 'node2',
markerStart: 'start-many',
markerEnd: 'end-one',
type: 'fieldEdge',
data: {
sourceFieldIndex: 2,
targetFieldIndex: 4,
},
});
Copy link
Contributor

@gribnoysup gribnoysup Oct 15, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Super nit / just a style suggestion for the future: when writing tests like this and if possible I would highly recommend to explicitly test the values that you actually are expecting to be added / removed / modified instead of doing this sort of snapshot testing. The reason for this is that next time someone changes related code it will be really really hard to understand if the test failure happens intentionally or not, in most cases people will just opt in to just updating the snapshot negating any benefits of having the test in the first place (basically the usual troubles of having a snapshot test 🙂).

In this case for example, you can have two dedicated test cases clearly stating the intent:

  • Should preserve external edge values (and test what are those if you feel like this type of test will be helpful)
  • Should convert to fieldEdge if indices provided (and test the type value and actual new properties that are added)

@paula-stacho paula-stacho merged commit 6bb6553 into main Oct 15, 2025
5 checks passed
@paula-stacho paula-stacho deleted the COMPASS-9611 branch October 15, 2025 13:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants