feat(UI): shortcuts info on empty query tab

src/main/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-import { app, BrowserWindow, /* session, */ nativeImage } from 'electron';
+import { app, BrowserWindow, /* session, */ nativeImage, Menu } from 'electron';
 import * as path from 'path';
 import Store from 'electron-store';
 
@@ -96,6 +96,7 @@ else {
    // create main BrowserWindow when electron is ready
    app.on('ready', async () => {
       mainWindow = await createMainWindow();
+      Menu.setApplicationMenu(null);
       if (isDevelopment)
          mainWindow.webContents.openDevTools();
    });

src/renderer/components/WorkspaceQueryEmptyState.vue

@@ -0,0 +1,41 @@
+<template>
+   <div class="container">
+      <div class="columns">
+         <div class="column col-16 text-right">
+            <div class="mb-4">
+               {{ $t('message.runQuery') }}
+            </div>
+            <div class="mb-4">
+               {{ $t('word.format') }}
+            </div>
+            <div class="mb-4">
+               {{ $t('word.clear') }}
+            </div>
+         </div>
+         <div class="column col-16">
+            <div class="mb-4">
+               <code>F5</code>
+            </div>
+            <div class="mb-4">
+               <code>CTRL</code> + <code>F8</code>
+            </div>
+            <div class="mb-4">
+               <code>CTRL</code> + <code>W</code>
+            </div>
+         </div>
+      </div>
+   </div>
+</template>
+
+<script>
+export default {
+   name: 'WorkspaceQueryEmptyState'
+};
+</script>
+
+<style scoped>
+.container {
+  padding-top: 15vh;
+  opacity: 0.6;
+}
+</style>

src/renderer/components/WorkspaceQueryTab.vue

@@ -100,6 +100,7 @@
             </div>
          </div>
       </div>
+      <WorkspaceQueryEmptyState v-if="!results.length && !isQuering" />
       <div class="workspace-query-results p-relative column col-12">
          <BaseLoader v-if="isQuering" />
          <WorkspaceQueryTable
@@ -124,6 +125,7 @@ import Schema from '@/ipc-api/Schema';
 import QueryEditor from '@/components/QueryEditor';
 import BaseLoader from '@/components/BaseLoader';
 import WorkspaceQueryTable from '@/components/WorkspaceQueryTable';
+import WorkspaceQueryEmptyState from '@/components/WorkspaceQueryEmptyState';
 import { mapGetters, mapActions } from 'vuex';
 import tableTabs from '@/mixins/tableTabs';
 
@@ -132,7 +134,8 @@ export default {
    components: {
       BaseLoader,
       QueryEditor,
-      WorkspaceQueryTable
+      WorkspaceQueryTable,
+      WorkspaceQueryEmptyState
    },
    mixins: [tableTabs],
    props: {

src/renderer/components/WorkspaceQueryTable.vue

@@ -130,7 +130,7 @@ export default {
    },
    data () {
       return {
-         resultsSize: 1000,
+         resultsSize: 0,
          localResults: [],
          isContext: false,
          isDeleteConfirmModal: false,

src/renderer/i18n/en-US.js

@@ -228,7 +228,8 @@ module.exports = {
       duplicateTable: 'Duplicate table',
       noOpenTabs: 'There are no open tabs, navigate on the left bar or:',
       noSchema: 'No schema',
-      restorePreviourSession: 'Restore previous session'
+      restorePreviourSession: 'Restore previous session',
+      runQuery: 'Run query'
    },
    faker: {
       address: 'Address',

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

@@ -135,6 +135,11 @@
     background: $bg-color-light-dark;
   }
 
+  code {
+    background-color: #000;
+    color: $body-font-color-dark;
+  }
+
   // Antares
   .workspace {
     .workspace-explorebar {