acquia / drupal-spec-tool

A tool for specifying Drupal architecture details and generating automated tests for them.
GNU General Public License v2.0
149 stars 36 forks source link

How do you use the "Diagrams" feature? #69

Closed monaw closed 1 year ago

monaw commented 1 year ago

In the currently v5.0.0 version of the sheet, the Diagrams sheet's cells B5 & B6 references the Queries sheet which doesn't exist!

Screenshot ![Screen Shot 2023-01-03 at 4 41 13 PM](https://user-images.githubusercontent.com/18472048/210464285-1e193a1a-1e63-4418-8046-611e66e0b384.png)

Or have I misunderstood the "Queries" reference?

More instructions on how to use the Diagrams sheet's data in PlantUML is appreciated (:

TravisCarden commented 1 year ago

Thanks for providing the helpful screenshot, @monaw. There is actually a "Queries" sheet. It's just hidden because it's "under the hood" stuff that isn't meant to be seen or edited by users.

As to generating the diagrams, copy the calculated value--not the underlying formula value!--of the cell in question, i.e., "Entity relationship diagram (ERD)" or "Workflow diagram". In other words, select the cell but don't click into it to see the raw formula as depicted in your screenshot. For example, the default value In v5.0.0 that you would want to copy is this:

@startuml
title  Entity Relationship Diagram
left to right direction
skinparam class {
  BackgroundColor White
  BackgroundColor<<Custom block type>> LightSalmon
  BorderColor<<Custom block type>> Brown
  BackgroundColor<<Content type>> LightBlue
  BorderColor<<Content type>> DarkBlue
  BackgroundColor<<Custom entity type>> PaleGoldenRod
  BorderColor<<Custom entity type>> Chocolate
  BackgroundColor<<Media type>> LightPink
  BorderColor<<Media bundle>> DeepPink
  BackgroundColor<<Paragraph type>> Plum
  BorderColor<<Paragraph type>> Indigo
  BackgroundColor<<Vocabulary>> DarkSeaGreen
  BorderColor<<Vocabulary>> DarkGreen
}
hide class circle
hide empty members
hide empty methods
hide members
class "Article Type" as article_type_vocabulary <<Vocabulary>>
class "Article" as article_content_type <<Content type>>
class "Categories" as categories_vocabulary <<Vocabulary>>
class "Document" as document_media_type <<Media type>>
class "Event Type" as event_type_vocabulary <<Vocabulary>>
class "Event" as event_content_type <<Content type>>
class "Image" as image_media_type <<Media type>>
class "Page" as page_content_type <<Content type>>
class "Person Type" as person_type_vocabulary <<Vocabulary>>
class "Person" as person_content_type <<Content type>>
class "Place Type" as place_type_vocabulary <<Vocabulary>>
class "Place" as place_content_type <<Content type>>
class "Tags" as tags_vocabulary <<Vocabulary>>
class "Video" as video_media_type <<Media type>>
article_content_type --> article_type_vocabulary
article_content_type --> categories_vocabulary
article_content_type --> image_media_type
article_content_type --> person_content_type
article_content_type --> tags_vocabulary
document_media_type --> categories_vocabulary
document_media_type --> tags_vocabulary
event_content_type --> categories_vocabulary
event_content_type --> event_type_vocabulary
event_content_type --> image_media_type
event_content_type --> place_content_type
event_content_type --> tags_vocabulary
image_media_type --> categories_vocabulary
image_media_type --> tags_vocabulary
page_content_type --> categories_vocabulary
page_content_type --> image_media_type
page_content_type --> tags_vocabulary
person_content_type --> categories_vocabulary
person_content_type --> image_media_type
person_content_type --> person_type_vocabulary
person_content_type --> place_content_type
person_content_type --> tags_vocabulary
place_content_type --> categories_vocabulary
place_content_type --> image_media_type
place_content_type --> place_type_vocabulary
place_content_type --> tags_vocabulary
video_media_type --> categories_vocabulary
video_media_type --> tags_vocabulary
@enduml

That's PlantUML code. Copy that and go to the PlantUML online editor at https://plantuml-editor.kkeisuke.com/, paste it there, and hit Ctrl-Enter or Cmd-Enter to generate the image. (Sometimes it's a little slow.) In this example, the result is this:

erd-uml-v5 0 0

The same process goes for the workflow diagram:

@startuml
title  Workflow Diagram
participant "Draft"
participant "In review"
participant "Published"
participant "Archived"
"Draft" --> "Draft": Create New Draft
"In review" --> "Draft": Create New Draft
"Published" --> "Draft": Create New Draft
"Archived" --> "Draft": Create New Draft
"Draft" --> "In review": Send to review
"In review" --> "In review": Send to review
"Draft" --> "Published": Publish
"In review" --> "Published": Publish
"Published" --> "Published": Publish
"Published" --> "Archived": Archive
"Archived" --> "Published": Restore from archive
@enduml

workflow-uml-v5 0 0

Hopefully the diagrams are self-explanatory. Clearly we need to expand our documentation of the feature. (If you're interested in contributing in that area, I can provide direction.)

Does that answer all your questions on this issue?

monaw commented 1 year ago

ah thanks @TravisCarden ! i got our diagrams (: i think your instruction above would be helpful to add to the Readme and yes let me know how i can help with the documentation (:

TravisCarden commented 1 year ago

Great, @monaw! You're welcome. 🙂 As far as helping with the documentation, I would encourage you to continue to file issues for anything that blocks or just confuses you--even if you eventually figure it out on your own. Pull requests and specific suggestions are welcome. I look forward to seeing you around. 😉