chore(release): 0.1.13

.github/workflows/build-linux.yml

@@ -17,7 +17,7 @@ jobs:
       - name: Install Node.js, NPM and Yarn
         uses: actions/setup-node@v1
         with:
-          node-version: 12
+          node-version: 14
 
       - name: Build/release Electron app
         uses: samuelmeuli/action-electron-builder@v1

.github/workflows/build-mac.yml

@@ -17,7 +17,7 @@ jobs:
       - name: Install Node.js, NPM and Yarn
         uses: actions/setup-node@v1
         with:
-          node-version: 12
+          node-version: 14
 
       - name: Build/release Electron app
         uses: samuelmeuli/action-electron-builder@v1

.github/workflows/build-win.yml

@@ -17,7 +17,7 @@ jobs:
       - name: Install Node.js, NPM and Yarn
         uses: actions/setup-node@v1
         with:
-          node-version: 12
+          node-version: 14
 
       - name: Build/release Electron app
         uses: samuelmeuli/action-electron-builder@v1

CHANGELOG.md

@@ -2,6 +2,26 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.1.13](https://github.com/Fabio286/antares/compare/v0.1.12...v0.1.13) (2021-06-19)
+
+
+### Features
+
+* **PostgreSQL:** alter trigger support ([5c8ee66](https://github.com/Fabio286/antares/commit/5c8ee66f432585db7bd72103fa814558bf406bcc))
+* **UI:** ability to manually insert page number in DATA tabs, closes [#65](https://github.com/Fabio286/antares/issues/65) ([e2ebb04](https://github.com/Fabio286/antares/commit/e2ebb04a9047d25187889644aa625fe675de808b))
+* **UI:** option to change query editors font size, closes [#77](https://github.com/Fabio286/antares/issues/77) ([e579f37](https://github.com/Fabio286/antares/commit/e579f374381b329422b646b8f7ab5acf298db981))
+
+
+### Bug Fixes
+
+* **MySQL:** pool connections not released after MySQL errors, causing endless load animation ([4133fc4](https://github.com/Fabio286/antares/commit/4133fc452fc2e961eb587590e010f4968675db7e))
+* **UI:** various fixes in displaying content with small window size ([8a20bef](https://github.com/Fabio286/antares/commit/8a20befd0941cb2e6d5e29552606454bd871b092))
+
+
+### Improvements
+
+* remove comments from queries before execution ([690a454](https://github.com/Fabio286/antares/commit/690a4541f96eaf831dea07b777a421729173b654))
+
 ### [0.1.12](https://github.com/Fabio286/antares/compare/v0.1.11...v0.1.12) (2021-06-09)
 
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "antares",
   "productName": "Antares",
-  "version": "0.1.12",
+  "version": "0.1.13",
   "description": "A cross-platform easy to use SQL client.",
   "license": "MIT",
   "repository": "https://github.com/Fabio286/antares.git",
@@ -87,14 +87,14 @@
     }
   },
   "dependencies": {
-    "@electron/remote": "^1.1.0",
+    "@electron/remote": "^1.2.0",
     "@mdi/font": "^5.9.55",
     "ace-builds": "^1.4.12",
     "electron-log": "^4.3.5",
     "electron-store": "^8.0.0",
     "electron-updater": "^4.3.9",
     "faker": "^5.5.3",
-    "marked": "^2.0.7",
+    "marked": "^2.1.1",
     "moment": "^2.29.1",
     "mysql2": "^2.2.5",
     "pg": "^8.5.1",
@@ -108,20 +108,20 @@
     "vuex": "^3.6.2"
   },
   "devDependencies": {
-    "@babel/eslint-parser": "^7.14.4",
+    "@babel/eslint-parser": "^7.14.5",
     "cross-env": "^7.0.2",
-    "electron": "^13.1.1",
-    "electron-builder": "22.10.5",
+    "electron": "^13.1.2",
+    "electron-builder": "^22.11.7",
     "electron-devtools-installer": "^3.2.0",
     "electron-webpack": "^2.8.2",
     "electron-webpack-vue": "^2.4.0",
-    "eslint": "^7.28.0",
+    "eslint": "^7.29.0",
     "eslint-config-standard": "^16.0.3",
     "eslint-plugin-import": "^2.23.4",
     "eslint-plugin-node": "^11.1.0",
     "eslint-plugin-promise": "^5.1.0",
-    "eslint-plugin-vue": "^7.10.0",
-    "sass": "^1.34.1",
+    "eslint-plugin-vue": "^7.11.1",
+    "sass": "^1.35.1",
     "sass-loader": "^10.2.0",
     "standard-version": "^9.3.0",
     "stylelint": "^13.13.1",

src/common/customizations/defaults.js

@@ -62,7 +62,7 @@ module.exports = {
    functionSql: false,
    functionContext: false,
    functionLanguage: false,
-   triggerMiltipleEvents: false,
+   triggerMultipleEvents: false,
    triggerTableInName: false,
    triggerUpdateColumns: false,
    triggerOnlyRename: false,

src/common/customizations/postgresql.js

@@ -40,6 +40,6 @@ module.exports = {
    functionLanguage: true,
    triggerMultipleEvents: true,
    triggerTableInName: true,
-   triggerOnlyRename: true,
+   triggerOnlyRename: false,
    languages: ['sql', 'plpgsql', 'c', 'internal']
 };

src/main/index.js

@@ -2,7 +2,6 @@
 
 import { app, BrowserWindow, nativeImage } from 'electron';
 import * as path from 'path';
-import { format as formatUrl } from 'url';
 import Store from 'electron-store';
 
 import ipcHandlers from './ipc-handlers';
@@ -47,13 +46,8 @@ async function createMainWindow () {
          const toolName = await installExtension(VUEJS_DEVTOOLS);
          console.log(toolName, 'installed');
       }
-      else {
-         await window.loadURL(formatUrl({
-            pathname: path.join(__dirname, 'index.html'),
-            protocol: 'file',
-            slashes: true
-         }));
-      }
+      else
+         await window.loadURL(new URL(`file:///${path.join(__dirname, 'index.html')}`).href);
    }
    catch (err) {
       console.log(err);

src/main/libs/clients/MySQLClient.js

@@ -1325,6 +1325,7 @@ export class MySQLClient extends AntaresCore {
     * @memberof MySQLClient
     */
    async raw (sql, args) {
+      sql = sql.replace(/(\/\*(.|[\r\n])*?\*\/)|(--(.*|[\r\n]))/gm, '');
       if (process.env.NODE_ENV === 'development') this._logger(sql);// TODO: replace BLOB content with a placeholder
 
       args = {
@@ -1337,7 +1338,11 @@ export class MySQLClient extends AntaresCore {
       const nestTables = args.nest ? '.' : false;
       const resultsArr = [];
       let paramsArr = [];
-      const queries = args.split ? sql.split(/((?:[^;'"]*(?:"(?:\\.|[^"])*"|'(?:\\.|[^'])*')[^;'"]*)+)|;/gm) : [sql];
+      const queries = args.split
+         ? sql.split(/((?:[^;'"]*(?:"(?:\\.|[^"])*"|'(?:\\.|[^'])*')[^;'"]*)+)|;/gm)
+            .filter(Boolean)
+            .map(q => q.trim())
+         : [sql];
       const isPool = typeof this._connection.getConnection === 'function';
       const connection = isPool ? await this._connection.getConnection() : this._connection;
 
@@ -1424,7 +1429,10 @@ export class MySQLClient extends AntaresCore {
                   fields: remappedFields,
                   keys: keysArr
                });
-            }).catch(reject);
+            }).catch((err) => {
+               if (isPool) connection.release();
+               reject(err);
+            });
          });
 
          resultsArr.push({ rows, report, fields, keys, duration });

src/main/libs/clients/PostgreSQLClient.js

@@ -535,7 +535,7 @@ export class PostgreSQLClient extends AntaresCore {
     */
    async dropTrigger (params) {
       const triggerParts = params.trigger.split('.');
-      const sql = `DROP TRIGGER ${triggerParts[1]} ON ${triggerParts[0]}`;
+      const sql = `DROP TRIGGER "${triggerParts[1]}" ON "${triggerParts[0]}"`;
       return await this.raw(sql);
    }
 
@@ -547,21 +547,18 @@ export class PostgreSQLClient extends AntaresCore {
     */
    async alterTrigger (params) {
       const { trigger } = params;
-      // const tempTrigger = Object.assign({}, trigger);
-      // tempTrigger.name = `Antares_${tempTrigger.name}_tmp`;
+      const tempTrigger = Object.assign({}, trigger);
+      tempTrigger.name = `Antares_${tempTrigger.name}_tmp`;
 
-      // try {
-      //    await this.createTrigger(tempTrigger);
-      //    await this.dropTrigger({ trigger: tempTrigger.name });
-      //    await this.dropTrigger({ trigger: trigger.oldName });
-      //    await this.createTrigger(trigger);
-      // }
-      // catch (err) {
-      //    return Promise.reject(err);
-      // }
-
-      const sql = `ALTER TRIGGER ${trigger.oldName} ON ${trigger.table} RENAME TO ${trigger.name}`;
-      return await this.raw(sql);
+      try {
+         await this.createTrigger(tempTrigger);
+         await this.dropTrigger({ trigger: `${tempTrigger.table}.${tempTrigger.name}` });
+         await this.dropTrigger({ trigger: `${trigger.table}.${trigger.oldName}` });
+         await this.createTrigger(trigger);
+      }
+      catch (err) {
+         return Promise.reject(err);
+      }
    }
 
    /**
@@ -571,7 +568,8 @@ export class PostgreSQLClient extends AntaresCore {
     * @memberof PostgreSQLClient
     */
    async createTrigger (trigger) {
-      const sql = `CREATE ${trigger.definer ? `DEFINER=${trigger.definer} ` : ''}TRIGGER \`${trigger.name}\` ${trigger.event} ${trigger.activation} ON \`${trigger.table}\` FOR EACH ROW ${trigger.sql}`;
+      const eventsString = Array.isArray(trigger.event) ? trigger.event.join(' OR ') : trigger.event;
+      const sql = `CREATE TRIGGER "${trigger.name}" ${trigger.activation} ${eventsString} ON "${trigger.table}" FOR EACH ROW ${trigger.sql}`;
       return await this.raw(sql, { split: false });
    }
 
@@ -1174,6 +1172,8 @@ export class PostgreSQLClient extends AntaresCore {
     * @memberof PostgreSQLClient
     */
    async raw (sql, args) {
+      sql = sql.replace(/(\/\*(.|[\r\n])*?\*\/)|(--(.*|[\r\n]))/gm, '');
+
       args = {
          nest: false,
          details: false,
@@ -1186,7 +1186,11 @@ export class PostgreSQLClient extends AntaresCore {
 
       const resultsArr = [];
       let paramsArr = [];
-      const queries = args.split ? sql.split(/(?!\B'[^']*);(?![^']*'\B)/gm) : [sql];
+      const queries = args.split
+         ? sql.split(/(?!\B'[^']*);(?![^']*'\B)/gm)
+            .filter(Boolean)
+            .map(q => q.trim())
+         : [sql];
 
       if (process.env.NODE_ENV === 'development') this._logger(sql);// TODO: replace BLOB content with a placeholder
 

src/renderer/components/BaseTextEditor.vue

@@ -34,6 +34,7 @@ export default {
    computed: {
       ...mapGetters({
          editorTheme: 'settings/getEditorTheme',
+         editorFontSize: 'settings/getEditorFontSize',
          autoComplete: 'settings/getAutoComplete',
          lineWrap: 'settings/getLineWrap'
       })
@@ -47,6 +48,19 @@ export default {
          if (this.editor)
             this.editor.setTheme(`ace/theme/${this.editorTheme}`);
       },
+      editorFontSize () {
+         const sizes = {
+            small: '12px',
+            medium: '14px',
+            large: '16px'
+         };
+
+         if (this.editor) {
+            this.editor.setOptions({
+               fontSize: sizes[this.editorFontSize]
+            });
+         }
+      },
       autoComplete () {
          if (this.editor) {
             this.editor.setOptions({

src/renderer/components/ModalAskParameters.vue

@@ -8,7 +8,8 @@
    >
       <template slot="header">
          <div class="d-flex">
-            <i class="mdi mdi-24px mdi-play mr-1" /> {{ $t('word.parameters') }}: {{ localRoutine.name }}
+            <i class="mdi mdi-24px mdi-play mr-1" />
+            <span class="cut-text">{{ $t('word.parameters') }}: {{ localRoutine.name }}</span>
          </div>
       </template>
       <div slot="body">
@@ -19,10 +20,10 @@
                   :key="parameter._id"
                   class="form-group"
                >
-                  <div class="col-3">
+                  <div class="col-4">
                      <label class="form-label">{{ parameter.name }}</label>
                   </div>
-                  <div class="col-9">
+                  <div class="col-8">
                      <div class="input-group">
                         <input
                            :ref="i === 0 ? 'firstInput' : ''"

src/renderer/components/ModalEditSchema.vue

@@ -5,7 +5,8 @@
          <div class="modal-header pl-2">
             <div class="modal-title h6">
                <div class="d-flex">
-                  <i class="mdi mdi-24px mdi-database-edit mr-1" /> {{ $t('message.editSchema') }}
+                  <i class="mdi mdi-24px mdi-database-edit mr-1" />
+                  <span class="cut-text">{{ $t('message.editSchema') }}</span>
                </div>
             </div>
             <a class="btn btn-clear c-hand" @click.stop="closeModal" />

src/renderer/components/ModalFakerRows.vue

@@ -5,7 +5,8 @@
          <div class="modal-header pl-2">
             <div class="modal-title h6">
                <div class="d-flex">
-                  <i class="mdi mdi-24px mdi-playlist-plus mr-1" /> {{ $t('message.tableFiller') }}
+                  <i class="mdi mdi-24px mdi-playlist-plus mr-1" />
+                  <span class="cut-text">{{ $t('message.tableFiller') }}</span>
                </div>
             </div>
             <a class="btn btn-clear c-hand" @click.stop="closeModal" />

src/renderer/components/ModalNewConnection.vue

@@ -5,7 +5,8 @@
          <div class="modal-header pl-2">
             <div class="modal-title h6">
                <div class="d-flex">
-                  <i class="mdi mdi-24px mdi-server-plus mr-1" /> {{ $t('message.createNewConnection') }}
+                  <i class="mdi mdi-24px mdi-server-plus mr-1" />
+                  <span class="cut-text">{{ $t('message.createNewConnection') }}</span>
                </div>
             </div>
             <a class="btn btn-clear c-hand" @click="closeModal" />

src/renderer/components/ModalNewSchema.vue

@@ -5,7 +5,8 @@
          <div class="modal-header pl-2">
             <div class="modal-title h6">
                <div class="d-flex">
-                  <i class="mdi mdi-24px mdi-database-plus mr-1" /> {{ $t('message.createNewSchema') }}
+                  <i class="mdi mdi-24px mdi-database-plus mr-1" />
+                  <span class="cut-text">{{ $t('message.createNewSchema') }}</span>
                </div>
             </div>
             <a class="btn btn-clear c-hand" @click.stop="closeModal" />

src/renderer/components/ModalNewTableRow.vue

@@ -5,7 +5,8 @@
          <div class="modal-header pl-2">
             <div class="modal-title h6">
                <div class="d-flex">
-                  <i class="mdi mdi-24px mdi-playlist-plus mr-1" /> {{ $t('message.addNewRow') }}
+                  <i class="mdi mdi-24px mdi-playlist-plus mr-1" />
+                  <span class="cut-text">{{ $t('message.addNewRow') }}</span>
                </div>
             </div>
             <a class="btn btn-clear c-hand" @click.stop="closeModal" />

src/renderer/components/ModalProcessesList.vue

@@ -5,7 +5,8 @@
          <div class="modal-header pl-2">
             <div class="modal-title h6">
                <div class="d-flex">
-                  <i class="mdi mdi-24px mdi-memory mr-1" /> {{ $t('message.processesList') }}: {{ connectionName }}
+                  <i class="mdi mdi-24px mdi-memory mr-1" />
+                  <span class="cut-text">{{ $t('message.processesList') }}: {{ connectionName }}</span>
                </div>
             </div>
             <a class="btn btn-clear c-hand" @click.stop="closeModal" />

src/renderer/components/ModalSettings.vue

@@ -6,7 +6,7 @@
             <div class="modal-title h6">
                <div class="d-flex">
                   <i class="mdi mdi-24px mdi-cog mr-1" />
-                  {{ $t('word.settings') }}
+                  <span class="cut-text">{{ $t('word.settings') }}</span>
                </div>
             </div>
             <a class="btn btn-clear c-hand" @click="closeModal" />
@@ -222,6 +222,31 @@
                               </optgroup>
                            </select>
                         </div>
+                        <div class="column col-6 mb-4">
+                           <div class="btn-group btn-group-block">
+                              <button
+                                 class="btn btn-dark cut-text"
+                                 :class="{'active': editorFontSize === 'small'}"
+                                 @click="changeEditorFontSize('small')"
+                              >
+                                 {{ $t('word.small') }}
+                              </button>
+                              <button
+                                 class="btn btn-dark cut-text"
+                                 :class="{'active': editorFontSize === 'medium'}"
+                                 @click="changeEditorFontSize('medium')"
+                              >
+                                 {{ $t('word.medium') }}
+                              </button>
+                              <button
+                                 class="btn btn-dark cut-text"
+                                 :class="{'active': editorFontSize === 'large'}"
+                                 @click="changeEditorFontSize('large')"
+                              >
+                                 {{ $t('word.large') }}
+                              </button>
+                           </div>
+                        </div>
                         <div class="column col-12">
                            <BaseTextEditor
                               :value="exampleQuery"
@@ -346,6 +371,7 @@ export default {
          notificationsTimeout: 'settings/getNotificationsTimeout',
          applicationTheme: 'settings/getApplicationTheme',
          editorTheme: 'settings/getEditorTheme',
+         editorFontSize: 'settings/getEditorFontSize',
          updateStatus: 'application/getUpdateStatus',
          selectedWorkspace: 'workspaces/getSelected',
          getWorkspace: 'workspaces/getWorkspace'
@@ -401,6 +427,7 @@ ORDER BY
          changeLineWrap: 'settings/changeLineWrap',
          changeApplicationTheme: 'settings/changeApplicationTheme',
          changeEditorTheme: 'settings/changeEditorTheme',
+         changeEditorFontSize: 'settings/changeEditorFontSize',
          updateNotificationsTimeout: 'settings/updateNotificationsTimeout'
       }),
       selectTab (tab) {

src/renderer/components/QueryEditor.vue

@@ -38,6 +38,7 @@ export default {
    computed: {
       ...mapGetters({
          editorTheme: 'settings/getEditorTheme',
+         editorFontSize: 'settings/getEditorFontSize',
          autoComplete: 'settings/getAutoComplete',
          lineWrap: 'settings/getLineWrap',
          baseCompleter: 'application/getBaseCompleter'
@@ -158,6 +159,19 @@ export default {
          if (this.editor)
             this.editor.setTheme(`ace/theme/${this.editorTheme}`);
       },
+      editorFontSize () {
+         const sizes = {
+            small: '12px',
+            medium: '14px',
+            large: '16px'
+         };
+
+         if (this.editor) {
+            this.editor.setOptions({
+               fontSize: sizes[this.editorFontSize]
+            });
+         }
+      },
       autoComplete () {
          if (this.editor) {
             this.editor.setOptions({

src/renderer/components/WorkspaceExploreBarMiscContext.vue

@@ -20,7 +20,8 @@
       >
          <template slot="header">
             <div class="d-flex">
-               <i class="mdi mdi-24px mdi-delete mr-1" /> {{ deleteMessage }}
+               <i class="mdi mdi-24px mdi-delete mr-1" />
+               <span class="cut-text">{{ deleteMessage }}</span>
             </div>
          </template>
          <div slot="body">

src/renderer/components/WorkspaceExploreBarSchemaContext.vue

@@ -69,7 +69,8 @@
       >
          <template slot="header">
             <div class="d-flex">
-               <i class="mdi mdi-24px mdi-database-remove mr-1" /> {{ $t('message.deleteSchema') }}
+               <i class="mdi mdi-24px mdi-database-remove mr-1" />
+               <span class="cut-text">{{ $t('message.deleteSchema') }}</span>
             </div>
          </template>
          <div slot="body">

src/renderer/components/WorkspaceExploreBarTableContext.vue

@@ -21,7 +21,7 @@
       >
          <template slot="header">
             <div class="d-flex">
-               <i class="mdi mdi-24px mdi-table-off mr-1" /> {{ $t('message.emptyTable') }}
+               <i class="mdi mdi-24px mdi-table-off mr-1" /> <span class="cut-text">{{ $t('message.emptyTable') }}</span>
             </div>
          </template>
          <div slot="body">
@@ -37,7 +37,8 @@
       >
          <template slot="header">
             <div class="d-flex">
-               <i class="mdi mdi-24px mdi-table-remove mr-1" /> {{ selectedTable.type === 'table' ? $t('message.deleteTable') : $t('message.deleteView') }}
+               <i class="mdi mdi-24px mdi-table-remove mr-1" />
+               <span class="cut-text">{{ selectedTable.type === 'table' ? $t('message.deleteTable') : $t('message.deleteView') }}</span>
             </div>
          </template>
          <div slot="body">

src/renderer/components/WorkspacePropsForeignModal.vue

@@ -8,7 +8,8 @@
    >
       <template :slot="'header'">
          <div class="d-flex">
-            <i class="mdi mdi-24px mdi-key-link mr-1" /> {{ $t('word.foreignKeys') }} "{{ table }}"
+            <i class="mdi mdi-24px mdi-key-link mr-1" />
+            <span class="cut-text">{{ $t('word.foreignKeys') }} "{{ table }}"</span>
          </div>
       </template>
       <div :slot="'body'">

src/renderer/components/WorkspacePropsFunctionOptionsModal.vue

@@ -7,7 +7,8 @@
    >
       <template :slot="'header'">
          <div class="d-flex">
-            <i class="mdi mdi-24px mdi-cogs mr-1" /> {{ $t('word.options') }} "{{ localOptions.name }}"
+            <i class="mdi mdi-24px mdi-cogs mr-1" />
+            <span class="cut-text">{{ $t('word.options') }} "{{ localOptions.name }}"</span>
          </div>
       </template>
       <div :slot="'body'">

src/renderer/components/WorkspacePropsFunctionParamsModal.vue

@@ -8,7 +8,8 @@
    >
       <template :slot="'header'">
          <div class="d-flex">
-            <i class="mdi mdi-24px mdi-dots-horizontal mr-1" /> {{ $t('word.parameters') }} "{{ func }}"
+            <i class="mdi mdi-24px mdi-dots-horizontal mr-1" />
+            <span class="cut-text">{{ $t('word.parameters') }} "{{ func }}"</span>
          </div>
       </template>
       <div :slot="'body'">

src/renderer/components/WorkspacePropsIndexesModal.vue

@@ -8,7 +8,8 @@
    >
       <template :slot="'header'">
          <div class="d-flex">
-            <i class="mdi mdi-24px mdi-key mdi-rotate-45 mr-1" /> {{ $t('word.indexes') }} "{{ table }}"
+            <i class="mdi mdi-24px mdi-key mdi-rotate-45 mr-1" />
+            <span class="cut-text">{{ $t('word.indexes') }} "{{ table }}"</span>
          </div>
       </template>
       <div :slot="'body'">

src/renderer/components/WorkspacePropsOptionsModal.vue

@@ -7,7 +7,8 @@
    >
       <template :slot="'header'">
          <div class="d-flex">
-            <i class="mdi mdi-24px mdi-cogs mr-1" /> {{ $t('word.options') }} "{{ table }}"
+            <i class="mdi mdi-24px mdi-cogs mr-1" />
+            <span class="cut-text">{{ $t('word.options') }} "{{ table }}"</span>
          </div>
       </template>
       <div :slot="'body'">

src/renderer/components/WorkspacePropsRoutineOptionsModal.vue

@@ -7,7 +7,8 @@
    >
       <template :slot="'header'">
          <div class="d-flex">
-            <i class="mdi mdi-24px mdi-cogs mr-1" /> {{ $t('word.options') }} "{{ localOptions.name }}"
+            <i class="mdi mdi-24px mdi-cogs mr-1" />
+            <span class="cut-text">{{ $t('word.options') }} "{{ localOptions.name }}"</span>
          </div>
       </template>
       <div :slot="'body'">

src/renderer/components/WorkspacePropsRoutineParamsModal.vue

@@ -8,7 +8,8 @@
    >
       <template :slot="'header'">
          <div class="d-flex">
-            <i class="mdi mdi-24px mdi-dots-horizontal mr-1" /> {{ $t('word.parameters') }} "{{ routine }}"
+            <i class="mdi mdi-24px mdi-dots-horizontal mr-1" />
+            <span class="cut-text">{{ $t('word.parameters') }} "{{ routine }}"</span>
          </div>
       </template>
       <div :slot="'body'">

src/renderer/components/WorkspacePropsSchedulerTimingModal.vue

@@ -7,7 +7,8 @@
    >
       <template :slot="'header'">
          <div class="d-flex">
-            <i class="mdi mdi-24px mdi-timer mr-1" /> {{ $t('word.timing') }} "{{ localOptions.name }}"
+            <i class="mdi mdi-24px mdi-timer mr-1" />
+            <span class="cut-text">{{ $t('word.timing') }} "{{ localOptions.name }}"</span>
          </div>
       </template>
       <div :slot="'body'">

src/renderer/components/WorkspacePropsTableRow.vue

@@ -232,7 +232,8 @@
       >
          <template :slot="'header'">
             <div class="d-flex">
-               <i class="mdi mdi-24px mdi-playlist-edit mr-1" /> {{ $t('word.default') }} "{{ row.name }}"
+               <i class="mdi mdi-24px mdi-playlist-edit mr-1" />
+               <span class="cut-text">{{ $t('word.default') }} "{{ row.name }}"</span>
             </div>
          </template>
          <div :slot="'body'">

src/renderer/components/WorkspaceQueryTable.vue

@@ -85,7 +85,8 @@
       >
          <template :slot="'header'">
             <div class="d-flex">
-               <i class="mdi mdi-24px mdi-delete mr-1" /> {{ $tc('message.deleteRows', selectedRows.length) }}
+               <i class="mdi mdi-24px mdi-delete mr-1" />
+               <span class="cut-text">{{ $tc('message.deleteRows', selectedRows.length) }}</span>
             </div>
          </template>
          <div :slot="'body'">

src/renderer/components/WorkspaceQueryTableRow.vue

@@ -74,7 +74,7 @@
       >
          <template :slot="'header'">
             <div class="d-flex">
-               <i class="mdi mdi-24px mdi-playlist-edit mr-1" /> {{ $t('word.edit') }} "{{ editingField }}"
+               <i class="mdi mdi-24px mdi-playlist-edit mr-1" /> <span class="cut-text">{{ $t('word.edit') }} "{{ editingField }}"</span>
             </div>
          </template>
          <div :slot="'body'">
@@ -138,7 +138,8 @@
       >
          <template :slot="'header'">
             <div class="d-flex">
-               <i class="mdi mdi-24px mdi-playlist-edit mr-1" /> {{ $t('word.edit') }} "{{ editingField }}"
+               <i class="mdi mdi-24px mdi-playlist-edit mr-1" />
+               <span class="cut-text">{{ $t('word.edit') }} "{{ editingField }}"</span>
             </div>
          </template>
          <div :slot="'body'">

src/renderer/components/WorkspaceTableTab.vue

@@ -41,8 +41,23 @@
                   >
                      <i class="mdi mdi-24px mdi-skip-previous" />
                   </button>
-                  <div class="btn btn-dark btn-sm mr-0 text-bold c-auto px-2">
-                     {{ page }}
+                  <div class="dropdown" :class="{'active': isPageMenu}">
+                     <div class="btn-group" @click="openPageMenu">
+                        <div class="btn btn-dark btn-sm mr-0 dropdown-toggle text-bold px-3">
+                           {{ page }}
+                        </div>
+                        <div class="menu px-3">
+                           <span>{{ $t('message.pageNumber') }}</span>
+                           <input
+                              ref="pageSelect"
+                              v-model="pageProxy"
+                              type="number"
+                              min="1"
+                              class="form-input"
+                              @blur="setPageNumber"
+                           >
+                        </div>
+                     </div>
                   </div>
                   <button
                      class="btn btn-dark btn-sm mr-0"
@@ -172,6 +187,7 @@ export default {
       return {
          tabUid: 'data',
          isQuering: false,
+         isPageMenu: false,
          results: [],
          lastTable: null,
          isAddModal: false,
@@ -179,7 +195,8 @@ export default {
          autorefreshTimer: 0,
          refreshInterval: null,
          sortParams: {},
-         page: 1
+         page: 1,
+         pageProxy: 1
       };
    },
    computed: {
@@ -229,8 +246,11 @@ export default {
             this.$refs.queryTable.resetSort();
          }
       },
-      page () {
-         this.getTableData();
+      page (val, oldVal) {
+         if (val && val > 0 && val !== oldVal) {
+            this.pageProxy = this.page;
+            this.getTableData();
+         }
       },
       isSelected (val) {
          if (val && this.lastTable !== this.table) {
@@ -292,11 +312,30 @@ export default {
          this.sortParams = sortParams;
          this.getTableData(sortParams);
       },
+      openPageMenu () {
+         if (this.isQuering) return;
+
+         this.isPageMenu = true;
+         if (this.isPageMenu)
+            setTimeout(() => this.$refs.pageSelect.focus(), 20);
+      },
+      setPageNumber () {
+         this.isPageMenu = false;
+
+         if (this.pageProxy > 0)
+            this.page = this.pageProxy;
+         else
+            this.pageProxy = this.page;
+      },
       pageChange (direction) {
          if (this.isQuering) return;
 
-         if (direction === 'next' && (this.results.length && this.results[0].rows.length === this.limit))
-            this.page++;
+         if (direction === 'next' && (this.results.length && this.results[0].rows.length === this.limit)) {
+            if (!this.page)
+               this.page = 2;
+            else
+               this.page++;
+         }
          else if (direction === 'prev' && this.page > 1)
             this.page--;
       },

src/renderer/i18n/en-US.js

@@ -105,7 +105,11 @@ module.exports = {
       scratchpad: 'Scratchpad',
       array: 'Array',
       changelog: 'Changelog',
-      format: 'Format'
+      format: 'Format',
+      structure: 'Structure',
+      small: 'Small',
+      medium: 'Medium',
+      large: 'Large'
    },
    message: {
       appWelcome: 'Welcome to Antares SQL Client!',
@@ -211,7 +215,8 @@ module.exports = {
       deleteSchema: 'Delete schema',
       markdownSupported: 'Markdown supported',
       plantATree: 'Plant a Tree',
-      dataTabPageSize: 'DATA tab page size'
+      dataTabPageSize: 'DATA tab page size',
+      pageNumber: 'Page number'
    },
    faker: {
       address: 'Address',

src/renderer/scss/main.scss

@@ -40,6 +40,12 @@ body {
   box-shadow: none !important;
 }
 
+.cut-text {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
 .workspace-tabs {
   align-content: baseline;
 
@@ -112,6 +118,10 @@ body {
       justify-content: space-between;
       align-items: center;
       border-radius: 3px 3px 0 0;
+
+      .modal-title {
+        overflow: hidden;
+      }
     }
   }
 }
@@ -185,6 +195,10 @@ body {
   max-height: 5000rem !important;
 }
 
+.btn-group {
+  flex-wrap: nowrap;
+}
+
 .btn.loading {
   > .mdi,
   > span {

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

@@ -58,6 +58,10 @@
       &:hover {
         background: $bg-color-gray;
       }
+
+      &.active {
+        background-color: $primary-color;
+      }
     }
   }
 
@@ -211,10 +215,8 @@
   }
 
   .bg-checkered {
-    background-image:
-      linear-gradient(to right, rgba(192, 192, 192, 0.75), rgba(192, 192, 192, 0.75)),
-      linear-gradient(to right, black 50%, white 50%),
-      linear-gradient(to bottom, black 50%, white 50%);
+    background-image: linear-gradient(to right, rgba(192, 192, 192, 0.75), rgba(192, 192, 192, 0.75)),
+      linear-gradient(to right, black 50%, white 50%), linear-gradient(to bottom, black 50%, white 50%);
     background-blend-mode: normal, difference, normal;
     background-size: 2em 2em;
   }

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

@@ -62,6 +62,10 @@
       &:hover {
         background: $bg-color-gray;
       }
+
+      &.active {
+        background-color: $primary-color;
+      }
     }
   }
 

src/renderer/store/modules/settings.store.js

@@ -15,7 +15,8 @@ export default {
       auto_complete: persistentStore.get('auto_complete', true),
       line_wrap: persistentStore.get('line_wrap', true),
       application_theme: persistentStore.get('application_theme', 'dark'),
-      editor_theme: persistentStore.get('editor_theme', 'twilight')
+      editor_theme: persistentStore.get('editor_theme', 'twilight'),
+      editor_font_size: persistentStore.get('editor_font_size', 'medium')
    },
    getters: {
       getLocale: state => state.locale,
@@ -26,7 +27,8 @@ export default {
       getAutoComplete: state => state.auto_complete,
       getLineWrap: state => state.line_wrap,
       getApplicationTheme: state => state.application_theme,
-      getEditorTheme: state => state.editor_theme
+      getEditorTheme: state => state.editor_theme,
+      getEditorFontSize: state => state.editor_font_size
    },
    mutations: {
       SET_LOCALE (state, locale) {
@@ -65,6 +67,10 @@ export default {
       SET_EDITOR_THEME (state, theme) {
          state.editor_theme = theme;
          persistentStore.set('editor_theme', state.editor_theme);
+      },
+      SET_EDITOR_FONT_SIZE (state, size) {
+         state.editor_font_size = size;
+         persistentStore.set('editor_font_size', state.editor_font_size);
       }
    },
    actions: {
@@ -94,6 +100,9 @@ export default {
       },
       changeEditorTheme ({ commit }, theme) {
          commit('SET_EDITOR_THEME', theme);
+      },
+      changeEditorFontSize ({ commit }, size) {
+         commit('SET_EDITOR_FONT_SIZE', size);
       }
    }
 };