fix hydration warning

This commit is contained in:
yohlo
2025-08-25 19:36:47 -05:00
parent ce63c02d8e
commit 4faa853c4c

View File

@@ -1,6 +1,7 @@
import { useAuth } from "@/contexts/auth-context";
import { createTheme, MantineProvider as MantineProviderCore } from "@mantine/core";
import ColorSchemeProvider from "./color-scheme-provider";
import { useState, useEffect } from "react";
const commonInputStyles = {
label: {
@@ -45,10 +46,18 @@ const theme = createTheme({
const MantineProvider = ({ children }: { children: React.ReactNode }) => {
const { metadata } = useAuth()
const [isHydrated, setIsHydrated] = useState(false)
useEffect(() => {
setIsHydrated(true)
}, [])
const colorScheme = isHydrated ? (metadata.colorScheme || 'auto') : 'auto'
const primaryColor = isHydrated ? (metadata.accentColor || 'blue') : 'blue'
return <MantineProviderCore
defaultColorScheme={metadata.colorScheme || 'auto'}
theme={{ ...theme, primaryColor: metadata.accentColor || 'blue' }}
defaultColorScheme={colorScheme}
theme={{ ...theme, primaryColor }}
>
<ColorSchemeProvider>
{children}