From fd836ce70dbb80f769703a11d57c20533adc1ab5 Mon Sep 17 00:00:00 2001
From: Jason <farion1231@gmail.com>
Date: Sat, 28 Feb 2026 14:50:51 +0800
Subject: [PATCH] fix: let "follow system" theme auto-update by delegating to
 Tauri's native theme tracking

Pass "system" to set_window_theme instead of explicitly detecting dark/light,
so Tauri uses window.set_theme(None) and the WebView's prefers-color-scheme
media query stays in sync with the real OS theme.
---
 src/components/theme-provider.tsx | 24 ++++--------------------
 1 file changed, 4 insertions(+), 20 deletions(-)

diff --git a/src/components/theme-provider.tsx b/src/components/theme-provider.tsx
index 3a32f46ad..f730241e5 100644
--- a/src/components/theme-provider.tsx
+++ b/src/components/theme-provider.tsx
@@ -113,33 +113,17 @@ export function ThemeProvider({
       }
     };
 
-    // Determine current effective theme
+    // When "system", pass "system" so Tauri uses None (follows OS theme natively).
+    // This keeps the WebView's prefers-color-scheme in sync with the real OS theme,
+    // allowing effect #3's media query listener to fire on system theme changes.
     if (theme === "system") {
-      const isDark =
-        window.matchMedia &&
-        window.matchMedia("(prefers-color-scheme: dark)").matches;
-      updateNativeTheme(isDark ? "dark" : "light");
+      updateNativeTheme("system");
     } else {
       updateNativeTheme(theme);
     }
 
-    // Listen to system theme changes for native window when in "system" mode
-    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-    const handleChange = () => {
-      if (theme === "system" && !isCancelled) {
-        updateNativeTheme(mediaQuery.matches ? "dark" : "light");
-      }
-    };
-
-    if (theme === "system") {
-      mediaQuery.addEventListener("change", handleChange);
-    }
-
     return () => {
       isCancelled = true;
-      if (theme === "system") {
-        mediaQuery.removeEventListener("change", handleChange);
-      }
     };
   }, [theme]);