From 7a76d3f4eb77419bedea5828c29f54b3111dbe5b Mon Sep 17 00:00:00 2001
From: Alphons Joseph <93847055+Crazypersonalph@users.noreply.github.com>
Date: Tue, 18 Mar 2025 19:03:23 +0800
Subject: [PATCH] bugfix: Finally fix theme application

---
 src/interface/components/themes/ThemeSelector.svelte | 2 --
 src/seqta/ui/themes/UpdateThemePreview.ts            | 8 ++++----
 src/seqta/ui/themes/disableTheme.ts                  | 1 +
 src/seqta/ui/themes/setTheme.ts                      | 5 +++--
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/interface/components/themes/ThemeSelector.svelte b/src/interface/components/themes/ThemeSelector.svelte
index c43696d2..9d490729 100644
--- a/src/interface/components/themes/ThemeSelector.svelte
+++ b/src/interface/components/themes/ThemeSelector.svelte
@@ -11,7 +11,6 @@
   import { OpenStorePage } from '@/seqta/ui/renderStore'
   import { themeUpdates } from '@/interface/hooks/ThemeUpdates'
   import { closeExtensionPopup } from '@/seqta/utils/Closers/closeExtensionPopup'
-  import { settingsState } from '@/seqta/utils/listeners/SettingsState'
 
   let themes = $state<ThemeList | null>(null);
   let { isEditMode } = $props<{ isEditMode: boolean }>();
@@ -25,7 +24,6 @@
       themes.selectedTheme = '';
     } else {
       await setTheme(theme.id);
-      settingsState.selectedColor = theme.defaultColour; // settingsState and the theme need to be synchronised.
       if (!themes) return;
       themes.selectedTheme = theme.id;
     }
diff --git a/src/seqta/ui/themes/UpdateThemePreview.ts b/src/seqta/ui/themes/UpdateThemePreview.ts
index 288ded87..cebc8a28 100644
--- a/src/seqta/ui/themes/UpdateThemePreview.ts
+++ b/src/seqta/ui/themes/UpdateThemePreview.ts
@@ -42,7 +42,7 @@ export const UpdateThemePreview = async (updatedTheme: LoadedCustomTheme) => {
   // Apply default color
   if (defaultColour) {
     // Store the original color if it hasn't been stored yet
-    if (originalColor === null) {
+    if (originalColor == null) {
       originalColor = settingsState.selectedColor;
     }
     settingsState.selectedColor = defaultColour;
@@ -62,13 +62,13 @@ export const ClearThemePreview = () => {
   }
 
   // Reset the color to the original value
-  if (originalColor !== null) {
+  if (originalColor != null) {
     settingsState.selectedColor = originalColor;
-    originalColor = null;
+    originalColor = settingsState.originalSelectedColor;
   }
 
   // Reset the theme (dark/light mode) to the original value
-  if (originalTheme !== null) {
+  if (originalTheme != null) {
     settingsState.DarkMode = originalTheme;
     originalTheme = null;
   }
diff --git a/src/seqta/ui/themes/disableTheme.ts b/src/seqta/ui/themes/disableTheme.ts
index f033571f..b8e57025 100644
--- a/src/seqta/ui/themes/disableTheme.ts
+++ b/src/seqta/ui/themes/disableTheme.ts
@@ -27,6 +27,7 @@ export const disableTheme = async () => {
     }
 
     settingsState.selectedTheme = ''
+    settingsState.selectedColor = settingsState.originalSelectedColor;
   } catch (error) {
     console.error('Error disabling theme:', error);
   } finally {
diff --git a/src/seqta/ui/themes/setTheme.ts b/src/seqta/ui/themes/setTheme.ts
index 6e560cea..e2b9f8cd 100644
--- a/src/seqta/ui/themes/setTheme.ts
+++ b/src/seqta/ui/themes/setTheme.ts
@@ -29,8 +29,9 @@ export const setTheme = async (themeId: string) => {
     await applyTheme(theme);
 
     settingsState.selectedTheme = themeId
-    settingsState.selectedColor = theme.selectedColor ? theme.selectedColor : (theme.defaultColour !== '' ? theme.defaultColour : '#007bff')
-    settingsState.originalSelectedColor = originalSelectedColor.selectedColor
+    //settingsState.selectedColor = theme.selectedColor ? theme.selectedColor : (theme.defaultColour !== '' ? theme.defaultColour : '#007bff')
+    settingsState.originalSelectedColor = settingsState.selectedColor;
+    settingsState.selectedColor = theme.defaultColour;
   } catch (error) {
     console.error('Error setting theme:', error);
   }