From d3a77ece194ed1ec0c5696f503a83d595b9116cc Mon Sep 17 00:00:00 2001
From: Jannis Baum <jannis.baum@gmail.com>
Date: Mon, 26 Aug 2024 11:37:13 -0500
Subject: [PATCH] feat(#132): pseudo-dynamically update mermaid theme

---
 src/routes/viewer.ts | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/src/routes/viewer.ts b/src/routes/viewer.ts
index 70e026d..2c4f8df 100644
--- a/src/routes/viewer.ts
+++ b/src/routes/viewer.ts
@@ -92,6 +92,15 @@ router.get(/.*/, async (req: Request, res: Response) => {
                 import mermaid from '/static/mermaid/mermaid.esm.min.mjs';
                 const darkModePreference = window.matchMedia("(prefers-color-scheme: dark)");
                 mermaid.initialize({ startOnLoad: true, theme: darkModePreference.matches ? 'dark' : 'default' })
+
+                function updateTheme() {
+                    if (document.getElementsByClassName('mermaid').length > 0) {
+                        window.location.reload()
+                    }
+                }
+                darkModePreference.addEventListener("change", () => updateTheme());
+                // deprecated method for backward compatibility
+                darkModePreference.addEventListener(() => updateTheme());
             </script>
             <script type="text/javascript" src="/static/client.js"></script>
         </html>