refactor(web): dependency management (#2386)

packages/web/src/javascripts/Components/Preferences/Panes/General/Advanced/AdvancedSection.tsx

@@ -2,7 +2,6 @@ import { FunctionComponent } from 'react'
 import OfflineSubscription from '@/Components/Preferences/Panes/General/Advanced/OfflineSubscription'
 import { WebApplication } from '@/Application/WebApplication'
 import { observer } from 'mobx-react-lite'
-import { ViewControllerManager } from '@/Controllers/ViewControllerManager'
 import PackagesPreferencesSection from '@/Components/Preferences/Panes/General/Advanced/Packages/Section'
 import { PackageProvider } from '@/Components/Preferences/Panes/General/Advanced/Packages/Provider/PackageProvider'
 import AccordionItem from '@/Components/Shared/AccordionItem'
@@ -11,18 +10,17 @@ import PreferencesSegment from '../../../PreferencesComponents/PreferencesSegmen
 
 type Props = {
   application: WebApplication
-  viewControllerManager: ViewControllerManager
   extensionsLatestVersions: PackageProvider
 }
 
-const Advanced: FunctionComponent<Props> = ({ application, viewControllerManager, extensionsLatestVersions }) => {
+const Advanced: FunctionComponent<Props> = ({ application, extensionsLatestVersions }) => {
   return (
     <PreferencesGroup>
       <PreferencesSegment>
         <AccordionItem title={'Advanced options'}>
           <div className="flex flex-row items-center">
             <div className="flex max-w-full flex-grow flex-col">
-              <OfflineSubscription application={application} viewControllerManager={viewControllerManager} />
+              <OfflineSubscription application={application} />
               <PackagesPreferencesSection
                 className={'mt-3'}
                 application={application}

packages/web/src/javascripts/Components/Preferences/Panes/General/Advanced/OfflineSubscription.tsx

@@ -3,7 +3,6 @@ import { Subtitle } from '@/Components/Preferences/PreferencesComponents/Content
 import DecoratedInput from '@/Components/Input/DecoratedInput'
 import Button from '@/Components/Button/Button'
 import { WebApplication } from '@/Application/WebApplication'
-import { ViewControllerManager } from '@/Controllers/ViewControllerManager'
 import { observer } from 'mobx-react-lite'
 import { STRING_REMOVE_OFFLINE_KEY_CONFIRMATION } from '@/Constants/Strings'
 import { ButtonType, ClientDisplayableError } from '@standardnotes/snjs'
@@ -11,7 +10,6 @@ import HorizontalSeparator from '@/Components/Shared/HorizontalSeparator'
 
 type Props = {
   application: WebApplication
-  viewControllerManager: ViewControllerManager
   onSuccess?: () => void
 }
 
@@ -46,7 +44,7 @@ const OfflineSubscription: FunctionComponent<Props> = ({ application, onSuccess
         return
       }
 
-      const signedInUser = application.getUser()
+      const signedInUser = application.sessions.getUser()
       if (!signedInUser) {
         return
       }

packages/web/src/javascripts/Components/Preferences/Panes/General/Advanced/Packages/PackageEntry.tsx

@@ -34,12 +34,12 @@ const PackageEntry: FunctionComponent<PackageEntryProps> = ({ application, exten
   const toggleOfflineOnly = () => {
     const newOfflineOnly = !offlineOnly
     setOfflineOnly(newOfflineOnly)
-    application
-      .changeAndSaveItem<ComponentMutator>(extension, (mutator) => {
+    application.changeAndSaveItem
+      .execute<ComponentMutator>(extension, (mutator) => {
         mutator.offlineOnly = newOfflineOnly
       })
-      .then((item) => {
-        const component = item as ComponentInterface
+      .then((result) => {
+        const component = result.getValue() as ComponentInterface
         setOfflineOnly(component.offlineOnly)
       })
       .catch((e) => {
@@ -49,12 +49,12 @@ const PackageEntry: FunctionComponent<PackageEntryProps> = ({ application, exten
 
   const changeExtensionName = (newName: string) => {
     setExtensionName(newName)
-    application
-      .changeAndSaveItem<ComponentMutator>(extension, (mutator) => {
+    application.changeAndSaveItem
+      .execute<ComponentMutator>(extension, (mutator) => {
         mutator.name = newName
       })
-      .then((item) => {
-        const component = item as ComponentInterface
+      .then((result) => {
+        const component = result.getValue() as ComponentInterface
         setExtensionName(component.name)
       })
       .catch(console.error)

packages/web/src/javascripts/Components/Preferences/Panes/General/General.tsx

@@ -1,5 +1,4 @@
 import { WebApplication } from '@/Application/WebApplication'
-import { ViewControllerManager } from '@/Controllers/ViewControllerManager'
 import { FunctionComponent } from 'react'
 import { PackageProvider } from '@/Components/Preferences/Panes/General/Advanced/Packages/Provider/PackageProvider'
 import { observer } from 'mobx-react-lite'
@@ -13,24 +12,19 @@ import SmartViews from './SmartViews/SmartViews'
 import Moments from './Moments'
 
 type Props = {
-  viewControllerManager: ViewControllerManager
   application: WebApplication
   extensionsLatestVersions: PackageProvider
 }
 
-const General: FunctionComponent<Props> = ({ viewControllerManager, application, extensionsLatestVersions }) => (
+const General: FunctionComponent<Props> = ({ application, extensionsLatestVersions }) => (
   <PreferencesPane>
     <Persistence application={application} />
     <Defaults application={application} />
     <Tools application={application} />
-    <SmartViews application={application} featuresController={viewControllerManager.featuresController} />
+    <SmartViews application={application} featuresController={application.featuresController} />
     <Moments application={application} />
     <LabsPane application={application} />
-    <Advanced
-      application={application}
-      viewControllerManager={viewControllerManager}
-      extensionsLatestVersions={extensionsLatestVersions}
-    />
+    <Advanced application={application} extensionsLatestVersions={extensionsLatestVersions} />
   </PreferencesPane>
 )
 

packages/web/src/javascripts/Components/Preferences/Panes/General/Persistence.tsx

@@ -21,9 +21,9 @@ const Persistence = ({ application }: Props) => {
     setShouldPersistNoteState(shouldPersist)
 
     if (shouldPersist) {
-      application.controllers.persistValues()
+      application.persistence.persistCurrentState()
     } else {
-      application.controllers.clearPersistedValues()
+      application.persistence.clearPersistedValues()
     }
   }
 

packages/web/src/javascripts/Components/Preferences/Panes/General/SmartViews/EditSmartViewModalController.tsx

@@ -88,7 +88,7 @@ export class EditSmartViewModalController {
 
     this.setIsSaving(true)
 
-    await this.application.changeAndSaveItem<SmartViewMutator>(this.view, (mutator) => {
+    await this.application.changeAndSaveItem.execute<SmartViewMutator>(this.view, (mutator) => {
       mutator.title = this.title
       mutator.iconString = (this.icon as string) || SmartViewDefaultIconName
       mutator.predicate = JSON.parse(this.predicateJson) as PredicateJsonForm

packages/web/src/javascripts/Components/Preferences/Panes/General/SmartViews/SmartViews.tsx

@@ -33,7 +33,7 @@ const SmartViews = ({ application, featuresController }: Props) => {
   )
 
   useEffect(() => {
-    const disposeItemStream = application.streamItems([ContentType.TYPES.SmartView], () => {
+    const disposeItemStream = application.items.streamItems([ContentType.TYPES.SmartView], () => {
       setSmartViews(application.items.getSmartViews().filter((view) => !isSystemView(view)))
     })