mirror/Plan
2
0
Fork 0
mirror of https://github.com/plan-player-analytics/Plan.git synced 2025-03-07 17:28:03 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fix theme not applying by default

Browse Source
This commit is contained in:
Aurora Lahtela 2023-04-16 19:54:10 +03:00
parent 10383da94a
commit 5f0ecb8bbe
1 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
Plan/react/dashboard/src/hooks/themeHook.js
View File

@ -1,4 +1,4 @@
import {createContext, useContext, useMemo, useState} from "react"; import {createContext, useContext, useEffect, useMemo, useState} from "react";
import {createNightModeCss, getColors} from "../util/colors"; import {createNightModeCss, getColors} from "../util/colors";
import {getLightModeChartTheming, getNightModeChartTheming} from "../util/graphColors"; import {getLightModeChartTheming, getNightModeChartTheming} from "../util/graphColors";
import {useMetadata} from "./metadataHook"; import {useMetadata} from "./metadataHook";
@ -16,7 +16,7 @@ const getDefaultTheme = (metadata) => {
|| defaultTheme === 'default' || defaultTheme === 'default'
|| defaultTheme === 'black' || defaultTheme === 'black'
|| defaultTheme === 'white' || defaultTheme === 'white'
|| !themeColors.map(color => color.name).includes(defaultTheme) || (defaultTheme !== 'night' && !themeColors.map(color => color.name).includes(defaultTheme));
return invalidColor ? 'plan' : defaultTheme; return invalidColor ? 'plan' : defaultTheme;
} }
@ -38,9 +38,15 @@ export const ThemeContextProvider = ({children}) => {
const metadata = useMetadata(); const metadata = useMetadata();
const [colorChooserOpen, setColorChooserOpen] = useState(false); const [colorChooserOpen, setColorChooserOpen] = useState(false);
const [selectedColor, setSelectedColor] = useState(getStoredTheme(getDefaultTheme(metadata))); const [selectedColor, setSelectedColor] = useState(getStoredTheme('plan'));
const [previousColor, setPreviousColor] = useState(undefined); const [previousColor, setPreviousColor] = useState(undefined);
useEffect(() => {
if (!metadata) return;
setSelectedColor(getStoredTheme(getDefaultTheme(metadata)));
}, [metadata, setSelectedColor]);
const sharedState = useMemo(() => { const sharedState = useMemo(() => {
return { return {
selectedColor, setSelectedColor, selectedColor, setSelectedColor,
@ -86,7 +92,9 @@ export const useTheme = () => {
const toggleNightMode = () => { const toggleNightMode = () => {
if (isNightModeEnabled()) { if (isNightModeEnabled()) {
setTheme(previousColor ? previousColor : getDefaultTheme(metadata)); const defaultTheme = getDefaultTheme(metadata);
const lightTheme = defaultTheme === 'night' ? 'plan' : defaultTheme;
setTheme(previousColor ? previousColor : lightTheme);
} else { } else {
setPreviousColor(selectedColor); setPreviousColor(selectedColor);
setTheme('night'); setTheme('night');