refactor: shortcuts registration via ShortcutRegister class

src/main/libs/ShortcutRegister.ts

@@ -0,0 +1,53 @@
+import { BrowserWindow, globalShortcut } from 'electron';
+import * as Store from 'electron-store';
+import { ShortcutRecord, shortcuts as defaultShortcuts } from 'common/shortcuts';
+const shortcutsStore = new Store({ name: 'shortcuts' });
+const isDevelopment = process.env.NODE_ENV !== 'production';
+
+export class ShortcutRegister {
+   shortcuts: ShortcutRecord[];
+   private _mainWindow: BrowserWindow;
+
+   constructor (args: { mainWindow: BrowserWindow }) {
+      this._mainWindow = args.mainWindow;
+      this.shortcuts = shortcutsStore.get('shortcuts', defaultShortcuts) as ShortcutRecord[];
+   }
+
+   init () {
+      for (const shortcut of this.shortcuts) {
+         if (shortcut.os.includes(process.platform)) {
+            for (const key of shortcut.keys) {
+               try {
+                  globalShortcut.register(key, () => {
+                     this._mainWindow.webContents.send(shortcut.event);
+                     if (isDevelopment) console.log('EVENT:', shortcut);
+                  });
+               }
+               catch (error) {
+                  this.restoreDefaults();
+                  throw error;
+               }
+            }
+         }
+      }
+   }
+
+   reload () {
+      this.unregister();
+      this.init();
+   }
+
+   updateShortcuts (shortcuts: ShortcutRecord[]) {
+      this.shortcuts = shortcuts;
+   }
+
+   restoreDefaults () {
+      shortcutsStore.set('shortcuts', defaultShortcuts);
+      this.shortcuts = defaultShortcuts;
+      this.reload();
+   }
+
+   unregister () {
+      globalShortcut.unregisterAll();
+   }
+}

src/main/main.ts

@@ -5,12 +5,13 @@ import * as windowStateKeeper from 'electron-window-state';
 import * as remoteMain from '@electron/remote/main';
 
 import ipcHandlers from './ipc-handlers';
-import { shortcuts } from 'common/shortcuts';
+import { ShortcutRegister } from './libs/ShortcutRegister';
 
 Store.initRenderer();
-const persistentStore = new Store({ name: 'settings' });
+const settingsStore = new Store({ name: 'settings' });
 
-const appTheme = persistentStore.get('application_theme');
+let shortCutRegister: ShortcutRegister;
+const appTheme = settingsStore.get('application_theme');
 const isDevelopment = process.env.NODE_ENV !== 'production';
 const isMacOS = process.platform === 'darwin';
 const isLinux = process.platform === 'linux';
@@ -86,7 +87,7 @@ else {
    ipcHandlers();
 
    ipcMain.on('refresh-theme-settings', () => {
-      const appTheme = persistentStore.get('application_theme');
+      const appTheme = settingsStore.get('application_theme');
       if (isWindows && mainWindow) {
          mainWindow.setTitleBarOverlay({
             color: appTheme === 'dark' ? '#3f3f3f' : '#fff',
@@ -121,6 +122,8 @@ else {
       mainWindow = await createMainWindow();
       createAppMenu();
 
+      shortCutRegister = new ShortcutRegister({ mainWindow });
+
       if (isWindows)
          mainWindow.show();
 
@@ -146,16 +149,7 @@ else {
 
    app.on('browser-window-focus', () => {
       // Send registered shortcut events to window
-      for (const shortcut of shortcuts) {
-         if (shortcut.os.includes(process.platform)) {
-            for (const key of shortcut.keys) {
-               globalShortcut.register(key, () => {
-                  mainWindow.webContents.send(shortcut.event);
-                  if (isDevelopment) console.log('EVENT:', shortcut);
-               });
-            }
-         }
-      }
+      shortCutRegister.init();
 
       if (isDevelopment) { // Dev shortcuts
          globalShortcut.register('Shift+CommandOrControl+F5', () => {
@@ -168,7 +162,7 @@ else {
    });
 
    app.on('browser-window-blur', () => {
-      globalShortcut.unregisterAll();
+      shortCutRegister.unregister();
    });
 }
 

src/renderer/components/ModalSettings.vue

@@ -30,6 +30,13 @@
                         >
                            <a class="tab-link">{{ t('word.themes') }}</a>
                         </li>
+                        <li
+                           class="tab-item c-hand"
+                           :class="{'active': selectedTab === 'shortcuts'}"
+                           @click="selectTab('shortcuts')"
+                        >
+                           <a class="tab-link">{{ t('word.shortcuts') }}</a>
+                        </li>
                         <li
                            v-if="updateStatus !== 'disabled'"
                            class="tab-item c-hand"

src/renderer/i18n/en-US.ts

@@ -142,7 +142,8 @@ module.exports = {
       contributors: 'Contributors',
       pin: 'Pin',
       unpin: 'Unpin',
-      console: 'Console'
+      console: 'Console',
+      shortcuts: 'Shortcuts'
    },
    message: {
       appWelcome: 'Welcome to Antares SQL Client!',