From ee837ea077a9d079ca346a26c3891229ae082fdd Mon Sep 17 00:00:00 2001
From: Baptiste Grob <60621355+baptiste-grob@users.noreply.github.com>
Date: Wed, 19 Aug 2020 12:31:42 +0200
Subject: [PATCH] fix: correctly switch between editors

---
 .../javascripts/views/editor/editor-view.pug     | 16 ++++++++--------
 .../javascripts/views/editor/editor_view.ts      |  7 +++++--
 2 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/app/assets/javascripts/views/editor/editor-view.pug b/app/assets/javascripts/views/editor/editor-view.pug
index 4eb651823..ae2ce369b 100644
--- a/app/assets/javascripts/views/editor/editor-view.pug
+++ b/app/assets/javascripts/views/editor/editor-view.pug
@@ -134,18 +134,18 @@
                 action="self.selectedMenuItem(true); self.toggleWebPrefKey(self.prefKeyMonospace)"
                 circle="self.state.monospaceFont ? 'success' : 'neutral'",
                 desc="'Toggles the font style for the default editor'",
-                disabled='self.activeEditorComponent',
+                disabled='self.state.editorComponent',
                 label="'Monospace Font'",
-                subtitle="self.activeEditorComponent ? 'Not available with editor extensions' : null"
+                subtitle="self.state.editorComponent ? 'Not available with editor extensions' : null"
                 )
               menu-row(
                 action="self.selectedMenuItem(true); self.toggleWebPrefKey(self.prefKeySpellcheck)"
                 circle="self.state.spellcheck ? 'success' : 'neutral'",
                 desc="'Toggles spellcheck for the default editor'",
-                disabled='self.activeEditorComponent',
+                disabled='self.state.editorComponent',
                 label="'Spellcheck'",
                 subtitle=`
-                  self.activeEditorComponent
+                  self.state.editorComponent
                     ? 'Not available with editor extensions'
                     : (self.state.isDesktop ? 'May degrade editor performance' : null)
                   `)
@@ -167,7 +167,7 @@
             callback='self.editorMenuOnSelect',
             current-item='self.note',
             ng-if='self.state.showEditorMenu',
-            selected-editor-uuid='self.activeEditorComponent && self.activeEditorComponent.uuid',
+            selected-editor-uuid='self.state.editorComponent && self.state.editorComponent.uuid',
             application='self.application'
             )
         .sk-app-bar-item(
@@ -204,8 +204,8 @@
       property="'left'"
       )
     component-view.component-view(
-      component-uuid='self.activeEditorComponent.uuid',
-      ng-if='self.activeEditorComponent && !self.state.editorComponentUnloading',
+      component-uuid='self.state.editorComponent.uuid',
+      ng-if='self.state.editorComponent && !self.state.editorComponentUnloading',
       on-load='self.onEditorLoad',
       application='self.application'
       )
@@ -215,7 +215,7 @@
       ng-change='self.contentChanged()',
       ng-click='self.clickedTextArea()',
       ng-focus='self.onContentFocus()',
-      ng-if='!self.activeEditorComponent && !self.state.textareaUnloading',
+      ng-if='!self.state.editorComponent && !self.state.textareaUnloading',
       ng-model='self.editorValues.text',
       ng-model-options='{ debounce: self.state.editorDebounce}',
       ng-readonly='self.noteLocked',
diff --git a/app/assets/javascripts/views/editor/editor_view.ts b/app/assets/javascripts/views/editor/editor_view.ts
index 482ef5a84..b9e863dda 100644
--- a/app/assets/javascripts/views/editor/editor_view.ts
+++ b/app/assets/javascripts/views/editor/editor_view.ts
@@ -344,21 +344,24 @@ class EditorViewCtrl extends PureViewCtrl<{}, EditorState> {
     const newEditor = this.application.componentManager!.editorForNote(this.note);
     const currentEditor = this.state.editorComponent;
     if (currentEditor?.uuid !== newEditor?.uuid) {
+      if (currentEditor) {
+        await this.application.componentManager!.deactivateComponent(currentEditor.uuid);
+      }
       await this.setState({
         editorComponent: newEditor,
         /** Unload current component view so that we create a new one */
         editorUnloading: true
       });
       if (newEditor && !newEditor.active) {
-        await this.application.componentManager?.activateComponent(newEditor.uuid);
+        await this.application.componentManager!.activateComponent(newEditor.uuid);
       }
       await this.setState({
         /** Reload component view */
         editorUnloading: false
       });
       this.reloadFont();
-      this.application.componentManager!.contextItemDidChangeInArea(ComponentArea.Editor);
     }
+    this.application.componentManager!.contextItemDidChangeInArea(ComponentArea.Editor);
   }
 
   setMenuState(menu: string, state: boolean) {