Update

developerplus2025 · Jul 26, 2024 · fa84acc · fa84acc
1 parent cfa5ad0
commit fa84acc
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 5 deletions.
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -26,7 +26,7 @@ export default function RootLayout({
       >
         <head />
         <body className="relative">
-          <ThemeProvider enableSystem attribute="class" defaultTheme="system">
+          <ThemeProvider enableSystem attribute="class" defaultTheme="dark">
             <Navigation />
             {children}
           </ThemeProvider>

diff --git a/src/components/mode-toggle.tsx b/src/components/mode-toggle.tsx
@@ -7,17 +7,18 @@ import { useTheme } from "next-themes";
 const ModeToggle = () => {
   const { setTheme, theme } = useTheme();
   const check_theme = theme === "dark" ? <Moon /> : <Sun />;
-  const [icontoggle, setIcon] = useState(check_theme);
+  const [icontoggle, setIcon] = useState(theme === "dark" ? <Moon /> : <Sun />);
 
   // eslint-disable-next-line react-hooks/exhaustive-deps
   const updateIcon = () => {
-    const check_theme = theme === "dark" ? <Moon /> : <Sun />;
+    setIcon(theme === "dark" ? <Moon /> : <Sun />);
   };
 
   const toggleTheme = () => {
     const isDarkMode = document.documentElement.classList.contains("dark");
+    updateIcon();
     setTheme(isDarkMode ? "light" : "dark");
-    updateIcon(); // Update icon when theme is toggled
+    // Update icon when theme is toggled
   };
 
   useEffect(() => {
@@ -45,7 +46,7 @@ const ModeToggle = () => {
       aria-label="Toggle Theme"
       className="cursor-pointer"
     >
-      {theme === "dark" ? <Moon /> : <Sun />}
+      {icontoggle}
     </div>
   );
 };