From 9f30dd0e7a57489aaaf9a77f3d571802a83758d4 Mon Sep 17 00:00:00 2001
From: heaprc <9023404+0xh3xa@users.noreply.github.com>
Date: Sat, 29 Mar 2025 04:40:29 +0100
Subject: [PATCH] fix invalid theme error

---
 src/web/waiters/OptionsWaiter.mjs | 21 ++++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/src/web/waiters/OptionsWaiter.mjs b/src/web/waiters/OptionsWaiter.mjs
index 4f4eda89..a5d04572 100644
--- a/src/web/waiters/OptionsWaiter.mjs
+++ b/src/web/waiters/OptionsWaiter.mjs
@@ -160,18 +160,33 @@ class OptionsWaiter {
 
         // Update theme selection
         const themeSelect = document.getElementById("theme");
-        themeSelect.selectedIndex = themeSelect.querySelector(`option[value="${theme}"`).index;
+        let themeOption = themeSelect.querySelector(`option[value="${theme}"]`);
+
+        if (!themeOption) {
+            const preferredColorScheme = this.getPreferredColorScheme();
+            document.querySelector(":root").className = preferredColorScheme;
+            themeOption = themeSelect.querySelector(`option[value="${preferredColorScheme}"]`);
+        }
+
+        themeSelect.selectedIndex = themeOption.index;
     }
 
     /**
      * Applies the user's preferred color scheme using the `prefers-color-scheme` media query.
      */
     applyPreferredColorScheme() {
-        const prefersDarkScheme = window.matchMedia("(prefers-color-scheme: dark)").matches;
-        const theme = prefersDarkScheme ? "dark" : "classic";
+        const theme = this.getPreferredColorScheme();
         this.changeTheme(theme);
     }
 
+    /**
+     * Get the user's preferred color scheme using the `prefers-color-scheme` media query.
+     */
+    getPreferredColorScheme() {
+        const prefersDarkScheme = window.matchMedia("(prefers-color-scheme: dark)").matches;
+        return prefersDarkScheme ? "dark" : "classic";
+    }
+
     /**
      * Changes the console logging level.
      *