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

package-lock.json

@@ -2958,9 +2958,9 @@
       }
     },
     "electron": {
-      "version": "13.0.1",
+      "version": "13.1.0",
-      "resolved": "https://registry.npmjs.org/electron/-/electron-13.0.1.tgz",
+      "resolved": "https://registry.npmjs.org/electron/-/electron-13.1.0.tgz",
-      "integrity": "sha512-ds1cf0m46nStil0jbM2r9W/p+Kprdq22+2MikIUqEu69eGl1c86IinQVrpmJ9bR4RshDSF4j3uD32a0bsHDMnQ==",
+      "integrity": "sha512-ykRAaPWrVQkm2Lju4O4rMQzahNcxWLeLMrhBw8WnmIiugkvUH0MhZ85jsOTrAoQ2Zl1FC542bloKFWGSkeVjkg==",
       "dev": true,
       "requires": {
         "@electron/get": "^1.0.1",
@@ -2969,9 +2969,9 @@
       },
       "dependencies": {
         "@types/node": {
-          "version": "14.17.1",
+          "version": "14.17.2",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-14.17.1.tgz",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-14.17.2.tgz",
-          "integrity": "sha512-/tpUyFD7meeooTRwl3sYlihx2BrJE7q9XF71EguPFIySj9B7qgnRtHsHTho+0AUm4m1SvWGm6uSncrR94q6Vtw==",
+          "integrity": "sha512-sld7b/xmFum66AAKuz/rp/CUO8+98fMpyQ3SBfzzBNGMd/1iHBTAg9oyAvcYlAj46bpc74r91jSw2iFdnx29nw==",
           "dev": true
         }
       }

package.json

@@ -80,7 +80,7 @@
   },
   "devDependencies": {
     "cross-env": "7.0.3",
-    "electron": "13.0.1",
+    "electron": "13.1.0",
     "electron-builder": "22.11.3",
     "electron-packager": "15.2.0",
     "electron-rebuild": "2.3.5",

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 a new tab", command: "openNoteInNewTab", uiIcon: "empty"},
-            {title: "Open note in new window", command: "openNoteInNewWindow", uiIcon: "window-open"}
+            {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 {