Restructure to monorepo (#6907)

* wip: restructure to monorepo Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * refactor create-release-pr to a package Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * build fixes Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * github workflow fixes Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * fix typo Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * add webpack-env types to core Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * fix github workflows Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * refactor/fix integration tests Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * lint fix Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * yarn run dev Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * eslint settings for vscode Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * move templates to right package Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * open-lens build fixes Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * integration test fix Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * fix nx task dependencies Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * use bash shell for unit tests in test workflow Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * fix test:unit for windows Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * fix win-ca webpack error in open-lens Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * fix win-ca webpack error in open-lens Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * fix build:app on windows Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * remove ELECTRON_BUILDER_EXTRA_ARGS Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * sync src/ from master Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> * remove Makefile from core Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com> Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>
2025-05-20 05:10:56 +00:00 · 2023-01-24 10:46:26 -08:00
1 parent 0066ca4ea2
commit 2657df2293
@@ -0,0 +1,23 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import type { IComputedValue } from "mobx";
+import { computed } from "mobx";
+import activeThemeInjectable from "./active.injectable";
+import type { LensThemeType } from "./lens-theme";
+
+export type ActiveThemeType = IComputedValue<LensThemeType>;
+
+const activeThemeTypeInjectable = getInjectable({
+  id: "active-theme-type",
+
+  instantiate: (di) => {
+    const activeTheme = di.inject(activeThemeInjectable);
+
+    return computed(() => activeTheme.get().type);
+  },
+});
+
+export default activeThemeTypeInjectable;
@@ -0,0 +1,40 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import assert from "assert";
+import { computed } from "mobx";
+import lensColorThemePreferenceInjectable from "../../common/user-store/lens-color-theme.injectable";
+import { lensThemeDeclarationInjectionToken } from "./declaration";
+import defaultLensThemeInjectable from "./default-theme.injectable";
+import systemThemeConfigurationInjectable from "./system-theme.injectable";
+import lensThemesInjectable from "./themes.injectable";
+
+const activeThemeInjectable = getInjectable({
+  id: "active-theme",
+  instantiate: (di) => {
+    const lensThemes = di.inject(lensThemesInjectable);
+    const themeDecls = di.injectMany(lensThemeDeclarationInjectionToken);
+    const lensColorThemePreference = di.inject(lensColorThemePreferenceInjectable);
+    const systemThemeConfiguration = di.inject(systemThemeConfigurationInjectable);
+    const defaultLensTheme = di.inject(defaultLensThemeInjectable);
+
+    return computed(() => {
+      const pref = lensColorThemePreference.get();
+
+      if (pref.useSystemTheme) {
+        const systemThemeType = systemThemeConfiguration.get();
+        const matchingTheme = themeDecls.find(theme => theme.type === systemThemeType);
+
+        assert(matchingTheme, `Missing theme declaration for system theme "${systemThemeType}"`);
+
+        return matchingTheme;
+      }
+
+      return lensThemes.get(pref.lensThemeId) ?? defaultLensTheme;
+    });
+  },
+});
+
+export default activeThemeInjectable;
@@ -0,0 +1,38 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import loggerInjectable from "../../common/logger.injectable";
+import userStoreInjectable from "../../common/user-store/user-store.injectable";
+import { object } from "../utils";
+import type { LensTheme } from "./lens-theme";
+
+export type ApplyLensTheme = (theme: LensTheme) => void;
+
+const applyLensThemeInjectable = getInjectable({
+  id: "apply-lens-theme",
+  instantiate: (di): ApplyLensTheme => {
+    const logger = di.inject(loggerInjectable);
+    const userStore = di.inject(userStoreInjectable);
+
+    return (theme) => {
+      try {
+        const colors = object.entries(theme.colors);
+
+        for (const [name, value] of colors) {
+          document.documentElement.style.setProperty(`--${name}`, value);
+        }
+
+        // Adding universal theme flag which can be used in component styles
+        document.body.classList.toggle("theme-light", theme.type === "light");
+      } catch (error) {
+        logger.error("[THEME]: Failed to apply active theme", error);
+        userStore.resetTheme();
+      }
+    };
+  },
+  causesSideEffects: true,
+});
+
+export default applyLensThemeInjectable;
@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+
+import { getGlobalOverride } from "../../common/test-utils/get-global-override";
+import applyLensThemeInjectable from "./apply-lens-theme.injectable";
+
+export default getGlobalOverride(applyLensThemeInjectable, () => () => {});
@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+
+import { getInjectionToken } from "@ogre-tools/injectable";
+import type { ReadonlyDeep } from "type-fest";
+import type { LensTheme } from "./lens-theme";
+
+export const lensThemeDeclarationInjectionToken = getInjectionToken<ReadonlyDeep<LensTheme>>({
+  id: "lens-theme-declaration",
+});
@@ -0,0 +1,26 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import { lensThemeDeclarationInjectionToken } from "./declaration";
+
+const defaultLensThemeInjectable = getInjectable({
+  id: "default-lens-theme",
+  instantiate: (di) => {
+    const themes = di.injectMany(lensThemeDeclarationInjectionToken);
+    const [defaultTheme, ...rest] = themes.filter(theme => theme.isDefault);
+
+    if (rest.length > 0) {
+      throw new Error("Multiple LensTheme's are declared as the default");
+    }
+
+    if (!defaultTheme) {
+      throw new Error("No LensTheme is declared as the default");
+    }
+
+    return defaultTheme;
+  },
+});
+
+export default defaultLensThemeInjectable;
@@ -0,0 +1,156 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import { lensThemeDeclarationInjectionToken } from "./declaration";
+
+const lensDarkThemeInjectable = getInjectable({
+  id: "lens-dark-theme",
+  instantiate: () => ({
+    name: "Dark",
+    type: "dark" as const,
+    description: "Original Lens dark theme",
+    author: "Mirantis",
+    monacoTheme: "clouds-midnight" as const,
+    colors: {
+      blue: "#3d90ce",
+      magenta: "#c93dce",
+      golden: "#ffc63d",
+      halfGray: "#87909c80",
+      primary: "#3d90ce",
+      textColorPrimary: "#8e9297",
+      textColorSecondary: "#a0a0a0",
+      textColorTertiary: "#909ba6",
+      textColorAccent: "#ffffff",
+      textColorDimmed: "#8e92978c",
+      borderColor: "#4c5053",
+      borderFaintColor: "#373a3e",
+      mainBackground: "#1e2124",
+      secondaryBackground: "#1e2125",
+      contentColor: "#262b2f",
+      layoutBackground: "#2e3136",
+      layoutTabsBackground: "#252729",
+      layoutTabsActiveColor: "#ffffff",
+      layoutTabsLineColor: "#87909c80",
+      sidebarBackground: "#36393e",
+      sidebarLogoBackground: "#414448",
+      sidebarActiveColor: "#ffffff",
+      sidebarSubmenuActiveColor: "#ffffff",
+      sidebarItemHoverBackground: "#3a3e44",
+      badgeBackgroundColor: "#ffba44",
+      buttonPrimaryBackground: "#3d90ce",
+      buttonDefaultBackground: "#414448",
+      buttonLightBackground: "#f1f1f1",
+      buttonAccentBackground: "#e85555",
+      buttonDisabledBackground: "#808080",
+      tableBgcStripe: "#2a2d33",
+      tableBgcSelected: "#383c42",
+      tableHeaderBackground: "#262b2f",
+      tableHeaderColor: "#ffffff",
+      tableSelectedRowColor: "#ffffff",
+      helmLogoBackground: "#ffffff",
+      helmStableRepo: "#3d90ce",
+      helmIncubatorRepo: "#ff7043",
+      helmDescriptionHr: "#41474a",
+      helmDescriptionBlockquoteColor: "#bbb",
+      helmDescriptionBlockquoteBorder: "#8a8f93",
+      helmDescriptionBlockquoteBackground: "#3b4348",
+      helmDescriptionHeaders: "#3e4147",
+      helmDescriptionH6: "#6a737d",
+      helmDescriptionTdBorder: "#47494a",
+      helmDescriptionTrBackground: "#1c2125",
+      helmDescriptionCodeBackground: "#ffffff1a",
+      helmDescriptionPreBackground: "#1b1f21",
+      helmDescriptionPreColor: "#b4b5b4",
+      colorSuccess: "#43a047",
+      colorOk: "#4caf50",
+      colorInfo: "#3d90ce",
+      colorError: "#ce3933",
+      colorSoftError: "#e85555",
+      colorWarning: "#ff9800",
+      colorVague: "#36393e",
+      colorTerminated: "#4c5053",
+      dockHeadBackground: "#2e3136",
+      dockInfoBackground: "#1e2125",
+      dockInfoBorderColor: "#303136",
+      dockEditorBackground: "#000000",
+      dockEditorTag: "#8e97a3",
+      dockEditorKeyword: "#ffffff",
+      dockEditorComment: "#808080",
+      dockEditorActiveLineBackground: "#3a3d41",
+      dockBadgeBackground: "#36393e",
+      dockTabBorderColor: "#43424d",
+      dockTabActiveBackground: "#3a3e45",
+      logsBackground: "#000000",
+      logsForeground: "#ffffff",
+      logRowHoverBackground: "#35373a",
+      dialogTextColor: "#87909c",
+      dialogBackground: "#ffffff",
+      dialogHeaderBackground: "#36393e",
+      dialogFooterBackground: "#f4f4f4",
+      drawerTogglerBackground: "#2f343a",
+      drawerTitleText: "#ffffff",
+      drawerSubtitleBackground: "#373a3e",
+      drawerItemNameColor: "#87909c",
+      drawerItemValueColor: "#a0a0a0",
+      clusterMenuBackground: "#252729",
+      clusterMenuBorderColor: "#252729",
+      clusterMenuCellBackground: "#2e3136",
+      clusterSettingsBackground: "#1e2124",
+      addClusterIconColor: "#252729",
+      boxShadow: "#0000003a",
+      iconActiveColor: "#ffffff",
+      iconActiveBackground: "#ffffff18",
+      filterAreaBackground: "#23272b",
+      chartLiveBarBackground: "#00000033",
+      chartStripesColor: "#ffffff08",
+      chartCapacityColor: "#4c545f",
+      pieChartDefaultColor: "#30353a",
+      inputOptionHoverColor: "#87909c",
+      inputControlBackground: "#1e2125",
+      inputControlBorder: "#414448",
+      inputControlHoverBorder: "#474a4f",
+      lineProgressBackground: "#414448",
+      radioActiveBackground: "#36393e",
+      menuActiveBackground: "#3d90ce",
+      menuSelectedOptionBgc: "#36393e",
+      canvasBackground: "#24292e",
+      scrollBarColor: "#5f6064",
+      settingsBackground: "#262b2e",
+      settingsColor: "#909ba6",
+      navSelectedBackground: "#262b2e",
+      navHoverColor: "#dcddde",
+      hrColor: "#ffffff0f",
+      tooltipBackground: "#18191c",
+    },
+    terminalColors: {
+      background: "#000000",
+      foreground: "#ffffff",
+      cursor: "#ffffff",
+      cursorAccent: "#000000",
+      selection: "#ffffff77",
+      black: "#2e3436",
+      red: "#cc0000",
+      green: "#4e9a06",
+      yellow: "#c4a000",
+      blue: "#3465a4",
+      magenta: "#75507b",
+      cyan: "#06989a",
+      white: "#d3d7cf",
+      brightBlack: "#555753",
+      brightRed: "#ef2929",
+      brightGreen: "#8ae234",
+      brightYellow: "#fce94f",
+      brightBlue: "#729fcf",
+      brightMagenta: "#ad7fa8",
+      brightCyan: "#34e2e2",
+      brightWhite: "#eeeeec",
+    },
+    isDefault: true,
+  }),
+  injectionToken: lensThemeDeclarationInjectionToken,
+});
+
+export default lensDarkThemeInjectable;
+
@@ -0,0 +1,154 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import { lensThemeDeclarationInjectionToken } from "./declaration";
+
+const lensLightThemeInjectable = getInjectable({
+  id: "lens-light-theme",
+  instantiate: () => ({
+    name: "Light",
+    type: "light" as const,
+    description: "Original Lens light theme",
+    author: "Mirantis",
+    monacoTheme: "vs" as const,
+    colors: {
+      blue: "#3d90ce",
+      magenta: "#c93dce",
+      golden: "#ffc63d",
+      halfGray: "#87909c80",
+      primary: "#3d90ce",
+      textColorPrimary: "#555555",
+      textColorSecondary: "#51575d",
+      textColorTertiary: "#555555",
+      textColorAccent: "#222222",
+      textColorDimmed: "#5557598c",
+      borderColor: "#c9cfd3",
+      borderFaintColor: "#dfdfdf",
+      mainBackground: "#f1f1f1",
+      secondaryBackground: "#f2f3f5",
+      contentColor: "#ffffff",
+      layoutBackground: "#e8e8e8",
+      layoutTabsBackground: "#f8f8f8",
+      layoutTabsActiveColor: "#333333",
+      layoutTabsLineColor: "#87909c80",
+      sidebarLogoBackground: "#f1f1f1",
+      sidebarActiveColor: "#ffffff",
+      sidebarSubmenuActiveColor: "#3d90ce",
+      sidebarBackground: "#e8e8e8",
+      sidebarItemHoverBackground: "#f0f2f5",
+      badgeBackgroundColor: "#ffba44",
+      buttonPrimaryBackground: "#3d90ce",
+      buttonDefaultBackground: "#414448",
+      buttonLightBackground: "#f1f1f1",
+      buttonAccentBackground: "#e85555",
+      buttonDisabledBackground: "#808080",
+      tableBgcStripe: "#f8f8f8",
+      tableBgcSelected: "#f4f5f5",
+      tableHeaderBackground: "#f1f1f1",
+      tableHeaderColor: "#555555",
+      tableSelectedRowColor: "#222222",
+      helmLogoBackground: "#ffffff",
+      helmStableRepo: "#3d90ce",
+      helmIncubatorRepo: "#ff7043",
+      helmDescriptionHr: "#dddddd",
+      helmDescriptionBlockquoteColor: "#555555",
+      helmDescriptionBlockquoteBorder: "#8a8f93",
+      helmDescriptionBlockquoteBackground: "#eeeeee",
+      helmDescriptionHeaders: "#3e4147",
+      helmDescriptionH6: "#6a737d",
+      helmDescriptionTdBorder: "#c6c6c6",
+      helmDescriptionTrBackground: "#1c2125",
+      helmDescriptionCodeBackground: "#ffffff1a",
+      helmDescriptionPreBackground: "#eeeeee",
+      helmDescriptionPreColor: "#555555",
+      colorSuccess: "#206923",
+      colorOk: "#399c3d",
+      colorInfo: "#2d71a4",
+      colorError: "#ce3933",
+      colorSoftError: "#e85555",
+      colorWarning: "#ff9800",
+      colorVague: "#ededed",
+      colorTerminated: "#9dabb5",
+      dockHeadBackground: "#e8e8e8",
+      dockInfoBackground: "#f3f3f3",
+      dockInfoBorderColor: "#c9cfd3",
+      dockEditorBackground: "#24292e",
+      dockEditorTag: "#8e97a3",
+      dockEditorKeyword: "#ffffff",
+      dockEditorComment: "#808080",
+      dockEditorActiveLineBackground: "#3a3d41",
+      dockBadgeBackground: "#dedede",
+      dockTabBorderColor: "#d5d4de",
+      dockTabActiveBackground: "#ffffff",
+      logsBackground: "#24292e",
+      logsForeground: "#ffffff",
+      logRowHoverBackground: "#35373a",
+      dialogTextColor: "#87909c",
+      dialogBackground: "#ffffff",
+      dialogHeaderBackground: "#36393e",
+      dialogFooterBackground: "#f4f4f4",
+      drawerTogglerBackground: "#eaeced",
+      drawerTitleText: "#ffffff",
+      drawerSubtitleBackground: "#f1f1f1",
+      drawerItemNameColor: "#727272",
+      drawerItemValueColor: "#555555",
+      clusterMenuBackground: "#d7d8da",
+      clusterMenuBorderColor: "#c9cfd3",
+      clusterMenuCellBackground: "#bbbbbb",
+      clusterSettingsBackground: "#ffffff",
+      addClusterIconColor: "#8d8d8d",
+      boxShadow: "#0000003a",
+      iconActiveColor: "#ffffff",
+      iconActiveBackground: "#a6a6a694",
+      filterAreaBackground: "#f7f7f7",
+      chartLiveBarBackground: "#00000033",
+      chartStripesColor: "#00000009",
+      chartCapacityColor: "#cccccc",
+      pieChartDefaultColor: "#efefef",
+      inputOptionHoverColor: "#ffffff",
+      inputControlBackground: "#f6f6f7",
+      inputControlBorder: "#cccdcf",
+      inputControlHoverBorder: "#b9bbbe",
+      lineProgressBackground: "#e8e8e8",
+      radioActiveBackground: "#f1f1f1",
+      menuActiveBackground: "#3d90ce",
+      menuSelectedOptionBgc: "#e8e8e8",
+      canvasBackground: "#24292e",
+      scrollBarColor: "#bbbbbb",
+      settingsBackground: "#ffffff",
+      settingsColor: "#555555",
+      navSelectedBackground: "#ffffff",
+      navHoverColor: "#2e3135",
+      hrColor: "#06060714",
+      tooltipBackground: "#ffffff",
+    },
+    terminalColors: {
+      background: "#ffffff",
+      foreground: "#2d2d2d",
+      cursor: "#2d2d2d",
+      cursorAccent: "#ffffff",
+      selection: "#bfbfbf",
+      black: "#2d2d2d",
+      red: "#cd3734 ",
+      green: "#18cf12",
+      yellow: "#acb300",
+      blue: "#3d90ce",
+      magenta: "#c100cd",
+      cyan: "#07c4b9",
+      white: "#d3d7cf",
+      brightBlack: "#a8a8a8",
+      brightRed: "#ff6259",
+      brightGreen: "#5cdb59",
+      brightYellow: "#f8c000",
+      brightBlue: "#008db6",
+      brightMagenta: "#ee55f8",
+      brightCyan: "#50e8df",
+      brightWhite: "#eeeeec",
+    },
+  }),
+  injectionToken: lensThemeDeclarationInjectionToken,
+});
+
+export default lensLightThemeInjectable;
@@ -0,0 +1,154 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+
+import type { MonacoTheme } from "../components/monaco-editor";
+
+export type ThemeId = string;
+export type LensThemeType = "dark" | "light";
+export interface LensTheme {
+  name: string;
+  type: LensThemeType;
+  colors: Record<LensColorName, string>;
+  terminalColors: Partial<Record<TerminalColorName, string>>;
+  description: string;
+  author: string;
+  monacoTheme: MonacoTheme;
+  isDefault?: boolean;
+}
+
+export type TerminalColorName =
+  | "foreground"
+  | "background"
+  | "cursor"
+  | "cursorAccent"
+  | "selection"
+  | "selectionForeground"
+  | "black"
+  | "red"
+  | "green"
+  | "yellow"
+  | "blue"
+  | "magenta"
+  | "cyan"
+  | "white"
+  | "brightBlack"
+  | "brightRed"
+  | "brightGreen"
+  | "brightYellow"
+  | "brightBlue"
+  | "brightMagenta"
+  | "brightCyan"
+  | "brightWhite";
+
+export type LensColorName =
+  | "blue"
+  | "magenta"
+  | "golden"
+  | "halfGray"
+  | "primary"
+  | "textColorPrimary"
+  | "textColorSecondary"
+  | "textColorTertiary"
+  | "textColorAccent"
+  | "textColorDimmed"
+  | "borderColor"
+  | "borderFaintColor"
+  | "mainBackground"
+  | "secondaryBackground"
+  | "contentColor"
+  | "layoutBackground"
+  | "layoutTabsBackground"
+  | "layoutTabsActiveColor"
+  | "layoutTabsLineColor"
+  | "sidebarLogoBackground"
+  | "sidebarActiveColor"
+  | "sidebarSubmenuActiveColor"
+  | "sidebarBackground"
+  | "sidebarItemHoverBackground"
+  | "badgeBackgroundColor"
+  | "buttonPrimaryBackground"
+  | "buttonDefaultBackground"
+  | "buttonLightBackground"
+  | "buttonAccentBackground"
+  | "buttonDisabledBackground"
+  | "tableBgcStripe"
+  | "tableBgcSelected"
+  | "tableHeaderBackground"
+  | "tableHeaderColor"
+  | "tableSelectedRowColor"
+  | "helmLogoBackground"
+  | "helmStableRepo"
+  | "helmIncubatorRepo"
+  | "helmDescriptionHr"
+  | "helmDescriptionBlockquoteColor"
+  | "helmDescriptionBlockquoteBorder"
+  | "helmDescriptionBlockquoteBackground"
+  | "helmDescriptionHeaders"
+  | "helmDescriptionH6"
+  | "helmDescriptionTdBorder"
+  | "helmDescriptionTrBackground"
+  | "helmDescriptionCodeBackground"
+  | "helmDescriptionPreBackground"
+  | "helmDescriptionPreColor"
+  | "colorSuccess"
+  | "colorOk"
+  | "colorInfo"
+  | "colorError"
+  | "colorSoftError"
+  | "colorWarning"
+  | "colorVague"
+  | "colorTerminated"
+  | "dockHeadBackground"
+  | "dockInfoBackground"
+  | "dockInfoBorderColor"
+  | "dockEditorBackground"
+  | "dockEditorTag"
+  | "dockEditorKeyword"
+  | "dockEditorComment"
+  | "dockEditorActiveLineBackground"
+  | "dockBadgeBackground"
+  | "dockTabBorderColor"
+  | "dockTabActiveBackground"
+  | "logsBackground"
+  | "logsForeground"
+  | "logRowHoverBackground"
+  | "dialogTextColor"
+  | "dialogBackground"
+  | "dialogHeaderBackground"
+  | "dialogFooterBackground"
+  | "drawerTogglerBackground"
+  | "drawerTitleText"
+  | "drawerSubtitleBackground"
+  | "drawerItemNameColor"
+  | "drawerItemValueColor"
+  | "clusterMenuBackground"
+  | "clusterMenuBorderColor"
+  | "clusterMenuCellBackground"
+  | "clusterSettingsBackground"
+  | "addClusterIconColor"
+  | "boxShadow"
+  | "iconActiveColor"
+  | "iconActiveBackground"
+  | "filterAreaBackground"
+  | "chartLiveBarBackground"
+  | "chartStripesColor"
+  | "chartCapacityColor"
+  | "pieChartDefaultColor"
+  | "inputOptionHoverColor"
+  | "inputControlBackground"
+  | "inputControlBorder"
+  | "inputControlHoverBorder"
+  | "lineProgressBackground"
+  | "radioActiveBackground"
+  | "menuActiveBackground"
+  | "menuSelectedOptionBgc"
+  | "canvasBackground"
+  | "scrollBarColor"
+  | "settingsBackground"
+  | "settingsColor"
+  | "navSelectedBackground"
+  | "navHoverColor"
+  | "hrColor"
+  | "tooltipBackground";
@@ -0,0 +1,37 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import { reaction } from "mobx";
+import initializeSystemThemeTypeInjectable from "../../features/theme/system-type/renderer/initialize.injectable";
+import { beforeFrameStartsSecondInjectionToken } from "../before-frame-starts/tokens";
+import initUserStoreInjectable from "../stores/init-user-store.injectable";
+import activeThemeInjectable from "./active.injectable";
+import applyLensThemeInjectable from "./apply-lens-theme.injectable";
+
+const setupApplyActiveThemeInjectable = getInjectable({
+  id: "setup-apply-active-theme",
+  instantiate: (di) => ({
+    id: "setup-apply-active-theme",
+    run: () => {
+      const activeTheme = di.inject(activeThemeInjectable);
+      const applyLensTheme = di.inject(applyLensThemeInjectable);
+
+      reaction(
+        () => activeTheme.get(),
+        applyLensTheme,
+        {
+          fireImmediately: true,
+        },
+      );
+    },
+    runAfter: [
+      di.inject(initializeSystemThemeTypeInjectable),
+      di.inject(initUserStoreInjectable),
+    ],
+  }),
+  injectionToken: beforeFrameStartsSecondInjectionToken,
+});
+
+export default setupApplyActiveThemeInjectable;
@@ -0,0 +1,13 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import { observable } from "mobx";
+
+const systemThemeConfigurationInjectable = getInjectable({
+  id: "system-theme-configuration",
+  instantiate: () => observable.box<"dark" | "light">("dark"),
+});
+
+export default systemThemeConfigurationInjectable;
@@ -0,0 +1,32 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import { computed } from "mobx";
+import terminalThemePreferenceInjectable from "../../common/user-store/terminal-theme.injectable";
+import activeThemeInjectable from "./active.injectable";
+import lensThemesInjectable from "./themes.injectable";
+
+const xtermColorThemeInjectable = getInjectable({
+  id: "terminal-colors",
+  instantiate: (di) => {
+    const activeTheme = di.inject(activeThemeInjectable);
+    const terminalThemePreference = di.inject(terminalThemePreferenceInjectable);
+    const themes = di.inject(lensThemesInjectable);
+
+    const terminalTheme = computed(() => {
+      const themePref = terminalThemePreference.get();
+
+      if (themePref.matchLensTheme) {
+        return activeTheme.get();
+      }
+
+      return themes.get(themePref.themeId) ?? activeTheme.get();
+    });
+
+    return computed(() => terminalTheme.get().terminalColors);
+  },
+});
+
+export default xtermColorThemeInjectable;
@@ -0,0 +1,17 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+import { getInjectable } from "@ogre-tools/injectable";
+import { lensThemeDeclarationInjectionToken } from "./declaration";
+
+const lensThemesInjectable = getInjectable({
+  id: "lens-themes",
+  instantiate: (di) => {
+    const themes = di.injectMany(lensThemeDeclarationInjectionToken);
+
+    return new Map(themes.map(theme => [theme.name, theme]));
+  },
+});
+
+export default lensThemesInjectable;