35 lines
760 B
TypeScript
35 lines
760 B
TypeScript
import { ColorSchemeProvider, MantineProvider } from "@mantine/core";
|
|
import { useEffect } from "react";
|
|
|
|
import { usePreferenceState } from "./store/module/preference";
|
|
|
|
interface ThemeProviderProps {
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
export function ThemeProvider({ children }: ThemeProviderProps) {
|
|
const {
|
|
state: { colorScheme },
|
|
toggleColorScheme,
|
|
} = usePreferenceState();
|
|
|
|
useEffect(() => {
|
|
console.log(colorScheme);
|
|
}, []);
|
|
|
|
return (
|
|
<ColorSchemeProvider
|
|
colorScheme={colorScheme}
|
|
toggleColorScheme={toggleColorScheme}
|
|
>
|
|
<MantineProvider
|
|
theme={{ colorScheme }}
|
|
withGlobalStyles
|
|
withNormalizeCSS
|
|
>
|
|
{children}
|
|
</MantineProvider>
|
|
</ColorSchemeProvider>
|
|
);
|
|
}
|