context menu now offer option to open notes in a new pane

src/public/app/services/link.js

@@ -132,13 +132,20 @@ function linkContextMenu(e) {
         x: e.pageX,
         y: e.pageY,
         items: [
-            {title: "Open note in new tab", command: "openNoteInNewTab", uiIcon: "empty"},
-            {title: "Open note in new window", command: "openNoteInNewWindow", uiIcon: "window-open"}
+            {title: "Open note in a new tab", command: "openNoteInNewTab", uiIcon: "empty"},
+            {title: "Open note in a new pane", command: "openNoteInNewPane", uiIcon: "dock-right"},
+            {title: "Open note in a new window", command: "openNoteInNewWindow", uiIcon: "window-open"}
         ],
         selectMenuItemHandler: ({command}) => {
             if (command === 'openNoteInNewTab') {
                 appContext.tabManager.openTabWithNoteWithHoisting(notePath);
             }
+            else if (command === 'openNoteInNewPane') {
+                const subContexts = appContext.tabManager.getActiveContext().getSubContexts();
+                const {ntxId} = subContexts[subContexts.length - 1];
+
+                appContext.triggerCommand("openNewPane", {ntxId, notePath});
+            }
             else if (command === 'openNoteInNewWindow') {
                 appContext.triggerCommand('openInWindow', {notePath, hoistedNoteId: 'root'});
             }

src/public/app/services/tree_context_menu.js

@@ -55,7 +55,7 @@ class TreeContextMenu {
 
         return [
             { title: 'Open in a new tab <kbd>Ctrl+Click</kbd>', command: "openInTab", uiIcon: "empty", enabled: noSelectedNotes },
-            { title: 'Open in a new window', command: "openInWindow", uiIcon: "window-open", enabled: noSelectedNotes },
+            { title: 'Open in a new pane', command: "openNoteInPane", uiIcon: "dock-right", enabled: noSelectedNotes },
             { title: 'Insert note after <kbd data-command="createNoteAfter"></kbd>', command: "insertNoteAfter", uiIcon: "plus",
                 items: insertNoteAfterEnabled ? this.getNoteTypeItems("insertNoteAfter") : null,
                 enabled: insertNoteAfterEnabled && noSelectedNotes },
@@ -130,6 +130,12 @@ class TreeContextMenu {
                 isProtected: this.node.data.isProtected
             });
         }
+        else if (command === 'openNoteInPane') {
+            const subContexts = appContext.tabManager.getActiveContext().getSubContexts();
+            const {ntxId} = subContexts[subContexts.length - 1];
+
+            this.treeWidget.triggerCommand("openNewPane", {ntxId, notePath});
+        }
         else {
             this.treeWidget.triggerCommand(command, {node: this.node, notePath: notePath});
         }

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

@@ -17,6 +17,7 @@ const TPL = `
         justify-content: center;
         margin-left: 10px;
         flex-grow: 1;
+        flex-flow: row wrap;
     }
     
     .section-title {

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

@@ -34,7 +34,7 @@ export default class PaneContainer extends FlexContainer {
         this.child(widget);
     }
 
-    async openNewPaneCommand({ntxId}) {
+    async openNewPaneEvent({ntxId, notePath}) {
         const noteContext = await appContext.tabManager.openEmptyTab(null, 'root', appContext.tabManager.getActiveMainContext().ntxId);
 
         // remove the original position of newly created note context
@@ -52,7 +52,12 @@ export default class PaneContainer extends FlexContainer {
 
         await appContext.tabManager.activateNoteContext(noteContext.ntxId);
 
-        await noteContext.setEmpty();
+        if (notePath) {
+            await noteContext.setNote(notePath);
+        }
+        else {
+            await noteContext.setEmpty();
+        }
     }
 
     closeThisPaneCommand({ntxId}) {

src/public/stylesheets/tree.css

@@ -21,6 +21,7 @@ ul.fancytree-container {
     cursor: pointer;
     overflow: hidden;
     white-space: nowrap;
+    text-overflow: ellipsis;
 }
 
 .fancytree-node:not(.fancytree-loading) .fancytree-expander {