feat: movee landing providers

2025-05-27 02:12:16 +07:00
parent f05fd5331d
commit 6819c24c6a
5 changed files with 27 additions and 14 deletions
@@ -6,7 +6,7 @@ import Image from 'next/image';
 import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
-import { SimpleThemeToggle } from './simple-theme-toggle';
+import { ThemeToggle } from './theme-toggle';

 export function Header() {
  const router = useRouter();
@@ -82,7 +82,7 @@ export function Header() {
        </nav>

        <div className="flex items-center gap-x-2">
-          <SimpleThemeToggle />
+          <ThemeToggle />

          <Button
            className="group relative w-full sm:w-auto bg-gradient-to-r from-primary to-blue-600 hover:from-primary/90 hover:to-blue-600/90 transition-all duration-300 font-bold text-white hover:text-white/90 shadow-lg cursor-pointer"
@@ -1,8 +0,0 @@
-'use client';
-
-import type { ThemeProviderProps } from 'next-themes';
-import { ThemeProvider as NextThemesProvider } from 'next-themes';
-
-export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
-  return <NextThemesProvider {...props}>{children}</NextThemesProvider>;
-}
@@ -4,7 +4,7 @@ import { Button, MoonIcon, SunIcon } from '@components';
 import { useTheme } from 'next-themes';
 import { useEffect, useState } from 'react';

-export function SimpleThemeToggle() {
+export function ThemeToggle() {
  const { theme, setTheme } = useTheme();
  const [mounted, setMounted] = useState(false);

@@ -0,0 +1,21 @@
+'use client';
+
+import type { ThemeProviderProps } from 'next-themes';
+import { ThemeProvider as NextThemesProvider } from 'next-themes';
+
+export function Providers({ children }: ThemeProviderProps) {
+  return (
+    <ThemeProvider
+      attribute="class"
+      defaultTheme="system"
+      enableSystem
+      disableTransitionOnChange
+    >
+      {children}
+    </ThemeProvider>
+  );
+}
+
+function ThemeProvider({ children, ...props }: ThemeProviderProps) {
+  return <NextThemesProvider {...props}>{children}</NextThemesProvider>;
+}
@@ -1,7 +1,7 @@
 import '@/styles/globals.css';
 import { type Metadata } from 'next';
 import { Inter } from 'next/font/google';
-import { ThemeProvider } from './(public)/_components/theme-provider';
+import { Providers } from './_components/providers';

 const inter = Inter({ subsets: ['latin'] });

@@ -18,14 +18,14 @@ export default function RootLayout({
  return (
    <html lang="id" suppressHydrationWarning>
      <body className={inter.className}>
-        <ThemeProvider
+        <Providers
          attribute="class"
          defaultTheme="system"
          enableSystem
          disableTransitionOnChange
        >
          {children}
-        </ThemeProvider>
+        </Providers>
      </body>
    </html>
  );