remove unnecesarry theme updates

src/interface/components/ThemeSelector.tsx

@@ -23,13 +23,6 @@ const ThemeSelector: ForwardRefExoticComponent<Omit<ThemeSelectorProps, "ref"> &
       ...prevState,
       selectedTheme: themeId,
     }));
-
-    /* debounce(() => {
-      setSettingsState((prevState: SettingsState) => ({
-        ...prevState,
-        selectedTheme: themeId,
-      }));
-    }, 50); */
   }
 
   useImperativeHandle(ref, () => ({
@@ -99,13 +92,14 @@ const ThemeSelector: ForwardRefExoticComponent<Omit<ThemeSelectorProps, "ref"> &
         if (selectedTheme) {
           await setTheme(selectedTheme.id);
           setSelectedTheme(themeId);
-          //debounce(() => setSelectedTheme(selectedTheme.id), 100);
         }
       }
     },
     [settingsState.selectedTheme, themes]
   );
 
+  const handleThemeSelectDebounced = debounce(handleThemeSelect, 50);
+
   const handleThemeDelete = useCallback(
     async (themeId: string) => {
       try {
@@ -135,7 +129,7 @@ const ThemeSelector: ForwardRefExoticComponent<Omit<ThemeSelectorProps, "ref"> &
             theme={theme}
             isSelected={theme.id === settingsState.selectedTheme}
             isEditMode={isEditMode}
-            onThemeSelect={handleThemeSelect}
+            onThemeSelect={handleThemeSelectDebounced}
             onThemeDelete={handleThemeDelete}
           />
         ))}
@@ -147,7 +141,7 @@ const ThemeSelector: ForwardRefExoticComponent<Omit<ThemeSelectorProps, "ref"> &
             theme={theme}
             isSelected={theme.id === settingsState.selectedTheme}
             isEditMode={isEditMode}
-            onThemeSelect={handleThemeSelect}
+            onThemeSelect={handleThemeSelectDebounced}
             onThemeDelete={handleThemeDelete}
           />
         ))}

src/seqta/ui/themes/removeTheme.ts

@@ -1,6 +1,5 @@
 import { CustomTheme } from '../../../interface/types/CustomThemes';
 import browser from 'webextension-polyfill';
-import sendThemeUpdate from '../../utils/sendThemeUpdate';
 
 export const removeTheme = async (theme: CustomTheme) => {
   // Remove custom CSS
@@ -20,6 +19,4 @@ export const removeTheme = async (theme: CustomTheme) => {
   customImageVariables.forEach((variableName) => {
     document.documentElement.style.removeProperty('--' + variableName);
   });
-
-  sendThemeUpdate();
 };

src/seqta/ui/themes/setTheme.ts

@@ -3,7 +3,6 @@ import localforage from 'localforage';
 import { CustomTheme } from '../../../interface/types/CustomThemes';
 import { applyTheme } from './applyTheme';
 import { removeTheme } from './removeTheme';
-import sendThemeUpdate from '../../utils/sendThemeUpdate';
 
 
 export const setTheme = async (themeId: string) => {
@@ -39,7 +38,6 @@ export const setTheme = async (themeId: string) => {
       originalSelectedColor: originalSelectedColor.selectedColor
     });
 
-    sendThemeUpdate();
   } catch (error) {
     console.error('Error setting theme:', error);
   }

src/seqta/utils/listeners/StorageListener.ts

@@ -11,7 +11,6 @@ import {
 } from '../../../SEQTA';
 import { updateBgDurations } from '../../ui/Animation';
 import { getDarkMode, updateAllColors } from '../../ui/colors/Manager';
-import { appendBackgroundToUI } from '../../ui/ImageBackgrounds';
 
 
 export default class StorageListener {
@@ -83,7 +82,7 @@ export default class StorageListener {
         break;
       
       case 'theme':
-        console.log(changes.theme.newValue)
+        console.debug(changes.theme.newValue)
         break;
 
       default: