From f0613e7af560f972e87e6f9fcfb650d5e86c9293 Mon Sep 17 00:00:00 2001
From: Aman Harwara <amanharwara@protonmail.com>
Date: Sat, 23 Mar 2024 00:24:41 +0530
Subject: [PATCH] chore: fix theme not toggling when changing auto-light/dark
 theme selection

---
 .../ui-services/src/Theme/ThemeManager.ts     | 22 ++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/packages/ui-services/src/Theme/ThemeManager.ts b/packages/ui-services/src/Theme/ThemeManager.ts
index 72892f6be..f1e339baf 100644
--- a/packages/ui-services/src/Theme/ThemeManager.ts
+++ b/packages/ui-services/src/Theme/ThemeManager.ts
@@ -27,7 +27,9 @@ const DefaultThemeIdentifier = 'Default'
 
 export class ThemeManager extends AbstractUIService {
   private themesActiveInTheUI: ActiveThemeList
-  private lastUseDeviceThemeSettings = false
+  private lastUseDeviceThemeSettings: boolean | undefined
+  private lastAutoLightTheme: string | undefined
+  private lastAutoDarkTheme: string | undefined
 
   constructor(
     application: WebApplicationInterface,
@@ -166,15 +168,25 @@ export class ThemeManager extends AbstractUIService {
 
     this.toggleTranslucentUIColors()
 
-    const useDeviceThemeSettings = this.preferences.getLocalValue(LocalPrefKey.UseSystemColorScheme, false)
+    const useSystemColorScheme = this.preferences.getLocalValue(LocalPrefKey.UseSystemColorScheme, false)
+    const autoLightTheme = this.preferences.getLocalValue(LocalPrefKey.AutoLightThemeIdentifier, DefaultThemeIdentifier)
+    const autoDarkTheme = this.preferences.getLocalValue(
+      LocalPrefKey.AutoDarkThemeIdentifier,
+      NativeFeatureIdentifier.TYPES.DarkTheme,
+    )
 
-    const hasPreferenceChanged = useDeviceThemeSettings !== this.lastUseDeviceThemeSettings
+    const hasPreferenceChanged =
+      useSystemColorScheme !== this.lastUseDeviceThemeSettings ||
+      autoLightTheme !== this.lastAutoLightTheme ||
+      autoDarkTheme !== this.lastAutoDarkTheme
 
     if (hasPreferenceChanged) {
-      this.lastUseDeviceThemeSettings = useDeviceThemeSettings
+      this.lastUseDeviceThemeSettings = useSystemColorScheme
+      this.lastAutoLightTheme = autoLightTheme
+      this.lastAutoDarkTheme = autoDarkTheme
     }
 
-    if (hasPreferenceChanged && useDeviceThemeSettings) {
+    if (hasPreferenceChanged && useSystemColorScheme) {
       let prefersDarkColorScheme = window.matchMedia('(prefers-color-scheme: dark)').matches
 
       if (this.application.isNativeMobileWeb()) {