From 0a33a843f8e4b27f36ed2af16e6e3b20e1857a7d Mon Sep 17 00:00:00 2001
From: xfy <i@rua.plus>
Date: Fri, 5 Jun 2026 17:07:23 +0800
Subject: [PATCH] fix(theme): resolve hydration mismatch in ThemeToggle by
 deferring icon render until mounted

---
 src/theme.rs | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/theme.rs b/src/theme.rs
index 6f488f7..e43a144 100644
--- a/src/theme.rs
+++ b/src/theme.rs
@@ -127,12 +127,17 @@ pub fn ThemePreload() -> Element {
 #[component]
 pub fn ThemeToggle() -> Element {
     let mut theme = use_theme();
+    let mut mounted = use_signal(|| false);
+
+    use_effect(move || {
+        mounted.set(true);
+    });
 
     rsx! {
         button {
             class: "theme-toggle p-2 rounded-full cursor-pointer hover:opacity-80 transition-opacity text-gray-600 dark:text-gray-300",
             onclick: move |_| theme.set(theme().toggle()),
-            if theme() == Theme::Dark {
+            if mounted() && theme() == Theme::Dark {
                 svg {
                     xmlns: "http://www.w3.org/2000/svg",
                     height: "24px",