hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Change lens theme regarding to native theme

Browse Source 
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2022-03-05 11:33:52 +03:00
parent beba2c0068
commit 7452ebdb60
2 changed files with 35 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/main/initializers/init-ipc-main-handlers/init-ipc-main-handlers.ts
View File

@ -3,7 +3,7 @@
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
import { BrowserWindow, IpcMainInvokeEvent, Menu, nativeTheme } from "electron";
import { BrowserWindow, IpcMainInvokeEvent, Menu } from "electron";
import { clusterFrameMap } from "../../../common/cluster-frames";
import { clusterActivateHandler, clusterSetFrameIdHandler, clusterVisibilityHandler, clusterRefreshHandler, clusterDisconnectHandler, clusterKubectlApplyAllHandler, clusterKubectlDeleteAllHandler, clusterDeleteHandler, clusterSetDeletingHandler, clusterClearDeletingHandler } from "../../../common/ipc/cluster";
import type { ClusterId } from "../../../common/cluster-types";

37
src/renderer/theme.store.ts
View File

@ -13,6 +13,8 @@ import type { SelectOption } from "./components/select";
import type { MonacoEditorProps } from "./components/monaco-editor";
import { defaultTheme } from "../common/vars";
import { camelCase } from "lodash";
import { ipcRenderer } from "electron";
import { getNativeThemeChannel, setNativeThemeChannel } from "../common/ipc/native-theme";
export type ThemeId = string;
@ -34,6 +36,8 @@ export class ThemeStore extends Singleton {
"lens-light": lensLightThemeJson as Theme,
});
private osNativeTheme: "dark" | "light" | undefined;
@computed get activeThemeId(): ThemeId {
return UserStore.getInstance().colorTheme;
}
@ -43,7 +47,7 @@ export class ThemeStore extends Singleton {
}
@computed get activeTheme(): Theme {
return this.themes.get(this.activeThemeId) ?? this.themes.get(defaultTheme);
return this.systemTheme ?? this.themes.get(this.activeThemeId) ?? this.themes.get(defaultTheme);
}
@computed get terminalColors(): [string, string][] {
@ -66,10 +70,22 @@ export class ThemeStore extends Singleton {
}
@computed get themeOptions(): SelectOption<string>[] {
return Array.from(this.themes).map(([themeId, theme]) => ({
const options = Array.from(this.themes).map(([themeId, theme]) => ({
label: theme.name,
value: themeId,
}));
options.unshift({ label: "System", value: "system" });
return options;
}
@computed get systemTheme() {
if (this.activeThemeId == "system" && this.osNativeTheme) {
return this.themes.get(`lens-${this.osNativeTheme}`);
}
return null;
}
constructor() {
@ -77,6 +93,8 @@ export class ThemeStore extends Singleton {
makeObservable(this);
autoBind(this);
this.setNativeTheme();
this.bindNativeThemeUpdateEvent();
// auto-apply active theme
reaction(() => ({
@ -95,8 +113,21 @@ export class ThemeStore extends Singleton {
});
}
bindNativeThemeUpdateEvent() {
ipcRenderer.on(setNativeThemeChannel, (event, theme: "dark" | "light") => {
this.osNativeTheme = theme;
this.applyTheme(theme);
});
}
async setNativeTheme() {
const theme: "dark" | "light" = await ipcRenderer.invoke(getNativeThemeChannel);
this.osNativeTheme = theme;
}
getThemeById(themeId: ThemeId): Theme {
return this.themes.get(themeId);
return this.systemTheme ?? this.themes.get(themeId);
}
protected applyTheme(themeId: ThemeId) {