zapishis-client/apps/web/providers/theme-provider.tsx

36 lines
735 B
TypeScript

'use client';
import { ThemeProvider as NextThemesProvider } from 'next-themes';
import { type ComponentProps, useEffect, useState } from 'react';
/**
* mouted - fix for Next.js 15 Hydration Failed
*/
export function ThemeProvider({
children,
...props
}: Readonly<ComponentProps<typeof NextThemesProvider>>) {
const [mounted, setMounted] = useState(false);
useEffect(() => {
setMounted(true);
}, []);
if (!mounted) {
// eslint-disable-next-line react/jsx-no-useless-fragment
return <></>;
}
return (
<NextThemesProvider
{...props}
attribute="class"
defaultTheme="system"
disableTransitionOnChange
enableSystem
>
{children}
</NextThemesProvider>
);
}