feat: create new tabs with cmd/ctrl+n

package.json

@@ -26,6 +26,7 @@
     "postuninstall": "electron-builder install-app-deps"
   },
   "dependencies": {
+    "electron-localshortcut": "^3.1.0",
     "electron-window-state": "^5.0.3",
     "is-url-relative-without-domain": "^2.0.0",
     "lodash-id": "^0.14.0",

src/App.vue

@@ -14,6 +14,7 @@
 import AppLayout from '@/components/AppLayout.vue';
 import TabsList from '@/components/TabsList.vue';
 import WindowDimmer from '@/components/WindowDimmer.vue';
+import Events from '@/utils/mixinEvents';
 import NotificationSchedule from '@/utils/mixinNotificationSchedule';
 
 export default {
@@ -22,6 +23,9 @@ export default {
     TabsList,
     WindowDimmer,
   },
-  mixins: [NotificationSchedule],
+  mixins: [
+    Events,
+    NotificationSchedule,
+  ],
 };
 </script>

src/background.js

@@ -1,3 +1,4 @@
+import electronLocalshortcut from 'electron-localshortcut';
 import windowStateKeeper from 'electron-window-state';
 import * as path from 'path';
 import { format as formatUrl } from 'url';
@@ -114,6 +115,8 @@ app.on('ready', async () => {
   }
   mainWindow = createMainWindow();
 
+  electronLocalshortcut.register('CmdOrCtrl+T', () => app.emit('app-router-goto-tabs-create'));
+
   Menu.setApplicationMenu(Menu.buildFromTemplate([
     {
       label: app.getName(),
@@ -127,7 +130,18 @@ app.on('ready', async () => {
         { type: 'separator' },
         { role: 'quit' },
       ],
-    }, {
+    },
+    {
+      label: 'File',
+      submenu: [
+        {
+          label: 'New Tab',
+          accelerator: 'CmdOrCtrl+N',
+          click: () => app.emit('app-router-goto-tabs-create'),
+        },
+      ],
+    },
+    {
       label: 'Edit',
       submenu: [
         { role: 'undo' },

src/components/TabsNav.vue

@@ -60,13 +60,6 @@ export default {
       return this.$store.getters['Settings/byKey']('navigation.displayTabLabels');
     },
   },
-  created() {
-    const { app } = this.$electron.remote;
-    const r = this.$router;
-    app.on('app-router-goto-settings', () => r.push({ name: 'settings' }));
-    app.on('app-router-goto-welcome', () => r.push({ name: 'welcome' }));
-    app.on('app-router-goto-changelog', () => r.push({ name: 'changelog' }));
-  },
 };
 </script>
 

src/utils/mixinEvents.js

@@ -0,0 +1,11 @@
+export default {
+  created() {
+    const { app } = this.$electron.remote;
+    const r = this.$router;
+
+    app.on('app-router-goto-tabs-create', () => r.push({ name: 'tabs-create' }));
+    app.on('app-router-goto-settings', () => r.push({ name: 'settings' }));
+    app.on('app-router-goto-welcome', () => r.push({ name: 'welcome' }));
+    app.on('app-router-goto-changelog', () => r.push({ name: 'changelog' }));
+  },
+};