From 54125cec212e380f2443850cf4be2d28967aff87 Mon Sep 17 00:00:00 2001 From: Mo Date: Wed, 1 Jun 2022 10:15:45 -0500 Subject: [PATCH] refactor: rename states to view controllers (#1060) --- .babelrc | 12 +- app/assets/javascripts/App.tsx | 4 +- .../{UIModels => Application}/Application.ts | 8 +- .../ApplicationGroup.ts | 6 +- .../Components/Abstract/PureComponent.tsx | 19 +- .../Components/AccountMenu/AccountMenu.tsx | 27 +- .../AccountMenu/AdvancedOptions.tsx | 10 +- .../AccountMenu/ConfirmPassword.tsx | 22 +- .../Components/AccountMenu/CreateAccount.tsx | 10 +- .../AccountMenu/GeneralAccountMenu.tsx | 39 +-- .../AccountMenu/MenuPaneSelector.tsx | 20 +- .../Components/AccountMenu/SignIn.tsx | 16 +- .../Components/AccountMenu/User.tsx | 15 +- .../WorkspaceSwitcherMenu.tsx | 16 +- .../WorkspaceSwitcherOption.tsx | 14 +- .../ApplicationGroupView.tsx | 4 +- .../ApplicationView/ApplicationView.tsx | 41 +-- .../AttachedFilesButton.tsx | 36 ++- .../AttachedFilesPopover.tsx | 10 +- .../ChallengeModal/ChallengeModal.tsx | 15 +- .../LockscreenWorkspaceSwitcher.tsx | 10 +- .../ChangeEditor/ChangeEditorButton.tsx | 14 +- .../ChangeEditor/ChangeEditorMenu.tsx | 4 +- .../ChangeEditor/createEditorMenuGroups.ts | 2 +- .../ComponentView/ComponentView.tsx | 8 +- .../ConfirmSignoutModal.tsx | 16 +- .../ContentListView/ContentList.tsx | 23 +- .../ContentListView/ContentListItem.tsx | 4 +- .../ContentListOptionsMenu.tsx | 10 +- .../ContentListView/ContentListView.tsx | 38 +-- .../ContentListView/FileListItem.tsx | 28 +- .../ContentListView/NoteListItem.tsx | 12 +- .../Types/AbstractListItemProps.ts | 6 +- .../DeallocateHandler/DeallocateHandler.tsx | 2 +- .../FileContextMenu/FileContextMenu.tsx | 24 +- .../Components/Files/FilePreviewModal.tsx | 26 +- .../javascripts/Components/Footer/Footer.tsx | 45 +-- .../MultipleSelectedNotes.tsx | 18 +- .../Components/Navigation/Navigation.tsx | 18 +- .../NoAccountWarning/NoAccountWarning.tsx | 20 +- .../NoteGroupView/NoteGroupView.tsx | 8 +- .../Components/NoteTags/NoteTag.tsx | 38 +-- .../Components/NoteTags/NoteTagsContainer.tsx | 16 +- .../Components/NoteView/NoteView.test.ts | 20 +- .../Components/NoteView/NoteView.tsx | 32 +- .../Components/NoteView/NoteViewProps.ts | 2 +- .../NotesContextMenu/NotesContextMenu.tsx | 22 +- .../Components/NotesOptions/AddTagOption.tsx | 18 +- .../NotesOptions/ChangeEditorOption.tsx | 6 +- .../NotesOptions/ListedActionsOption.tsx | 2 +- .../Components/NotesOptions/NotesOptions.tsx | 54 ++-- .../NotesOptions/NotesOptionsPanel.tsx | 16 +- .../NotesOptions/NotesOptionsProps.ts | 6 +- .../OtherSessionsSignOut.tsx | 14 +- .../PasswordWizard/PasswordWizard.tsx | 2 +- .../PermissionsModal/PermissionsModal.tsx | 2 +- .../PermissionsModalWrapper.tsx | 2 +- .../PinNoteButton/PinNoteButton.tsx | 18 +- .../Components/Preferences/PaneSelector.tsx | 17 +- .../Panes/Account/AccountPreferences.tsx | 20 +- .../Preferences/Panes/Account/Advanced.tsx | 10 +- .../Panes/Account/Authentication.tsx | 20 +- .../Panes/Account/ChangeEmail/ChangeEmail.tsx | 2 +- .../Panes/Account/ClearSessionDataView.tsx | 8 +- .../Preferences/Panes/Account/Credentials.tsx | 6 +- .../Preferences/Panes/Account/Files.tsx | 2 +- .../Panes/Account/OfflineSubscription.tsx | 6 +- .../Preferences/Panes/Account/SignOutView.tsx | 26 +- .../Account/Subscription/NoSubscription.tsx | 2 +- .../Panes/Account/Subscription/StatusText.tsx | 4 +- .../Account/Subscription/Subscription.tsx | 10 +- .../Subscription/SubscriptionInformation.tsx | 6 +- .../Preferences/Panes/Account/Sync.tsx | 2 +- .../Preferences/Panes/Appearance.tsx | 2 +- .../Preferences/Panes/Backups/Backups.tsx | 10 +- .../CloudBackups/CloudBackupProvider.tsx | 2 +- .../Backups/CloudBackups/CloudBackups.tsx | 2 +- .../Preferences/Panes/Backups/DataBackups.tsx | 10 +- .../Panes/Backups/EmailBackups.tsx | 2 +- .../Panes/Backups/Files/BackupsDropZone.tsx | 2 +- .../Files/FileBackupsCrossPlatform.tsx | 2 +- .../Backups/Files/FileBackupsDesktop.tsx | 2 +- .../Panes/Extensions/ExtensionItemProps.tsx | 2 +- .../Panes/Extensions/Extensions.tsx | 2 +- .../Extensions/ExtensionsLatestVersions.ts | 2 +- .../Preferences/Panes/General/Defaults.tsx | 4 +- .../Preferences/Panes/General/General.tsx | 14 +- .../Preferences/Panes/General/Labs.tsx | 2 +- .../Preferences/Panes/General/Tools.tsx | 2 +- .../Preferences/Panes/Listed/Listed.tsx | 2 +- .../Panes/Listed/ListedAccountItem.tsx | 2 +- .../Preferences/Panes/Security/Encryption.tsx | 10 +- .../Panes/Security/EncryptionEnabled.tsx | 8 +- .../Panes/Security/ErroredItems.tsx | 8 +- .../Panes/Security/PasscodeLock.tsx | 11 +- .../Preferences/Panes/Security/Privacy.tsx | 2 +- .../Panes/Security/Protections.tsx | 2 +- .../Preferences/Panes/Security/Security.tsx | 14 +- .../Panes/Security/securityPrefsHasBubble.tsx | 2 +- .../Components/Preferences/PreferencesMenu.ts | 2 +- .../Preferences/PreferencesProps.tsx | 6 +- .../Preferences/PreferencesView.tsx | 6 +- .../Preferences/PreferencesViewWrapper.tsx | 11 +- .../PreferencesViewWrapperProps.tsx | 6 +- .../PremiumFeaturesModal.tsx | 2 +- .../ProtectedNoteOverlay.tsx | 8 +- .../PurchaseFlow/Panes/CreateAccount.tsx | 12 +- .../Components/PurchaseFlow/Panes/SignIn.tsx | 12 +- .../PurchaseFlow/PurchaseFlowFunctions.ts | 2 +- .../PurchaseFlow/PurchaseFlowView.tsx | 28 +- .../PurchaseFlow/PurchaseFlowWrapper.tsx | 6 +- .../PurchaseFlow/PurchaseFlowWrapperProps.tsx | 6 +- .../QuickSettingsMenu/FocusModeSwitch.tsx | 2 +- .../QuickSettingsMenu/QuickSettingsMenu.tsx | 14 +- .../QuickSettingsMenu/ThemesMenuButton.tsx | 2 +- .../HistoryListContainer.tsx | 2 +- .../RemoteHistoryList.tsx | 2 +- .../RevisionContentLocked.tsx | 9 +- .../RevisionHistoryModalWrapper.tsx | 39 ++- .../SelectedRevisionContent.tsx | 10 +- .../SearchOptions/SearchOptions.tsx | 10 +- .../SessionsModal/SessionsModal.tsx | 18 +- .../SyncResolutionMenu/SyncResolutionMenu.tsx | 2 +- .../TagAutocomplete/AutocompleteTagHint.tsx | 32 +- .../TagAutocomplete/AutocompleteTagInput.tsx | 36 ++- .../TagAutocomplete/AutocompleteTagResult.tsx | 34 +- .../Components/Tags/RootTagDropZone.tsx | 8 +- .../Components/Tags/SmartViewsList.tsx | 17 +- .../Components/Tags/SmartViewsListItem.tsx | 8 +- .../Components/Tags/SmartViewsSection.tsx | 8 +- .../Components/Tags/TagContextMenu.tsx | 48 +-- .../javascripts/Components/Tags/TagsList.tsx | 27 +- .../Components/Tags/TagsListItem.tsx | 8 +- .../Components/Tags/TagsSection.tsx | 33 +- .../Components/Tags/TagsSectionAddButton.tsx | 8 +- .../Components/Tags/TagsSectionTitle.tsx | 4 +- .../Abstract/AbstractViewController.ts | 14 + .../Abstract/IsControllerDealloced.ts | 5 + .../AccountMenu/AccountMenuController.ts} | 14 +- .../AccountMenu/StructuredItemsCount.ts | 6 + .../ActionsMenuController.ts} | 2 +- .../FeaturesController.ts} | 6 +- .../FilePreviewModalController.ts} | 2 +- .../FilesController.ts} | 28 +- .../ItemList/ItemListController.ts} | 101 +++--- .../ItemList}/WebDisplayOptions.ts | 0 .../Controllers/Navigation/AnyTagType.ts | 3 + .../Navigation/TagsController.ts} | 60 +--- .../Controllers/Navigation/Utils.ts | 38 +++ .../NoAccountWarningController.ts} | 6 +- .../NoteTagsController.ts} | 24 +- .../NotesController.ts} | 40 +-- .../PreferencesController.ts} | 4 +- .../PurchaseFlow/PurchaseFlowController.ts} | 6 +- .../PurchaseFlow}/PurchaseFlowPane.ts | 0 .../QuickSettingsController.ts} | 2 +- .../SearchOptionsController.ts} | 6 +- .../SelectedItemsController.ts} | 18 +- .../AvailableSubscriptionsType.ts | 5 + .../Subscription/SubscriptionController.ts} | 20 +- .../Subscription/SubscriptionType.ts | 5 + .../SyncStatusController.ts} | 2 +- .../javascripts/Hooks/usePremiumModal.tsx | 82 ++--- .../javascripts/Services/ArchiveManager.ts | 2 +- .../javascripts/Services/DesktopManager.ts | 6 +- .../javascripts/Services/ThemeManager.ts | 2 +- .../ViewControllerManager.ts | 298 ++++++++++++++++++ .../ViewControllerManagerEvent.ts} | 2 +- .../Services/ViewControllerManager/index.ts | 2 + .../javascripts/Typings/EditorEventSource.ts | 4 + .../javascripts/Typings/PanelResizedData.ts | 4 + .../UIModels/AppState/AbstractState.ts | 23 -- .../javascripts/UIModels/AppState/AppState.ts | 298 ------------------ .../UIModels/AppState/EventSource.ts | 4 - .../javascripts/UIModels/AppState/index.ts | 4 - app/assets/javascripts/Utils/DragTypeCheck.ts | 2 +- app/assets/javascripts/tsconfig.json | 31 +- 177 files changed, 1518 insertions(+), 1365 deletions(-) rename app/assets/javascripts/{UIModels => Application}/Application.ts (94%) rename app/assets/javascripts/{UIModels => Application}/ApplicationGroup.ts (92%) create mode 100644 app/assets/javascripts/Controllers/Abstract/AbstractViewController.ts create mode 100644 app/assets/javascripts/Controllers/Abstract/IsControllerDealloced.ts rename app/assets/javascripts/{UIModels/AppState/AccountMenuState.ts => Controllers/AccountMenu/AccountMenuController.ts} (94%) create mode 100644 app/assets/javascripts/Controllers/AccountMenu/StructuredItemsCount.ts rename app/assets/javascripts/{UIModels/AppState/ActionsMenuState.ts => Controllers/ActionsMenuController.ts} (93%) rename app/assets/javascripts/{UIModels/AppState/FeaturesState.ts => Controllers/FeaturesController.ts} (93%) rename app/assets/javascripts/{UIModels/AppState/FilePreviewModalState.ts => Controllers/FilePreviewModalController.ts} (94%) rename app/assets/javascripts/{UIModels/AppState/FilesState.ts => Controllers/FilesController.ts} (92%) rename app/assets/javascripts/{UIModels/AppState/ContentListViewState.ts => Controllers/ItemList/ItemListController.ts} (80%) rename app/assets/javascripts/{UIModels/AppState => Controllers/ItemList}/WebDisplayOptions.ts (100%) create mode 100644 app/assets/javascripts/Controllers/Navigation/AnyTagType.ts rename app/assets/javascripts/{UIModels/AppState/TagsState.ts => Controllers/Navigation/TagsController.ts} (89%) create mode 100644 app/assets/javascripts/Controllers/Navigation/Utils.ts rename app/assets/javascripts/{UIModels/AppState/NoAccountWarningState.ts => Controllers/NoAccountWarningController.ts} (83%) rename app/assets/javascripts/{UIModels/AppState/NoteTagsState.ts => Controllers/NoteTagsController.ts} (88%) rename app/assets/javascripts/{UIModels/AppState/NotesState.ts => Controllers/NotesController.ts} (87%) rename app/assets/javascripts/{UIModels/AppState/PreferencesState.ts => Controllers/PreferencesController.ts} (88%) rename app/assets/javascripts/{UIModels/AppState/PurchaseFlowState.ts => Controllers/PurchaseFlow/PurchaseFlowController.ts} (81%) rename app/assets/javascripts/{UIModels/AppState => Controllers/PurchaseFlow}/PurchaseFlowPane.ts (100%) rename app/assets/javascripts/{UIModels/AppState/QuickSettingsState.ts => Controllers/QuickSettingsController.ts} (96%) rename app/assets/javascripts/{UIModels/AppState/SearchOptionsState.ts => Controllers/SearchOptionsController.ts} (88%) rename app/assets/javascripts/{UIModels/AppState/SelectedItemsState.ts => Controllers/SelectedItemsController.ts} (89%) create mode 100644 app/assets/javascripts/Controllers/Subscription/AvailableSubscriptionsType.ts rename app/assets/javascripts/{UIModels/AppState/SubscriptionState.ts => Controllers/Subscription/SubscriptionController.ts} (91%) create mode 100644 app/assets/javascripts/Controllers/Subscription/SubscriptionType.ts rename app/assets/javascripts/{UIModels/AppState/SyncState.ts => Controllers/SyncStatusController.ts} (96%) create mode 100644 app/assets/javascripts/Services/ViewControllerManager/ViewControllerManager.ts rename app/assets/javascripts/{UIModels/AppState/AppStateEvent.ts => Services/ViewControllerManager/ViewControllerManagerEvent.ts} (78%) create mode 100644 app/assets/javascripts/Services/ViewControllerManager/index.ts create mode 100644 app/assets/javascripts/Typings/EditorEventSource.ts create mode 100644 app/assets/javascripts/Typings/PanelResizedData.ts delete mode 100644 app/assets/javascripts/UIModels/AppState/AbstractState.ts delete mode 100644 app/assets/javascripts/UIModels/AppState/AppState.ts delete mode 100644 app/assets/javascripts/UIModels/AppState/EventSource.ts delete mode 100644 app/assets/javascripts/UIModels/AppState/index.ts diff --git a/.babelrc b/.babelrc index 643b8d31e..d5e8e32f5 100644 --- a/.babelrc +++ b/.babelrc @@ -1,12 +1,4 @@ { - "presets": [ - "@babel/preset-typescript", - "@babel/preset-env" - ], - "plugins": [ - ["@babel/plugin-transform-react-jsx", { - "pragma": "h", - "pragmaFrag": "Fragment" - }] - ] + "presets": ["@babel/preset-typescript", "@babel/preset-env"], + "plugins": [["@babel/plugin-transform-react-jsx"]] } diff --git a/app/assets/javascripts/App.tsx b/app/assets/javascripts/App.tsx index 710f35274..22134ef52 100644 --- a/app/assets/javascripts/App.tsx +++ b/app/assets/javascripts/App.tsx @@ -25,9 +25,9 @@ import { DesktopManagerInterface, SNLog } from '@standardnotes/snjs' import ApplicationGroupView from './Components/ApplicationGroupView/ApplicationGroupView' import { WebDevice } from './Device/WebDevice' import { StartApplication } from './Device/StartApplication' -import { ApplicationGroup } from './UIModels/ApplicationGroup' +import { ApplicationGroup } from './Application/ApplicationGroup' import { WebOrDesktopDevice } from './Device/WebOrDesktopDevice' -import { WebApplication } from './UIModels/Application' +import { WebApplication } from './Application/Application' import { createRoot, Root } from 'react-dom/client' let keyCount = 0 diff --git a/app/assets/javascripts/UIModels/Application.ts b/app/assets/javascripts/Application/Application.ts similarity index 94% rename from app/assets/javascripts/UIModels/Application.ts rename to app/assets/javascripts/Application/Application.ts index 76d746fd5..b6e9cb744 100644 --- a/app/assets/javascripts/UIModels/Application.ts +++ b/app/assets/javascripts/Application/Application.ts @@ -5,7 +5,7 @@ import { AutolockService } from '@/Services/AutolockService' import { DesktopManager } from '@/Services/DesktopManager' import { IOService } from '@/Services/IOService' import { ThemeManager } from '@/Services/ThemeManager' -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { WebOrDesktopDevice } from '@/Device/WebOrDesktopDevice' import { DeinitSource, @@ -21,7 +21,7 @@ import { import { makeObservable, observable } from 'mobx' type WebServices = { - appState: AppState + viewControllerManager: ViewControllerManager desktopService?: DesktopManager autolockService: AutolockService archiveService: ArchiveManager @@ -116,8 +116,8 @@ export class WebApplication extends SNApplication { } } - public getAppState(): AppState { - return this.webServices.appState + public getViewControllerManager(): ViewControllerManager { + return this.webServices.viewControllerManager } public getDesktopService(): DesktopManager | undefined { diff --git a/app/assets/javascripts/UIModels/ApplicationGroup.ts b/app/assets/javascripts/Application/ApplicationGroup.ts similarity index 92% rename from app/assets/javascripts/UIModels/ApplicationGroup.ts rename to app/assets/javascripts/Application/ApplicationGroup.ts index ba77e21b6..28e554e15 100644 --- a/app/assets/javascripts/UIModels/ApplicationGroup.ts +++ b/app/assets/javascripts/Application/ApplicationGroup.ts @@ -6,7 +6,7 @@ import { InternalEventBus, isDesktopDevice, } from '@standardnotes/snjs' -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { getPlatform, isDesktopApplication } from '@/Utils' import { ArchiveManager } from '@/Services/ArchiveManager' import { DesktopManager } from '@/Services/DesktopManager' @@ -32,14 +32,14 @@ const createApplication = ( webSocketUrl, ) - const appState = new AppState(application, device) + const viewControllerManager = new ViewControllerManager(application, device) const archiveService = new ArchiveManager(application) const io = new IOService(platform === Platform.MacWeb || platform === Platform.MacDesktop) const autolockService = new AutolockService(application, new InternalEventBus()) const themeService = new ThemeManager(application) application.setWebServices({ - appState, + viewControllerManager, archiveService, desktopService: isDesktopDevice(device) ? new DesktopManager(application, device) : undefined, io, diff --git a/app/assets/javascripts/Components/Abstract/PureComponent.tsx b/app/assets/javascripts/Components/Abstract/PureComponent.tsx index 353c0f93f..831d058c2 100644 --- a/app/assets/javascripts/Components/Abstract/PureComponent.tsx +++ b/app/assets/javascripts/Components/Abstract/PureComponent.tsx @@ -1,8 +1,9 @@ import { ApplicationEvent } from '@standardnotes/snjs' -import { WebApplication } from '@/UIModels/Application' -import { AppState, AppStateEvent } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ViewControllerManager, ViewControllerManagerEvent } from '@/Services/ViewControllerManager' import { autorun, IReactionDisposer, IReactionPublic } from 'mobx' import { Component } from 'react' + export type PureComponentState = Partial> export type PureComponentProps = Partial> @@ -17,7 +18,7 @@ export abstract class PureComponent

void): void { this.reactionDisposers.push(autorun(view)) } - addAppStateObserver() { - this.unsubState = this.application.getAppState().addObserver(async (eventName, data) => { - this.onAppStateEvent(eventName, data) + addViewControllerManagerObserver() { + this.unsubState = this.application.getViewControllerManager().addObserver(async (eventName, data) => { + this.onViewControllerManagerEvent(eventName, data) }) } - onAppStateEvent(_eventName: AppStateEvent, _data: unknown) { + onViewControllerManagerEvent(_eventName: ViewControllerManagerEvent, _data: unknown) { /** Optional override */ } diff --git a/app/assets/javascripts/Components/AccountMenu/AccountMenu.tsx b/app/assets/javascripts/Components/AccountMenu/AccountMenu.tsx index 1e5d60069..0aec88f39 100644 --- a/app/assets/javascripts/Components/AccountMenu/AccountMenu.tsx +++ b/app/assets/javascripts/Components/AccountMenu/AccountMenu.tsx @@ -1,31 +1,36 @@ import { observer } from 'mobx-react-lite' import { useCloseOnClickOutside } from '@/Hooks/useCloseOnClickOutside' -import { AppState } from '@/UIModels/AppState' -import { WebApplication } from '@/UIModels/Application' +import { ViewControllerManager } from '@/Services/ViewControllerManager' +import { WebApplication } from '@/Application/Application' import { useCallback, useRef, FunctionComponent, KeyboardEventHandler } from 'react' -import { ApplicationGroup } from '@/UIModels/ApplicationGroup' +import { ApplicationGroup } from '@/Application/ApplicationGroup' import { AccountMenuPane } from './AccountMenuPane' import MenuPaneSelector from './MenuPaneSelector' type Props = { - appState: AppState + viewControllerManager: ViewControllerManager application: WebApplication onClickOutside: () => void mainApplicationGroup: ApplicationGroup } -const AccountMenu: FunctionComponent = ({ application, appState, onClickOutside, mainApplicationGroup }) => { - const { currentPane, shouldAnimateCloseMenu } = appState.accountMenu +const AccountMenu: FunctionComponent = ({ + application, + viewControllerManager, + onClickOutside, + mainApplicationGroup, +}) => { + const { currentPane, shouldAnimateCloseMenu } = viewControllerManager.accountMenuController const closeAccountMenu = useCallback(() => { - appState.accountMenu.closeAccountMenu() - }, [appState]) + viewControllerManager.accountMenuController.closeAccountMenu() + }, [viewControllerManager]) const setCurrentPane = useCallback( (pane: AccountMenuPane) => { - appState.accountMenu.setCurrentPane(pane) + viewControllerManager.accountMenuController.setCurrentPane(pane) }, - [appState], + [viewControllerManager], ) const ref = useRef(null) @@ -59,7 +64,7 @@ const AccountMenu: FunctionComponent = ({ application, appState, onClickO onKeyDown={handleKeyDown} > void onStrictSignInChange?: (isStrictSignIn: boolean) => void } const AdvancedOptions: FunctionComponent = ({ - appState, + viewControllerManager, application, disabled = false, onPrivateWorkspaceChange, onStrictSignInChange, children, }) => { - const { server, setServer, enableServerOption, setEnableServerOption } = appState.accountMenu + const { server, setServer, enableServerOption, setEnableServerOption } = viewControllerManager.accountMenuController const [showAdvanced, setShowAdvanced] = useState(false) const [isPrivateWorkspace, setIsPrivateWorkspace] = useState(false) diff --git a/app/assets/javascripts/Components/AccountMenu/ConfirmPassword.tsx b/app/assets/javascripts/Components/AccountMenu/ConfirmPassword.tsx index 84570701f..935d93867 100644 --- a/app/assets/javascripts/Components/AccountMenu/ConfirmPassword.tsx +++ b/app/assets/javascripts/Components/AccountMenu/ConfirmPassword.tsx @@ -1,6 +1,6 @@ import { STRING_NON_MATCHING_PASSWORDS } from '@/Strings' -import { WebApplication } from '@/UIModels/Application' -import { AppState } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { observer } from 'mobx-react-lite' import { FunctionComponent, KeyboardEventHandler, useCallback, useEffect, useRef, useState } from 'react' import { AccountMenuPane } from './AccountMenuPane' @@ -11,15 +11,21 @@ import Icon from '@/Components/Icon/Icon' import IconButton from '@/Components/Button/IconButton' type Props = { - appState: AppState + viewControllerManager: ViewControllerManager application: WebApplication setMenuPane: (pane: AccountMenuPane) => void email: string password: string } -const ConfirmPassword: FunctionComponent = ({ application, appState, setMenuPane, email, password }) => { - const { notesAndTagsCount } = appState.accountMenu +const ConfirmPassword: FunctionComponent = ({ + application, + viewControllerManager, + setMenuPane, + email, + password, +}) => { + const { notesAndTagsCount } = viewControllerManager.accountMenuController const [confirmPassword, setConfirmPassword] = useState('') const [isRegistering, setIsRegistering] = useState(false) const [isEphemeral, setIsEphemeral] = useState(false) @@ -61,8 +67,8 @@ const ConfirmPassword: FunctionComponent = ({ application, appState, setM if (res.error) { throw new Error(res.error.message) } - appState.accountMenu.closeAccountMenu() - appState.accountMenu.setCurrentPane(AccountMenuPane.GeneralMenu) + viewControllerManager.accountMenuController.closeAccountMenu() + viewControllerManager.accountMenuController.setCurrentPane(AccountMenuPane.GeneralMenu) }) .catch((err) => { console.error(err) @@ -77,7 +83,7 @@ const ConfirmPassword: FunctionComponent = ({ application, appState, setM passwordInputRef.current?.focus() } }, - [appState, application, confirmPassword, email, isEphemeral, password, shouldMergeLocal], + [viewControllerManager, application, confirmPassword, email, isEphemeral, password, shouldMergeLocal], ) const handleKeyDown: KeyboardEventHandler = useCallback( diff --git a/app/assets/javascripts/Components/AccountMenu/CreateAccount.tsx b/app/assets/javascripts/Components/AccountMenu/CreateAccount.tsx index dd451fda9..9a9067b85 100644 --- a/app/assets/javascripts/Components/AccountMenu/CreateAccount.tsx +++ b/app/assets/javascripts/Components/AccountMenu/CreateAccount.tsx @@ -1,5 +1,5 @@ -import { WebApplication } from '@/UIModels/Application' -import { AppState } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { observer } from 'mobx-react-lite' import { FunctionComponent, KeyboardEventHandler, useCallback, useEffect, useRef, useState } from 'react' import { AccountMenuPane } from './AccountMenuPane' @@ -11,7 +11,7 @@ import IconButton from '@/Components/Button/IconButton' import AdvancedOptions from './AdvancedOptions' type Props = { - appState: AppState + viewControllerManager: ViewControllerManager application: WebApplication setMenuPane: (pane: AccountMenuPane) => void email: string @@ -21,7 +21,7 @@ type Props = { } const CreateAccount: FunctionComponent = ({ - appState, + viewControllerManager, application, setMenuPane, email, @@ -137,7 +137,7 @@ const CreateAccount: FunctionComponent = ({

diff --git a/app/assets/javascripts/Components/AccountMenu/GeneralAccountMenu.tsx b/app/assets/javascripts/Components/AccountMenu/GeneralAccountMenu.tsx index ad54a6869..13d7f783b 100644 --- a/app/assets/javascripts/Components/AccountMenu/GeneralAccountMenu.tsx +++ b/app/assets/javascripts/Components/AccountMenu/GeneralAccountMenu.tsx @@ -1,5 +1,5 @@ -import { WebApplication } from '@/UIModels/Application' -import { AppState } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { observer } from 'mobx-react-lite' import Icon from '@/Components/Icon/Icon' import { SyncQueueStrategy } from '@standardnotes/snjs' @@ -11,11 +11,11 @@ import MenuItem from '@/Components/Menu/MenuItem' import MenuItemSeparator from '@/Components/Menu/MenuItemSeparator' import { MenuItemType } from '@/Components/Menu/MenuItemType' import WorkspaceSwitcherOption from './WorkspaceSwitcher/WorkspaceSwitcherOption' -import { ApplicationGroup } from '@/UIModels/ApplicationGroup' +import { ApplicationGroup } from '@/Application/ApplicationGroup' import { formatLastSyncDate } from '@/Utils/FormatLastSyncDate' type Props = { - appState: AppState + viewControllerManager: ViewControllerManager application: WebApplication mainApplicationGroup: ApplicationGroup setMenuPane: (pane: AccountMenuPane) => void @@ -26,7 +26,7 @@ const iconClassName = 'color-neutral mr-2' const GeneralAccountMenu: FunctionComponent = ({ application, - appState, + viewControllerManager, setMenuPane, closeMenu, mainApplicationGroup, @@ -60,20 +60,20 @@ const GeneralAccountMenu: FunctionComponent = ({ const user = useMemo(() => application.getUser(), [application]) const openPreferences = useCallback(() => { - appState.accountMenu.closeAccountMenu() - appState.preferences.setCurrentPane('account') - appState.preferences.openPreferences() - }, [appState]) + viewControllerManager.accountMenuController.closeAccountMenu() + viewControllerManager.preferencesController.setCurrentPane('account') + viewControllerManager.preferencesController.openPreferences() + }, [viewControllerManager]) const openHelp = useCallback(() => { - appState.accountMenu.closeAccountMenu() - appState.preferences.setCurrentPane('help-feedback') - appState.preferences.openPreferences() - }, [appState]) + viewControllerManager.accountMenuController.closeAccountMenu() + viewControllerManager.preferencesController.setCurrentPane('help-feedback') + viewControllerManager.preferencesController.openPreferences() + }, [viewControllerManager]) const signOut = useCallback(() => { - appState.accountMenu.setSigningOut(true) - }, [appState]) + viewControllerManager.accountMenuController.setSigningOut(true) + }, [viewControllerManager]) const activateRegisterPane = useCallback(() => { setMenuPane(AccountMenuPane.Register) @@ -136,13 +136,16 @@ const GeneralAccountMenu: FunctionComponent = ({ )} - + {user ? ( @@ -166,7 +169,7 @@ const GeneralAccountMenu: FunctionComponent = ({ Help & feedback - v{appState.version} + v{viewControllerManager.version} {user ? ( <> diff --git a/app/assets/javascripts/Components/AccountMenu/MenuPaneSelector.tsx b/app/assets/javascripts/Components/AccountMenu/MenuPaneSelector.tsx index a456769dc..4544ac6e2 100644 --- a/app/assets/javascripts/Components/AccountMenu/MenuPaneSelector.tsx +++ b/app/assets/javascripts/Components/AccountMenu/MenuPaneSelector.tsx @@ -1,6 +1,6 @@ -import { WebApplication } from '@/UIModels/Application' -import { ApplicationGroup } from '@/UIModels/ApplicationGroup' -import { AppState } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ApplicationGroup } from '@/Application/ApplicationGroup' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { observer } from 'mobx-react-lite' import { FunctionComponent, useState } from 'react' import { AccountMenuPane } from './AccountMenuPane' @@ -10,7 +10,7 @@ import GeneralAccountMenu from './GeneralAccountMenu' import SignInPane from './SignIn' type Props = { - appState: AppState + viewControllerManager: ViewControllerManager application: WebApplication mainApplicationGroup: ApplicationGroup menuPane: AccountMenuPane @@ -20,7 +20,7 @@ type Props = { const MenuPaneSelector: FunctionComponent = ({ application, - appState, + viewControllerManager, menuPane, setMenuPane, closeMenu, @@ -33,7 +33,7 @@ const MenuPaneSelector: FunctionComponent = ({ case AccountMenuPane.GeneralMenu: return ( = ({ /> ) case AccountMenuPane.SignIn: - return + return ( + + ) case AccountMenuPane.Register: return ( = ({ case AccountMenuPane.ConfirmPassword: return ( void } -const SignInPane: FunctionComponent = ({ application, appState, setMenuPane }) => { - const { notesAndTagsCount } = appState.accountMenu +const SignInPane: FunctionComponent = ({ application, viewControllerManager, setMenuPane }) => { + const { notesAndTagsCount } = viewControllerManager.accountMenuController const [email, setEmail] = useState('') const [password, setPassword] = useState('') const [error, setError] = useState('') @@ -86,7 +86,7 @@ const SignInPane: FunctionComponent = ({ application, appState, setMenuPa if (res.error) { throw new Error(res.error.message) } - appState.accountMenu.closeAccountMenu() + viewControllerManager.accountMenuController.closeAccountMenu() }) .catch((err) => { console.error(err) @@ -97,7 +97,7 @@ const SignInPane: FunctionComponent = ({ application, appState, setMenuPa .finally(() => { setIsSigningIn(false) }) - }, [appState, application, email, isEphemeral, isStrictSignin, password, shouldMergeLocal]) + }, [viewControllerManager, application, email, isEphemeral, isStrictSignin, password, shouldMergeLocal]) const onPrivateWorkspaceChange = useCallback( (newIsPrivateWorkspace: boolean, privateWorkspaceIdentifier?: string) => { @@ -201,7 +201,7 @@ const SignInPane: FunctionComponent = ({ application, appState, setMenuPa
{ - const { server } = appState.accountMenu +const User = ({ viewControllerManager, application }: Props) => { + const { server } = viewControllerManager.accountMenuController const user = application.getUser() as UserType return (
- {appState.sync.errorMessage && ( + {viewControllerManager.syncStatusController.errorMessage && (
Sync Unreachable
- Hmm...we can't seem to sync your account. The reason: {appState.sync.errorMessage} + Hmm...we can't seem to sync your account. The reason:{' '} + {viewControllerManager.syncStatusController.errorMessage}
= ({ mainApplicationGroup, - appState, + viewControllerManager, isOpen, hideWorkspaceOptions = false, }: Props) => { @@ -42,7 +42,7 @@ const WorkspaceSwitcherMenu: FunctionComponent = ({ }, [mainApplicationGroup]) const signoutAll = useCallback(async () => { - const confirmed = await appState.application.alertService.confirm( + const confirmed = await viewControllerManager.application.alertService.confirm( 'Are you sure you want to sign out of all workspaces on this device?', undefined, 'Sign out all', @@ -52,11 +52,11 @@ const WorkspaceSwitcherMenu: FunctionComponent = ({ return } mainApplicationGroup.signOutAllWorkspaces().catch(console.error) - }, [mainApplicationGroup, appState]) + }, [mainApplicationGroup, viewControllerManager]) const destroyWorkspace = useCallback(() => { - appState.accountMenu.setSigningOut(true) - }, [appState]) + viewControllerManager.accountMenuController.setSigningOut(true) + }, [viewControllerManager]) return ( diff --git a/app/assets/javascripts/Components/AccountMenu/WorkspaceSwitcher/WorkspaceSwitcherOption.tsx b/app/assets/javascripts/Components/AccountMenu/WorkspaceSwitcher/WorkspaceSwitcherOption.tsx index 95a788196..43907697d 100644 --- a/app/assets/javascripts/Components/AccountMenu/WorkspaceSwitcher/WorkspaceSwitcherOption.tsx +++ b/app/assets/javascripts/Components/AccountMenu/WorkspaceSwitcher/WorkspaceSwitcherOption.tsx @@ -1,6 +1,6 @@ import { FOCUSABLE_BUT_NOT_TABBABLE } from '@/Constants' -import { ApplicationGroup } from '@/UIModels/ApplicationGroup' -import { AppState } from '@/UIModels/AppState' +import { ApplicationGroup } from '@/Application/ApplicationGroup' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { calculateSubmenuStyle, SubmenuStyle } from '@/Utils/CalculateSubmenuStyle' import { observer } from 'mobx-react-lite' import { FunctionComponent, useCallback, useEffect, useRef, useState } from 'react' @@ -9,10 +9,10 @@ import WorkspaceSwitcherMenu from './WorkspaceSwitcherMenu' type Props = { mainApplicationGroup: ApplicationGroup - appState: AppState + viewControllerManager: ViewControllerManager } -const WorkspaceSwitcherOption: FunctionComponent = ({ mainApplicationGroup, appState }) => { +const WorkspaceSwitcherOption: FunctionComponent = ({ mainApplicationGroup, viewControllerManager }) => { const buttonRef = useRef(null) const menuRef = useRef(null) const [isOpen, setIsOpen] = useState(false) @@ -58,7 +58,11 @@ const WorkspaceSwitcherOption: FunctionComponent = ({ mainApplicationGrou {isOpen && (
- +
)} diff --git a/app/assets/javascripts/Components/ApplicationGroupView/ApplicationGroupView.tsx b/app/assets/javascripts/Components/ApplicationGroupView/ApplicationGroupView.tsx index 467debdaf..475c4d3e0 100644 --- a/app/assets/javascripts/Components/ApplicationGroupView/ApplicationGroupView.tsx +++ b/app/assets/javascripts/Components/ApplicationGroupView/ApplicationGroupView.tsx @@ -1,5 +1,5 @@ -import { ApplicationGroup } from '@/UIModels/ApplicationGroup' -import { WebApplication } from '@/UIModels/Application' +import { ApplicationGroup } from '@/Application/ApplicationGroup' +import { WebApplication } from '@/Application/Application' import { Component } from 'react' import ApplicationView from '@/Components/ApplicationView/ApplicationView' import { WebOrDesktopDevice } from '@/Device/WebOrDesktopDevice' diff --git a/app/assets/javascripts/Components/ApplicationView/ApplicationView.tsx b/app/assets/javascripts/Components/ApplicationView/ApplicationView.tsx index 1f2e8d1c0..0fe3edc89 100644 --- a/app/assets/javascripts/Components/ApplicationView/ApplicationView.tsx +++ b/app/assets/javascripts/Components/ApplicationView/ApplicationView.tsx @@ -1,10 +1,10 @@ -import { ApplicationGroup } from '@/UIModels/ApplicationGroup' +import { ApplicationGroup } from '@/Application/ApplicationGroup' import { getPlatformString, getWindowUrlParams } from '@/Utils' -import { AppStateEvent, PanelResizedData } from '@/UIModels/AppState' +import { ViewControllerManagerEvent } from '@/Services/ViewControllerManager' import { ApplicationEvent, Challenge, removeFromArray } from '@standardnotes/snjs' import { PANEL_NAME_NOTES, PANEL_NAME_NAVIGATION } from '@/Constants' import { alertDialog } from '@/Services/AlertService' -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import Navigation from '@/Components/Navigation/Navigation' import NoteGroupView from '@/Components/NoteGroupView/NoteGroupView' import Footer from '@/Components/Footer/Footer' @@ -23,6 +23,7 @@ import FilePreviewModalWrapper from '@/Components/Files/FilePreviewModal' import ContentListView from '@/Components/ContentListView/ContentListView' import FileContextMenuWrapper from '@/Components/FileContextMenu/FileContextMenu' import PermissionsModalWrapper from '@/Components/PermissionsModal/PermissionsModalWrapper' +import { PanelResizedData } from '@/Typings/PanelResizedData' type Props = { application: WebApplication @@ -36,7 +37,7 @@ const ApplicationView: FunctionComponent = ({ application, mainApplicatio const [needsUnlock, setNeedsUnlock] = useState(true) const [challenges, setChallenges] = useState([]) - const appState = application.getAppState() + const viewControllerManager = application.getViewControllerManager() useEffect(() => { const desktopService = application.getDesktopService() @@ -119,8 +120,8 @@ const ApplicationView: FunctionComponent = ({ application, mainApplicatio }, [application, onAppLaunch, onAppStart]) useEffect(() => { - const removeObserver = application.getAppState().addObserver(async (eventName, data) => { - if (eventName === AppStateEvent.PanelResized) { + const removeObserver = application.getViewControllerManager().addObserver(async (eventName, data) => { + if (eventName === ViewControllerManagerEvent.PanelResized) { const { panel, collapsed } = data as PanelResizedData let appClass = '' if (panel === PANEL_NAME_NOTES && collapsed) { @@ -130,7 +131,7 @@ const ApplicationView: FunctionComponent = ({ application, mainApplicatio appClass += ' collapsed-navigation' } setAppClass(appClass) - } else if (eventName === AppStateEvent.WindowDidFocus) { + } else if (eventName === ViewControllerManagerEvent.WindowDidFocus) { if (!(await application.isLocked())) { application.sync.sync().catch(console.error) } @@ -155,7 +156,7 @@ const ApplicationView: FunctionComponent = ({ application, mainApplicatio = ({ application, mainApplicatio })} ) - }, [appState, challenges, mainApplicationGroup, removeChallenge, application]) + }, [viewControllerManager, challenges, mainApplicationGroup, removeChallenge, application]) if (!renderAppContents) { return renderChallenges() } return ( - +
- +
<>
- - - + + + {renderChallenges()} <> - - - - + + + + - +
diff --git a/app/assets/javascripts/Components/AttachedFilesPopover/AttachedFilesButton.tsx b/app/assets/javascripts/Components/AttachedFilesPopover/AttachedFilesButton.tsx index a945f5e89..8c3e17a85 100644 --- a/app/assets/javascripts/Components/AttachedFilesPopover/AttachedFilesButton.tsx +++ b/app/assets/javascripts/Components/AttachedFilesPopover/AttachedFilesButton.tsx @@ -1,5 +1,5 @@ -import { WebApplication } from '@/UIModels/Application' -import { AppState } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { MENU_MARGIN_FROM_APP_BORDER } from '@/Constants' import { Disclosure, DisclosureButton, DisclosurePanel } from '@reach/disclosure' import VisuallyHidden from '@reach/visually-hidden' @@ -19,13 +19,17 @@ import { isHandlingFileDrag } from '@/Utils/DragTypeCheck' type Props = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager onClickPreprocessing?: () => Promise } -const AttachedFilesButton: FunctionComponent = ({ application, appState, onClickPreprocessing }: Props) => { +const AttachedFilesButton: FunctionComponent = ({ + application, + viewControllerManager, + onClickPreprocessing, +}: Props) => { const premiumModal = usePremiumModal() - const note: SNNote | undefined = appState.notes.firstSelectedNote + const note: SNNote | undefined = viewControllerManager.notesController.firstSelectedNote const [open, setOpen] = useState(false) const [position, setPosition] = useState({ @@ -39,12 +43,12 @@ const AttachedFilesButton: FunctionComponent = ({ application, appState, const [closeOnBlur, keepMenuOpen] = useCloseOnBlur(containerRef, setOpen) useEffect(() => { - if (appState.filePreviewModal.isOpen) { + if (viewControllerManager.filePreviewModalController.isOpen) { keepMenuOpen(true) } else { keepMenuOpen(false) } - }, [appState.filePreviewModal.isOpen, keepMenuOpen]) + }, [viewControllerManager.filePreviewModalController.isOpen, keepMenuOpen]) const [currentTab, setCurrentTab] = useState(PopoverTabs.AttachedFiles) const [allFiles, setAllFiles] = useState([]) @@ -90,10 +94,10 @@ const AttachedFilesButton: FunctionComponent = ({ application, appState, }, [onClickPreprocessing, open]) const prospectivelyShowFilesPremiumModal = useCallback(() => { - if (!appState.features.hasFiles) { + if (!viewControllerManager.featuresController.hasFiles) { premiumModal.activate('Files') } - }, [appState.features.hasFiles, premiumModal]) + }, [viewControllerManager.featuresController.hasFiles, premiumModal]) const toggleAttachedFilesMenuWithEntitlementCheck = useCallback(async () => { prospectivelyShowFilesPremiumModal() @@ -121,7 +125,7 @@ const AttachedFilesButton: FunctionComponent = ({ application, appState, } const downloadFile = async (file: FileItem) => { - appState.files.downloadFile(file).catch(console.error) + viewControllerManager.filesController.downloadFile(file).catch(console.error) } const attachFileToNote = useCallback( @@ -213,7 +217,7 @@ const AttachedFilesButton: FunctionComponent = ({ application, appState, case PopoverFileItemActionType.PreviewFile: { keepMenuOpen(true) const otherFiles = currentTab === PopoverTabs.AllFiles ? allFiles : attachedFiles - appState.filePreviewModal.activate( + viewControllerManager.filePreviewModalController.activate( file, otherFiles.filter((file) => !file.protected), ) @@ -305,7 +309,7 @@ const AttachedFilesButton: FunctionComponent = ({ application, appState, setIsDraggingFiles(false) - if (!appState.features.hasFiles) { + if (!viewControllerManager.featuresController.hasFiles) { prospectivelyShowFilesPremiumModal() return } @@ -320,7 +324,7 @@ const AttachedFilesButton: FunctionComponent = ({ application, appState, return } - const uploadedFiles = await appState.files.uploadNewFile(fileOrHandle) + const uploadedFiles = await viewControllerManager.filesController.uploadNewFile(fileOrHandle) if (!uploadedFiles) { return @@ -338,8 +342,8 @@ const AttachedFilesButton: FunctionComponent = ({ application, appState, } }, [ - appState.files, - appState.features.hasFiles, + viewControllerManager.filesController, + viewControllerManager.featuresController.hasFiles, attachFileToNote, currentTab, application, @@ -396,7 +400,7 @@ const AttachedFilesButton: FunctionComponent = ({ application, appState, {open && ( void @@ -25,7 +25,7 @@ type Props = { const AttachedFilesPopover: FunctionComponent = ({ application, - appState, + viewControllerManager, allFiles, attachedFiles, closeOnBlur, @@ -45,7 +45,7 @@ const AttachedFilesPopover: FunctionComponent = ({ : filesList const handleAttachFilesClick = async () => { - const uploadedFiles = await appState.files.uploadNewFile() + const uploadedFiles = await viewControllerManager.filesController.uploadNewFile() if (!uploadedFiles) { return } diff --git a/app/assets/javascripts/Components/ChallengeModal/ChallengeModal.tsx b/app/assets/javascripts/Components/ChallengeModal/ChallengeModal.tsx index 9b305f863..7622a159a 100644 --- a/app/assets/javascripts/Components/ChallengeModal/ChallengeModal.tsx +++ b/app/assets/javascripts/Components/ChallengeModal/ChallengeModal.tsx @@ -1,4 +1,4 @@ -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { DialogContent, DialogOverlay } from '@reach/dialog' import { ButtonType, @@ -14,13 +14,13 @@ import Button from '@/Components/Button/Button' import Icon from '@/Components/Icon/Icon' import ChallengeModalPrompt from './ChallengePrompt' import LockscreenWorkspaceSwitcher from './LockscreenWorkspaceSwitcher' -import { ApplicationGroup } from '@/UIModels/ApplicationGroup' -import { AppState } from '@/UIModels/AppState' +import { ApplicationGroup } from '@/Application/ApplicationGroup' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { ChallengeModalValues } from './ChallengeModalValues' type Props = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager mainApplicationGroup: ApplicationGroup challenge: Challenge onDismiss?: (challenge: Challenge) => void @@ -44,7 +44,7 @@ const validateValues = (values: ChallengeModalValues, prompts: ChallengePrompt[] const ChallengeModal: FunctionComponent = ({ application, - appState, + viewControllerManager, mainApplicationGroup, challenge, onDismiss, @@ -255,7 +255,10 @@ const ChallengeModal: FunctionComponent = ({ )} {shouldShowWorkspaceSwitcher && ( - + )} diff --git a/app/assets/javascripts/Components/ChallengeModal/LockscreenWorkspaceSwitcher.tsx b/app/assets/javascripts/Components/ChallengeModal/LockscreenWorkspaceSwitcher.tsx index 6bd8b77ec..a534cf018 100644 --- a/app/assets/javascripts/Components/ChallengeModal/LockscreenWorkspaceSwitcher.tsx +++ b/app/assets/javascripts/Components/ChallengeModal/LockscreenWorkspaceSwitcher.tsx @@ -1,5 +1,5 @@ -import { ApplicationGroup } from '@/UIModels/ApplicationGroup' -import { AppState } from '@/UIModels/AppState' +import { ApplicationGroup } from '@/Application/ApplicationGroup' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { calculateSubmenuStyle, SubmenuStyle } from '@/Utils/CalculateSubmenuStyle' import { FunctionComponent, useCallback, useEffect, useRef, useState } from 'react' import WorkspaceSwitcherMenu from '@/Components/AccountMenu/WorkspaceSwitcher/WorkspaceSwitcherMenu' @@ -9,10 +9,10 @@ import { useCloseOnClickOutside } from '@/Hooks/useCloseOnClickOutside' type Props = { mainApplicationGroup: ApplicationGroup - appState: AppState + viewControllerManager: ViewControllerManager } -const LockscreenWorkspaceSwitcher: FunctionComponent = ({ mainApplicationGroup, appState }) => { +const LockscreenWorkspaceSwitcher: FunctionComponent = ({ mainApplicationGroup, viewControllerManager }) => { const buttonRef = useRef(null) const menuRef = useRef(null) const containerRef = useRef(null) @@ -55,7 +55,7 @@ const LockscreenWorkspaceSwitcher: FunctionComponent = ({ mainApplication
diff --git a/app/assets/javascripts/Components/ChangeEditor/ChangeEditorButton.tsx b/app/assets/javascripts/Components/ChangeEditor/ChangeEditorButton.tsx index c7e2411cb..f5edbec27 100644 --- a/app/assets/javascripts/Components/ChangeEditor/ChangeEditorButton.tsx +++ b/app/assets/javascripts/Components/ChangeEditor/ChangeEditorButton.tsx @@ -1,5 +1,5 @@ -import { WebApplication } from '@/UIModels/Application' -import { AppState } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { MENU_MARGIN_FROM_APP_BORDER } from '@/Constants' import { Disclosure, DisclosureButton, DisclosurePanel } from '@reach/disclosure' import VisuallyHidden from '@reach/visually-hidden' @@ -11,12 +11,16 @@ import { useCloseOnBlur } from '@/Hooks/useCloseOnBlur' type Props = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager onClickPreprocessing?: () => Promise } -const ChangeEditorButton: FunctionComponent = ({ application, appState, onClickPreprocessing }: Props) => { - const note = appState.notes.firstSelectedNote +const ChangeEditorButton: FunctionComponent = ({ + application, + viewControllerManager, + onClickPreprocessing, +}: Props) => { + const note = viewControllerManager.notesController.firstSelectedNote const [isOpen, setIsOpen] = useState(false) const [isVisible, setIsVisible] = useState(false) const [position, setPosition] = useState({ diff --git a/app/assets/javascripts/Components/ChangeEditor/ChangeEditorMenu.tsx b/app/assets/javascripts/Components/ChangeEditor/ChangeEditorMenu.tsx index dae1095b3..491bba8cf 100644 --- a/app/assets/javascripts/Components/ChangeEditor/ChangeEditorMenu.tsx +++ b/app/assets/javascripts/Components/ChangeEditor/ChangeEditorMenu.tsx @@ -4,7 +4,7 @@ import MenuItem from '@/Components/Menu/MenuItem' import { MenuItemType } from '@/Components/Menu/MenuItemType' import { usePremiumModal } from '@/Hooks/usePremiumModal' import { STRING_EDIT_LOCKED_ATTEMPT } from '@/Strings' -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { ComponentArea, ItemMutator, @@ -90,7 +90,7 @@ const ChangeEditorMenu: FunctionComponent = ({ const transactions: TransactionalMutation[] = [] - await application.getAppState().contentListView.insertCurrentIfTemplate() + await application.getViewControllerManager().contentListController.insertCurrentIfTemplate() if (note.locked) { application.alertService.alert(STRING_EDIT_LOCKED_ATTEMPT).catch(console.error) diff --git a/app/assets/javascripts/Components/ChangeEditor/createEditorMenuGroups.ts b/app/assets/javascripts/Components/ChangeEditor/createEditorMenuGroups.ts index 0ad8f50cb..0c2e962e4 100644 --- a/app/assets/javascripts/Components/ChangeEditor/createEditorMenuGroups.ts +++ b/app/assets/javascripts/Components/ChangeEditor/createEditorMenuGroups.ts @@ -1,4 +1,4 @@ -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { ContentType, FeatureStatus, diff --git a/app/assets/javascripts/Components/ComponentView/ComponentView.tsx b/app/assets/javascripts/Components/ComponentView/ComponentView.tsx index 33ff00cae..2471ed0f5 100644 --- a/app/assets/javascripts/Components/ComponentView/ComponentView.tsx +++ b/app/assets/javascripts/Components/ComponentView/ComponentView.tsx @@ -7,7 +7,7 @@ import { ComponentViewerEvent, ComponentViewerError, } from '@standardnotes/snjs' -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { FunctionComponent, useCallback, useEffect, useRef, useState } from 'react' import { observer } from 'mobx-react-lite' import OfflineRestricted from '@/Components/ComponentView/OfflineRestricted' @@ -15,12 +15,12 @@ import UrlMissing from '@/Components/ComponentView/UrlMissing' import IsDeprecated from '@/Components/ComponentView/IsDeprecated' import IsExpired from '@/Components/ComponentView/IsExpired' import IssueOnLoading from '@/Components/ComponentView/IssueOnLoading' -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { openSubscriptionDashboard } from '@/Utils/ManageSubscription' interface IProps { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager componentViewer: ComponentViewer requestReload?: (viewer: ComponentViewer, force?: boolean) => void onLoad?: (component: SNComponent) => void @@ -151,7 +151,7 @@ const ComponentView: FunctionComponent = ({ application, onLoad, compone application.io.handleComponentKeyUp(data.keyboardModifier) break case ComponentAction.Click: - application.getAppState().notes.setContextMenuOpen(false) + application.getViewControllerManager().notesController.setContextMenuOpen(false) break default: return diff --git a/app/assets/javascripts/Components/ConfirmSignoutModal/ConfirmSignoutModal.tsx b/app/assets/javascripts/Components/ConfirmSignoutModal/ConfirmSignoutModal.tsx index 98e99bc33..9a6c94b55 100644 --- a/app/assets/javascripts/Components/ConfirmSignoutModal/ConfirmSignoutModal.tsx +++ b/app/assets/javascripts/Components/ConfirmSignoutModal/ConfirmSignoutModal.tsx @@ -1,31 +1,31 @@ import { FunctionComponent, useEffect, useRef, useState } from 'react' import { AlertDialog, AlertDialogDescription, AlertDialogLabel } from '@reach/alert-dialog' import { STRING_SIGN_OUT_CONFIRMATION } from '@/Strings' -import { WebApplication } from '@/UIModels/Application' -import { AppState } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { observer } from 'mobx-react-lite' -import { ApplicationGroup } from '@/UIModels/ApplicationGroup' +import { ApplicationGroup } from '@/Application/ApplicationGroup' import { isDesktopApplication } from '@/Utils' type Props = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager applicationGroup: ApplicationGroup } -const ConfirmSignoutModal: FunctionComponent = ({ application, appState, applicationGroup }) => { +const ConfirmSignoutModal: FunctionComponent = ({ application, viewControllerManager, applicationGroup }) => { const [deleteLocalBackups, setDeleteLocalBackups] = useState(false) const cancelRef = useRef(null) function closeDialog() { - appState.accountMenu.setSigningOut(false) + viewControllerManager.accountMenuController.setSigningOut(false) } const [localBackupsCount, setLocalBackupsCount] = useState(0) useEffect(() => { application.desktopDevice?.localBackupsCount().then(setLocalBackupsCount).catch(console.error) - }, [appState.accountMenu.signingOut, application.desktopDevice]) + }, [viewControllerManager.accountMenuController.signingOut, application.desktopDevice]) const workspaces = applicationGroup.getDescriptors() const showWorkspaceWarning = workspaces.length > 1 && isDesktopApplication() @@ -112,7 +112,7 @@ const ConfirmSignoutModal: FunctionComponent = ({ application, appState, ConfirmSignoutModal.displayName = 'ConfirmSignoutModal' const ConfirmSignoutContainer = (props: Props) => { - if (!props.appState.accountMenu.signingOut) { + if (!props.viewControllerManager.accountMenuController.signingOut) { return null } return diff --git a/app/assets/javascripts/Components/ContentListView/ContentList.tsx b/app/assets/javascripts/Components/ContentListView/ContentList.tsx index e084539bd..dac21cb3b 100644 --- a/app/assets/javascripts/Components/ContentListView/ContentList.tsx +++ b/app/assets/javascripts/Components/ContentListView/ContentList.tsx @@ -1,6 +1,6 @@ -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { KeyboardKey } from '@/Services/IOService' -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { UuidString } from '@standardnotes/snjs' import { observer } from 'mobx-react-lite' import { FunctionComponent, KeyboardEventHandler, UIEventHandler, useCallback } from 'react' @@ -10,16 +10,23 @@ import ContentListItem from './ContentListItem' type Props = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager items: ListableContentItem[] selectedItems: Record paginate: () => void } -const ContentList: FunctionComponent = ({ application, appState, items, selectedItems, paginate }) => { - const { selectPreviousItem, selectNextItem } = appState.contentListView - const { hideTags, hideDate, hideNotePreview, hideEditorIcon } = appState.contentListView.webDisplayOptions - const { sortBy } = appState.contentListView.displayOptions +const ContentList: FunctionComponent = ({ + application, + viewControllerManager, + items, + selectedItems, + paginate, +}) => { + const { selectPreviousItem, selectNextItem } = viewControllerManager.contentListController + const { hideTags, hideDate, hideNotePreview, hideEditorIcon } = + viewControllerManager.contentListController.webDisplayOptions + const { sortBy } = viewControllerManager.contentListController.displayOptions const onScroll: UIEventHandler = useCallback( (e) => { @@ -57,7 +64,7 @@ const ContentList: FunctionComponent = ({ application, appState, items, s = (props) => { return [] } - const selectedTag = props.appState.tags.selected + const selectedTag = props.viewControllerManager.navigationController.selected if (!selectedTag) { return [] } - const tags = props.appState.getItemTags(props.item) + const tags = props.viewControllerManager.getItemTags(props.item) const isNavigatingOnlyTag = selectedTag instanceof SNTag && tags.length === 1 if (isNavigatingOnlyTag) { diff --git a/app/assets/javascripts/Components/ContentListView/ContentListOptionsMenu.tsx b/app/assets/javascripts/Components/ContentListView/ContentListOptionsMenu.tsx index 0e21af840..ce6243c9b 100644 --- a/app/assets/javascripts/Components/ContentListView/ContentListOptionsMenu.tsx +++ b/app/assets/javascripts/Components/ContentListView/ContentListOptionsMenu.tsx @@ -1,4 +1,4 @@ -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { CollectionSort, CollectionSortProperty, PrefKey, SystemViewId } from '@standardnotes/snjs' import { observer } from 'mobx-react-lite' import { FunctionComponent, useCallback, useState } from 'react' @@ -7,11 +7,11 @@ import Menu from '@/Components/Menu/Menu' import MenuItem from '@/Components/Menu/MenuItem' import MenuItemSeparator from '@/Components/Menu/MenuItemSeparator' import { MenuItemType } from '@/Components/Menu/MenuItemType' -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' type Props = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager closeOnBlur: (event: { relatedTarget: EventTarget | null }) => void closeDisplayOptionsMenu: () => void isOpen: boolean @@ -21,7 +21,7 @@ const ContentListOptionsMenu: FunctionComponent = ({ closeDisplayOptionsMenu, closeOnBlur, application, - appState, + viewControllerManager, isOpen, }) => { const [sortBy, setSortBy] = useState(() => application.getPreference(PrefKey.SortNotesBy, CollectionSort.CreatedAt)) @@ -174,7 +174,7 @@ const ContentListOptionsMenu: FunctionComponent = ({
View
- {appState.tags.selectedUuid !== SystemViewId.Files && ( + {viewControllerManager.navigationController.selectedUuid !== SystemViewId.Files && ( = ({ application, appState }) => { +const ContentListView: FunctionComponent = ({ application, viewControllerManager }) => { const itemsViewPanelRef = useRef(null) const displayOptionsMenuRef = useRef(null) @@ -46,9 +46,9 @@ const ContentListView: FunctionComponent = ({ application, appState }) => paginate, panelWidth, createNewNote, - } = appState.contentListView + } = viewControllerManager.contentListController - const { selectedItems } = appState.selectedItems + const { selectedItems } = viewControllerManager.selectionController const [showDisplayOptionsMenu, setShowDisplayOptionsMenu] = useState(false) const [focusedSearch, setFocusedSearch] = useState(false) @@ -56,17 +56,17 @@ const ContentListView: FunctionComponent = ({ application, appState }) => const [closeDisplayOptMenuOnBlur] = useCloseOnBlur(displayOptionsMenuRef, setShowDisplayOptionsMenu) const isFilesSmartView = useMemo( - () => appState.tags.selected?.uuid === SystemViewId.Files, - [appState.tags.selected?.uuid], + () => viewControllerManager.navigationController.selected?.uuid === SystemViewId.Files, + [viewControllerManager.navigationController.selected?.uuid], ) const addNewItem = useCallback(() => { if (isFilesSmartView) { - void appState.files.uploadNewFile() + void viewControllerManager.filesController.uploadNewFile() } else { void createNewNote() } - }, [appState.files, createNewNote, isFilesSmartView]) + }, [viewControllerManager.filesController, createNewNote, isFilesSmartView]) useEffect(() => { /** @@ -142,15 +142,15 @@ const ContentListView: FunctionComponent = ({ application, appState }) => const panelResizeFinishCallback: ResizeFinishCallback = useCallback( (width, _lastLeft, _isMaxWidth, isCollapsed) => { application.setPreference(PrefKey.NotesPanelWidth, width).catch(console.error) - appState.noteTags.reloadTagsContainerMaxWidth() - appState.panelDidResize(PANEL_NAME_NOTES, isCollapsed) + viewControllerManager.noteTagsController.reloadTagsContainerMaxWidth() + viewControllerManager.panelDidResize(PANEL_NAME_NOTES, isCollapsed) }, - [appState, application], + [viewControllerManager, application], ) const panelWidthEventCallback = useCallback(() => { - appState.noteTags.reloadTagsContainerMaxWidth() - }, [appState]) + viewControllerManager.noteTagsController.reloadTagsContainerMaxWidth() + }, [viewControllerManager]) const toggleDisplayOptionsMenu = useCallback(() => { setShowDisplayOptionsMenu(!showDisplayOptionsMenu) @@ -208,11 +208,11 @@ const ContentListView: FunctionComponent = ({ application, appState }) => {(focusedSearch || noteFilterText) && (
- +
)}
- +
@@ -235,7 +235,7 @@ const ContentListView: FunctionComponent = ({ application, appState }) => {showDisplayOptionsMenu && ( = ({ application, appState }) => items={renderedItems} selectedItems={selectedItems} application={application} - appState={appState} + viewControllerManager={viewControllerManager} paginate={paginate} /> ) : null} diff --git a/app/assets/javascripts/Components/ContentListView/FileListItem.tsx b/app/assets/javascripts/Components/ContentListView/FileListItem.tsx index e8358298f..b1c32c664 100644 --- a/app/assets/javascripts/Components/ContentListView/FileListItem.tsx +++ b/app/assets/javascripts/Components/ContentListView/FileListItem.tsx @@ -10,7 +10,7 @@ import { DisplayableListItemProps } from './Types/DisplayableListItemProps' const FileListItem: FunctionComponent = ({ application, - appState, + viewControllerManager, hideDate, hideIcon, hideTags, @@ -21,32 +21,40 @@ const FileListItem: FunctionComponent = ({ }) => { const openFileContextMenu = useCallback( (posX: number, posY: number) => { - appState.files.setFileContextMenuLocation({ + viewControllerManager.filesController.setFileContextMenuLocation({ x: posX, y: posY, }) - appState.files.setShowFileContextMenu(true) + viewControllerManager.filesController.setShowFileContextMenu(true) }, - [appState.files], + [viewControllerManager.filesController], ) const openContextMenu = useCallback( async (posX: number, posY: number) => { - const { didSelect } = await appState.selectedItems.selectItem(item.uuid) + const { didSelect } = await viewControllerManager.selectionController.selectItem(item.uuid) if (didSelect) { openFileContextMenu(posX, posY) } }, - [appState.selectedItems, item.uuid, openFileContextMenu], + [viewControllerManager.selectionController, item.uuid, openFileContextMenu], ) const onClick = useCallback(() => { - void appState.selectedItems.selectItem(item.uuid, true).then(({ didSelect }) => { - if (didSelect && appState.selectedItems.selectedItemsCount < 2) { - appState.filePreviewModal.activate(item as FileItem, appState.files.allFiles) + void viewControllerManager.selectionController.selectItem(item.uuid, true).then(({ didSelect }) => { + if (didSelect && viewControllerManager.selectionController.selectedItemsCount < 2) { + viewControllerManager.filePreviewModalController.activate( + item as FileItem, + viewControllerManager.filesController.allFiles, + ) } }) - }, [appState.filePreviewModal, appState.files.allFiles, appState.selectedItems, item]) + }, [ + viewControllerManager.filePreviewModalController, + viewControllerManager.filesController.allFiles, + viewControllerManager.selectionController, + item, + ]) const IconComponent = () => getFileIconComponent( diff --git a/app/assets/javascripts/Components/ContentListView/NoteListItem.tsx b/app/assets/javascripts/Components/ContentListView/NoteListItem.tsx index b6fa0e960..d1575459f 100644 --- a/app/assets/javascripts/Components/ContentListView/NoteListItem.tsx +++ b/app/assets/javascripts/Components/ContentListView/NoteListItem.tsx @@ -11,7 +11,7 @@ import { DisplayableListItemProps } from './Types/DisplayableListItemProps' const NoteListItem: FunctionComponent = ({ application, - appState, + viewControllerManager, hideDate, hideIcon, hideTags, @@ -27,16 +27,16 @@ const NoteListItem: FunctionComponent = ({ const hasFiles = application.items.getFilesForNote(item as SNNote).length > 0 const openNoteContextMenu = (posX: number, posY: number) => { - appState.notes.setContextMenuClickLocation({ + viewControllerManager.notesController.setContextMenuClickLocation({ x: posX, y: posY, }) - appState.notes.reloadContextMenuLayout() - appState.notes.setContextMenuOpen(true) + viewControllerManager.notesController.reloadContextMenuLayout() + viewControllerManager.notesController.setContextMenuOpen(true) } const openContextMenu = async (posX: number, posY: number) => { - const { didSelect } = await appState.selectedItems.selectItem(item.uuid, true) + const { didSelect } = await viewControllerManager.selectionController.selectItem(item.uuid, true) if (didSelect) { openNoteContextMenu(posX, posY) } @@ -49,7 +49,7 @@ const NoteListItem: FunctionComponent = ({ }`} id={item.uuid} onClick={() => { - void appState.selectedItems.selectItem(item.uuid, true) + void viewControllerManager.selectionController.selectItem(item.uuid, true) }} onContextMenu={(event) => { event.preventDefault() diff --git a/app/assets/javascripts/Components/ContentListView/Types/AbstractListItemProps.ts b/app/assets/javascripts/Components/ContentListView/Types/AbstractListItemProps.ts index 64abf5983..8b1b2ded4 100644 --- a/app/assets/javascripts/Components/ContentListView/Types/AbstractListItemProps.ts +++ b/app/assets/javascripts/Components/ContentListView/Types/AbstractListItemProps.ts @@ -1,11 +1,11 @@ -import { WebApplication } from '@/UIModels/Application' -import { AppState } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { SortableItem } from '@standardnotes/snjs' import { ListableContentItem } from './ListableContentItem' export type AbstractListItemProps = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager hideDate: boolean hideIcon: boolean hideTags: boolean diff --git a/app/assets/javascripts/Components/DeallocateHandler/DeallocateHandler.tsx b/app/assets/javascripts/Components/DeallocateHandler/DeallocateHandler.tsx index 770c4cc12..bdc99e4e5 100644 --- a/app/assets/javascripts/Components/DeallocateHandler/DeallocateHandler.tsx +++ b/app/assets/javascripts/Components/DeallocateHandler/DeallocateHandler.tsx @@ -1,4 +1,4 @@ -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { observer } from 'mobx-react-lite' import { FunctionComponent } from 'react' diff --git a/app/assets/javascripts/Components/FileContextMenu/FileContextMenu.tsx b/app/assets/javascripts/Components/FileContextMenu/FileContextMenu.tsx index 1243073b0..a0c1dbdad 100644 --- a/app/assets/javascripts/Components/FileContextMenu/FileContextMenu.tsx +++ b/app/assets/javascripts/Components/FileContextMenu/FileContextMenu.tsx @@ -1,7 +1,7 @@ import { MAX_MENU_SIZE_MULTIPLIER, MENU_MARGIN_FROM_APP_BORDER } from '@/Constants' import { useCloseOnBlur } from '@/Hooks/useCloseOnBlur' import { useCloseOnClickOutside } from '@/Hooks/useCloseOnClickOutside' -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { observer } from 'mobx-react-lite' import { FunctionComponent, useCallback, useEffect, useRef, useState } from 'react' import { PopoverFileItemAction } from '../AttachedFilesPopover/PopoverFileItemAction' @@ -9,11 +9,12 @@ import { PopoverTabs } from '../AttachedFilesPopover/PopoverTabs' import FileMenuOptions from './FileMenuOptions' type Props = { - appState: AppState + viewControllerManager: ViewControllerManager } -const FileContextMenu: FunctionComponent = observer(({ appState }) => { - const { selectedFiles, showFileContextMenu, setShowFileContextMenu, fileContextMenuLocation } = appState.files +const FileContextMenu: FunctionComponent = observer(({ viewControllerManager }) => { + const { selectedFiles, showFileContextMenu, setShowFileContextMenu, fileContextMenuLocation } = + viewControllerManager.filesController const [contextMenuStyle, setContextMenuStyle] = useState({ top: 0, @@ -23,7 +24,7 @@ const FileContextMenu: FunctionComponent = observer(({ appState }) => { const [contextMenuMaxHeight, setContextMenuMaxHeight] = useState('auto') const contextMenuRef = useRef(null) const [closeOnBlur] = useCloseOnBlur(contextMenuRef, (open: boolean) => setShowFileContextMenu(open)) - useCloseOnClickOutside(contextMenuRef, () => appState.files.setShowFileContextMenu(false)) + useCloseOnClickOutside(contextMenuRef, () => viewControllerManager.filesController.setShowFileContextMenu(false)) const selectedFile = selectedFiles[0] @@ -87,10 +88,13 @@ const FileContextMenu: FunctionComponent = observer(({ appState }) => { const handleFileAction = useCallback( async (action: PopoverFileItemAction) => { - const { didHandleAction } = await appState.files.handleFileAction(action, PopoverTabs.AllFiles) + const { didHandleAction } = await viewControllerManager.filesController.handleFileAction( + action, + PopoverTabs.AllFiles, + ) return didHandleAction }, - [appState.files], + [viewControllerManager.filesController], ) return ( @@ -116,8 +120,8 @@ const FileContextMenu: FunctionComponent = observer(({ appState }) => { FileContextMenu.displayName = 'FileContextMenu' -const FileContextMenuWrapper: FunctionComponent = ({ appState }) => { - const { selectedFiles, showFileContextMenu } = appState.files +const FileContextMenuWrapper: FunctionComponent = ({ viewControllerManager }) => { + const { selectedFiles, showFileContextMenu } = viewControllerManager.filesController const selectedFile = selectedFiles[0] @@ -125,7 +129,7 @@ const FileContextMenuWrapper: FunctionComponent = ({ appState }) => { return null } - return + return } export default observer(FileContextMenuWrapper) diff --git a/app/assets/javascripts/Components/Files/FilePreviewModal.tsx b/app/assets/javascripts/Components/Files/FilePreviewModal.tsx index 503f9d76d..348926298 100644 --- a/app/assets/javascripts/Components/Files/FilePreviewModal.tsx +++ b/app/assets/javascripts/Components/Files/FilePreviewModal.tsx @@ -1,4 +1,4 @@ -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { concatenateUint8Arrays } from '@/Utils/ConcatenateUint8Arrays' import { DialogContent, DialogOverlay } from '@reach/dialog' import { addToast, ToastType } from '@standardnotes/stylekit' @@ -12,16 +12,16 @@ import { isFileTypePreviewable } from './isFilePreviewable' import PreviewComponent from './PreviewComponent' import { FOCUSABLE_BUT_NOT_TABBABLE } from '@/Constants' import { KeyboardKey } from '@/Services/IOService' -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { observer } from 'mobx-react-lite' type Props = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager } -const FilePreviewModal: FunctionComponent = observer(({ application, appState }) => { - const { currentFile, setCurrentFile, otherFiles, dismiss } = appState.filePreviewModal +const FilePreviewModal: FunctionComponent = observer(({ application, viewControllerManager }) => { + const { currentFile, setCurrentFile, otherFiles, dismiss } = viewControllerManager.filePreviewModalController if (!currentFile) { return null @@ -221,7 +221,10 @@ const FilePreviewModal: FunctionComponent = observer(({ application, appS
{ref && ( diff --git a/app/assets/javascripts/Components/NoAccountWarning/NoAccountWarning.tsx b/app/assets/javascripts/Components/NoAccountWarning/NoAccountWarning.tsx index 2792fc803..1dbf56cfb 100644 --- a/app/assets/javascripts/Components/NoAccountWarning/NoAccountWarning.tsx +++ b/app/assets/javascripts/Components/NoAccountWarning/NoAccountWarning.tsx @@ -1,22 +1,22 @@ import Icon from '@/Components/Icon/Icon' -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { observer } from 'mobx-react-lite' import { MouseEventHandler, useCallback } from 'react' -type Props = { appState: AppState } +type Props = { viewControllerManager: ViewControllerManager } -const NoAccountWarning = observer(({ appState }: Props) => { +const NoAccountWarning = observer(({ viewControllerManager }: Props) => { const showAccountMenu: MouseEventHandler = useCallback( (event) => { event.stopPropagation() - appState.accountMenu.setShow(true) + viewControllerManager.accountMenuController.setShow(true) }, - [appState], + [viewControllerManager], ) const hideWarning = useCallback(() => { - appState.noAccountWarning.hide() - }, [appState]) + viewControllerManager.noAccountWarningController.hide() + }, [viewControllerManager]) return (
@@ -40,10 +40,10 @@ const NoAccountWarning = observer(({ appState }: Props) => { NoAccountWarning.displayName = 'NoAccountWarning' -const NoAccountWarningWrapper = ({ appState }: Props) => { - const canShow = appState.noAccountWarning.show +const NoAccountWarningWrapper = ({ viewControllerManager }: Props) => { + const canShow = viewControllerManager.noAccountWarningController.show - return canShow ? : null + return canShow ? : null } export default observer(NoAccountWarningWrapper) diff --git a/app/assets/javascripts/Components/NoteGroupView/NoteGroupView.tsx b/app/assets/javascripts/Components/NoteGroupView/NoteGroupView.tsx index fc1c982b6..a4082e660 100644 --- a/app/assets/javascripts/Components/NoteGroupView/NoteGroupView.tsx +++ b/app/assets/javascripts/Components/NoteGroupView/NoteGroupView.tsx @@ -1,6 +1,6 @@ import { NoteViewController } from '@standardnotes/snjs' import { PureComponent } from '@/Components/Abstract/PureComponent' -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import MultipleSelectedNotes from '@/Components/MultipleSelectedNotes/MultipleSelectedNotes' import NoteView from '@/Components/NoteView/NoteView' import { ElementIds } from '@/ElementIDs' @@ -37,9 +37,9 @@ class NoteGroupView extends PureComponent { }) this.autorun(() => { - if (this.appState && this.appState.notes) { + if (this.viewControllerManager && this.viewControllerManager.notesController) { this.setState({ - showMultipleSelectedNotes: this.appState.notes.selectedNotesCount > 1, + showMultipleSelectedNotes: this.viewControllerManager.notesController.selectedNotesCount > 1, }) } }) @@ -56,7 +56,7 @@ class NoteGroupView extends PureComponent { return (
{this.state.showMultipleSelectedNotes && ( - + )} {!this.state.showMultipleSelectedNotes && ( diff --git a/app/assets/javascripts/Components/NoteTags/NoteTag.tsx b/app/assets/javascripts/Components/NoteTags/NoteTag.tsx index f6f94467c..54844a37e 100644 --- a/app/assets/javascripts/Components/NoteTags/NoteTag.tsx +++ b/app/assets/javascripts/Components/NoteTags/NoteTag.tsx @@ -8,17 +8,17 @@ import { useRef, useState, } from 'react' -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { SNTag } from '@standardnotes/snjs' import { observer } from 'mobx-react-lite' type Props = { - appState: AppState + viewControllerManager: ViewControllerManager tag: SNTag } -const NoteTag = ({ appState, tag }: Props) => { - const noteTags = appState.noteTags +const NoteTag = ({ viewControllerManager, tag }: Props) => { + const noteTags = viewControllerManager.noteTagsController const { autocompleteInputFocused, focusedTagUuid, tags } = noteTags @@ -33,9 +33,9 @@ const NoteTag = ({ appState, tag }: Props) => { const longTitle = noteTags.getLongTitle(tag) const deleteTag = useCallback(() => { - appState.noteTags.focusPreviousTag(tag) - appState.noteTags.removeTagFromActiveNote(tag).catch(console.error) - }, [appState, tag]) + viewControllerManager.noteTagsController.focusPreviousTag(tag) + viewControllerManager.noteTagsController.removeTagFromActiveNote(tag).catch(console.error) + }, [viewControllerManager, tag]) const onDeleteTagClick: MouseEventHandler = useCallback( (event) => { @@ -49,28 +49,28 @@ const NoteTag = ({ appState, tag }: Props) => { (event) => { if (tagClicked && event.target !== deleteTagRef.current) { setTagClicked(false) - void appState.tags.setSelectedTag(tag) + void viewControllerManager.navigationController.setSelectedTag(tag) } else { setTagClicked(true) } }, - [appState, tagClicked, tag], + [viewControllerManager, tagClicked, tag], ) const onFocus = useCallback(() => { - appState.noteTags.setFocusedTagUuid(tag.uuid) + viewControllerManager.noteTagsController.setFocusedTagUuid(tag.uuid) setShowDeleteButton(true) - }, [appState, tag]) + }, [viewControllerManager, tag]) const onBlur: FocusEventHandler = useCallback( (event) => { const relatedTarget = event.relatedTarget as Node if (relatedTarget !== deleteTagRef.current) { - appState.noteTags.setFocusedTagUuid(undefined) + viewControllerManager.noteTagsController.setFocusedTagUuid(undefined) setShowDeleteButton(false) } }, - [appState], + [viewControllerManager], ) const getTabIndex = useCallback(() => { @@ -85,33 +85,33 @@ const NoteTag = ({ appState, tag }: Props) => { const onKeyDown: KeyboardEventHandler = useCallback( (event) => { - const tagIndex = appState.noteTags.getTagIndex(tag, tags) + const tagIndex = viewControllerManager.noteTagsController.getTagIndex(tag, tags) switch (event.key) { case 'Backspace': deleteTag() break case 'ArrowLeft': - appState.noteTags.focusPreviousTag(tag) + viewControllerManager.noteTagsController.focusPreviousTag(tag) break case 'ArrowRight': if (tagIndex === tags.length - 1) { - appState.noteTags.setAutocompleteInputFocused(true) + viewControllerManager.noteTagsController.setAutocompleteInputFocused(true) } else { - appState.noteTags.focusNextTag(tag) + viewControllerManager.noteTagsController.focusNextTag(tag) } break default: return } }, - [appState, deleteTag, tag, tags], + [viewControllerManager, deleteTag, tag, tags], ) useEffect(() => { if (focusedTagUuid === tag.uuid) { tagRef.current?.focus() } - }, [appState, focusedTagUuid, tag]) + }, [viewControllerManager, focusedTagUuid, tag]) return (
- +
)} @@ -993,7 +993,7 @@ class NoteView extends PureComponent { onLoad={this.onEditorComponentLoad} requestReload={this.editorComponentViewerRequestsReload} application={this.application} - appState={this.appState} + viewControllerManager={this.viewControllerManager} />
)} @@ -1068,7 +1068,7 @@ class NoteView extends PureComponent { key={viewer.identifier} componentViewer={viewer} application={this.application} - appState={this.appState} + viewControllerManager={this.viewControllerManager} />
) diff --git a/app/assets/javascripts/Components/NoteView/NoteViewProps.ts b/app/assets/javascripts/Components/NoteView/NoteViewProps.ts index e5041db0d..114ad3d0c 100644 --- a/app/assets/javascripts/Components/NoteView/NoteViewProps.ts +++ b/app/assets/javascripts/Components/NoteView/NoteViewProps.ts @@ -1,6 +1,6 @@ import { NoteViewController } from '@standardnotes/snjs' -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' export interface NoteViewProps { application: WebApplication diff --git a/app/assets/javascripts/Components/NotesContextMenu/NotesContextMenu.tsx b/app/assets/javascripts/Components/NotesContextMenu/NotesContextMenu.tsx index 33f0a1be6..edb2f4df7 100644 --- a/app/assets/javascripts/Components/NotesContextMenu/NotesContextMenu.tsx +++ b/app/assets/javascripts/Components/NotesContextMenu/NotesContextMenu.tsx @@ -1,27 +1,29 @@ -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { useCloseOnBlur } from '@/Hooks/useCloseOnBlur' import { useCloseOnClickOutside } from '@/Hooks/useCloseOnClickOutside' import { observer } from 'mobx-react-lite' import NotesOptions from '@/Components/NotesOptions/NotesOptions' import { useCallback, useEffect, useRef } from 'react' -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' type Props = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager } -const NotesContextMenu = ({ application, appState }: Props) => { - const { contextMenuOpen, contextMenuPosition, contextMenuMaxHeight } = appState.notes +const NotesContextMenu = ({ application, viewControllerManager }: Props) => { + const { contextMenuOpen, contextMenuPosition, contextMenuMaxHeight } = viewControllerManager.notesController const contextMenuRef = useRef(null) - const [closeOnBlur] = useCloseOnBlur(contextMenuRef, (open: boolean) => appState.notes.setContextMenuOpen(open)) + const [closeOnBlur] = useCloseOnBlur(contextMenuRef, (open: boolean) => + viewControllerManager.notesController.setContextMenuOpen(open), + ) - useCloseOnClickOutside(contextMenuRef, () => appState.notes.setContextMenuOpen(false)) + useCloseOnClickOutside(contextMenuRef, () => viewControllerManager.notesController.setContextMenuOpen(false)) const reloadContextMenuLayout = useCallback(() => { - appState.notes.reloadContextMenuLayout() - }, [appState]) + viewControllerManager.notesController.reloadContextMenuLayout() + }, [viewControllerManager]) useEffect(() => { window.addEventListener('resize', reloadContextMenuLayout) @@ -39,7 +41,7 @@ const NotesContextMenu = ({ application, appState }: Props) => { maxHeight: contextMenuMaxHeight, }} > - + ) : null } diff --git a/app/assets/javascripts/Components/NotesOptions/AddTagOption.tsx b/app/assets/javascripts/Components/NotesOptions/AddTagOption.tsx index 1eb63d3f7..764e46c20 100644 --- a/app/assets/javascripts/Components/NotesOptions/AddTagOption.tsx +++ b/app/assets/javascripts/Components/NotesOptions/AddTagOption.tsx @@ -1,4 +1,4 @@ -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { calculateSubmenuStyle, SubmenuStyle } from '@/Utils/CalculateSubmenuStyle' import { Disclosure, DisclosureButton, DisclosurePanel } from '@reach/disclosure' import { observer } from 'mobx-react-lite' @@ -7,10 +7,10 @@ import Icon from '@/Components/Icon/Icon' import { useCloseOnBlur } from '@/Hooks/useCloseOnBlur' type Props = { - appState: AppState + viewControllerManager: ViewControllerManager } -const AddTagOption: FunctionComponent = ({ appState }) => { +const AddTagOption: FunctionComponent = ({ viewControllerManager }) => { const menuContainerRef = useRef(null) const menuRef = useRef(null) const menuButtonRef = useRef(null) @@ -84,22 +84,22 @@ const AddTagOption: FunctionComponent = ({ appState }) => { }} className="sn-dropdown min-w-80 flex flex-col py-2 max-h-120 max-w-xs fixed overflow-y-auto" > - {appState.tags.tags.map((tag) => ( + {viewControllerManager.navigationController.tags.map((tag) => ( ))} diff --git a/app/assets/javascripts/Components/NotesOptions/ChangeEditorOption.tsx b/app/assets/javascripts/Components/NotesOptions/ChangeEditorOption.tsx index 4d6ab456e..3cfcd5c65 100644 --- a/app/assets/javascripts/Components/NotesOptions/ChangeEditorOption.tsx +++ b/app/assets/javascripts/Components/NotesOptions/ChangeEditorOption.tsx @@ -1,6 +1,6 @@ import { KeyboardKey } from '@/Services/IOService' -import { WebApplication } from '@/UIModels/Application' -import { AppState } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { Disclosure, DisclosureButton, DisclosurePanel } from '@reach/disclosure' import { SNNote } from '@standardnotes/snjs' import { FunctionComponent, useCallback, useEffect, useRef, useState } from 'react' @@ -10,7 +10,7 @@ import { calculateSubmenuStyle, SubmenuStyle } from '@/Utils/CalculateSubmenuSty import { useCloseOnBlur } from '@/Hooks/useCloseOnBlur' type ChangeEditorOptionProps = { - appState: AppState + viewControllerManager: ViewControllerManager application: WebApplication note: SNNote } diff --git a/app/assets/javascripts/Components/NotesOptions/ListedActionsOption.tsx b/app/assets/javascripts/Components/NotesOptions/ListedActionsOption.tsx index 985bebb3c..c21c628b1 100644 --- a/app/assets/javascripts/Components/NotesOptions/ListedActionsOption.tsx +++ b/app/assets/javascripts/Components/NotesOptions/ListedActionsOption.tsx @@ -1,4 +1,4 @@ -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { calculateSubmenuStyle, SubmenuStyle } from '@/Utils/CalculateSubmenuStyle' import { Disclosure, DisclosureButton, DisclosurePanel } from '@reach/disclosure' import { Action, ListedAccount, SNNote } from '@standardnotes/snjs' diff --git a/app/assets/javascripts/Components/NotesOptions/NotesOptions.tsx b/app/assets/javascripts/Components/NotesOptions/NotesOptions.tsx index 0fbb9af06..46cd4b00f 100644 --- a/app/assets/javascripts/Components/NotesOptions/NotesOptions.tsx +++ b/app/assets/javascripts/Components/NotesOptions/NotesOptions.tsx @@ -1,4 +1,4 @@ -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import Icon from '@/Components/Icon/Icon' import Switch from '@/Components/Switch/Switch' import { observer } from 'mobx-react-lite' @@ -121,15 +121,15 @@ const NoteAttributes: FunctionComponent<{ } const SpellcheckOptions: FunctionComponent<{ - appState: AppState + viewControllerManager: ViewControllerManager note: SNNote -}> = ({ appState, note }) => { - const editor = appState.application.componentManager.editorForNote(note) +}> = ({ viewControllerManager, note }) => { + const editor = viewControllerManager.application.componentManager.editorForNote(note) const spellcheckControllable = Boolean(!editor || editor.package_info.spellcheckControl) const noteSpellcheck = !spellcheckControllable ? true : note - ? appState.notes.getSpellcheckStateForNote(note) + ? viewControllerManager.notesController.getSpellcheckStateForNote(note) : undefined return ( @@ -137,7 +137,7 @@ const SpellcheckOptions: FunctionComponent<{ @@ -425,7 +427,7 @@ const NotesOptions = ({ application, appState, closeOnBlur }: NotesOptionsProps)
- +
diff --git a/app/assets/javascripts/Components/NotesOptions/NotesOptionsPanel.tsx b/app/assets/javascripts/Components/NotesOptions/NotesOptionsPanel.tsx index 23b0a50bc..09874408f 100644 --- a/app/assets/javascripts/Components/NotesOptions/NotesOptionsPanel.tsx +++ b/app/assets/javascripts/Components/NotesOptions/NotesOptionsPanel.tsx @@ -1,4 +1,4 @@ -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import Icon from '@/Components/Icon/Icon' import VisuallyHidden from '@reach/visually-hidden' import { useCloseOnBlur } from '@/Hooks/useCloseOnBlur' @@ -6,16 +6,16 @@ import { Disclosure, DisclosureButton, DisclosurePanel } from '@reach/disclosure import { useRef, useState } from 'react' import { observer } from 'mobx-react-lite' import NotesOptions from './NotesOptions' -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { FOCUSABLE_BUT_NOT_TABBABLE } from '@/Constants' type Props = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager onClickPreprocessing?: () => Promise } -const NotesOptionsPanel = ({ application, appState, onClickPreprocessing }: Props) => { +const NotesOptionsPanel = ({ application, viewControllerManager, onClickPreprocessing }: Props) => { const [open, setOpen] = useState(false) const [position, setPosition] = useState({ top: 0, @@ -79,7 +79,13 @@ const NotesOptionsPanel = ({ application, appState, onClickPreprocessing }: Prop onBlur={closeOnBlur} tabIndex={FOCUSABLE_BUT_NOT_TABBABLE} > - {open && } + {open && ( + + )} ) diff --git a/app/assets/javascripts/Components/NotesOptions/NotesOptionsProps.ts b/app/assets/javascripts/Components/NotesOptions/NotesOptionsProps.ts index 2a969165c..6f10ede6a 100644 --- a/app/assets/javascripts/Components/NotesOptions/NotesOptionsProps.ts +++ b/app/assets/javascripts/Components/NotesOptions/NotesOptionsProps.ts @@ -1,8 +1,8 @@ -import { WebApplication } from '@/UIModels/Application' -import { AppState } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ViewControllerManager } from '@/Services/ViewControllerManager' export type NotesOptionsProps = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager closeOnBlur: (event: { relatedTarget: EventTarget | null }) => void } diff --git a/app/assets/javascripts/Components/OtherSessionsSignOut/OtherSessionsSignOut.tsx b/app/assets/javascripts/Components/OtherSessionsSignOut/OtherSessionsSignOut.tsx index c10ce1f16..8cb39fae3 100644 --- a/app/assets/javascripts/Components/OtherSessionsSignOut/OtherSessionsSignOut.tsx +++ b/app/assets/javascripts/Components/OtherSessionsSignOut/OtherSessionsSignOut.tsx @@ -1,20 +1,20 @@ import { useCallback, useRef } from 'react' import { AlertDialog, AlertDialogDescription, AlertDialogLabel } from '@reach/alert-dialog' -import { WebApplication } from '@/UIModels/Application' -import { AppState } from '@/UIModels/AppState' +import { WebApplication } from '@/Application/Application' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import { observer } from 'mobx-react-lite' type Props = { application: WebApplication - appState: AppState + viewControllerManager: ViewControllerManager } -const ConfirmOtherSessionsSignOut = observer(({ application, appState }: Props) => { +const ConfirmOtherSessionsSignOut = observer(({ application, viewControllerManager }: Props) => { const cancelRef = useRef(null) const closeDialog = useCallback(() => { - appState.accountMenu.setOtherSessionsSignOut(false) - }, [appState]) + viewControllerManager.accountMenuController.setOtherSessionsSignOut(false) + }, [viewControllerManager]) return ( @@ -62,7 +62,7 @@ const ConfirmOtherSessionsSignOut = observer(({ application, appState }: Props) ConfirmOtherSessionsSignOut.displayName = 'ConfirmOtherSessionsSignOut' const OtherSessionsSignOutContainer = (props: Props) => { - if (!props.appState.accountMenu.otherSessionsSignOut) { + if (!props.viewControllerManager.accountMenuController.otherSessionsSignOut) { return null } return diff --git a/app/assets/javascripts/Components/PasswordWizard/PasswordWizard.tsx b/app/assets/javascripts/Components/PasswordWizard/PasswordWizard.tsx index 2cb0d1180..b44e5d254 100644 --- a/app/assets/javascripts/Components/PasswordWizard/PasswordWizard.tsx +++ b/app/assets/javascripts/Components/PasswordWizard/PasswordWizard.tsx @@ -1,4 +1,4 @@ -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { ChangeEventHandler, createRef } from 'react' import { PureComponent } from '@/Components/Abstract/PureComponent' diff --git a/app/assets/javascripts/Components/PermissionsModal/PermissionsModal.tsx b/app/assets/javascripts/Components/PermissionsModal/PermissionsModal.tsx index 0682c8960..9df4bc06e 100644 --- a/app/assets/javascripts/Components/PermissionsModal/PermissionsModal.tsx +++ b/app/assets/javascripts/Components/PermissionsModal/PermissionsModal.tsx @@ -1,4 +1,4 @@ -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { SNComponent } from '@standardnotes/snjs' import { Component } from 'react' diff --git a/app/assets/javascripts/Components/PermissionsModal/PermissionsModalWrapper.tsx b/app/assets/javascripts/Components/PermissionsModal/PermissionsModalWrapper.tsx index 308074fff..462af2d47 100644 --- a/app/assets/javascripts/Components/PermissionsModal/PermissionsModalWrapper.tsx +++ b/app/assets/javascripts/Components/PermissionsModal/PermissionsModalWrapper.tsx @@ -1,4 +1,4 @@ -import { WebApplication } from '@/UIModels/Application' +import { WebApplication } from '@/Application/Application' import { ApplicationEvent, PermissionDialog } from '@standardnotes/snjs' import { FunctionComponent, useCallback, useEffect, useState } from 'react' import PermissionsModal from './PermissionsModal' diff --git a/app/assets/javascripts/Components/PinNoteButton/PinNoteButton.tsx b/app/assets/javascripts/Components/PinNoteButton/PinNoteButton.tsx index 6738391a5..8ec22bd1e 100644 --- a/app/assets/javascripts/Components/PinNoteButton/PinNoteButton.tsx +++ b/app/assets/javascripts/Components/PinNoteButton/PinNoteButton.tsx @@ -1,17 +1,21 @@ -import { AppState } from '@/UIModels/AppState' +import { ViewControllerManager } from '@/Services/ViewControllerManager' import VisuallyHidden from '@reach/visually-hidden' import { observer } from 'mobx-react-lite' import { FunctionComponent, useCallback } from 'react' import Icon from '@/Components/Icon/Icon' type Props = { - appState: AppState + viewControllerManager: ViewControllerManager className?: string onClickPreprocessing?: () => Promise } -const PinNoteButton: FunctionComponent = ({ appState, className = '', onClickPreprocessing }: Props) => { - const notes = appState.notes.selectedNotes +const PinNoteButton: FunctionComponent = ({ + viewControllerManager, + className = '', + onClickPreprocessing, +}: Props) => { + const notes = viewControllerManager.notesController.selectedNotes const pinned = notes.some((note) => note.pinned) const togglePinned = useCallback(async () => { @@ -19,11 +23,11 @@ const PinNoteButton: FunctionComponent = ({ appState, className = '', onC await onClickPreprocessing() } if (!pinned) { - appState.notes.setPinSelectedNotes(true) + viewControllerManager.notesController.setPinSelectedNotes(true) } else { - appState.notes.setPinSelectedNotes(false) + viewControllerManager.notesController.setPinSelectedNotes(false) } - }, [appState, onClickPreprocessing, pinned]) + }, [viewControllerManager, onClickPreprocessing, pinned]) return (