olly/queueful
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

work on light theme

Browse Source
This commit is contained in:
Olly Hearn
2024-04-16 00:42:40 +03:00
parent 3033d1f34b
commit ed0ecf9f51
6 changed files with 96 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
frontend/app/src/config/store.ts
View File

@ -23,10 +23,12 @@ const initialAuthDataState: AuthDataType = {
export type SettingsType = {
language: string | undefined;
theme: string | undefined;
};
const initialSettingsState: SettingsType = {
language: undefined,
theme: undefined,
};
export type StorePrototype = {
@ -44,6 +46,8 @@ export const logOut = createAction("auth/logOut");
export const setLanguage = createAction<string>("settings/setLanguage");
export const loadLanguage = createAction("settings/loadLanguage");
export const setTheme = createAction<string>("settings/setTheme");
export const loadTheme = createAction("settings/loadTheme");
export const store = configureStore({
reducer: {
@ -94,6 +98,19 @@ export const store = configureStore({
state.language = "en";
}
});
builder.addCase(setTheme, (state, action) => {
state.theme = action.payload || "dark";
localStorage.setItem("theme", action.payload || "dark");
});
builder.addCase(loadTheme, (state) => {
const theme: string | null = localStorage.getItem("theme");
if (theme) {
state.theme = theme;
} else {
const darkThemeMq = window.matchMedia("(prefers-color-scheme: dark)");
state.theme = darkThemeMq.matches ? "dark" : "light";
}
});
}),
},
// Adding the api middleware enables caching, invalidation, polling,