Simplify noteContextReorder event call

src/public/app/components/tab_manager.js

@@ -451,13 +451,21 @@ export default class TabManager extends Component {
         this.tabsUpdate.scheduleUpdate();
     }
 
-    noteContextReorderEvent({ntxIdsInOrder, mainNtxIdsInOrder}) {
+    noteContextReorderEvent({ntxIdsInOrder, oldMainNtxId, newMainNtxId}) {
         const order = Object.fromEntries(ntxIdsInOrder.map((v, i) => [v, i]));
 
         this.children.sort((a, b) => order[a.ntxId] < order[b.ntxId] ? -1 : 1);
 
-        if (!!mainNtxIdsInOrder && mainNtxIdsInOrder.length === this.children.length) {
+        if (oldMainNtxId && newMainNtxId) {
-            this.children.forEach((c, i) => c.mainNtxId = mainNtxIdsInOrder[i]);
+            this.children.forEach(c => {
+                if (c.ntxId === newMainNtxId) {
+                    // new main context has null mainNtxId
+                    c.mainNtxId = null;
+                } else if (c.ntxId === oldMainNtxId || c.mainNtxId === oldMainNtxId) {
+                    // old main context or subcontexts all have the new mainNtxId
+                    c.mainNtxId = newMainNtxId;
+                }
+            });
         }
 
         this.tabsUpdate.scheduleUpdate();

src/public/app/widgets/buttons/move_pane_button.js

@@ -2,42 +2,6 @@ import OnClickButtonWidget from "./onclick_button.js";
 import appContext from "../../components/app_context.js";
 
 export default class MovePaneButton extends OnClickButtonWidget {
-    isEnabled() {
-        if (!super.isEnabled())
-            return false;
-        
-        if (this.isMovingLeft) {
-            // movable if the current context is not a main context, i.e. non-null mainNtxId
-            return !!this.noteContext?.mainNtxId;
-        } else {
-            const currentIndex = appContext.tabManager.noteContexts.findIndex(c => c.ntxId === this.ntxId);
-            const nextContext = appContext.tabManager.noteContexts[currentIndex + 1];
-            // movable if the next context is not null and not a main context, i.e. non-null mainNtxId
-            return !!nextContext?.mainNtxId;
-        }
-    }
-
-    initialRenderCompleteEvent() {
-        this.refresh();
-        super.initialRenderCompleteEvent();
-    }
-
-    async noteContextRemovedEvent({ntxIds}) {
-        this.refresh();
-    }
-
-    async newNoteContextCreatedEvent({noteContext}) {
-        this.refresh();
-    }
-
-    async noteContextSwitchEvent() {
-        this.refresh();
-    }
-
-    async noteContextReorderEvent({ntxIdsInOrder}) {
-        this.refresh();
-    }
-
     constructor(isMovingLeft) {
         super();
 
@@ -52,4 +16,32 @@ export default class MovePaneButton extends OnClickButtonWidget {
             })
             .class("icon-action");
     }
+
+    isEnabled() {
+        if (!super.isEnabled()) {
+            return false;
+        }
+
+        if (this.isMovingLeft) {
+            // movable if the current context is not a main context, i.e. non-null mainNtxId
+            return !!this.noteContext?.mainNtxId;
+        } else {
+            const currentIndex = appContext.tabManager.noteContexts.findIndex(c => c.ntxId === this.ntxId);
+            const nextContext = appContext.tabManager.noteContexts[currentIndex + 1];
+            // movable if the next context is not null and not a main context, i.e. non-null mainNtxId
+            return !!nextContext?.mainNtxId;
+        }
+    }
+
+    async noteContextRemovedEvent() {
+        this.refresh();
+    }
+
+    async newNoteContextCreatedEvent() {
+        this.refresh();
+    }
+
+    async noteContextReorderEvent() {
+        this.refresh();
+    }
 }

src/public/app/widgets/containers/split_note_container.js

@@ -86,28 +86,31 @@ export default class SplitNoteContainer extends FlexContainer {
         const leftIndex = isMovingLeft ? currentIndex - 1 : currentIndex;
 
         if (currentIndex === -1 || leftIndex < 0 || leftIndex + 1 >= contexts.length) {
-            logError("invalid context!");
+            logError(`invalid context! currentIndex: ${currentIndex}, leftIndex: ${leftIndex}, contexts.length: ${contexts.length}`);
             return;
         }
 
-        if (contexts[leftIndex].isEmpty() && contexts[leftIndex + 1].isEmpty())
+        if (contexts[leftIndex].isEmpty() && contexts[leftIndex + 1].isEmpty()) {
             // no op
             return;
+        }
 
         const ntxIds = contexts.map(c => c.ntxId);
-        const mainNtxIds = contexts.map(c => c.mainNtxId);
+        const newNtxIds = [
+            ...ntxIds.slice(0, leftIndex),
+            ntxIds[leftIndex + 1],
+            ntxIds[leftIndex],
+            ...ntxIds.slice(leftIndex + 2),
+        ];
+        const isChangingMainContext = !contexts[leftIndex].mainNtxId;
 
         this.triggerCommand("noteContextReorder", {
-            ntxIdsInOrder: [
+            ntxIdsInOrder: newNtxIds,
-                ...ntxIds.slice(0, leftIndex),
+            oldMainNtxId: isChangingMainContext ? ntxIds[leftIndex] : null,
-                ntxIds[leftIndex + 1],
+            newMainNtxId: isChangingMainContext ? ntxIds[leftIndex + 1]: null,
-                ntxIds[leftIndex],
-                ...ntxIds.slice(leftIndex + 2),
-            ],
-            oldNtxIdsInOrder: ntxIds,
-            mainNtxIdsInOrder: mainNtxIds.map(id => id === ntxIds[leftIndex] ? ntxIds[leftIndex + 1] : id)
         });
 
+        // reorder the note context widgets
         this.$widget.find(`[data-ntx-id="${ntxIds[leftIndex]}"]`)
             .insertAfter(this.$widget.find(`[data-ntx-id="${ntxIds[leftIndex + 1]}"]`));
 

src/public/app/widgets/tab_row.js

@@ -609,20 +609,15 @@ export default class TabRowWidget extends BasicWidget {
         this.updateTabById(noteContext.mainNtxId || noteContext.ntxId);
     }
 
-    noteContextReorderEvent({ntxIdsInOrder, oldNtxIdsInOrder, mainNtxIdsInOrder}) {
+    noteContextReorderEvent({oldMainNtxId, newMainNtxId}) {
-        if (!oldNtxIdsInOrder || !mainNtxIdsInOrder
+        if (!oldMainNtxId || !newMainNtxId) {
-            || ntxIdsInOrder.length !== oldNtxIdsInOrder.length
+            // no need to update tab row
-            || ntxIdsInOrder.length !== mainNtxIdsInOrder.length
-        )
             return;
+        }
 
-        ntxIdsInOrder.forEach((id, i) => {
+        // update tab id for the new main context
-            // update main context that is not a tab
+        this.getTabById(oldMainNtxId).attr("data-ntx-id", newMainNtxId);
-            if (!mainNtxIdsInOrder[i] && this.getTabById(id).length === 0) {
+        this.updateTabById(newMainNtxId);        
-                this.getTabById(oldNtxIdsInOrder[i]).attr("data-ntx-id", id);
-                this.updateTabById(id);
-            }
-        });
     }
 
     updateTabById(ntxId) {