From 3951a31c9ba8f5a489c96f4537255dc8177aff74 Mon Sep 17 00:00:00 2001 From: besdar <43372966+besdar@users.noreply.github.com> Date: Fri, 17 Jan 2025 17:36:04 +0000 Subject: [PATCH] Your commit message --- .../src/Domain/Preferences/PreferenceId.ts | 34 +++++++-------- .../src/Domain/Status/StatusService.ts | 28 ++++++------ .../Domain/VaultInvite/VaultInviteService.ts | 3 +- .../AccountMenu/GeneralAccountMenu.tsx | 6 +-- .../ChangeEditor/ChangeEditorMenu.tsx | 3 +- .../Components/Dropdown/Dropdown.tsx | 12 +++--- .../Components/Dropdown/DropdownItem.tsx | 4 +- .../FileContextMenuBackupOption.tsx | 4 +- .../javascripts/Components/Footer/Footer.tsx | 3 +- .../Preferences/Controller/MenuItems.ts | 43 ++++++++++--------- .../PreferencesSessionController.ts | 10 ++--- .../Components/Preferences/PaneSelector.tsx | 29 +++++++------ .../Preferences/PreferencesMenuView.tsx | 5 +-- .../VaultSelectionMenu/VaultSelectionMenu.tsx | 3 +- .../Controllers/PreferencesController.ts | 4 +- 15 files changed, 96 insertions(+), 95 deletions(-) diff --git a/packages/services/src/Domain/Preferences/PreferenceId.ts b/packages/services/src/Domain/Preferences/PreferenceId.ts index 2ef5905d897..9c842875c4b 100644 --- a/packages/services/src/Domain/Preferences/PreferenceId.ts +++ b/packages/services/src/Domain/Preferences/PreferenceId.ts @@ -1,18 +1,16 @@ -const PREFERENCE_PANE_IDS = [ - 'general', - 'account', - 'security', - 'home-server', - 'vaults', - 'appearance', - 'backups', - 'listed', - 'plugins', - 'shortcuts', - 'accessibility', - 'get-free-month', - 'help-feedback', - 'whats-new', -] as const - -export type PreferencePaneId = (typeof PREFERENCE_PANE_IDS)[number] +export enum PreferencePaneId { + General = 'general', + Account = 'account', + Security = 'security', + HomeServer = 'home-server', + Vaults = 'vaults', + Appearance = 'appearance', + Backups = 'backups', + Listed = 'listed', + Plugins = 'plugins', + Shortcuts = 'shortcuts', + Accessibility = 'accessibility', + GetFreeMonth = 'get-free-month', + HelpFeedback = 'help-feedback', + WhatsNew = 'whats-new', +} diff --git a/packages/services/src/Domain/Status/StatusService.ts b/packages/services/src/Domain/Status/StatusService.ts index 094c88f630c..398f190d1c1 100644 --- a/packages/services/src/Domain/Status/StatusService.ts +++ b/packages/services/src/Domain/Status/StatusService.ts @@ -7,20 +7,20 @@ import { PreferencePaneId } from '../Preferences/PreferenceId' export class StatusService extends AbstractService implements StatusServiceInterface { private preferencesBubbleCounts: Record = { - general: 0, - account: 0, - security: 0, - 'home-server': 0, - vaults: 0, - appearance: 0, - backups: 0, - listed: 0, - shortcuts: 0, - plugins: 0, - accessibility: 0, - 'get-free-month': 0, - 'help-feedback': 0, - 'whats-new': 0, + [PreferencePaneId.General]: 0, + [PreferencePaneId.Account]: 0, + [PreferencePaneId.Security]: 0, + [PreferencePaneId.HomeServer]: 0, + [PreferencePaneId.Vaults]: 0, + [PreferencePaneId.Appearance]: 0, + [PreferencePaneId.Backups]: 0, + [PreferencePaneId.Listed]: 0, + [PreferencePaneId.Shortcuts]: 0, + [PreferencePaneId.Plugins]: 0, + [PreferencePaneId.Accessibility]: 0, + [PreferencePaneId.GetFreeMonth]: 0, + [PreferencePaneId.HelpFeedback]: 0, + [PreferencePaneId.WhatsNew]: 0, } getPreferencesBubbleCount(preferencePaneId: PreferencePaneId): number { diff --git a/packages/services/src/Domain/VaultInvite/VaultInviteService.ts b/packages/services/src/Domain/VaultInvite/VaultInviteService.ts index a4ac26cf626..62330892a59 100644 --- a/packages/services/src/Domain/VaultInvite/VaultInviteService.ts +++ b/packages/services/src/Domain/VaultInvite/VaultInviteService.ts @@ -41,6 +41,7 @@ import { StatusServiceInterface } from '../Status/StatusServiceInterface' import { ApplicationEvent } from '../Event/ApplicationEvent' import { WebSocketsServiceEvent } from '../Api/WebSocketsServiceEvent' import { NotificationServiceEvent, NotificationServiceEventPayload } from '../UserEvent/NotificationServiceEvent' +import { PreferencePaneId } from '@standardnotes/snjs' export class VaultInviteService extends AbstractService @@ -101,7 +102,7 @@ export class VaultInviteService } updatePendingInviteCount() { - this.status.setPreferencesBubbleCount('vaults', Object.keys(this.pendingInvites).length) + this.status.setPreferencesBubbleCount(PreferencePaneId.Vaults, Object.keys(this.pendingInvites).length) } addPendingInvite(invite: InviteRecord): void { diff --git a/packages/web/src/javascripts/Components/AccountMenu/GeneralAccountMenu.tsx b/packages/web/src/javascripts/Components/AccountMenu/GeneralAccountMenu.tsx index 0a7f55c948d..180e6b0ecc8 100644 --- a/packages/web/src/javascripts/Components/AccountMenu/GeneralAccountMenu.tsx +++ b/packages/web/src/javascripts/Components/AccountMenu/GeneralAccountMenu.tsx @@ -1,6 +1,6 @@ import { observer } from 'mobx-react-lite' import Icon from '@/Components/Icon/Icon' -import { SyncQueueStrategy } from '@standardnotes/snjs' +import { PreferencePaneId, SyncQueueStrategy } from '@standardnotes/snjs' import { STRING_GENERIC_SYNC_ERROR } from '@/Constants/Strings' import { useCallback, useMemo, useState, FunctionComponent } from 'react' import { AccountMenuPane } from './AccountMenuPane' @@ -57,13 +57,13 @@ const GeneralAccountMenu: FunctionComponent = ({ setMenuPane, closeMenu, const openPreferences = useCallback(() => { application.accountMenuController.closeAccountMenu() - application.preferencesController.setCurrentPane('account') + application.preferencesController.setCurrentPane(PreferencePaneId.Account) application.preferencesController.openPreferences() }, [application]) const openHelp = useCallback(() => { application.accountMenuController.closeAccountMenu() - application.preferencesController.setCurrentPane('help-feedback') + application.preferencesController.setCurrentPane(PreferencePaneId.HelpFeedback) application.preferencesController.openPreferences() }, [application]) diff --git a/packages/web/src/javascripts/Components/ChangeEditor/ChangeEditorMenu.tsx b/packages/web/src/javascripts/Components/ChangeEditor/ChangeEditorMenu.tsx index 1a4aad1cddb..bf997b16575 100644 --- a/packages/web/src/javascripts/Components/ChangeEditor/ChangeEditorMenu.tsx +++ b/packages/web/src/javascripts/Components/ChangeEditor/ChangeEditorMenu.tsx @@ -13,6 +13,7 @@ import { SNNote, ContentType, LocalPrefKey, + PreferencePaneId, } from '@standardnotes/snjs' import { FunctionComponent, useCallback, useEffect, useState } from 'react' import { EditorMenuGroup } from '@/Components/NotesOptions/EditorMenuGroup' @@ -247,7 +248,7 @@ const ChangeEditorMenu: FunctionComponent = ({ } const managePlugins = useCallback(() => { - application.openPreferences('plugins') + application.openPreferences(PreferencePaneId.Plugins) }, [application]) return ( diff --git a/packages/web/src/javascripts/Components/Dropdown/Dropdown.tsx b/packages/web/src/javascripts/Components/Dropdown/Dropdown.tsx index 355ed76ba8a..dda1f325c29 100644 --- a/packages/web/src/javascripts/Components/Dropdown/Dropdown.tsx +++ b/packages/web/src/javascripts/Components/Dropdown/Dropdown.tsx @@ -4,11 +4,11 @@ import { classNames } from '@standardnotes/snjs' import { Select, SelectItem, SelectLabel, SelectPopover, SelectStoreProps, useSelectStore } from '@ariakit/react' import { KeyboardKey } from '@standardnotes/ui-services' -type DropdownProps = { +type DropdownProps = { label: string - items: DropdownItem[] - value: string - onChange: (value: string) => void + items: DropdownItem[] + value: T + onChange: (value: T) => void disabled?: boolean classNameOverride?: { wrapper?: string @@ -20,7 +20,7 @@ type DropdownProps = { showLabel?: boolean } -const Dropdown = ({ +const Dropdown = ({ label, value, onChange, @@ -30,7 +30,7 @@ const Dropdown = ({ classNameOverride = {}, popoverPlacement, showLabel, -}: DropdownProps) => { +}: DropdownProps) => { const select = useSelectStore({ value, setValue: onChange, diff --git a/packages/web/src/javascripts/Components/Dropdown/DropdownItem.tsx b/packages/web/src/javascripts/Components/Dropdown/DropdownItem.tsx index 05aaf556d49..2b8dd3d8f70 100644 --- a/packages/web/src/javascripts/Components/Dropdown/DropdownItem.tsx +++ b/packages/web/src/javascripts/Components/Dropdown/DropdownItem.tsx @@ -1,9 +1,9 @@ import { IconType } from '@standardnotes/snjs' -export type DropdownItem = { +export type DropdownItem = { icon?: IconType iconClassName?: string label: string - value: string + value: T disabled?: boolean } diff --git a/packages/web/src/javascripts/Components/FileContextMenu/FileContextMenuBackupOption.tsx b/packages/web/src/javascripts/Components/FileContextMenu/FileContextMenuBackupOption.tsx index a054b4dbf23..aca394028cb 100644 --- a/packages/web/src/javascripts/Components/FileContextMenu/FileContextMenuBackupOption.tsx +++ b/packages/web/src/javascripts/Components/FileContextMenu/FileContextMenuBackupOption.tsx @@ -1,7 +1,7 @@ import { FunctionComponent, useCallback, useEffect, useState } from 'react' import MenuItem from '../Menu/MenuItem' import { useApplication } from '../ApplicationProvider' -import { FileBackupRecord, FileItem } from '@standardnotes/snjs' +import { FileBackupRecord, FileItem, PreferencePaneId } from '@standardnotes/snjs' import { dateToStringStyle1 } from '@/Utils/DateUtils' import { MenuItemIconSize } from '@/Constants/TailwindClassNames' import MenuSection from '../Menu/MenuSection' @@ -31,7 +31,7 @@ export const FileContextMenuBackupOption: FunctionComponent<{ file: FileItem }> }, [backupInfo, application]) const configureFileBackups = useCallback(() => { - application.openPreferences('backups') + application.openPreferences(PreferencePaneId.Backups) }, [application]) if (!application.fileBackups) { diff --git a/packages/web/src/javascripts/Components/Footer/Footer.tsx b/packages/web/src/javascripts/Components/Footer/Footer.tsx index 0bc7195f7e2..97389b956e4 100644 --- a/packages/web/src/javascripts/Components/Footer/Footer.tsx +++ b/packages/web/src/javascripts/Components/Footer/Footer.tsx @@ -9,6 +9,7 @@ import { StatusServiceEvent, HttpErrorResponseBody, getErrorMessageFromErrorResponseBody, + PreferencePaneId, } from '@standardnotes/snjs' import { STRING_NEW_UPDATE_READY, @@ -343,7 +344,7 @@ class Footer extends AbstractComponent { openPreferences = (openWhatsNew: boolean) => { if (openWhatsNew) { - this.application.preferencesController.setCurrentPane('whats-new') + this.application.preferencesController.setCurrentPane(PreferencePaneId.WhatsNew) } this.application.preferencesController.openPreferences() } diff --git a/packages/web/src/javascripts/Components/Preferences/Controller/MenuItems.ts b/packages/web/src/javascripts/Components/Preferences/Controller/MenuItems.ts index dd8ef437d5e..cf02361f673 100644 --- a/packages/web/src/javascripts/Components/Preferences/Controller/MenuItems.ts +++ b/packages/web/src/javascripts/Components/Preferences/Controller/MenuItems.ts @@ -1,28 +1,29 @@ +import { PreferencePaneId } from '@/__mocks__/@standardnotes/snjs' import { PreferencesMenuItem } from './PreferencesMenuItem' export const PREFERENCES_MENU_ITEMS: PreferencesMenuItem[] = [ - { id: 'whats-new', label: "What's New", icon: 'asterisk', order: 0 }, - { id: 'account', label: 'Account', icon: 'user', order: 1 }, - { id: 'general', label: 'General', icon: 'settings', order: 3 }, - { id: 'security', label: 'Security', icon: 'security', order: 4 }, - { id: 'backups', label: 'Backups', icon: 'restore', order: 5 }, - { id: 'appearance', label: 'Appearance', icon: 'themes', order: 6 }, - { id: 'listed', label: 'Listed', icon: 'listed', order: 7 }, - { id: 'shortcuts', label: 'Shortcuts', icon: 'keyboard', order: 8 }, - { id: 'plugins', label: 'Plugins', icon: 'dashboard', order: 8 }, - { id: 'accessibility', label: 'Accessibility', icon: 'accessibility', order: 9 }, - { id: 'get-free-month', label: 'Get a free month', icon: 'star', order: 10 }, - { id: 'help-feedback', label: 'Help & feedback', icon: 'help', order: 11 }, + { id: PreferencePaneId.WhatsNew, label: "What's New", icon: 'asterisk', order: 0 }, + { id: PreferencePaneId.Account, label: 'Account', icon: 'user', order: 1 }, + { id: PreferencePaneId.General, label: 'General', icon: 'settings', order: 3 }, + { id: PreferencePaneId.Security, label: 'Security', icon: 'security', order: 4 }, + { id: PreferencePaneId.Backups, label: 'Backups', icon: 'restore', order: 5 }, + { id: PreferencePaneId.Appearance, label: 'Appearance', icon: 'themes', order: 6 }, + { id: PreferencePaneId.Listed, label: 'Listed', icon: 'listed', order: 7 }, + { id: PreferencePaneId.Shortcuts, label: 'Shortcuts', icon: 'keyboard', order: 8 }, + { id: PreferencePaneId.Plugins, label: 'Plugins', icon: 'dashboard', order: 8 }, + { id: PreferencePaneId.Accessibility, label: 'Accessibility', icon: 'accessibility', order: 9 }, + { id: PreferencePaneId.GetFreeMonth, label: 'Get a free month', icon: 'star', order: 10 }, + { id: PreferencePaneId.HelpFeedback, label: 'Help & feedback', icon: 'help', order: 11 }, ] export const READY_PREFERENCES_MENU_ITEMS: PreferencesMenuItem[] = [ - { id: 'whats-new', label: "What's New", icon: 'asterisk', order: 0 }, - { id: 'account', label: 'Account', icon: 'user', order: 1 }, - { id: 'general', label: 'General', icon: 'settings', order: 3 }, - { id: 'security', label: 'Security', icon: 'security', order: 4 }, - { id: 'backups', label: 'Backups', icon: 'restore', order: 5 }, - { id: 'appearance', label: 'Appearance', icon: 'themes', order: 6 }, - { id: 'listed', label: 'Listed', icon: 'listed', order: 7 }, - { id: 'plugins', label: 'Plugins', icon: 'dashboard', order: 8 }, - { id: 'help-feedback', label: 'Help & feedback', icon: 'help', order: 11 }, + { id: PreferencePaneId.WhatsNew, label: "What's New", icon: 'asterisk', order: 0 }, + { id: PreferencePaneId.Account, label: 'Account', icon: 'user', order: 1 }, + { id: PreferencePaneId.General, label: 'General', icon: 'settings', order: 3 }, + { id: PreferencePaneId.Security, label: 'Security', icon: 'security', order: 4 }, + { id: PreferencePaneId.Backups, label: 'Backups', icon: 'restore', order: 5 }, + { id: PreferencePaneId.Appearance, label: 'Appearance', icon: 'themes', order: 6 }, + { id: PreferencePaneId.Listed, label: 'Listed', icon: 'listed', order: 7 }, + { id: PreferencePaneId.Plugins, label: 'Plugins', icon: 'dashboard', order: 8 }, + { id: PreferencePaneId.HelpFeedback, label: 'Help & feedback', icon: 'help', order: 11 }, ] diff --git a/packages/web/src/javascripts/Components/Preferences/Controller/PreferencesSessionController.ts b/packages/web/src/javascripts/Components/Preferences/Controller/PreferencesSessionController.ts index ae0d89e3ee8..bc183a3c0b8 100644 --- a/packages/web/src/javascripts/Components/Preferences/Controller/PreferencesSessionController.ts +++ b/packages/web/src/javascripts/Components/Preferences/Controller/PreferencesSessionController.ts @@ -13,7 +13,7 @@ import { PREFERENCES_MENU_ITEMS, READY_PREFERENCES_MENU_ITEMS } from './MenuItem * Preferences menu. It is created and destroyed each time the menu is opened and closed. */ export class PreferencesSessionController { - private _selectedPane: PreferencePaneId = 'account' + private _selectedPane: PreferencePaneId = PreferencePaneId.Account private _menu: PreferencesMenuItem[] private _extensionLatestVersions: PackageProvider = new PackageProvider(new Map()) @@ -26,11 +26,11 @@ export class PreferencesSessionController { : READY_PREFERENCES_MENU_ITEMS.slice() if (application.featuresController.isVaultsEnabled()) { - menuItems.push({ id: 'vaults', label: 'Vaults', icon: 'safe-square', order: 5 }) + menuItems.push({ id: PreferencePaneId.Vaults, label: 'Vaults', icon: 'safe-square', order: 5 }) } if (isDesktopApplication()) { - menuItems.push({ id: 'home-server', label: 'Home Server', icon: 'server', order: 5 }) + menuItems.push({ id: PreferencePaneId.HomeServer, label: 'Home Server', icon: 'server', order: 5 }) } this._menu = menuItems.sort((a, b) => a.order - b.order) @@ -107,7 +107,7 @@ export class PreferencesSessionController { return this.selectedMenuItem.id } - return 'account' + return PreferencePaneId.Account } selectPane = (key: PreferencePaneId) => { @@ -115,7 +115,7 @@ export class PreferencesSessionController { } sectionHasBubble(id: PreferencePaneId): boolean { - if (id === 'security') { + if (id === PreferencePaneId.Security) { return securityPrefsHasBubble(this.application) } diff --git a/packages/web/src/javascripts/Components/Preferences/PaneSelector.tsx b/packages/web/src/javascripts/Components/Preferences/PaneSelector.tsx index 798046c01f1..5e0de63dbc9 100644 --- a/packages/web/src/javascripts/Components/Preferences/PaneSelector.tsx +++ b/packages/web/src/javascripts/Components/Preferences/PaneSelector.tsx @@ -13,39 +13,40 @@ import WhatsNew from './Panes/WhatsNew/WhatsNew' import HomeServer from './Panes/HomeServer/HomeServer' import Vaults from './Panes/Vaults/Vaults' import PluginsPane from './Panes/Plugins/PluginsPane' +import { PreferencePaneId } from '@standardnotes/snjs' const PaneSelector: FunctionComponent = ({ menu, application, }) => { switch (menu.selectedPaneId) { - case 'general': + case PreferencePaneId.General: return - case 'account': + case PreferencePaneId.Account: return - case 'appearance': + case PreferencePaneId.Appearance: return - case 'home-server': + case PreferencePaneId.HomeServer: return - case 'security': + case PreferencePaneId.Security: return - case 'vaults': + case PreferencePaneId.Vaults: return - case 'backups': + case PreferencePaneId.Backups: return - case 'listed': + case PreferencePaneId.Listed: return - case 'shortcuts': + case PreferencePaneId.Shortcuts: return null - case 'plugins': + case PreferencePaneId.Plugins: return - case 'accessibility': + case PreferencePaneId.Accessibility: return null - case 'get-free-month': + case PreferencePaneId.GetFreeMonth: return null - case 'help-feedback': + case PreferencePaneId.HelpFeedback: return - case 'whats-new': + case PreferencePaneId.WhatsNew: return default: return diff --git a/packages/web/src/javascripts/Components/Preferences/PreferencesMenuView.tsx b/packages/web/src/javascripts/Components/Preferences/PreferencesMenuView.tsx index 74674b8bddc..019ff02e5d5 100644 --- a/packages/web/src/javascripts/Components/Preferences/PreferencesMenuView.tsx +++ b/packages/web/src/javascripts/Components/Preferences/PreferencesMenuView.tsx @@ -4,7 +4,6 @@ import Dropdown from '../Dropdown/Dropdown' import { DropdownItem } from '../Dropdown/DropdownItem' import PreferencesMenuItem from './PreferencesComponents/MenuItem' import { PreferencesSessionController } from './Controller/PreferencesSessionController' -import { PreferencePaneId } from '@standardnotes/services' type Props = { menu: PreferencesSessionController @@ -45,9 +44,7 @@ const PreferencesMenuView: FunctionComponent = ({ menu }) => { items={dropdownMenuItems} label="Preferences Menu" value={selectedPaneId} - onChange={(paneId) => { - selectPane(paneId as PreferencePaneId) - }} + onChange={selectPane} classNameOverride={{ wrapper: 'relative', button: 'focus:outline-none focus:shadow-none focus:ring-none', diff --git a/packages/web/src/javascripts/Components/VaultSelectionMenu/VaultSelectionMenu.tsx b/packages/web/src/javascripts/Components/VaultSelectionMenu/VaultSelectionMenu.tsx index 85ad082053a..8f1c99fcac7 100644 --- a/packages/web/src/javascripts/Components/VaultSelectionMenu/VaultSelectionMenu.tsx +++ b/packages/web/src/javascripts/Components/VaultSelectionMenu/VaultSelectionMenu.tsx @@ -7,6 +7,7 @@ import SingleVaultSelectionMenu from './SingleVaultSelectionMenu' import { useApplication } from '../ApplicationProvider' import MenuItemSeparator from '../Menu/MenuItemSeparator' import MenuItem from '../Menu/MenuItem' +import { PreferencePaneId } from '@/__mocks__/@standardnotes/snjs' type SettingsMode = 'many' | 'single' @@ -44,7 +45,7 @@ const VaultSelectionMenu = () => { { - application.preferencesController.openPreferences('vaults') + application.preferencesController.openPreferences(PreferencePaneId.Vaults) }} > Open vault settings diff --git a/packages/web/src/javascripts/Controllers/PreferencesController.ts b/packages/web/src/javascripts/Controllers/PreferencesController.ts index 4319e09e475..adaa0a15989 100644 --- a/packages/web/src/javascripts/Controllers/PreferencesController.ts +++ b/packages/web/src/javascripts/Controllers/PreferencesController.ts @@ -4,11 +4,11 @@ import { RootQueryParam, RouteServiceInterface } from '@standardnotes/ui-service import { AbstractViewController } from './Abstract/AbstractViewController' import { PreferencePaneId } from '@standardnotes/services' -const DEFAULT_PANE: PreferencePaneId = 'account' +const DEFAULT_PANE = PreferencePaneId.Account export class PreferencesController extends AbstractViewController { private _open = false - currentPane: PreferencePaneId = DEFAULT_PANE + currentPane = DEFAULT_PANE constructor( private routeService: RouteServiceInterface,