Feature/117 er diagram

[spopida]

📑 Summary

Implementation of the ability to define entity relationship diagrams and render them using the mermaid API

Resolves #117 (ER Diagram)

📏 Design Decisions

This initial implementation only supports the definition of entities, relationships, and a 'role' which enables each relationship to be labelled. The basic syntax is as follows:

erDiagram
    ENTITY-1 !-!< ENTITY-2 : role
    ENTITY-1 ?-?< ENTITY-3 : role

Note that:

• The '<' is intended to resemble the crow's foot that gets rendered. Crows foot notation is easily the most popular in ER diagramming.
• The '!' indicates a mandatory relationship
• The '?' indicates an optional relationship
• The relationship part of the statement can be reversed, so A !-?< B : has is equivalent to B >?-! A : has

So the statement CUSTOMER !-!< OFFICE : has would be read as a customer has one or more offices and an office relates to one and only one customer. Other examples are:

Example	Meaning
A !-! B : has	A has exactly one B and B has exactly one A
A ?-? B : has	A might have one B and B might have one A
A !-?< B : has	A has zero or more Bs and B must have exactly one A ?

Another key decision I took was to use curved edges between nodes. This is not strictly necessary in the long run (I could make it configurable), but I took a lot of care to make sure the crows feet meet nodes 'neatly', even when the relationship edge is intersecting with the node at an angle. I think the curved 'toes' on the crows feet look good, and go well with curved lines. But it's true that most ER diagrams have straight lines with right-angled changes of direction so that the crows feet always strike an entity squarely. I'm not sure if I can achieve this with the layout engine, so for now I have used curved lines.

I have taken the approach of using ER diagramming as a modelling tool, rather than attempting to reverse-engineer an ER diagram from a physical relational DB schema. This, of course is also possible, but represents a different problem space, and I wanted to tackle the modelling domain.

I have explored the rest of the codebase at length and tried to follow the right approach, but pretty much all the technology involved is new to me, so I am totally receptive to any constructive suggestions to improve things - and grateful for the opportunity to contribute!

📋 Tasks

Make sure you

• 📖 have read the contribution guidelines
• 💻 have added unit/e2e tests (if appropriate)
• 🔖 targeted develop branch

[knsv]

This looks great! You managed to figure out how things are made in the project and made a solid effort. Much impressive!

[spopida]

Hey - thanks for merging. @dunning-kruger I will certainly look at the PlantUML syntax - it's a good call. Hopefully not too late to be experimenting with alternative / additional syntax. Would it be possible to open a new issue to request this pls?

Actually ignore that - I can open an issue myself !

[nickolay]

@spopida, thanks for implementing this! Were you planning to update the live editor as well as well or is this up to the rest of community?

[spopida]

@nickolay, happy to be involved. Sure, thanks for reminding me - yes I'll definitely have a go at the live editor as well - haven't looked at it yet, but it's on my list. I want to get PlantUML syntax working first, but then that's the next thing (unless anyone else beats me to it!)