From dcd64efea6999bd2bfc3014dc9872de1a12a81e4 Mon Sep 17 00:00:00 2001
From: DIYgod <i@diygod.me>
Date: Tue, 18 Jul 2023 16:33:16 +0100
Subject: [PATCH] fix: dark mode flush

---
 src/app/ColorSchemeInjector.tsx | 16 ++++++++--------
 src/hooks/useDarkMode.ts        |  4 +++-
 2 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/app/ColorSchemeInjector.tsx b/src/app/ColorSchemeInjector.tsx
index 1bd24dc7..b6850548 100644
--- a/src/app/ColorSchemeInjector.tsx
+++ b/src/app/ColorSchemeInjector.tsx
@@ -14,17 +14,17 @@ export const ColorSchemeInjector = () => {
       <script
         dangerouslySetInnerHTML={{
           __html: `(() => {
-var DARK_MODE_STORAGE_KEY = "${DARK_MODE_STORAGE_KEY}";
-var namespace = "xlog"
-var getStorage = () => {
-  const data = {}
+let DARK_MODE_STORAGE_KEY = "${DARK_MODE_STORAGE_KEY}";
+let namespace = "xlog"
+let getStorage = (key) => {
+  let data = {}
   try {
     data = JSON.parse(localStorage.getItem(namespace) || "{}")
   } catch (error) {}
-  return data
+  return data[key]
 }
-var COLOR_SCHEME_LIGHT = "${COLOR_SCHEME_LIGHT}";
-var COLOR_SCHEME_DARK = "${COLOR_SCHEME_DARK}";
+let COLOR_SCHEME_LIGHT = "${COLOR_SCHEME_LIGHT}";
+let COLOR_SCHEME_DARK = "${COLOR_SCHEME_DARK}";
 
 let data = {}
 const isDark = getStorage(DARK_MODE_STORAGE_KEY)
@@ -36,7 +36,7 @@ if (typeof isDark === "undefined") {
   document.documentElement.classList.add(currentColorScheme)
 } else {
   document.documentElement.classList.add(
-    isDark ? COLOR_SCHEME_DARK : COLOR_SCHEME_LIGHT,
+    isDark === "true" ? COLOR_SCHEME_DARK : COLOR_SCHEME_LIGHT,
   )
 }
 })();`,
diff --git a/src/hooks/useDarkMode.ts b/src/hooks/useDarkMode.ts
index 4541da84..83fc97ff 100644
--- a/src/hooks/useDarkMode.ts
+++ b/src/hooks/useDarkMode.ts
@@ -184,7 +184,9 @@ const mockElement = {
 
 export const useDarkMode = () => {
   const { toggle, value } = useDarkModeInternal(
-    getStorage(DARK_MODE_STORAGE_KEY),
+    getStorage(DARK_MODE_STORAGE_KEY) === undefined
+      ? undefined
+      : getStorage(DARK_MODE_STORAGE_KEY) === "true",
     {
       classNameDark: COLOR_SCHEME_DARK,
       classNameLight: COLOR_SCHEME_LIGHT,