From 8a56db377feabe09c6812ae61d7630cda1d68868 Mon Sep 17 00:00:00 2001
From: Mo Bitar <me@bitar.io>
Date: Thu, 20 Dec 2018 10:36:23 -0600
Subject: [PATCH] Component stack dock fixes

---
 .../javascripts/app/controllers/editor.js     | 21 +++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/app/controllers/editor.js b/app/assets/javascripts/app/controllers/editor.js
index 247107ab0..b1b196bb6 100644
--- a/app/assets/javascripts/app/controllers/editor.js
+++ b/app/assets/javascripts/app/controllers/editor.js
@@ -27,6 +27,7 @@ angular.module('app')
 
     this.spellcheck = true;
     this.componentManager = componentManager;
+    this.componentStack = [];
 
     $rootScope.$on("sync:taking-too-long", function(){
       this.syncTakingTooLong = true;
@@ -88,11 +89,14 @@ angular.module('app')
       }
     });
 
-    // Observe editor changes to see if the current note should update its editor
 
     modelManager.addItemSyncObserver("editor-component-observer", "SN|Component", (allItems, validItems, deletedItems, source) => {
       if(!this.note) { return; }
 
+      // Reload componentStack in case new ones were added or removed
+      this.reloadComponentStackArray();
+
+      // Observe editor changes to see if the current note should update its editor
       var editors = allItems.filter(function(item) {
         return item.isEditor();
       });
@@ -683,15 +687,18 @@ angular.module('app')
       }
     }});
 
-
-    this.reloadComponentContext = function() {
-      // componentStack is used by the template to ng-repeat
+    this.reloadComponentStackArray = function() {
       this.componentStack = componentManager.componentsForArea("editor-stack").sort((a, b) => {
         // Careful here. For some reason (probably because re-assigning array everytime quickly destroys componentView elements, causing deallocs),
         // sorting by updated_at (or any other property that may always be changing)
         // causes weird problems with ext communication when changing notes or activating/deactivating in quick succession
         return a.name.toLowerCase() < b.name.toLowerCase() ? -1 : 1;
       });
+    }
+
+    this.reloadComponentContext = function() {
+      // componentStack is used by the template to ng-repeat
+      this.reloadComponentStackArray();
       /*
       In the past, we were doing this looping code even if the note wasn't currently defined.
       The problem is if an editor stack item loaded first, requested to stream items, and the note was undefined,
@@ -717,13 +724,15 @@ angular.module('app')
     }
 
     this.toggleStackComponentForCurrentItem = function(component) {
-      if(component.hidden) {
+      // If it's hidden, we want to show it
+      // If it's not active, then hidden won't be set, and we mean to activate and show it.
+      if(component.hidden || !component.active) {
         // Unhide, associate with current item
         component.hidden = false;
+        this.associateComponentWithCurrentNote(component);
         if(!component.active) {
           componentManager.activateComponent(component);
         }
-        this.associateComponentWithCurrentNote(component);
         componentManager.contextItemDidChangeInArea("editor-stack");
       } else {
         // not hidden, hide