add graph

gatsby-config.js

@@ -1,7 +1,7 @@
 module.exports = {
   siteMetadata: require("./metadata"),
   plugins: [
-    "gatsby-plugin-postcss",
+    'gatsby-plugin-postcss',
     'gatsby-plugin-preact',
     'gatsby-plugin-sitemap',
     { resolve: 'gatsby-plugin-robots-txt', options: { policy: [{userAgent: '*', allow: '/'}] } },
@@ -14,15 +14,12 @@ module.exports = {
       __key: "pages"
     },
     {
-      resolve: `gatsby-transformer-remark`,
+      resolve: 'gatsby-transformer-remark',
       options: {
         plugins: [
-          {
-            resolve: `gatsby-remark-prismjs`,
-            options: {
-              showLineNumbers: false,
-            }
-          }
+          'gatsby-remark-smartypants',
+          { resolve: 'gatsby-remark-mermaid', options: { theme: "dark", } },
+          { resolve: 'gatsby-remark-prismjs', options: { showLineNumbers: false, } },
         ]
       }
     },

package.json

@@ -26,7 +26,9 @@
     "gatsby-plugin-preact": "^6.21.0",
     "gatsby-plugin-robots-txt": "^1.7.1",
     "gatsby-plugin-sitemap": "^5.21.0",
+    "gatsby-remark-mermaid": "^2.1.0",
     "gatsby-remark-prismjs": "^6.21.0",
+    "gatsby-remark-smartypants": "^5.22.0",
     "gatsby-source-filesystem": "^4.22.0",
     "gatsby-transformer-remark": "^5.21.0",
     "postcss": "^8.4.16",

src/pages/docs/users/use-nginx.md

@@ -29,7 +29,28 @@ Here I'll cover the install on a managed seedbox using ultra.cc
 
 Here is a diagram I made to summarize how everything works:
 
-`// TODO`
+```mermaid
+flowchart TB
+
+subgraph P[P2P network]
+Alice((Alice)) <--> Trackers
+Bob((Bob)) <--> Trackers
+Paul((Paul)) <--> Trackers
+end
+
+Trackers --> Prowlarr
+
+subgraph S[Search for Movies, Tv series, Animes]
+Prowlarr <---> |Requests| Radarr
+Prowlarr <---> |Requests| Sonarr
+click Prowlarr callback "Prowlarr is used for stuff"
+end
+
+Sonarr --> |Send torrent| A(Radarr)
+Radarr[Radarr] --> |Send torrent| A(Radarr)
+A[Transmission] -->|Download to filesystem| C{Nginx}
+C -->|Stream| D(Cloudstream-3)
+```
 
 Prowlarr is between the tracker and the media mangment apps (radarr and sonarr): it handles the requests to the trackers (that you add inside prowlarr)