From bcd962f150c1e5cbbc0aa2f2aa2eb092dff6b12d Mon Sep 17 00:00:00 2001 From: Aman Harwara Date: Thu, 11 May 2023 19:45:10 +0530 Subject: [PATCH] refactor: remove unused dark mode code (#2332) --- .../src/Domain/Syncable/UserPrefs/PrefKey.ts | 2 -- .../ui-services/src/Theme/ThemeManager.ts | 3 -- .../ApplicationView/ApplicationView.tsx | 2 -- .../DarkModeHandler/DarkModeHandler.tsx | 26 --------------- .../QuickSettingsMenu/QuickSettingsMenu.tsx | 33 ++----------------- .../src/javascripts/Constants/PrefDefaults.ts | 1 - 6 files changed, 3 insertions(+), 64 deletions(-) delete mode 100644 packages/web/src/javascripts/Components/DarkModeHandler/DarkModeHandler.tsx diff --git a/packages/models/src/Domain/Syncable/UserPrefs/PrefKey.ts b/packages/models/src/Domain/Syncable/UserPrefs/PrefKey.ts index af603e011..326a21bc1 100644 --- a/packages/models/src/Domain/Syncable/UserPrefs/PrefKey.ts +++ b/packages/models/src/Domain/Syncable/UserPrefs/PrefKey.ts @@ -40,7 +40,6 @@ export enum PrefKey { NewNoteTitleFormat = 'newNoteTitleFormat', CustomNoteTitleFormat = 'customNoteTitleFormat', UpdateSavingStatusIndicator = 'updateSavingStatusIndicator', - DarkMode = 'darkMode', DefaultEditorIdentifier = 'defaultEditorIdentifier', MomentsDefaultTagUuid = 'momentsDefaultTagUuid', ClipperDefaultTagUuid = 'clipperDefaultTagUuid', @@ -118,7 +117,6 @@ export type PrefValue = { [PrefKey.EditorLineWidth]: EditorLineWidth [PrefKey.EditorFontSize]: EditorFontSize [PrefKey.UpdateSavingStatusIndicator]: boolean - [PrefKey.DarkMode]: boolean [PrefKey.DefaultEditorIdentifier]: EditorIdentifier [PrefKey.MomentsDefaultTagUuid]: string | undefined [PrefKey.ClipperDefaultTagUuid]: string | undefined diff --git a/packages/ui-services/src/Theme/ThemeManager.ts b/packages/ui-services/src/Theme/ThemeManager.ts index 9f819127d..411582ee5 100644 --- a/packages/ui-services/src/Theme/ThemeManager.ts +++ b/packages/ui-services/src/Theme/ThemeManager.ts @@ -249,7 +249,6 @@ export class ThemeManager extends AbstractService { const setTheme = () => { if (themeIdentifier === DefaultThemeIdentifier) { toggleActiveTheme() - void this.application.setPreference(PrefKey.DarkMode, false) } else { const theme = themes.find((theme) => theme.package_info.identifier === themeIdentifier) if (theme && !theme.active) { @@ -345,8 +344,6 @@ export class ThemeManager extends AbstractService { } } document.getElementsByTagName('head')[0].appendChild(link) - - void this.application.setPreference(PrefKey.DarkMode, false) } private getBackgroundColor() { diff --git a/packages/web/src/javascripts/Components/ApplicationView/ApplicationView.tsx b/packages/web/src/javascripts/Components/ApplicationView/ApplicationView.tsx index a439bb644..190b9f24a 100644 --- a/packages/web/src/javascripts/Components/ApplicationView/ApplicationView.tsx +++ b/packages/web/src/javascripts/Components/ApplicationView/ApplicationView.tsx @@ -22,7 +22,6 @@ import FileDragNDropProvider from '../FileDragNDropProvider' import ResponsivePaneProvider from '../Panes/ResponsivePaneProvider' import AndroidBackHandlerProvider from '@/NativeMobileWeb/useAndroidBackHandler' import ConfirmDeleteAccountContainer from '@/Components/ConfirmDeleteAccountModal/ConfirmDeleteAccountModal' -import DarkModeHandler from '../DarkModeHandler/DarkModeHandler' import ApplicationProvider from '../ApplicationProvider' import CommandProvider from '../CommandProvider' import PanesSystemComponent from '../Panes/PanesSystemComponent' @@ -216,7 +215,6 @@ const ApplicationView: FunctionComponent = ({ application, mainApplicatio - { - useEffect(() => { - application.addSingleEventObserver(ApplicationEvent.PreferencesChanged, async () => { - const isDarkModeOn = application.getPreference(PrefKey.DarkMode, PrefDefaults[PrefKey.DarkMode]) - - if (isDarkModeOn) { - document.documentElement.classList.add('dark-mode') - } else { - document.documentElement.classList.remove('dark-mode') - } - }) - }, [application]) - - return null -} - -export default DarkModeHandler diff --git a/packages/web/src/javascripts/Components/QuickSettingsMenu/QuickSettingsMenu.tsx b/packages/web/src/javascripts/Components/QuickSettingsMenu/QuickSettingsMenu.tsx index 9154ab118..deca7ea20 100644 --- a/packages/web/src/javascripts/Components/QuickSettingsMenu/QuickSettingsMenu.tsx +++ b/packages/web/src/javascripts/Components/QuickSettingsMenu/QuickSettingsMenu.tsx @@ -1,13 +1,5 @@ import { WebApplication } from '@/Application/WebApplication' -import { - ApplicationEvent, - ComponentArea, - ContentType, - FeatureIdentifier, - GetFeatures, - PrefKey, - SNComponent, -} from '@standardnotes/snjs' +import { ComponentArea, ContentType, FeatureIdentifier, GetFeatures, SNComponent } from '@standardnotes/snjs' import { observer } from 'mobx-react-lite' import { FunctionComponent, useCallback, useEffect, useRef, useState } from 'react' import Icon from '@/Components/Icon/Icon' @@ -18,7 +10,6 @@ import { sortThemes } from '@/Utils/SortThemes' import HorizontalSeparator from '../Shared/HorizontalSeparator' import { QuickSettingsController } from '@/Controllers/QuickSettingsController' import PanelSettingsSection from './PanelSettingsSection' -import { PrefDefaults } from '@/Constants/PrefDefaults' import Menu from '../Menu/Menu' import MenuSwitchButtonItem from '../Menu/MenuSwitchButtonItem' import MenuRadioButtonItem from '../Menu/MenuRadioButtonItem' @@ -34,24 +25,7 @@ const QuickSettingsMenu: FunctionComponent = ({ application, quickSet const [themes, setThemes] = useState([]) const [toggleableComponents, setToggleableComponents] = useState([]) - const [isDarkModeOn, setDarkModeOn] = useState(() => - application.getPreference(PrefKey.DarkMode, PrefDefaults[PrefKey.DarkMode]), - ) - const defaultThemeOn = - !themes.map((item) => item?.component).find((theme) => theme?.active && !theme.isLayerable()) && !isDarkModeOn - - useEffect(() => { - const removeObserver = application.addEventObserver(async (event) => { - if (event !== ApplicationEvent.PreferencesChanged) { - return - } - - const isDarkModeOn = application.getPreference(PrefKey.DarkMode, PrefDefaults[PrefKey.DarkMode]) - setDarkModeOn(isDarkModeOn) - }) - - return removeObserver - }, [application]) + const defaultThemeOn = !themes.map((item) => item?.component).find((theme) => theme?.active && !theme.isLayerable()) const prefsButtonRef = useRef(null) const defaultThemeButtonRef = useRef(null) @@ -145,8 +119,7 @@ const QuickSettingsMenu: FunctionComponent = ({ application, quickSet const toggleDefaultTheme = useCallback(() => { deactivateAnyNonLayerableTheme() - void application.setPreference(PrefKey.DarkMode, false) - }, [application, deactivateAnyNonLayerableTheme]) + }, [deactivateAnyNonLayerableTheme]) return ( diff --git a/packages/web/src/javascripts/Constants/PrefDefaults.ts b/packages/web/src/javascripts/Constants/PrefDefaults.ts index 76be45321..d4e155233 100644 --- a/packages/web/src/javascripts/Constants/PrefDefaults.ts +++ b/packages/web/src/javascripts/Constants/PrefDefaults.ts @@ -36,6 +36,5 @@ export const PrefDefaults = { [PrefKey.NewNoteTitleFormat]: NewNoteTitleFormat.CurrentDateAndTime, [PrefKey.CustomNoteTitleFormat]: 'YYYY-MM-DD [at] hh:mm A', [PrefKey.UpdateSavingStatusIndicator]: true, - [PrefKey.DarkMode]: false, [PrefKey.PaneGesturesEnabled]: true, } as const