Refactor ordering of constructing theme

This commit is contained in:
Reckless_Satoshi 2022-11-06 09:44:06 -08:00
parent 8108c4146b
commit eb923b4e6f
No known key found for this signature in database
GPG Key ID: 9C4585B561315571

View File

@ -12,36 +12,26 @@ import i18n from './i18n/Web';
import { systemClient } from './services/System'; import { systemClient } from './services/System';
import { Settings } from './models'; import { Settings } from './models';
const defaultTheme: Theme = createTheme({ const makeTheme = function (settings: Settings) {
palette: { const theme: Theme = createTheme({
mode: new Settings().mode, palette: {
background: { mode: settings.mode,
default: new Settings().mode === 'dark' ? '#070707' : '#fff', background: {
default: settings.mode === 'dark' ? '#070707' : '#fff',
},
}, },
}, typography: { fontSize: settings.fontSize },
typography: { fontSize: new Settings().fontSize }, });
});
return theme;
};
const App = (): JSX.Element => { const App = (): JSX.Element => {
const [theme, setTheme] = useState<Theme>(defaultTheme); const [theme, setTheme] = useState<Theme>(makeTheme(new Settings()));
const [settings, setSettings] = useState<Settings>(new Settings()); const [settings, setSettings] = useState<Settings>(new Settings());
const updateTheme = function () {
setTheme(
createTheme({
palette: {
mode: settings.mode,
background: {
default: settings.mode === 'dark' ? '#070707' : '#fff',
},
},
typography: { fontSize: settings.fontSize },
}),
);
};
useEffect(() => { useEffect(() => {
updateTheme(); setTheme(makeTheme(settings));
}, [settings.fontSize, settings.mode]); }, [settings.fontSize, settings.mode]);
useEffect(() => { useEffect(() => {