From 925cb4aadee2e6f2ae35a867bd878656531f4975 Mon Sep 17 00:00:00 2001 From: docaohieu2808 Date: Wed, 2 Sep 2026 20:05:18 +0700 Subject: [PATCH] fix(ui): apply persisted theme before first paint to avoid flash on reload Theme was applied from the client store in useEffect (after hydration), so a reload painted the default light theme for a frame before the stored dark theme was reapplied. Add a blocking head script that reads the persisted zustand theme key and sets the dark class on documentElement before first paint, mirroring applyTheme() including system -> prefers-color-scheme resolution. --- src/app/layout.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/app/layout.js b/src/app/layout.js index 8e9b7609..a6534188 100644 --- a/src/app/layout.js +++ b/src/app/layout.js @@ -32,6 +32,14 @@ export default function RootLayout({ children }) { return ( + {/* Apply persisted theme before first paint so a reload does not flash the + default (light) theme before the client store hydrates. Mirrors the + zustand-persist "theme" key and the `dark` class applyTheme() sets. */} +