diff --git a/src/interface/components/ThemeSelector.tsx b/src/interface/components/ThemeSelector.tsx index 3b61752a..1e82ce7d 100644 --- a/src/interface/components/ThemeSelector.tsx +++ b/src/interface/components/ThemeSelector.tsx @@ -23,13 +23,6 @@ const ThemeSelector: ForwardRefExoticComponent & ...prevState, selectedTheme: themeId, })); - - /* debounce(() => { - setSettingsState((prevState: SettingsState) => ({ - ...prevState, - selectedTheme: themeId, - })); - }, 50); */ } useImperativeHandle(ref, () => ({ @@ -99,13 +92,14 @@ const ThemeSelector: ForwardRefExoticComponent & 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 & theme={theme} isSelected={theme.id === settingsState.selectedTheme} isEditMode={isEditMode} - onThemeSelect={handleThemeSelect} + onThemeSelect={handleThemeSelectDebounced} onThemeDelete={handleThemeDelete} /> ))} @@ -147,7 +141,7 @@ const ThemeSelector: ForwardRefExoticComponent & theme={theme} isSelected={theme.id === settingsState.selectedTheme} isEditMode={isEditMode} - onThemeSelect={handleThemeSelect} + onThemeSelect={handleThemeSelectDebounced} onThemeDelete={handleThemeDelete} /> ))} diff --git a/src/seqta/ui/themes/removeTheme.ts b/src/seqta/ui/themes/removeTheme.ts index dd530655..733eceae 100644 --- a/src/seqta/ui/themes/removeTheme.ts +++ b/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(); }; diff --git a/src/seqta/ui/themes/setTheme.ts b/src/seqta/ui/themes/setTheme.ts index 7ebacbd2..0fa3fc99 100644 --- a/src/seqta/ui/themes/setTheme.ts +++ b/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); } diff --git a/src/seqta/utils/listeners/StorageListener.ts b/src/seqta/utils/listeners/StorageListener.ts index e66d0ac8..b9712f67 100644 --- a/src/seqta/utils/listeners/StorageListener.ts +++ b/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: