diff --git a/docs/.vitepress/config.mjs b/docs/.vitepress/config.mjs index e7b1d89..1f9a60b 100644 --- a/docs/.vitepress/config.mjs +++ b/docs/.vitepress/config.mjs @@ -60,7 +60,7 @@ function getGuidesSidebar () { { text: 'Deploy your app', link: '/guides/development/deploy' }, { text: 'Publish your app', link: '/guides/development/publish' }, { text: 'Document your app', link: '/guides/development/documentation' }, - { text: 'Use our cli', link: '/guides/development/kli' }, + { text: 'Use our CLI', link: '/guides/development/kli' }, { text: 'Tips & troubleshooting', link: '/guides/development/tips' } ] }, diff --git a/docs/.vitepress/public/hooks-diagram-template.mmd b/docs/.vitepress/public/hooks-diagram-template.mmd new file mode 100644 index 0000000..96fbc4f --- /dev/null +++ b/docs/.vitepress/public/hooks-diagram-template.mmd @@ -0,0 +1,42 @@ +graph TB + beforeAll{before all} + bahook(ba-hook) --> beforeAll + + afterAll{after all} + afterAll --> aahook(aa-hook) + + beforeAll --> bfhook(bf-hook) + bfhook -->|before| FIND[FIND] + FIND -->|after| afhook(af-hook) + afhook --> afterAll + + beforeAll --> bghook(bg-hook) + bghook -->|before| GET[GET] + GET -->|after| aghook(ag-hook) + aghook --> afterAll + + beforeAll --> bchook(bc-hook) + bchook -->|before| CREATE[CREATE] + CREATE -->|after| achook(ac-hook) + achook --> afterAll + + beforeAll --> buhook(bu-hook) + buhook -->|before| UPDATE[UPDATE] + UPDATE -->|after| auhook(au-hook) + auhook --> afterAll + + beforeAll --> bphook(bp-hook) + bphook -->|before| PATCH[PATCH] + PATCH -->|after| aphook(ap-hook) + aphook --> afterAll + + beforeAll --> brhook(br-hook) + brhook -->|before| REMOVE[REMOVE] + REMOVE -->|after| arhook(ar-hook) + arhook --> afterAll + + linkStyle default stroke-width:2px,fill:none,stroke:black + classDef hookClass fill:#f96,stroke:#333,stroke-width:2px + class bahook,aahook,bfhook,afhook,bghook,aghook,bchook,achook,buhook,auhook,bphook,aphook,brhook,arhook hookClass + classDef operationClass fill:#9c6,stroke:#333,stroke-width:2px + class FIND,GET,CREATE,UPDATE,PATCH,REMOVE operationClass \ No newline at end of file diff --git a/docs/.vitepress/public/images/hooks-diagram-template.png b/docs/.vitepress/public/images/hooks-diagram-template.png new file mode 100644 index 0000000..77d8690 Binary files /dev/null and b/docs/.vitepress/public/images/hooks-diagram-template.png differ diff --git a/docs/guides/development/documentation.md b/docs/guides/development/documentation.md index 1d348d3..d53d17d 100644 --- a/docs/guides/development/documentation.md +++ b/docs/guides/development/documentation.md @@ -69,7 +69,7 @@ Have a look at our workflow for an example. ## Working with diagrams We use two distinct tools to work with diagrams: -* [draw.io](http://draw.io)] a complete editor to create well known diagrams +* [draw.io](http://draw.io) a complete editor to create well known diagrams * [mermaid](https://github.com/knsv/mermaid) which allows you to generate diagrams from a simple text definition. We mainly use mermaid to create the hooks diagrams. To be able to include the diagrams within the documentation, we adopted the following methodology: @@ -83,9 +83,13 @@ To be able to include the diagrams within the documentation, we adopted the foll ### mermaid 1. install the [mermaid CLI](https://github.com/mermaidjs/mermaid.cli) -2. start from the [hooks diagram template file](./hooks-diagram-template.mmd) +2. start from the hooks diagram template file +::: details .github/workflows/main.yaml + +<<< @/.vitepress/public/hooks-diagram-template.mmd +::: 3. output the SVG/PNG file in the root **assets** folder using `mmdc -i ./my-hooks-diagram.mmd -t neutral -b transparent -o my-hooks-diagram.svg` 4. reference it in the documentation using a link like this `![My legend](https://raw.githubusercontent.com/kalisio/kdk/master/images/my-diagram.png)` The template looks like this: -![Hooks Diagram Template](../.vitepress/public/images/hooks-diagram-template.png) \ No newline at end of file +![Hooks Diagram Template](../../.vitepress/public/images/hooks-diagram-template.png) \ No newline at end of file