From eec41123ef0d7042b84659b335800308a7876b5a Mon Sep 17 00:00:00 2001
From: nxtkofi <psliwa.b@gmail.com>
Date: Tue, 21 Apr 2026 20:52:52 +0200
Subject: [PATCH] refactor(theme): use useSyncExternalStore for theme hydration

Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent)

Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
---
 src/components/core/ThemeChanger.tsx | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/core/ThemeChanger.tsx b/src/components/core/ThemeChanger.tsx
index 629d133..7bc0daa 100644
--- a/src/components/core/ThemeChanger.tsx
+++ b/src/components/core/ThemeChanger.tsx
@@ -1,14 +1,14 @@
 "use client";
 import { useTheme } from "@wrksz/themes/client";
-import { useEffect, useState } from "react";
+import { useSyncExternalStore } from "react";
 
 export const ThemeChanger = () => {
   const { theme, setTheme } = useTheme();
-  const [mounted, setMounted] = useState(false);
-
-  useEffect(() => {
-    setMounted(true);
-  }, []);
+  const mounted = useSyncExternalStore(
+    () => () => undefined,
+    () => true,
+    () => false,
+  );
 
   if (!mounted) {
     return <p>Loading theme...</p>;