check if isClient for other parts of component

SJSUCSClub · Oct 2, 2024 · a413b80 · a413b80
1 parent 19be82d
commit a413b80
Showing 1 changed file with 7 additions and 1 deletion.
diff --git a/components/molecules/client/color-mode-picker/component.tsx b/components/molecules/client/color-mode-picker/component.tsx
@@ -21,6 +21,9 @@ const ColorModePickerWithoutCookies: React.FC = () => {
     setTheme(localStorage.theme);
   }, []);
   React.useEffect(() => {
+    if (!isClient) {
+      return;
+    }
     if (theme) {
       localStorage.theme = theme;
     } else {
@@ -37,11 +40,14 @@ const ColorModePickerWithoutCookies: React.FC = () => {
       document.documentElement.classList.remove('dark');
       setCookie('theme', 'light', { path: '/' });
     }
-  }, [theme, setCookie]);
+  }, [theme, isClient, setCookie]);
   function handleChange(e: React.ChangeEvent<HTMLSelectElement>) {
     const theme = e.target.value;
     setTheme(theme);
   }
+  if (!isClient) {
+    return null;
+  }
   return (
     <Select defaultValue={theme ?? ''} onChange={handleChange}>
       <option value="">System</option>