diff --git a/apps/web/desktop/asset-manager.ts b/apps/web/desktop/asset-manager.ts
index 9c15180fc..a50be690b 100644
--- a/apps/web/desktop/asset-manager.ts
+++ b/apps/web/desktop/asset-manager.ts
@@ -17,11 +17,12 @@ You should have received a copy of the GNU General Public License
along with this program. If not, see .
*/
-import { NativeImage, nativeImage, nativeTheme } from "electron";
+import { NativeImage, nativeImage } from "electron";
import path from "path";
import { isDevelopment } from "./utils";
import { parse, ParsedImage } from "icojs";
import { readFileSync } from "fs";
+import { getSystemTheme } from "./config/theme";
type Formats = "ico" | "png" | "icns";
type IconOptions = {
@@ -86,7 +87,7 @@ export class AssetManager {
): FlexibleIcon | undefined {
const { size = 16, format = "png" } = options;
- const prefix: Prefixes = nativeTheme.shouldUseDarkColors ? ".dark" : "";
+ const prefix: Prefixes = getSystemTheme() === "dark" ? ".dark" : "";
const icoPath = path.join(
RESOURCES_DIR,
diff --git a/apps/web/desktop/config/theme.js b/apps/web/desktop/config/theme.js
index 12de6c881..3e6cf612a 100644
--- a/apps/web/desktop/config/theme.js
+++ b/apps/web/desktop/config/theme.js
@@ -35,6 +35,23 @@ function getBackgroundColor() {
return nativeTheme.shouldUseDarkColors ? "#0f0f0f" : "#ffffff";
}
+function getSystemTheme() {
+ const listeners = nativeTheme.rawListeners("updated");
+ nativeTheme.removeAllListeners("updated");
+
+ const oldThemeSource = nativeTheme.themeSource;
+ nativeTheme.themeSource = "system";
+ const currentTheme = nativeTheme.shouldUseDarkColors ? "dark" : "light";
+ nativeTheme.themeSource = oldThemeSource;
+
+ setTimeout(
+ () => listeners.forEach((a) => nativeTheme.addListener("updated", a)),
+ 1000
+ );
+ return currentTheme;
+}
+
+export { getTheme, setTheme, getBackgroundColor, getSystemTheme };
function changeTheme(theme) {
const listeners = nativeTheme.rawListeners("updated");