chore: update user setting appearance (#654)

This commit is contained in:
boojack
2022-12-02 20:00:34 +08:00
committed by GitHub
parent 5451fd2d2c
commit 14f9f29348
17 changed files with 134 additions and 159 deletions

View File

@ -6,12 +6,12 @@ import { useAppSelector } from "./store";
import Loading from "./pages/Loading";
import router from "./router";
import * as storage from "./helpers/storage";
import useAppearance from "./hooks/useAppearance";
import { useColorScheme } from "@mui/joy";
function App() {
const { i18n } = useTranslation();
const { locale, systemStatus } = useAppSelector((state) => state.global);
useAppearance();
const { appearance, locale, systemStatus } = useAppSelector((state) => state.global);
const { setMode } = useColorScheme();
useEffect(() => {
locationService.updateStateWithLocation();
@ -42,6 +42,19 @@ function App() {
});
}, [locale]);
useEffect(() => {
const root = document.documentElement;
if (appearance === "light") {
root.classList.remove("dark");
} else if (appearance === "dark") {
root.classList.add("dark");
}
setMode(appearance);
storage.set({
appearance: appearance,
});
}, [appearance]);
return (
<Suspense fallback={<Loading />}>
<RouterProvider router={router} />