jlaksana / UML2Code

UML diagram creator designed for intro CS students
https://uml2code.vercel.app
2 stars 0 forks source link

Share Menu and Options #51

Closed jlaksana closed 1 year ago

jlaksana commented 1 year ago

Description Diagrams should be shareable. There are two ways that I want to be able to share a diagram. The first is to be able to export the diagram as an image. This is the easier approach. The second is to add the idea of a public and private diagram. A public diagram has a view-only mode where someone can toggle their diagram to be public and share the link without needing a password. A private diagram can only be viewed/edited with a password. These options will be provided in the share menu.

Acceptance Criteria The share menu will have two options. The first is to export the diagram as an image. When clicking this button, the user will download an image of the current state of the diagram. The second option is a toggle switch to make the diagram public or private. If public, a URL that is copyable appears below for the user to be able to share. Will need to split routes between editor and viewer of a diagram. Editor should check for cookies if they are authenticated. Viewer will have stripped down view so that the user cannot make any changes to the diagram.

Side effect: the contents of a diagram only needs to verify cookie if the diagram is private. Other create/edit/delete endpoints should remain the same.

Additional Information export to png: https://reactflow.dev/docs/examples/misc/download-image/

jlaksana commented 1 year ago

Decided not to implement the download button because the button needs to be in the context of a reactflow component. This is not elegantly possible to put in the header menu.

jlaksana commented 1 year ago

https://github.com/jlaksana/UML2Code/commit/6254ccb8357a3b72afeabc80deb05b9e82aceacc