fix first define color scheme
This commit is contained in:
parent
f760a9f745
commit
2ca9195fbf
17
src/App.tsx
17
src/App.tsx
@ -4,12 +4,11 @@ import { ModalsProvider } from '@mantine/modals';
|
||||
import { Notifications } from '@mantine/notifications';
|
||||
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
|
||||
import { getCookie, setCookie } from 'cookies-next';
|
||||
import { useState } from 'react';
|
||||
import { useEffect, useState } from 'react';
|
||||
import AppBody from './AppBody';
|
||||
import { FfprobeModal } from './shared/components/modal.windows/FfprobeModal';
|
||||
import { VaInfoModal } from './shared/components/modal.windows/VaInfoModal';
|
||||
import { useRealmAccessRoles } from './hooks/useRealmAccessRoles';
|
||||
import { useAdminRole } from './hooks/useAdminRole';
|
||||
import { isProduction } from './shared/env.const';
|
||||
|
||||
const queryClient = new QueryClient({
|
||||
defaultOptions: {
|
||||
@ -32,13 +31,23 @@ declare module '@mantine/modals' {
|
||||
|
||||
function App() {
|
||||
const systemColorScheme = useColorScheme()
|
||||
const [colorScheme, setColorScheme] = useState<ColorScheme>(getCookie('mantine-color-scheme') as ColorScheme || systemColorScheme)
|
||||
|
||||
const cookieColorScheme = getCookie('mantine-color-scheme') as ColorScheme | null
|
||||
|
||||
const selectedColorScheme = cookieColorScheme || systemColorScheme
|
||||
|
||||
const [colorScheme, setColorScheme] = useState<ColorScheme>(selectedColorScheme)
|
||||
const toggleColorScheme = (value?: ColorScheme) => {
|
||||
const nextColorScheme = value || (colorScheme === 'dark' ? 'light' : 'dark');
|
||||
setColorScheme(nextColorScheme)
|
||||
setCookie('mantine-color-scheme', nextColorScheme, { maxAge: 60 * 60 * 24 * 30 });
|
||||
}
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
setColorScheme(selectedColorScheme);
|
||||
}, [selectedColorScheme]);
|
||||
|
||||
return (
|
||||
<QueryClientProvider client={queryClient}>
|
||||
<div className="App">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user