forked from github/plane
70 lines
2.0 KiB
TypeScript
70 lines
2.0 KiB
TypeScript
// mobx
|
|
import { action, observable, makeObservable } from "mobx";
|
|
// helper
|
|
import { applyTheme, unsetCustomCssVariables } from "helpers/theme.helper";
|
|
// interfaces
|
|
import { ICurrentUserSettings } from "types";
|
|
|
|
class ThemeStore {
|
|
sidebarCollapsed: boolean | null = null;
|
|
theme: string | null = null;
|
|
// root store
|
|
rootStore;
|
|
|
|
constructor(_rootStore: any | null = null) {
|
|
makeObservable(this, {
|
|
// observable
|
|
sidebarCollapsed: observable,
|
|
theme: observable,
|
|
// action
|
|
setSidebarCollapsed: action,
|
|
setTheme: action,
|
|
// computed
|
|
});
|
|
|
|
this.rootStore = _rootStore;
|
|
this.initialLoad();
|
|
}
|
|
|
|
setSidebarCollapsed(collapsed: boolean | null = null) {
|
|
if (collapsed === null) {
|
|
let _sidebarCollapsed: string | boolean | null =
|
|
localStorage.getItem("app_sidebar_collapsed");
|
|
_sidebarCollapsed = _sidebarCollapsed ? (_sidebarCollapsed === "true" ? true : false) : false;
|
|
this.sidebarCollapsed = _sidebarCollapsed;
|
|
} else {
|
|
this.sidebarCollapsed = collapsed;
|
|
localStorage.setItem("app_sidebar_collapsed", collapsed.toString());
|
|
}
|
|
}
|
|
|
|
setTheme = async (_theme: { theme: ICurrentUserSettings }) => {
|
|
try {
|
|
const currentTheme: string = _theme.theme.theme.toString();
|
|
|
|
// updating the local storage theme value
|
|
localStorage.setItem("theme", currentTheme);
|
|
// updating the mobx theme value
|
|
this.theme = currentTheme;
|
|
|
|
// applying the theme to platform if the selected theme is custom
|
|
if (currentTheme === "custom") {
|
|
const themeSettings = this.rootStore.user.currentUserSettings || null;
|
|
applyTheme(
|
|
themeSettings?.theme?.palette !== ",,,,"
|
|
? themeSettings?.theme?.palette
|
|
: "#0d101b,#c5c5c5,#3f76ff,#0d101b,#c5c5c5",
|
|
themeSettings?.theme?.darkPalette
|
|
);
|
|
} else unsetCustomCssVariables();
|
|
} catch (error) {
|
|
console.error("setting user theme error", error);
|
|
}
|
|
};
|
|
|
|
// init load
|
|
initialLoad() {}
|
|
}
|
|
|
|
export default ThemeStore;
|