Merge pull request #405 from antares-sql/custom-shortcuts

Shortcuts customization

.stylelintrc

@@ -1,6 +1,7 @@
 {
   "extends": [
-    "stylelint-config-standard"
+    "stylelint-config-standard",
+    "stylelint-config-recommended-vue"
   ],
   "fix": true,
   "formatter": "verbose",

package.json

@@ -181,15 +181,17 @@
     "node-loader": "~2.0.0",
     "playwright": "~1.21.1",
     "playwright-core": "~1.21.1",
+    "postcss-html": "~1.5.0",
     "progress-webpack-plugin": "~1.0.12",
     "rimraf": "~3.0.2",
     "sass": "~1.42.1",
     "sass-loader": "~12.3.0",
     "standard-version": "~9.3.1",
     "style-loader": "~3.3.1",
-    "stylelint": "~13.13.1",
+    "stylelint": "~14.9.1",
-    "stylelint-config-standard": "~22.0.0",
+    "stylelint-config-recommended-vue": "~1.4.0",
-    "stylelint-scss": "~3.21.0",
+    "stylelint-config-standard": "~26.0.0",
+    "stylelint-scss": "~4.3.0",
     "tree-kill": "~1.2.2",
     "ts-loader": "~9.2.8",
     "typescript": "~4.6.3",

scripts/devRunner.js

@@ -114,7 +114,6 @@ function startRenderer (callback) {
    });
 
    const server = new WebpackDevServer(compiler, {
-      hot: true,
       port: 9080,
       client: {
          overlay: true,

src/common/shortcuts.ts

@@ -1,67 +1,136 @@
+export const shortcutEvents: { [key: string]: { l18n: string; l18nParam?: string | number; context?: 'tab' }} = {
+   'open-new-tab': { l18n: 'message.openNewTab', context: 'tab' },
+   'close-tab': { l18n: 'message.closeTab', context: 'tab' },
+   'next-tab': { l18n: 'message.nextTab', context: 'tab' },
+   'prev-tab': { l18n: 'message.previousTab', context: 'tab' },
+   'format-query': { l18n: 'message.formatQuery', context: 'tab' },
+   'kill-query': { l18n: 'message.killQuery', context: 'tab' },
+   'query-history': { l18n: 'message.queryHistory', context: 'tab' },
+   'clear-query': { l18n: 'message.clearQuery', context: 'tab' },
+   'open-all-connections': { l18n: 'message.openAllConnections' },
+   'open-filter': { l18n: 'message.openFilter' },
+   'next-page': { l18n: 'message.nextResultsPage' },
+   'prev-page': { l18n: 'message.previousResultsPage' },
+   'toggle-console': { l18n: 'message.toggleConsole' },
+   'save-content': { l18n: 'message.saveContent' },
+   'run-or-reload': { l18n: 'message.runOrReload' },
+   'create-connection': { l18n: 'message.createNewConnection' },
+   'open-settings': { l18n: 'message.openSettings' },
+   'open-scratchpad': { l18n: 'message.openScratchpad' }
+};
+
 interface ShortcutRecord {
    event: string;
-   keys: Electron.Accelerator[];
+   keys: Electron.Accelerator[] | string[];
-   description: string;
+   /** Needed for default shortcuts */
    os: NodeJS.Platform[];
 }
 
+/**
+ * Default shortcuts
+ */
 const shortcuts: ShortcutRecord[] = [
+   {
+      event: 'run-or-reload',
+      keys: ['F5'],
+      os: ['darwin', 'linux', 'win32']
+   },
+   {
+      event: 'save-content',
+      keys: ['CommandOrControl+S'],
+      os: ['darwin', 'linux', 'win32']
+   },
+   {
+      event: 'kill-query',
+      keys: ['CommandOrControl+K'],
+      os: ['darwin', 'linux', 'win32']
+   },
+   {
+      event: 'format-query',
+      keys: ['CommandOrControl+B'],
+      os: ['darwin', 'linux', 'win32']
+   },
+   {
+      event: 'clear-query',
+      keys: ['CommandOrControl+Alt+W'],
+      os: ['darwin', 'linux', 'win32']
+   },
+   {
+      event: 'query-history',
+      keys: ['CommandOrControl+G'],
+      os: ['darwin', 'linux', 'win32']
+   },
    {
       event: 'open-new-tab',
       keys: ['CommandOrControl+T'],
-      description: 'Open a new query tab',
       os: ['darwin', 'linux', 'win32']
    },
    {
       event: 'close-tab',
       keys: ['CommandOrControl+W'],
-      description: 'Close tab',
       os: ['darwin', 'linux', 'win32']
    },
    {
       event: 'next-tab',
-      keys: ['Alt+CommandOrControl+Right', 'CommandOrControl+PageDown'],
+      keys: ['Alt+CommandOrControl+Right'],
-      description: 'Next tab',
       os: ['darwin', 'win32']
    },
    {
       event: 'prev-tab',
-      keys: ['Alt+CommandOrControl+Left', 'CommandOrControl+PageUp'],
+      keys: ['Alt+CommandOrControl+Left'],
-      description: 'Previous tab',
       os: ['darwin', 'win32']
    },
    {
       event: 'next-tab',
       keys: ['CommandOrControl+PageDown'],
-      description: 'Next tab',
+      os: ['linux', 'win32']
-      os: ['linux']
    },
    {
       event: 'prev-tab',
       keys: ['CommandOrControl+PageUp'],
-      description: 'Previous tab',
+      os: ['linux', 'win32']
-      os: ['linux']
    },
    {
-      event: 'open-connections-modal',
+      event: 'open-filter',
+      keys: ['CommandOrControl+F'],
+      os: ['darwin', 'linux', 'win32']
+   },
+   {
+      event: 'next-page',
+      keys: ['CommandOrControl+Right'],
+      os: ['darwin', 'linux', 'win32']
+   },
+   {
+      event: 'prev-page',
+      keys: ['CommandOrControl+Left'],
+      os: ['darwin', 'linux', 'win32']
+   },
+   {
+      event: 'open-all-connections',
       keys: ['Shift+CommandOrControl+Space'],
-      description: 'Show all connections',
       os: ['darwin', 'linux', 'win32']
    },
    {
       event: 'toggle-console',
-      keys: ['CommandOrControl+F12', 'CommandOrControl+`'],
+      keys: ['CommandOrControl+F12'],
-      description: 'Toggle console',
+      os: ['darwin', 'linux', 'win32']
+   },
+   {
+      event: 'toggle-console',
+      keys: ['CommandOrControl+`'],
       os: ['darwin', 'linux', 'win32']
    }
 ];
 
 for (let i = 1; i <= 9; i++) {
-   shortcuts.push(
+   shortcutEvents[`select-tab-${i}`] = {
-      {
+      l18n: 'message.selectTabNumber',
+      l18nParam: i
+   };
+
+   shortcuts.push({
       event: `select-tab-${i}`,
       keys: [`CommandOrControl+${i}`],
-         description: `Select tab number ${i}`,
       os: ['darwin', 'linux', 'win32']
    });
 }

src/main/ipc-handlers/application.ts

@@ -1,4 +1,5 @@
-import { app, ipcMain, dialog } from 'electron';
+import { app, ipcMain, dialog, BrowserWindow } from 'electron';
+import { ShortcutRegister } from '../libs/ShortcutRegister';
 
 export default () => {
    ipcMain.on('close-app', () => {
@@ -12,4 +13,28 @@ export default () => {
    ipcMain.handle('get-download-dir-path', () => {
       return app.getPath('downloads');
    });
+
+   ipcMain.handle('resotre-default-shortcuts', () => {
+      const mainWindow = BrowserWindow.getAllWindows()[0];
+      const shortCutRegister = ShortcutRegister.getInstance({ mainWindow });
+      shortCutRegister.restoreDefaults();
+   });
+
+   ipcMain.handle('reload-shortcuts', () => {
+      const mainWindow = BrowserWindow.getAllWindows()[0];
+      const shortCutRegister = ShortcutRegister.getInstance({ mainWindow });
+      shortCutRegister.reload();
+   });
+
+   ipcMain.handle('update-shortcuts', (event, shortcuts) => {
+      const mainWindow = BrowserWindow.getAllWindows()[0];
+      const shortCutRegister = ShortcutRegister.getInstance({ mainWindow });
+      shortCutRegister.updateShortcuts(shortcuts);
+   });
+
+   ipcMain.handle('unregister-shortcuts', () => {
+      const mainWindow = BrowserWindow.getAllWindows()[0];
+      const shortCutRegister = ShortcutRegister.getInstance({ mainWindow });
+      shortCutRegister.unregister();
+   });
 };

src/main/libs/ShortcutRegister.ts

@@ -0,0 +1,74 @@
+import { BrowserWindow, globalShortcut } from 'electron';
+import * as Store from 'electron-store';
+import { ShortcutRecord, shortcuts } from 'common/shortcuts';
+
+const shortcutsStore = new Store({ name: 'shortcuts' });
+const isDevelopment = process.env.NODE_ENV !== 'production';
+const defaultShortcuts = shortcuts.filter(s => s.os.includes(process.platform));
+
+export class ShortcutRegister {
+   private _shortcuts: ShortcutRecord[];
+   private _mainWindow: BrowserWindow;
+   private static _instance: ShortcutRegister;
+
+   private constructor (args: { mainWindow: BrowserWindow }) {
+      this._mainWindow = args.mainWindow;
+      this.shortcuts = shortcutsStore.get('shortcuts', defaultShortcuts) as ShortcutRecord[];
+   }
+
+   public static getInstance (args: { mainWindow: BrowserWindow }) {
+      if (!ShortcutRegister._instance)
+         ShortcutRegister._instance = new ShortcutRegister(args);
+
+      return ShortcutRegister._instance;
+   }
+
+   get shortcuts () {
+      return this._shortcuts;
+   }
+
+   private set shortcuts (value: ShortcutRecord[]) {
+      this._shortcuts = value;
+      shortcutsStore.set('shortcuts', value);
+   }
+
+   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;
+               }
+            }
+         }
+      }
+
+      this._mainWindow.webContents.send('update-shortcuts', this.shortcuts);
+   }
+
+   reload () {
+      this.unregister();
+      this.init();
+   }
+
+   updateShortcuts (shortcuts: ShortcutRecord[]) {
+      this.shortcuts = shortcuts;
+      this.reload();
+   }
+
+   restoreDefaults () {
+      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,12 +122,32 @@ else {
       mainWindow = await createMainWindow();
       createAppMenu();
 
+      shortCutRegister = ShortcutRegister.getInstance({ mainWindow });
+
       if (isWindows)
          mainWindow.show();
 
       if (isDevelopment)
          mainWindow.webContents.openDevTools();
 
+      app.on('browser-window-focus', () => {
+      // Send registered shortcut events to window
+         shortCutRegister.init();
+
+         if (isDevelopment) { // Dev shortcuts
+            globalShortcut.register('Shift+CommandOrControl+F5', () => {
+               mainWindow.reload();
+            });
+            globalShortcut.register('Shift+CommandOrControl+F12', () => {
+               mainWindow.webContents.openDevTools();
+            });
+         }
+      });
+
+      app.on('browser-window-blur', () => {
+         shortCutRegister.unregister();
+      });
+
       process.on('uncaughtException', error => {
          mainWindow.webContents.send('unhandled-exception', error);
       });
@@ -143,33 +164,6 @@ else {
          window.webContents.session.loadExtension(extensionPath, { allowFileAccess: true }).catch(console.error);
       }
    });
-
-   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);
-               });
-            }
-         }
-      }
-
-      if (isDevelopment) { // Dev shortcuts
-         globalShortcut.register('Shift+CommandOrControl+F5', () => {
-            mainWindow.reload();
-         });
-         globalShortcut.register('Shift+CommandOrControl+F12', () => {
-            mainWindow.webContents.openDevTools();
-         });
-      }
-   });
-
-   app.on('browser-window-blur', () => {
-      globalShortcut.unregisterAll();
-   });
 }
 
 function createAppMenu () {

src/renderer/App.vue

@@ -67,10 +67,6 @@ const { changeApplicationTheme } = settingsStore;
 
 const isAllConnectionsModal: Ref<boolean> = ref(false);
 
-ipcRenderer.on('open-connections-modal', () => {
-   isAllConnectionsModal.value = true;
-});
-
 document.addEventListener('DOMContentLoaded', () => {
    setTimeout(() => {
       changeApplicationTheme(applicationTheme.value);// Forces persistentStore to save on file and mail process
@@ -78,6 +74,22 @@ document.addEventListener('DOMContentLoaded', () => {
 });
 
 onMounted(() => {
+   ipcRenderer.on('open-all-connections', () => {
+      isAllConnectionsModal.value = true;
+   });
+
+   ipcRenderer.on('open-scratchpad', () => {
+      isScratchpad.value = true;
+   });
+
+   ipcRenderer.on('open-settings', () => {
+      isSettingModal.value = true;
+   });
+
+   ipcRenderer.on('create-connection', () => {
+      workspacesStore.selectWorkspace('NEW');
+   });
+
    ipcRenderer.send('check-for-updates');
    checkVersionUpdate();
 

src/renderer/components/BaseConfirmModal.vue

@@ -68,6 +68,10 @@ const props = defineProps({
    disableAutofocus: {
       type: Boolean,
       default: false
+   },
+   closeOnConfirm: {
+      type: Boolean,
+      default: true
    }
 });
 const emit = defineEmits(['confirm', 'hide']);
@@ -90,7 +94,7 @@ const modalSizeClass = computed(() => {
 
 const confirmModal = () => {
    emit('confirm');
-   hideModal();
+   if (props.closeOnConfirm) hideModal();
 };
 
 const hideModal = () => {

src/renderer/components/KeyPressDetector.vue

@@ -0,0 +1,122 @@
+<template>
+   <div class="form-group has-icon-right m-0">
+      <input
+         class="form-input"
+         type="text"
+         :value="pressedKeys"
+         :placeholder="t('message.registerAShortcut')"
+         @focus="isFocus = true"
+         @blur="isFocus = false"
+         @keydown.prevent.stop="onKey"
+      >
+      <i class="form-icon mdi mdi-keyboard-outline mdi-24px" />
+   </div>
+</template>
+<script setup lang="ts">
+import { computed, PropType, Ref, ref, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
+import Application from '@/ipc-api/Application';
+
+const { t } = useI18n();
+
+const emit = defineEmits(['update:modelValue']);
+
+const isMacOS = process.platform === 'darwin';
+
+const props = defineProps({
+   modelValue: String as PropType<string | Electron.Accelerator>
+});
+
+const isFocus = ref(false);
+const keyboardEvent: Ref<KeyboardEvent> = ref(null);
+
+const pressedKeys = computed(() => {
+   const keys: string[] = [];
+   const singleKeysToIgnore = ['Dead', 'Backspace', 'ArrotLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'];
+   const specialKeys = ['Control', 'Alt', 'AltGraph', 'Shift', 'Meta', 'CapsLock', 'ContextMenu', 'Escape'];
+   const keysFromCode = ['Space', 'Minus', 'Equal', 'Slash', 'Quote', 'Semicolon', 'Comma', 'Period', 'Backslash', 'BracketLeft', 'BracketRight'];
+
+   if (props.modelValue && !keyboardEvent.value)
+      return props.modelValue;
+   else if (keyboardEvent.value) {
+      if (keyboardEvent.value.altKey)
+         keys.push('Alt');
+      if (keyboardEvent.value.ctrlKey)
+         keys.push('Control');
+      if (keyboardEvent.value.metaKey && isMacOS)
+         keys.push('Command');
+      if (keyboardEvent.value.shiftKey && keys.length)
+         keys.push('Shift');
+      if (keyboardEvent.value.code) {
+         if (keys.length === 0 && (keyboardEvent.value.key.length === 1 || singleKeysToIgnore.includes(keyboardEvent.value.key)))
+            return t('message.invalidShortcutMessage');
+         else if (!specialKeys.includes(keyboardEvent.value.key)) {
+            if (keyboardEvent.value.key === 'Dead') {
+               keys.push(keyboardEvent.value.code
+                  .replace('Digit', '')
+                  .replace('Key', '')
+                  .replace('Quote', '\'')
+                  .replace('Backquote', '`'));
+            }
+            else if (keysFromCode.includes(keyboardEvent.value.code) || keyboardEvent.value.code.includes('Digit')) {
+               keys.push(keyboardEvent.value.code
+                  .replace('Quote', '\'')
+                  .replace('Semicolon', ';')
+                  .replace('Slash', '/')
+                  .replace('Backslash', '\\')
+                  .replace('BracketLeft', '[')
+                  .replace('BracketRight', ']')
+                  .replace('Comma', ',')
+                  .replace('Period', '.')
+                  .replace('Minus', '-')
+                  .replace('Equal', '=')
+                  .replace('Digit', '')
+                  .replace('Key', ''));
+            }
+            else {
+               keys.push(keyboardEvent.value.key.length === 1
+                  ? keyboardEvent.value.key.toUpperCase()
+                  : keyboardEvent.value.key
+                     .replace('Arrow', '')
+               );
+            }
+         }
+         else
+            return t('message.invalidShortcutMessage');
+      }
+   }
+
+   return keys.join('+');
+});
+
+const onKey = (e: KeyboardEvent) => {
+   e.stopPropagation();
+   e.preventDefault();
+   keyboardEvent.value = e;
+};
+
+watch(pressedKeys, (value) => {
+   if (value !== t('message.invalidShortcutMessage'))
+      emit('update:modelValue', pressedKeys.value);
+});
+
+watch(isFocus, (val) => {
+   if (val)
+      Application.unregisterShortcuts();
+   else
+      Application.reloadShortcuts();
+});
+</script>
+<style lang="scss" scoped>
+.has-icon-right {
+   .form-input {
+      padding-right: 1.8rem;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      caret-color: transparent;
+   }
+   .form-icon {
+      right: 0.4rem;
+   }
+}
+</style>

src/renderer/components/ModalProcessesList.vue

@@ -29,7 +29,7 @@
                         <button
                            class="btn btn-dark btn-sm mr-0 pr-1 d-flex"
                            :class="{'loading':isQuering}"
-                           :title="`${t('word.refresh')} (F5)`"
+                           :title="`${t('word.refresh')}`"
                            @click="getProcessesList"
                         >
                            <i v-if="!+autorefreshTimer" class="mdi mdi-24px mdi-refresh mr-1" />
@@ -135,6 +135,7 @@
 
 <script setup lang="ts">
 import { Component, computed, onBeforeUnmount, onMounted, onUpdated, Prop, Ref, ref } from 'vue';
+import { ipcRenderer } from 'electron';
 import { ConnectionParams } from 'common/interfaces/antares';
 import { exportRows } from '../libs/exportRows';
 import { useNotificationsStore } from '@/stores/notifications';
@@ -326,10 +327,10 @@ const onKey = (e:KeyboardEvent) => {
    e.stopPropagation();
    if (e.key === 'Escape')
       closeModal();
-   if (e.key === 'F5')
-      getProcessesList();
 };
 
+ipcRenderer.on('run-or-reload', getProcessesList);
+
 window.addEventListener('keydown', onKey, { capture: true });
 
 onMounted(() => {
@@ -348,6 +349,8 @@ onBeforeUnmount(() => {
    window.removeEventListener('keydown', onKey, { capture: true });
    window.removeEventListener('resize', resizeResults);
    clearInterval(refreshInterval.value);
+
+   ipcRenderer.removeListener('run-or-reload', getProcessesList);
 });
 
 defineExpose({ refreshScroller });

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"
@@ -282,6 +289,9 @@
                      </div>
                   </div>
 
+                  <div v-show="selectedTab === 'shortcuts'" class="panel-body py-4">
+                     <ModalSettingsShortcuts />
+                  </div>
                   <div v-show="selectedTab === 'update'" class="panel-body py-4">
                      <ModalSettingsUpdate />
                   </div>
@@ -326,6 +336,7 @@ import { useFocusTrap } from '@/composables/useFocusTrap';
 import { localesNames } from '@/i18n/supported-locales';
 import ModalSettingsUpdate from '@/components/ModalSettingsUpdate.vue';
 import ModalSettingsChangelog from '@/components/ModalSettingsChangelog.vue';
+import ModalSettingsShortcuts from '@/components/ModalSettingsShortcuts.vue';
 import BaseTextEditor from '@/components/BaseTextEditor.vue';
 import BaseSelect from '@/components/BaseSelect.vue';
 import { AvailableLocale } from '@/i18n';

src/renderer/components/ModalSettingsShortcuts.vue

@@ -0,0 +1,321 @@
+<template>
+   <div class="p-relative">
+      <div class="shortcuts-tools pb-2 px-2">
+         <button class="btn btn-dark btn-sm d-flex ml-2" @click="showAddModal">
+            <i class="mdi mdi-24px mdi-plus mr-1" /><span>{{ t('message.addShortcut') }}</span>
+         </button>
+         <button class="btn btn-dark btn-sm d-flex ml-2" @click="isConfirmRestoreModal = true">
+            <i class="mdi mdi-24px mdi-undo mr-1" /><span>{{ t('message.restoreDefaults') }}</span>
+         </button>
+      </div>
+      <div class="container workspace-query-results">
+         <div class="table table-hover">
+            <div class="thead">
+               <div class="tr text-uppercase">
+                  <div class="th no-border">
+                     <div>
+                        {{ t('word.event') }}
+                     </div>
+                  </div>
+                  <div class="th no-border" style="width: 100%;">
+                     <div>
+                        {{ t('word.key', 2) }}
+                     </div>
+                  </div>
+                  <div class="th no-border" />
+               </div>
+            </div>
+
+            <div class="tbody">
+               <div
+                  v-for="(shortcut, i) in shortcuts"
+                  :key="i"
+                  class="tr"
+                  tabindex="0"
+               >
+                  <div class="td py-1">
+                     {{ t(shortcutEvents[shortcut.event].l18n, {param: shortcutEvents[shortcut.event].l18nParam}) }}
+                  </div>
+                  <div
+                     class="td py-1"
+                     style="border-right: 0;"
+                     v-html="parseKeys(shortcut.keys)"
+                  />
+                  <div class="td py-1 pr-2">
+                     <button class="shortcut-button btn btn-link btn-sm d-flex p-0 px-1 mr-2" @click="showEditModal({...shortcut, index: i})">
+                        <span>{{ t('word.edit') }}</span><i class="mdi mdi-pencil ml-1" />
+                     </button>
+                     <button class="shortcut-button btn btn-link btn-sm d-flex p-0 px-1" @click="showDeleteModal(shortcut)">
+                        <span>{{ t('word.delete') }}</span><i class="mdi mdi-delete-outline ml-1" />
+                     </button>
+                  </div>
+               </div>
+            </div>
+         </div>
+      </div>
+   </div>
+   <Teleport to="#window-content">
+      <ConfirmModal
+         v-if="isConfirmAddModal"
+         :disable-autofocus="true"
+         :confirm-text="t('word.save')"
+         :close-on-confirm="false"
+         @confirm="addShortcut"
+         @hide="closeAddModal"
+      >
+         <template #header>
+            <div class="d-flex">
+               <i class="mdi mdi-24px mdi-plus mr-1" /> {{ t('message.addShortcut') }}
+            </div>
+         </template>
+         <template #body>
+            <div class="mb-2">
+               <div class="form-group">
+                  <label class="form-label">{{ t('word.event') }}</label>
+                  <BaseSelect
+                     v-model="shortcutToAdd.event"
+                     class="form-select"
+                     :options="eventOptions"
+                  />
+               </div>
+            </div>
+            <div class="mb-2">
+               <div class="form-group">
+                  <label class="form-label">{{ t('word.key', 2) }}</label>
+                  <KeyPressDetector v-model="typedShortcut" />
+               </div>
+            </div>
+            <small v-if="doesShortcutExists" class="text-warning">{{ t('message.shortcutAlreadyExists') }}</small>
+         </template>
+      </ConfirmModal>
+
+      <ConfirmModal
+         v-if="isConfirmEditModal"
+         :disable-autofocus="true"
+         :confirm-text="t('word.save')"
+         :close-on-confirm="false"
+         @confirm="editShortcut"
+         @hide="closeEditModal"
+      >
+         <template #header>
+            <div class="d-flex">
+               <i class="mdi mdi-24px mdi-plus mr-1" /> {{ t('message.editShortcut') }}
+            </div>
+         </template>
+         <template #body>
+            <div class="mb-2">
+               <div class="form-group">
+                  <label class="form-label">{{ t('word.event') }}</label>
+                  <BaseSelect
+                     v-model="shortcutToEdit.event"
+                     class="form-select"
+                     :options="eventOptions"
+                     :disabled="true"
+                  />
+               </div>
+            </div>
+            <div class="mb-2">
+               <div class="form-group">
+                  <label class="form-label">{{ t('word.key', 2) }}</label>
+                  <KeyPressDetector v-model="shortcutToEdit.keys[0]" />
+               </div>
+            </div>
+            <small v-if="doesShortcutExists" class="text-warning">{{ t('message.shortcutAlreadyExists') }}</small>
+         </template>
+      </ConfirmModal>
+
+      <ConfirmModal
+         v-if="isConfirmDeleteModal"
+         :disable-autofocus="true"
+         @confirm="deleteShortcut"
+         @hide="isConfirmDeleteModal = false"
+      >
+         <template #header>
+            <div class="d-flex">
+               <i class="mdi mdi-24px mdi-delete mr-1" /> {{ t('message.deleteShortcut') }}
+            </div>
+         </template>
+         <template #body>
+            <div class="mb-2">
+               {{ t('message.deleteCorfirm') }} <b>{{ t(shortcutEvents[shortcutToDelete.event].l18n, {param: shortcutEvents[shortcutToDelete.event].l18nParam}) }} (<span v-html="parseKeys(shortcutToDelete.keys)" />)</b>?
+            </div>
+         </template>
+      </ConfirmModal>
+
+      <ConfirmModal
+         v-if="isConfirmRestoreModal"
+         :disable-autofocus="true"
+         @confirm="restoreDefaults"
+         @hide="isConfirmRestoreModal = false"
+      >
+         <template #header>
+            <div class="d-flex">
+               <i class="mdi mdi-24px mdi-undo mr-1" /> {{ t('message.restoreDefaults') }}
+            </div>
+         </template>
+         <template #body>
+            <div class="mb-2">
+               {{ t('message.restoreDefaultsQuestion') }}
+            </div>
+         </template>
+      </ConfirmModal>
+   </Teleport>
+</template>
+<script setup lang="ts">
+import { Ref, ref, watch } from 'vue';
+import { storeToRefs } from 'pinia';
+import { useI18n } from 'vue-i18n';
+import { useSettingsStore } from '@/stores/settings';
+import KeyPressDetector from './KeyPressDetector.vue';
+import Application from '@/ipc-api/Application';
+import { shortcutEvents, ShortcutRecord } from 'common/shortcuts';
+import ConfirmModal from '@/components/BaseConfirmModal.vue';
+import BaseSelect from '@/components/BaseSelect.vue';
+import { computed } from '@vue/reactivity';
+
+const { t } = useI18n();
+
+const isMacOS = process.platform === 'darwin';
+
+const isConfirmRestoreModal = ref(false);
+const isConfirmAddModal = ref(false);
+const isConfirmEditModal = ref(false);
+const isConfirmDeleteModal = ref(false);
+const doesShortcutExists = ref(false);
+const shortcutToAdd: Ref<ShortcutRecord> = ref({ event: undefined, keys: [], os: [process.platform] });
+const shortcutToEdit: Ref<ShortcutRecord & { index: number }> = ref(null);
+const shortcutToDelete: Ref<ShortcutRecord> = ref(null);
+const typedShortcut = ref('');
+
+const settingsStore = useSettingsStore();
+const { shortcuts } = storeToRefs(settingsStore);
+
+const eventOptions = computed(() => {
+   return Object.keys(shortcutEvents)
+      .map(key => {
+         return { value: key, label: t(shortcutEvents[key].l18n, { param: shortcutEvents[key].l18nParam }) };
+      })
+      .sort((a, b) => {
+         if (a.label < b.label) return -1;
+         if (a.label > b.label) return 1;
+         return 0;
+      });
+});
+
+const parseKeys = (keys: {[key: number]: string}[]) => {
+   return (keys as string[]).map(k => (
+      k.split('+')
+         .map(sk => (
+            `<code class="text-bold">${sk}</code>`
+         )))
+      .join('+')
+      .replaceAll('CommandOrControl', isMacOS ? 'Command' : 'Control')
+   ).join(', ');
+};
+
+const restoreDefaults = () => {
+   isConfirmRestoreModal.value = false;
+   return Application.restoreDefaultShortcuts();
+};
+
+const showAddModal = () => {
+   shortcutToAdd.value.event = eventOptions.value[0].value;
+   isConfirmAddModal.value = true;
+};
+
+const closeAddModal = () => {
+   typedShortcut.value = '';
+   doesShortcutExists.value = false;
+   shortcutToAdd.value = { event: undefined, keys: [], os: [process.platform] };
+   isConfirmAddModal.value = false;
+};
+
+const showEditModal = (shortcut: ShortcutRecord & { index: number }) => {
+   shortcut = {
+      ...shortcut,
+      keys: [shortcut.keys[0].replaceAll('CommandOrControl', isMacOS ? 'Command' : 'Control')]
+   };
+   shortcutToEdit.value = shortcut;
+   isConfirmEditModal.value = true;
+};
+
+const editShortcut = () => {
+   const index = shortcutToEdit.value.index;
+   delete shortcutToEdit.value.index;
+   shortcutToEdit.value.index = undefined;
+
+   shortcuts.value[index] = shortcutToEdit.value;
+
+   isConfirmEditModal.value = false;
+   return Application.updateShortcuts(shortcuts.value);
+};
+
+const closeEditModal = () => {
+   typedShortcut.value = '';
+   doesShortcutExists.value = false;
+   shortcutToEdit.value = null;
+   isConfirmEditModal.value = false;
+};
+
+const addShortcut = () => {
+   if (!typedShortcut.value.length || doesShortcutExists.value) return;
+   shortcutToAdd.value.keys = [typedShortcut.value.replaceAll(isMacOS ? 'Command' : 'Control', 'CommandOrControl')];
+   const filteredShortcuts = [shortcutToAdd.value, ...shortcuts.value];
+
+   isConfirmAddModal.value = false;
+   return Application.updateShortcuts(filteredShortcuts);
+};
+
+const showDeleteModal = (shortcut: ShortcutRecord) => {
+   isConfirmDeleteModal.value = true;
+   shortcutToDelete.value = shortcut;
+};
+
+const deleteShortcut = () => {
+   const filteredShortcuts = shortcuts.value.filter(s => (
+      shortcutToDelete.value.keys.toString() !== s.keys.toString()
+   ));
+
+   isConfirmDeleteModal.value = false;
+   return Application.updateShortcuts(filteredShortcuts);
+};
+
+watch(typedShortcut, () => {
+   doesShortcutExists.value = shortcuts.value.some(s => (
+      s.keys.some(k => (
+         k.replaceAll('CommandOrControl', isMacOS ? 'Command' : 'Control') === typedShortcut.value
+      ))
+   ));
+});
+</script>
+<style lang="scss" scoped>
+  .table {
+    .tr {
+      .td {
+        border-right: 3px solid;
+        border-bottom: 3px solid;
+      }
+
+      &:hover {
+        .shortcut-button {
+          opacity: 1;
+        }
+      }
+
+      .shortcut-button {
+        font-size: 0.7rem;
+        height: 1rem;
+        line-height: 1rem;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        opacity: 0;
+      }
+    }
+  }
+
+  .shortcuts-tools {
+    display: flex;
+    justify-content: flex-end;
+  }
+</style>

src/renderer/components/TheSettingBar.vue

@@ -343,6 +343,7 @@ watch(selectedWorkspace, (newVal, oldVal) => {
             text-align: left;
             line-height: 1.1;
             color: rgba($body-font-color-dark, 0.8);
+            text-align: center;
          }
 
          .settingbar-element-pin {

src/renderer/components/WorkspaceAddConnectionPanel.vue

@@ -553,7 +553,7 @@ setDefaults();
 
 setTimeout(() => {
    if (firstInput.value) firstInput.value.focus();
-}, 20);
+}, 200);
 </script>
 
 <style lang="scss" scoped>

src/renderer/components/WorkspaceExploreBarMiscContext.vue

@@ -188,8 +188,6 @@ const deleteMisc = async () => {
             break;
       }
 
-      console.log(res);
-
       const { status, response } = res;
 
       if (status === 'success') {

src/renderer/components/WorkspaceTabNewFunction.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -189,6 +188,7 @@ import WorkspaceTabPropsFunctionParamsModal from '@/components/WorkspaceTabProps
 import BaseSelect from '@/components/BaseSelect.vue';
 import { FunctionInfos, FunctionParam } from 'common/interfaces/antares';
 import { useI18n } from 'vue-i18n';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -300,14 +300,10 @@ const hideParamsModal = () => {
    isParamsModal.value = false;
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.isSelected, (val) => {
@@ -341,19 +337,19 @@ setTimeout(() => {
    resizeQueryEditor();
 }, 50);
 
-window.addEventListener('keydown', onKey);
-
 onMounted(() => {
    if (props.isSelected)
       changeBreadcrumbs({ schema: props.schema });
 
+   ipcRenderer.on('save-content', saveContentListener);
+
    setTimeout(() => {
       firstInput.value.focus();
    }, 100);
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 
 onUnmounted(() => {

src/renderer/components/WorkspaceTabNewRoutine.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -161,6 +160,7 @@ import WorkspaceTabPropsRoutineParamsModal from '@/components/WorkspaceTabPropsR
 import BaseSelect from '@/components/BaseSelect.vue';
 import { FunctionParam } from 'common/interfaces/antares';
 import { useI18n } from 'vue-i18n';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -272,14 +272,10 @@ const hideParamsModal = () => {
    isParamsModal.value = false;
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.isSelected, (val) => {
@@ -313,19 +309,19 @@ setTimeout(() => {
    resizeQueryEditor();
 }, 50);
 
-window.addEventListener('keydown', onKey);
-
 onMounted(() => {
    if (props.isSelected)
       changeBreadcrumbs({ schema: props.schema });
 
+   ipcRenderer.on('save-content', saveContentListener);
+
    setTimeout(() => {
       firstInput.value.focus();
    }, 100);
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 
 onUnmounted(() => {

src/renderer/components/WorkspaceTabNewScheduler.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -138,6 +137,7 @@ import QueryEditor from '@/components/QueryEditor.vue';
 import WorkspaceTabPropsSchedulerTimingModal from '@/components/WorkspaceTabPropsSchedulerTimingModal.vue';
 import Schedulers from '@/ipc-api/Schedulers';
 import BaseSelect from '@/components/BaseSelect.vue';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -259,14 +259,10 @@ const timingUpdate = (options: EventInfos) => {
    localScheduler.value = options;
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.isSelected, (val) => {
@@ -298,19 +294,19 @@ setTimeout(() => {
    resizeQueryEditor();
 }, 50);
 
-window.addEventListener('keydown', onKey);
-
 onMounted(() => {
    if (props.isSelected)
       changeBreadcrumbs({ schema: props.schema });
 
+   ipcRenderer.on('save-content', saveContentListener);
+
    setTimeout(() => {
       firstInput.value.focus();
    }, 100);
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 
 onUnmounted(() => {

src/renderer/components/WorkspaceTabNewTable.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged || !isValid"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -175,6 +174,7 @@ import WorkspaceTabPropsTableForeignModal from '@/components/WorkspaceTabPropsTa
 import WorkspaceTabNewTableEmptyState from '@/components/WorkspaceTabNewTableEmptyState.vue';
 import BaseSelect from '@/components/BaseSelect.vue';
 import { ConnectionParams, TableField, TableForeign, TableIndex, TableOptions } from 'common/interfaces/antares';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -420,14 +420,10 @@ const foreignsUpdate = (foreigns: TableForeign[]) => {
    localKeyUsage.value = foreigns;
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.isSelected, (val) => {
@@ -447,18 +443,19 @@ tableOptions.value = {
 };
 
 localOptions.value = JSON.parse(JSON.stringify(tableOptions.value));
-window.addEventListener('keydown', onKey);
 
 onMounted(() => {
    if (props.isSelected)
       changeBreadcrumbs({ schema: props.schema });
 
+   ipcRenderer.on('save-content', saveContentListener);
+
    setTimeout(() => {
       firstInput.value.focus();
    }, 100);
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 </script>

src/renderer/components/WorkspaceTabNewTrigger.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -126,6 +125,7 @@ import QueryEditor from '@/components/QueryEditor.vue';
 import BaseLoader from '@/components/BaseLoader.vue';
 import Triggers from '@/ipc-api/Triggers';
 import BaseSelect from '@/components/BaseSelect.vue';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -268,14 +268,10 @@ const resizeQueryEditor = () => {
    }
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.isSelected, (val) => {
@@ -305,12 +301,12 @@ setTimeout(() => {
    resizeQueryEditor();
 }, 50);
 
-window.addEventListener('keydown', onKey);
-
 onMounted(() => {
    if (props.isSelected)
       changeBreadcrumbs({ schema: props.schema });
 
+   ipcRenderer.on('save-content', saveContentListener);
+
    setTimeout(() => {
       firstInput.value.focus();
    }, 100);
@@ -323,6 +319,6 @@ onUnmounted(() => {
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 </script>

src/renderer/components/WorkspaceTabNewTriggerFunction.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -105,6 +104,7 @@ import BaseLoader from '@/components/BaseLoader.vue';
 import QueryEditor from '@/components/QueryEditor.vue';
 import Functions from '@/ipc-api/Functions';
 import BaseSelect from '@/components/BaseSelect.vue';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -203,14 +203,10 @@ const resizeQueryEditor = () => {
    }
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 originalFunction.value = {
@@ -237,12 +233,12 @@ setTimeout(() => {
    resizeQueryEditor();
 }, 50);
 
-window.addEventListener('keydown', onKey);
-
 onMounted(() => {
    if (props.isSelected)
       changeBreadcrumbs({ schema: props.schema });
 
+   ipcRenderer.on('save-content', saveContentListener);
+
    setTimeout(() => {
       firstInput.value.focus();
    }, 100);
@@ -255,6 +251,6 @@ onUnmounted(() => {
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 </script>

src/renderer/components/WorkspaceTabNewView.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -115,6 +114,7 @@ import BaseLoader from '@/components/BaseLoader.vue';
 import QueryEditor from '@/components/QueryEditor.vue';
 import Views from '@/ipc-api/Views';
 import BaseSelect from '@/components/BaseSelect.vue';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -216,14 +216,10 @@ const resizeQueryEditor = () => {
    }
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.isSelected, (val) => {
@@ -259,12 +255,12 @@ setTimeout(() => {
    resizeQueryEditor();
 }, 50);
 
-window.addEventListener('keydown', onKey);
-
 onMounted(() => {
    if (props.isSelected)
       changeBreadcrumbs({ schema: props.schema });
 
+   ipcRenderer.on('save-content', saveContentListener);
+
    setTimeout(() => {
       firstInput.value.focus();
    }, 100);
@@ -277,7 +273,7 @@ onUnmounted(() => {
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 
 </script>

src/renderer/components/WorkspaceTabPropsFunction.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -207,6 +206,7 @@ import Functions from '@/ipc-api/Functions';
 import BaseSelect from '@/components/BaseSelect.vue';
 import { useI18n } from 'vue-i18n';
 import { AlterFunctionParams, FunctionInfos, FunctionParam } from 'common/interfaces/antares';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -407,14 +407,10 @@ const hideAskParamsModal = () => {
    isAskingParameters.value = false;
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.keyCode === 83) { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.schema, async () => {
@@ -457,11 +453,12 @@ watch(consoleHeight, () => {
 (async () => {
    await getFunctionData();
    queryEditor.value.editor.session.setValue(localFunction.value.sql);
-   window.addEventListener('keydown', onKey);
 })();
 
 onMounted(() => {
    window.addEventListener('resize', resizeQueryEditor);
+
+   ipcRenderer.on('save-content', saveContentListener);
 });
 
 onUnmounted(() => {
@@ -469,6 +466,6 @@ onUnmounted(() => {
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 </script>

src/renderer/components/WorkspaceTabPropsRoutine.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -179,6 +178,7 @@ import BaseLoader from '@/components/BaseLoader.vue';
 import WorkspaceTabPropsRoutineParamsModal from '@/components/WorkspaceTabPropsRoutineParamsModal.vue';
 import ModalAskParameters from '@/components/ModalAskParameters.vue';
 import BaseSelect from '@/components/BaseSelect.vue';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -377,14 +377,10 @@ const hideAskParamsModal = () => {
    isAskingParameters.value = false;
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.schema, async () => {
@@ -427,11 +423,12 @@ watch(consoleHeight, () => {
 (async () => {
    await getRoutineData();
    queryEditor.value.editor.session.setValue(localRoutine.value.sql);
-   window.addEventListener('keydown', onKey);
 })();
 
 onMounted(() => {
    window.addEventListener('resize', resizeQueryEditor);
+
+   ipcRenderer.on('save-content', saveContentListener);
 });
 
 onUnmounted(() => {
@@ -439,7 +436,7 @@ onUnmounted(() => {
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 
 </script>

src/renderer/components/WorkspaceTabPropsScheduler.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -136,6 +135,7 @@ import QueryEditor from '@/components/QueryEditor.vue';
 import WorkspaceTabPropsSchedulerTimingModal from '@/components/WorkspaceTabPropsSchedulerTimingModal.vue';
 import BaseSelect from '@/components/BaseSelect.vue';
 import Schedulers from '@/ipc-api/Schedulers';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -295,14 +295,10 @@ const timingUpdate = (options: EventInfos) => {
    localScheduler.value = options;
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.schema, async () => {
@@ -345,11 +341,12 @@ watch(consoleHeight, () => {
 (async () => {
    await getSchedulerData();
    queryEditor.value.editor.session.setValue(localScheduler.value.sql);
-   window.addEventListener('keydown', onKey);
 })();
 
 onMounted(() => {
    window.addEventListener('resize', resizeQueryEditor);
+
+   ipcRenderer.on('save-content', saveContentListener);
 });
 
 onUnmounted(() => {
@@ -357,7 +354,7 @@ onUnmounted(() => {
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 
 </script>

src/renderer/components/WorkspaceTabPropsTable.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -173,7 +172,7 @@
 </template>
 
 <script setup lang="ts">
-import { Component, computed, onBeforeUnmount, Ref, ref, watch } from 'vue';
+import { Component, computed, onBeforeUnmount, onMounted, Ref, ref, watch } from 'vue';
 import { AlterTableParams, TableField, TableForeign, TableIndex, TableInfos, TableOptions } from 'common/interfaces/antares';
 import { storeToRefs } from 'pinia';
 import { useI18n } from 'vue-i18n';
@@ -186,6 +185,7 @@ import BaseSelect from '@/components/BaseSelect.vue';
 import WorkspaceTabPropsTableFields from '@/components/WorkspaceTabPropsTableFields.vue';
 import WorkspaceTabPropsTableIndexesModal from '@/components/WorkspaceTabPropsTableIndexesModal.vue';
 import WorkspaceTabPropsTableForeignModal from '@/components/WorkspaceTabPropsTableForeignModal.vue';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -646,14 +646,10 @@ const foreignsUpdate = (foreigns: TableForeign[]) => {
    localKeyUsage.value = foreigns;
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.schema, () => {
@@ -684,9 +680,12 @@ watch(isChanged, (val) => {
 });
 
 getFieldsData();
-window.addEventListener('keydown', onKey);
+
+onMounted(() => {
+   ipcRenderer.on('save-content', saveContentListener);
+});
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 </script>

src/renderer/components/WorkspaceTabPropsTrigger.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -126,6 +125,7 @@ import QueryEditor from '@/components/QueryEditor.vue';
 import BaseLoader from '@/components/BaseLoader.vue';
 import Triggers from '@/ipc-api/Triggers';
 import BaseSelect from '@/components/BaseSelect.vue';
+import { ipcRenderer } from 'electron';
 
 type TriggerEventName = 'INSERT' | 'UPDATE' | 'DELETE'
 
@@ -318,14 +318,10 @@ const resizeQueryEditor = () => {
    }
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.schema, async () => {
@@ -359,11 +355,12 @@ watch(consoleHeight, () => {
 (async () => {
    await getTriggerData();
    queryEditor.value.editor.session.setValue(localTrigger.value.sql);
-   window.addEventListener('keydown', onKey);
 })();
 
 onMounted(() => {
    window.addEventListener('resize', resizeQueryEditor);
+
+   ipcRenderer.on('save-content', saveContentListener);
 });
 
 onUnmounted(() => {
@@ -371,6 +368,6 @@ onUnmounted(() => {
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 </script>

src/renderer/components/WorkspaceTabPropsTriggerFunction.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -93,6 +92,7 @@ import QueryEditor from '@/components/QueryEditor.vue';
 import Functions from '@/ipc-api/Functions';
 import BaseSelect from '@/components/BaseSelect.vue';
 import { AlterFunctionParams, TriggerFunctionInfos } from 'common/interfaces/antares';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -223,14 +223,10 @@ const resizeQueryEditor = () => {
    }
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.schema, async () => {
@@ -264,11 +260,12 @@ watch(isChanged, (val) => {
 (async () => {
    await getFunctionData();
    queryEditor.value.editor.session.setValue(localFunction.value.sql);
-   window.addEventListener('keydown', onKey);
 })();
 
 onMounted(() => {
    window.addEventListener('resize', resizeQueryEditor);
+
+   ipcRenderer.on('save-content', saveContentListener);
 });
 
 onUnmounted(() => {
@@ -276,6 +273,6 @@ onUnmounted(() => {
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 </script>

src/renderer/components/WorkspaceTabPropsView.vue

@@ -7,7 +7,6 @@
                   class="btn btn-primary btn-sm"
                   :disabled="!isChanged"
                   :class="{'loading':isSaving}"
-                  title="CTRL+S"
                   @click="saveChanges"
                >
                   <i class="mdi mdi-24px mdi-content-save mr-1" />
@@ -112,6 +111,7 @@ import BaseLoader from '@/components/BaseLoader.vue';
 import QueryEditor from '@/components/QueryEditor.vue';
 import BaseSelect from '@/components/BaseSelect.vue';
 import Views from '@/ipc-api/Views';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -245,14 +245,10 @@ const resizeQueryEditor = () => {
    }
 };
 
-const onKey = (e: KeyboardEvent) => {
+const saveContentListener = () => {
-   if (props.isSelected) {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
-      e.stopPropagation();
+   if (props.isSelected && !hasModalOpen && isChanged.value)
-      if (e.ctrlKey && e.key === 's') { // CTRL + S
-         if (isChanged.value)
       saveChanges();
-      }
-   }
 };
 
 watch(() => props.schema, async () => {
@@ -288,11 +284,12 @@ watch(isChanged, (val) => {
 (async () => {
    await getViewData();
    queryEditor.value.editor.session.setValue(localView.value.sql);
-   window.addEventListener('keydown', onKey);
 })();
 
 onMounted(() => {
    window.addEventListener('resize', resizeQueryEditor);
+
+   ipcRenderer.on('save-content', saveContentListener);
 });
 
 onUnmounted(() => {
@@ -300,6 +297,6 @@ onUnmounted(() => {
 });
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 </script>

src/renderer/components/WorkspaceTabQuery.vue

@@ -3,11 +3,6 @@
       v-show="isSelected"
       class="workspace-query-tab column col-12 columns col-gapless no-outline p-0"
       tabindex="0"
-      @keydown.f5="runQuery(query)"
-      @keydown.k="killTabQuery"
-      @keydown.ctrl.alt.w="clear"
-      @keydown.ctrl.b="beautify"
-      @keydown.ctrl.g="openHistoryModal"
    >
       <div class="workspace-query-runner column col-12">
          <QueryEditor
@@ -40,7 +35,6 @@
                      class="btn btn-primary btn-sm"
                      :class="{'loading':isQuering}"
                      :disabled="!query"
-                     title="F5"
                      @click="runQuery(query)"
                   >
                      <i class="mdi mdi-24px mdi-play pr-1" />
@@ -68,7 +62,6 @@
                <button
                   class="btn btn-link btn-sm mr-0"
                   :disabled="!query || isQuering"
-                  title="CTRL+W"
                   @click="clear()"
                >
                   <i class="mdi mdi-24px mdi-delete-sweep pr-1" />
@@ -80,7 +73,6 @@
                <button
                   class="btn btn-dark btn-sm"
                   :disabled="!query || isQuering"
-                  title="CTRL+B"
                   @click="beautify()"
                >
                   <i class="mdi mdi-24px mdi-brush pr-1" />
@@ -89,7 +81,6 @@
                <button
                   class="btn btn-dark btn-sm"
                   :disabled="isQuering"
-                  title="CTRL+G"
                   @click="openHistoryModal()"
                >
                   <i class="mdi mdi-24px mdi-history pr-1" />
@@ -206,6 +197,7 @@ import WorkspaceTabQueryTable from '@/components/WorkspaceTabQueryTable.vue';
 import WorkspaceTabQueryEmptyState from '@/components/WorkspaceTabQueryEmptyState.vue';
 import ModalHistory from '@/components/ModalHistory.vue';
 import BaseSelect from '@/components/BaseSelect.vue';
+import { ipcRenderer } from 'electron';
 
 const { t } = useI18n();
 
@@ -427,7 +419,8 @@ const beautify = () => {
       const formattedQuery = format(query.value, {
          language,
          uppercase: true
-      });
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      } as any);
       queryEditor.value.editor.session.setValue(formattedQuery);
    }
 };
@@ -499,12 +492,47 @@ selectedSchema.value = props.tab.schema || breadcrumbsSchema.value;
 if (!databaseSchemas.value.includes(selectedSchema.value))
    selectedSchema.value = null;
 
-// window.addEventListener('keydown', onKey);
 window.addEventListener('resize', onWindowResize);
 
+const reloadListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen)
+      runQuery(query.value);
+};
+
+const formatListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen)
+      beautify();
+};
+
+const killQueryListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen)
+      killTabQuery();
+};
+
+const clearQueryListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen)
+      clear();
+};
+
+const historyListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen)
+      openHistoryModal();
+};
+
 onMounted(() => {
    const localResizer = resizer.value;
 
+   ipcRenderer.on('run-or-reload', reloadListener);
+   ipcRenderer.on('format-query', formatListener);
+   ipcRenderer.on('kill-query', killQueryListener);
+   ipcRenderer.on('clear-query', clearQueryListener);
+   ipcRenderer.on('query-history', historyListener);
+
    localResizer.addEventListener('mousedown', (e: MouseEvent) => {
       e.preventDefault();
 
@@ -518,12 +546,17 @@ onMounted(() => {
 
 onBeforeUnmount(() => {
    window.removeEventListener('resize', onWindowResize);
-   // window.removeEventListener('keydown', onKey);
    const params = {
       uid: props.connection.uid,
       tabUid: props.tab.uid
    };
    Schema.destroyConnectionToCommit(params);
+
+   ipcRenderer.removeListener('run-or-reload', reloadListener);
+   ipcRenderer.removeListener('format-query', formatListener);
+   ipcRenderer.removeListener('kill-query', killQueryListener);
+   ipcRenderer.removeListener('clear-query', clearQueryListener);
+   ipcRenderer.removeListener('query-history', historyListener);
 });
 </script>
 

src/renderer/components/WorkspaceTabTable.vue

@@ -8,7 +8,7 @@
                      <button
                         class="btn btn-dark btn-sm mr-0 pr-1"
                         :class="{'loading':isQuering}"
-                        :title="`${t('word.refresh')} (F5)`"
+                        :title="`${t('word.refresh')}`"
                         @click="reloadTable"
                      >
                         <i v-if="!+autorefreshTimer" class="mdi mdi-24px mdi-refresh mr-1" />
@@ -35,7 +35,7 @@
                   <button
                      class="btn btn-dark btn-sm mr-0"
                      :disabled="isQuering || page === 1"
-                     title="CTRL+ᐊ"
+                     :title="t('message.previousResultsPage')"
                      @click="pageChange('prev')"
                   >
                      <i class="mdi mdi-24px mdi-skip-previous" />
@@ -61,7 +61,7 @@
                   <button
                      class="btn btn-dark btn-sm mr-0"
                      :disabled="isQuering || (results.length && results[0].rows.length < limit)"
-                     title="CTRL+ᐅ"
+                     :title="t('message.nextResultsPage')"
                      @click="pageChange('next')"
                   >
                      <i class="mdi mdi-24px mdi-skip-next" />
@@ -72,7 +72,7 @@
 
                <button
                   class="btn btn-sm"
-                  :title="`${t('word.filter')} (CTRL+F)`"
+                  :title="t('word.filter')"
                   :class="{'btn-primary': isSearch, 'btn-dark': !isSearch}"
                   @click="isSearch = !isSearch"
                >
@@ -190,6 +190,7 @@ import ModalFakerRows from '@/components/ModalFakerRows.vue';
 import { ConnectionParams } from 'common/interfaces/antares';
 import { TableFilterClausole } from 'common/interfaces/tableApis';
 import { useFilters } from '@/composables/useFilters';
+import { ipcRenderer } from 'electron';
 
 const { localeString } = useFilters();
 
@@ -342,7 +343,6 @@ const pageChange = (direction: 'prev' | 'next') => {
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const showFakerModal = (row?: any) => {
-   console.log(row);
    if (isQuering.value) return;
    isFakerModal.value = true;
    rowToDuplicate.value = row;
@@ -353,23 +353,6 @@ const hideFakerModal = () => {
    rowToDuplicate.value = null;
 };
 
-const onKey = (e: KeyboardEvent) => {
-   if (props.isSelected) {
-      e.stopPropagation();
-      if (e.key === 'F5')
-         reloadTable();
-
-      if (e.ctrlKey || e.metaKey) {
-         if (e.key === 'ArrowRight')
-            pageChange('next');
-         if (e.key === 'ArrowLeft')
-            pageChange('prev');
-         if (e.key === 'f')
-            isSearch.value = !isSearch.value;
-      }
-   }
-};
-
 const setRefreshInterval = () => {
    if (refreshInterval.value)
       clearInterval(refreshInterval.value);
@@ -401,6 +384,30 @@ const updateFilters = (clausoles: TableFilterClausole[]) => {
    getTableData();
 };
 
+const reloadListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen)
+      reloadTable();
+};
+
+const openFilterListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen)
+      isSearch.value = !isSearch.value;
+};
+
+const nextPageListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen)
+      pageChange('next');
+};
+
+const prevPageListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen)
+      pageChange('prev');
+};
+
 const hasApproximately = computed(() => {
    return results.value.length &&
       results.value[0].rows &&
@@ -457,10 +464,17 @@ watch(isSearch, (val) => {
 });
 
 getTableData();
-window.addEventListener('keydown', onKey);
+
+ipcRenderer.on('run-or-reload', reloadListener);
+ipcRenderer.on('open-filter', openFilterListener);
+ipcRenderer.on('next-page', nextPageListener);
+ipcRenderer.on('prev-page', prevPageListener);
 
 onBeforeUnmount(() => {
-   window.removeEventListener('keydown', onKey);
    clearInterval(refreshInterval.value);
+   ipcRenderer.removeListener('run-or-reload', reloadListener);
+   ipcRenderer.removeListener('open-filter', openFilterListener);
+   ipcRenderer.removeListener('next-page', nextPageListener);
+   ipcRenderer.removeListener('prev-page', prevPageListener);
 });
 </script>

src/renderer/i18n/en-US.ts

@@ -142,7 +142,8 @@ export const enUS = {
       contributors: 'Contributors',
       pin: 'Pin',
       unpin: 'Unpin',
-      console: 'Console'
+      console: 'Console',
+      shortcuts: 'Shortcuts'
    },
    message: {
       appWelcome: 'Welcome to Antares SQL Client!',
@@ -298,7 +299,30 @@ export const enUS = {
       allConnections: 'All connections',
       searchForConnections: 'Search for connections',
       disableScratchpad: 'Disable scratchpad',
-      reportABug: 'Report a bug'
+      reportABug: 'Report a bug',
+      nextTab: 'Next tab',
+      previousTab: 'Previous tab',
+      selectTabNumber: 'Select tab number {param}',
+      toggleConsole: 'Toggle console',
+      addShortcut: 'Add shortcut',
+      editShortcut: 'Edit shortcut',
+      deleteShortcut: 'Delete shortcut',
+      restoreDefaults: 'Restore defaults',
+      restoreDefaultsQuestion: 'Do you confirm to restore default values?',
+      registerAShortcut: 'Register a shortcut',
+      invalidShortcutMessage: 'Invalid combination, continue to type',
+      shortcutAlreadyExists: 'Shortcut already exists',
+      saveContent: 'Save content',
+      openAllConnections: 'Open all connections',
+      openSettings: 'Open settings',
+      openScratchpad: 'Open scratchpad',
+      runOrReload: 'Run or reload',
+      formatQuery: 'Format query',
+      queryHistory: 'Query history',
+      clearQuery: 'Clear query',
+      openFilter: 'Open filter',
+      nextResultsPage: 'Next results page',
+      previousResultsPage: 'Previous results page'
    },
    faker: {
       address: 'Address',

src/renderer/index.ts

@@ -42,6 +42,10 @@ ipcRenderer.on('query-log', (event, logRecord) => {
    useConsoleStore().putLog(logRecord);
 });
 
+ipcRenderer.on('toggle-console', () => {
+   useConsoleStore().toggleConsole();
+});
+
 // IPC app updates
 ipcRenderer.on('checking-for-update', () => {
    useApplicationStore().updateStatus = 'checking';
@@ -85,3 +89,7 @@ ipcRenderer.on('open-updates-preferences', () => {
    useApplicationStore().showSettingModal('update');
    ipcRenderer.send('check-for-updates');
 });
+
+ipcRenderer.on('update-shortcuts', (event, shortcuts) => {
+   useSettingsStore().updateShortcuts(shortcuts);
+});

src/renderer/ipc-api/Application.ts

@@ -1,3 +1,4 @@
+import { ShortcutRecord } from 'common/shortcuts';
 import { ipcRenderer, OpenDialogOptions, OpenDialogReturnValue } from 'electron';
 import { unproxify } from '../libs/unproxify';
 
@@ -9,4 +10,20 @@ export default class {
    static getDownloadPathDirectory (): Promise<string> {
       return ipcRenderer.invoke('get-download-dir-path');
    }
+
+   static reloadShortcuts () {
+      return ipcRenderer.invoke('reload-shortcuts');
+   }
+
+   static updateShortcuts (shortcuts: ShortcutRecord[]) {
+      return ipcRenderer.invoke('update-shortcuts', unproxify(shortcuts));
+   }
+
+   static restoreDefaultShortcuts () {
+      return ipcRenderer.invoke('resotre-default-shortcuts');
+   }
+
+   static unregisterShortcuts () {
+      return ipcRenderer.invoke('unregister-shortcuts');
+   }
 }

src/renderer/scss/_data-types.scss

@@ -1,4 +1,3 @@
-
 @mixin type-colors($types) {
   @each $type, $color in $types {
     .type-#{$type} {

src/renderer/scss/_fake-tables.scss

@@ -13,7 +13,7 @@
     display: table-row;
   }
 
-  // Scollable tables
+  /* Scollable tables */
   &.table-scroll {
     display: block;
     overflow-x: auto;

src/renderer/scss/_table-keys.scss

@@ -1,3 +1,4 @@
+/* stylelint-disable selector-class-pattern */
 .column-key {
   transform: rotate(45deg);
   font-size: 0.7rem;

src/renderer/scss/_variables.scss

@@ -38,4 +38,5 @@ $footer-height: 1.5rem;
   }
 }
 
+/* stylelint-disable-next-line function-no-unknown */
 $excluding-size: get-excluding-size();

src/renderer/scss/main.scss

@@ -1,3 +1,4 @@
+/* stylelint-disable selector-class-pattern */
 @import "~spectre.css/src/variables";
 @import "variables";
 @import "transitions";
@@ -108,7 +109,7 @@ option:checked {
 
       > div {
         padding: 0.1rem 0.2rem;
-        min-width: -webkit-fill-available;
+        min-width: fill-available;
       }
     }
 
@@ -167,13 +168,13 @@ option:checked {
   width: 100%;
 }
 
-// Scrollbars
+/* Scrollbars */
 ::-webkit-scrollbar {
   width: 10px;
   height: 10px;
 }
 
-// Animations
+/* Animations */
 @keyframes rotation {
   from {
     transform: rotate(0deg);
@@ -210,15 +211,14 @@ option:checked {
   }
 
   .modal-overlay {
-    background: rgba(255, 255, 255, 0.1);
+    background: rgb(255 255 255 / 10%);
-    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
+    box-shadow: 0 8px 32px 0 rgb(31 38 135 / 37%);
   }
 }
 
 #wrapper:not(.no-blur) {
   .modal-overlay {
     backdrop-filter: blur(4px);
-    -webkit-backdrop-filter: blur(4px);
   }
 }
 
@@ -330,7 +330,7 @@ option:checked {
   z-index: 401 !important;
   border: 1px solid transparent;
   border-radius: $border-radius;
-  box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
+  box-shadow: 0 8px 17px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);
 }
 
 .select__option--selected {
@@ -409,7 +409,7 @@ option:checked {
   }
 }
 
-// Ace Editor
+/* Ace Editor */
 .ace_editor {
   &.ace_autocomplete {
     border-radius: $border-radius;

src/renderer/scss/themes/dark-theme.scss

@@ -163,7 +163,8 @@
   }
 
   code {
-    background-color: #000;
+    background-color: #111;
+    border: 1px solid #444;
     color: rgba($body-font-color-dark, 0.7);
   }
 

src/renderer/scss/themes/light-theme.scss

@@ -209,6 +209,11 @@
     }
   }
 
+  code {
+    background-color: #eee;
+    border: 1px solid #ddd;
+  }
+
   .workspace {
     .workspace-explorebar {
       background: $bg-color-light-gray;

src/renderer/stores/console.ts

@@ -1,4 +1,3 @@
-import { ipcRenderer } from 'electron';
 import { defineStore } from 'pinia';
 import { useWorkspacesStore } from './workspaces';
 const logsSize = 1000;
@@ -57,7 +56,3 @@ export const useConsoleStore = defineStore('console', {
       }
    }
 });
-
-ipcRenderer.on('toggle-console', () => {
-   useConsoleStore().toggleConsole();
-});

src/renderer/stores/settings.ts

@@ -2,7 +2,10 @@ import { defineStore } from 'pinia';
 import { ipcRenderer } from 'electron';
 import { i18n, AvailableLocale } from '@/i18n';
 import * as Store from 'electron-store';
-const persistentStore = new Store({ name: 'settings' });
+import { ShortcutRecord } from 'common/shortcuts';
+
+const settingsStore = new Store({ name: 'settings' });
+const shortcutsStore = new Store({ name: 'shortcuts' });
 const isDarkTheme = window.matchMedia('(prefers-color-scheme: dark)');
 const defaultAppTheme = isDarkTheme.matches ? 'dark' : 'light';
 const defaultEditorTheme = isDarkTheme.matches ? 'twilight' : 'sqlserver';
@@ -12,74 +15,78 @@ export type ApplicationTheme = 'light' | 'dark';
 
 export const useSettingsStore = defineStore('settings', {
    state: () => ({
-      locale: persistentStore.get('locale', 'en-US') as AvailableLocale,
+      locale: settingsStore.get('locale', 'en-US') as AvailableLocale,
-      allowPrerelease: persistentStore.get('allow_prerelease', true) as boolean,
+      allowPrerelease: settingsStore.get('allow_prerelease', true) as boolean,
-      explorebarSize: persistentStore.get('explorebar_size', null) as number,
+      explorebarSize: settingsStore.get('explorebar_size', null) as number,
-      notificationsTimeout: persistentStore.get('notifications_timeout', 5) as number,
+      notificationsTimeout: settingsStore.get('notifications_timeout', 5) as number,
-      dataTabLimit: persistentStore.get('data_tab_limit', 1000) as number,
+      dataTabLimit: settingsStore.get('data_tab_limit', 1000) as number,
-      autoComplete: persistentStore.get('auto_complete', true) as boolean,
+      autoComplete: settingsStore.get('auto_complete', true) as boolean,
-      lineWrap: persistentStore.get('line_wrap', true) as boolean,
+      lineWrap: settingsStore.get('line_wrap', true) as boolean,
-      applicationTheme: persistentStore.get('application_theme', defaultAppTheme) as ApplicationTheme,
+      applicationTheme: settingsStore.get('application_theme', defaultAppTheme) as ApplicationTheme,
-      editorTheme: persistentStore.get('editor_theme', defaultEditorTheme) as string,
+      editorTheme: settingsStore.get('editor_theme', defaultEditorTheme) as string,
-      editorFontSize: persistentStore.get('editor_font_size', 'medium') as EditorFontSize,
+      editorFontSize: settingsStore.get('editor_font_size', 'medium') as EditorFontSize,
-      restoreTabs: persistentStore.get('restore_tabs', true) as boolean,
+      restoreTabs: settingsStore.get('restore_tabs', true) as boolean,
-      disableBlur: persistentStore.get('disable_blur', false) as boolean,
+      disableBlur: settingsStore.get('disable_blur', false) as boolean,
-      disableScratchpad: persistentStore.get('disable_scratchpad', false) as boolean
+      disableScratchpad: settingsStore.get('disable_scratchpad', false) as boolean,
+      shortcuts: shortcutsStore.get('shortcuts', []) as ShortcutRecord[]
    }),
    actions: {
       changeLocale (locale: AvailableLocale) {
          this.locale = locale;
          i18n.global.locale = locale;
-         persistentStore.set('locale', this.locale);
+         settingsStore.set('locale', this.locale);
       },
       changePageSize (limit: number) {
          this.dataTabLimit = limit;
-         persistentStore.set('data_tab_limit', this.dataTabLimit);
+         settingsStore.set('data_tab_limit', this.dataTabLimit);
       },
       changeAllowPrerelease (allow: boolean) {
          this.allowPrerelease = allow;
-         persistentStore.set('allow_prerelease', this.allowPrerelease);
+         settingsStore.set('allow_prerelease', this.allowPrerelease);
       },
       updateNotificationsTimeout (timeout: number) {
          this.notificationsTimeout = timeout;
-         persistentStore.set('notifications_timeout', this.notificationsTimeout);
+         settingsStore.set('notifications_timeout', this.notificationsTimeout);
       },
       changeExplorebarSize (size: number) {
          this.explorebarSize = size;
-         persistentStore.set('explorebar_size', this.explorebarSize);
+         settingsStore.set('explorebar_size', this.explorebarSize);
       },
       changeAutoComplete (val: boolean) {
          this.autoComplete = val;
-         persistentStore.set('auto_complete', this.autoComplete);
+         settingsStore.set('auto_complete', this.autoComplete);
       },
       changeLineWrap (val: boolean) {
          this.lineWrap = val;
-         persistentStore.set('line_wrap', this.lineWrap);
+         settingsStore.set('line_wrap', this.lineWrap);
       },
       changeApplicationTheme (theme: string) {
          this.applicationTheme = theme;
-         persistentStore.set('application_theme', this.applicationTheme);
+         settingsStore.set('application_theme', this.applicationTheme);
          ipcRenderer.send('refresh-theme-settings');
       },
       changeEditorTheme (theme: string) {
          this.editorTheme = theme;
-         persistentStore.set('editor_theme', this.editorTheme);
+         settingsStore.set('editor_theme', this.editorTheme);
       },
       changeEditorFontSize (size: EditorFontSize) {
          this.editorFontSize = size;
-         persistentStore.set('editor_font_size', this.editorFontSize);
+         settingsStore.set('editor_font_size', this.editorFontSize);
       },
       changeRestoreTabs (val: boolean) {
          this.restoreTabs = val;
-         persistentStore.set('restore_tabs', this.restoreTabs);
+         settingsStore.set('restore_tabs', this.restoreTabs);
       },
       changeDisableBlur (val: boolean) {
          this.disableBlur = val;
-         persistentStore.set('disable_blur', this.disableBlur);
+         settingsStore.set('disable_blur', this.disableBlur);
       },
       changeDisableScratchpad (val: boolean) {
          this.disableScratchpad = val;
-         persistentStore.set('disable_scratchpad', this.disableScratchpad);
+         settingsStore.set('disable_scratchpad', this.disableScratchpad);
+      },
+      updateShortcuts (shortcuts: ShortcutRecord[]) {
+         this.shortcuts = shortcuts;
       }
    }
 });