chore(release): 0.0.18

feat: added french language

.versionrc.json

@@ -0,0 +1,7 @@
+{
+  "types": [
+    {"type":"feat","section":"Features"},
+    {"type":"perf","section":"Improvements"},
+    {"type":"fix","section":"Bug Fixes"}
+  ]
+}

CHANGELOG.md

@@ -2,6 +2,138 @@
 
 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.0.18](https://github.com/Fabio286/antares/compare/v0.0.17...v0.0.18) (2021-02-25)
+
+
+### Features
+
+* **UI:** context menu for input and textarea tags ([b54fefb](https://github.com/Fabio286/antares/commit/b54fefbf255c91f3cdd0c52b917b239ea40dae16))
+* **UI:** html, xml, json, svg and yaml editor modes in long text fields edit ([9a1bf32](https://github.com/Fabio286/antares/commit/9a1bf3212850d3783ac6382f8a980eb25c4f4226))
+* **UI:** run procedures/functions from sidebar context menu ([219da0a](https://github.com/Fabio286/antares/commit/219da0aba46839295807a01056199d42584e0af9))
+* **UI:** run routines/functions from settings tab ([7e81671](https://github.com/Fabio286/antares/commit/7e8167154ffd64e46d78a50cd13cf90cee61370c))
+* **UI:** search filter in explore bar ([2f58007](https://github.com/Fabio286/antares/commit/2f58007af4f32207fe4be9fc15bb43916e8e0abc))
+* **UI:** sticky schema names in explore bar ([110b0b4](https://github.com/Fabio286/antares/commit/110b0b414cef25395ae28493032c2048307e4783))
+
+
+### Bug Fixes
+
+* **MySQL:** issue obtaining routine/function parameters ([3aa2159](https://github.com/Fabio286/antares/commit/3aa2159a1ae3b6785646fc7ac1e866cb0277d087))
+* issue managing function/routine parameters ([76d92cd](https://github.com/Fabio286/antares/commit/76d92cd106b0409e8752c43d7d587d09dd3e1e32))
+* **UI:** data tab opened when non-table element is selected ([dbab06f](https://github.com/Fabio286/antares/commit/dbab06fcb80ccdae85215ceae9ba24af3e7ff263))
+* **UI:** elements from previous selected schemas in query suggestions ([c8545a2](https://github.com/Fabio286/antares/commit/c8545a250bc696c339e418a69a2942d5bac10cbf))
+* disabled sort for fields without a name property ([3b37b74](https://github.com/Fabio286/antares/commit/3b37b7432e969e6315ebd6ed74905ec3980a049c))
+* prevents F5 shortcut to run in non-selected workspaces ([7c4ca99](https://github.com/Fabio286/antares/commit/7c4ca999ce64af8077d29e419f430d5beaaead93))
+* support of bit fields in table filler ([94c4952](https://github.com/Fabio286/antares/commit/94c49523197284510361ebbb6984816a3bb1b243))
+
+### [0.0.17](https://github.com/Fabio286/antares/compare/v0.0.16...v0.0.17) (2021-02-17)
+
+
+### Features
+
+* Added french language ([18a93ef](https://github.com/Fabio286/antares/commit/18a93ef1aae530e69c9062bbeb08a3beec206eda))
+* fake table data generator ([a176174](https://github.com/Fabio286/antares/commit/a176174b8d7dc232920f4cd7c5e3f8e4c58d51a0))
+* min and max option for random floats and numbers ([6c62052](https://github.com/Fabio286/antares/commit/6c62052b4764731c774fef90784342447b36deb7))
+* support to fake data locales ([970de49](https://github.com/Fabio286/antares/commit/970de4962b3bffec271bfa6d4747e6fb9d408ba6))
+
+
+### Bug Fixes
+
+* **UI:** file uploader in table filler ([b5a8283](https://github.com/Fabio286/antares/commit/b5a828309f067636eae2120032f07e01233706e2))
+* **UI:** no foreign key select editing query results ([5b21d17](https://github.com/Fabio286/antares/commit/5b21d17f3a8f2482c3aafe85f26c34cd3c0a1fcf))
+* cut faker text based on field length ([288ff4c](https://github.com/Fabio286/antares/commit/288ff4c1a1c77f4b8b86b24649d805836366fdd3))
+* wrong date or time detection in field default ([9d5ebef](https://github.com/Fabio286/antares/commit/9d5ebefdced999af595f3d8dc2fac2b18fa8258b))
+* **UI:** better text on ssl file selectors ([9a19085](https://github.com/Fabio286/antares/commit/9a190854fe3c73ed4e7f89545ff259e15ee9f947))
+* **UI:** wrong length for char fields on table header ([0f69d1d](https://github.com/Fabio286/antares/commit/0f69d1dbb7958e45059b6b738c845abea1ad3225))
+
+
+### Improvements
+
+* **core:** bulk inserts support ([b0576ac](https://github.com/Fabio286/antares/commit/b0576acdf65d41c1c8e0b0bca6cf6522dcb372be))
+
+### [0.0.16](https://github.com/Fabio286/antares/compare/v0.0.15...v0.0.16) (2021-02-06)
+
+
+### Features
+
+* MySQL and MariaDB auto detection ([02c03e3](https://github.com/Fabio286/antares/commit/02c03e3d266052872ac8edeb159ec8182f41c6a5))
+* **UI:** enanched file upload input ([a0d8552](https://github.com/Fabio286/antares/commit/a0d85520fb0669d5eec4475f5e255adb1e2a0159))
+* support to ssl connections ([4e72bb1](https://github.com/Fabio286/antares/commit/4e72bb15874324214aa0f5b89057cdd565744468))
+* **UI:** database version in app footer ([15417e8](https://github.com/Fabio286/antares/commit/15417e8a776c6aa9f90762d198d70b26163bb2df))
+* **UI:** resize query editor area ([88ab7c5](https://github.com/Fabio286/antares/commit/88ab7c5a62654c6a6026b63464224226d33b1950))
+* delete rows from tables without a primary key ([574d493](https://github.com/Fabio286/antares/commit/574d4939083577ffcb8e7c65f572c364eb8415fb))
+* edit rows from tables without a primary key ([5940b0b](https://github.com/Fabio286/antares/commit/5940b0b84207093da141b5c617c41e0a18fcb1d7))
+
+
+### Bug Fixes
+
+* compatibility with electron-store 7 ([bacf458](https://github.com/Fabio286/antares/commit/bacf45893676cb0744907703f6534ffd472bd1dd))
+* edit bit fields ([ede6fe8](https://github.com/Fabio286/antares/commit/ede6fe81cefc91cdce2bbb0cd7cd6f85bbca99b8))
+
+### [0.0.15](https://github.com/Fabio286/antares/compare/v0.0.14...v0.0.15) (2021-01-23)
+
+
+### Features
+
+* functions and schedulers in query suggestions ([8ff6e70](https://github.com/Fabio286/antares/commit/8ff6e70145ed2a207ae8b23a2c688258382a5d74))
+* loading animation in properties tabs ([1cf6485](https://github.com/Fabio286/antares/commit/1cf64858964f4894913db42f7c268013bb06e40b))
+
+
+### Bug Fixes
+
+* error retriving dato of some schedulers ([b9ed8dd](https://github.com/Fabio286/antares/commit/b9ed8dd610e3be1489e01cf53f7d632cb1bd6ac5))
+* unable to call stored routines from query tabs ([4923128](https://github.com/Fabio286/antares/commit/4923128236131482ca948ae8052c294bd9269ed0))
+
+
+### Improvements
+
+* better fields type detection ([4bc9bbf](https://github.com/Fabio286/antares/commit/4bc9bbfb34ebdc51061f718cdf9cbca8507fa0f4))
+* big performance improvement in database structure loading ([a11bac5](https://github.com/Fabio286/antares/commit/a11bac504cd4ee865ea6c614a15ee809dc38202e))
+
+### [0.0.14](https://github.com/Fabio286/antares/compare/v0.0.13...v0.0.14) (2021-01-16)
+
+
+### Features
+
+* export data tables to json or csv file ([0cbea9d](https://github.com/Fabio286/antares/commit/0cbea9d1007304a5b9cf893d165b4b4104266651))
+* functions creation ([49d7172](https://github.com/Fabio286/antares/commit/49d71722e26172232f7b54c6568e1e588ce0d049))
+* functions delete ([59a50bc](https://github.com/Fabio286/antares/commit/59a50bc014facc9643f9153cff61dc9d5a8605a9))
+* functions edit ([41d75b1](https://github.com/Fabio286/antares/commit/41d75b127cbcf1481fd259a14e6e7688638e18a4))
+* scheduler edit ([ceab4ef](https://github.com/Fabio286/antares/commit/ceab4ef243881ba64517fb95320844a21fce4849))
+* schedulers creation ([dbe7b9d](https://github.com/Fabio286/antares/commit/dbe7b9dd239248e806377ae6236b477456f175a3))
+* schedulers delete ([1e7d4ca](https://github.com/Fabio286/antares/commit/1e7d4ca347f4b9337ff266ec78bb4bbc6dd20d4d))
+* triggers and stored routines in sql suggestions ([e351c90](https://github.com/Fabio286/antares/commit/e351c903a8a8d7e908d6a7d54c0491438ac6f024))
+
+
+### Bug Fixes
+
+* error with empty functions/procedures ([f150508](https://github.com/Fabio286/antares/commit/f1505085477a760a768a7d245c9517a858c1379c))
+* removed internal row _id from exported files ([c0a32c0](https://github.com/Fabio286/antares/commit/c0a32c040e653729ef80d580d6dd1796d1b2adcd))
+
+### [0.0.13](https://github.com/Fabio286/antares/compare/v0.0.12...v0.0.13) (2021-01-06)
+
+
+### Features
+
+* option to toggle line wrap mode ([d94b49f](https://github.com/Fabio286/antares/commit/d94b49febf54b0200127859f2a8ed7ef591e56ab))
+* select definer in view creation/edit ([ab307f8](https://github.com/Fabio286/antares/commit/ab307f82b1d78c5f9571233090b6678a964bd674))
+* stored routines creation ([3bcd02f](https://github.com/Fabio286/antares/commit/3bcd02fc4ea9a4b780305212f906d6d78c7a8dae))
+* stored routines delete ([aa33850](https://github.com/Fabio286/antares/commit/aa3385028685417860b3ce985cc7a74f9da377ad))
+* stored routines edit ([82fdc0b](https://github.com/Fabio286/antares/commit/82fdc0bcd7514b321c1c9852a773adacf81baf87))
+* triggers creation ([d695c9f](https://github.com/Fabio286/antares/commit/d695c9f8d2418a6a4523a7a242fa1a8cba80e035))
+* triggers delete ([b32132a](https://github.com/Fabio286/antares/commit/b32132ad84d5798555b80eec3c624b681c37c339))
+* triggers edit ([3126625](https://github.com/Fabio286/antares/commit/3126625461f4b6d68d641b6b0eda8fcd390bb636))
+* views creation ([8c4aaec](https://github.com/Fabio286/antares/commit/8c4aaec167f58333a343b52927205b68137ad408))
+* views deletion ([dcf469e](https://github.com/Fabio286/antares/commit/dcf469ebed6252b4a496800206e0c34cd83b1f5e))
+* views edit ([56f2a27](https://github.com/Fabio286/antares/commit/56f2a27f0059cc10316204210db078a97408973c))
+
+
+### Bug Fixes
+
+* breadcrumb not change after table rename ([b6b7be0](https://github.com/Fabio286/antares/commit/b6b7be098ad5ab4d55bfe05a7f862f045c1f54da))
+* unable to rename views ([b7053bd](https://github.com/Fabio286/antares/commit/b7053bdf8036d027e1685d6b5080d6b927a80e08))
+* wrong new stored routine modal icon ([0ec2710](https://github.com/Fabio286/antares/commit/0ec2710872c692b3feac076a3250d3b760af4009))
+* wrong or duplicate fields in some queries ([0df2b83](https://github.com/Fabio286/antares/commit/0df2b836b15436a2397d6a2202bd049b5cd53de4))
+
 ### [0.0.12](https://github.com/Fabio286/antares/compare/v0.0.11...v0.0.12) (2020-12-24)
 
 

README.md

@@ -32,6 +32,8 @@ An application created with minimalism and semplicity in mind, with features in
 - Multiple database connections at same time.
 - Database management (add/edit/delete).
 - Full tables management, including indexes and foreign keys.
+- Views, triggers, stored routines, functions and schedulers management (add/edit/delete).
+- Fake table data filler.
 - Run queries on multiple tabs.
 - Query suggestions and auto complete.
 - Native dark theme.
@@ -43,19 +45,28 @@ An application created with minimalism and semplicity in mind, with features in
 
 This is a roadmap with major features will come in near future.
 
-- Stored procedures, views, schedulers and triggers support.
-- Users management (add/edit/delete).
-- Database tools (variables, process list...).
-- SSL and SSH tunnel support.
 - Support for other databases.
+- Database tools (variables, process list...).
+- SSH tunnel support.
+- Users management (add/edit/delete).
 - UI/UX improvements.
 - Query history.
 - More context menu shortcuts.
 - More keyboard shortcuts.
 - Query logs console.
-- Fake data filler.
 - Import/export and migration.
-- Themes.
+- Light theme.
+
+## Troubleshooting
+
+### **Linux**
+
+With KDE may need necessary installation of the additional `gnome-keyring` package.  
+Depending on your distribution, you will need to run the following command:
+
+- Debian/Ubuntu: `sudo apt-get install gnome-keyring`
+- Red Hat-based: `sudo yum install gnome-keyring`
+- Arch Linux: `sudo pacman -S gnome-keyring`
 
 ## Currently supported
 
@@ -63,8 +74,8 @@ This is a roadmap with major features will come in near future.
 
 - [x] MySQL/MariaDB
 - [ ] PostgreSQL
-- [ ] MSSQL
 - [ ] SQLite
+- [ ] MSSQL
 - [ ] OracleDB
 - [ ] More...
 
@@ -74,7 +85,7 @@ This is a roadmap with major features will come in near future.
 
 - [x] Windows
 - [x] Linux
-- [x] MacOS (needs tests)
+- [x] MacOS (i need feedbacks)
 
 #### • ARM
 
@@ -84,6 +95,11 @@ This is a roadmap with major features will come in near future.
 
 ## Translations
 
-[Giuseppe Gigliotti](https://github.com/ReverbOD) / [Italian Translation](https://github.com/Fabio286/antares/pull/20)  
-[Mohd-PH](https://github.com/Mohd-PH) / [Arabic Translation](https://github.com/Fabio286/antares/pull/29)  
-[hongkfui](https://github.com/hongkfui) / [Spanish Translation](https://github.com/Fabio286/antares/pull/32)
+**Italian Translation** (46%) / [Giuseppe Gigliotti](https://github.com/ReverbOD) [[#20](https://github.com/Fabio286/antares/pull/20)]  
+**Arabic Translation** (45%) / [Mohd-PH](https://github.com/Mohd-PH) [[#29](https://github.com/Fabio286/antares/pull/29)]  
+**Spanish Translation** (46%) / [hongkfui](https://github.com/hongkfui) [[#32](https://github.com/Fabio286/antares/pull/32)]  
+**French Translation** (100%) / [MrAnyx](https://github.com/MrAnyx) [[#44](https://github.com/Fabio286/antares/pull/44)]
+
+## Reviews
+
+<a target="_blank" href="https://www.softx64.com/windows/antares-sql-client.html" title="Antares SQL Client review"><img src="https://www.softx64.com/softx64-review.png" alt="Antares SQL Client review" /></a>

package.json

@@ -1,7 +1,7 @@
 {
   "name": "antares",
   "productName": "Antares",
-  "version": "0.0.12",
+  "version": "0.0.18",
   "description": "A cross-platform easy to use SQL client.",
   "license": "MIT",
   "repository": "https://github.com/Fabio286/antares.git",
@@ -39,6 +39,10 @@
         "AppImage"
       ],
       "category": "Development"
+    },
+    "appImage": {
+      "license": "./LICENSE",
+      "category": "Development"
     }
   },
   "electronWebpack": {
@@ -47,47 +51,46 @@
     }
   },
   "dependencies": {
-    "@mdi/font": "^5.8.55",
+    "@mdi/font": "^5.9.55",
     "ace-builds": "^1.4.12",
     "electron-log": "^4.3.0",
-    "electron-store": "^6.0.1",
+    "electron-store": "^7.0.0",
     "electron-updater": "^4.3.5",
+    "faker": "^5.3.1",
     "keytar": "^7.3.0",
-    "lodash": "^4.17.20",
     "moment": "^2.29.1",
     "mssql": "^6.2.3",
     "mysql": "^2.18.1",
     "pg": "^8.5.1",
     "source-map-support": "^0.5.16",
     "spectre.css": "^0.5.9",
-    "vue-i18n": "^8.22.2",
+    "vue-i18n": "^8.22.4",
     "vue-the-mask": "^0.11.1",
     "vuedraggable": "^2.24.3",
-    "vuex": "^3.6.0",
-    "vuex-persist": "^3.1.3"
+    "vuex": "^3.6.0"
   },
   "devDependencies": {
     "babel-eslint": "^10.1.0",
     "cross-env": "^7.0.2",
-    "electron": "^11.0.2",
+    "electron": "^11.3.0",
     "electron-builder": "^22.9.1",
     "electron-devtools-installer": "^3.1.1",
     "electron-webpack": "^2.8.2",
     "electron-webpack-vue": "^2.4.0",
-    "eslint": "^7.14.0",
+    "eslint": "^7.20.0",
     "eslint-config-standard": "^16.0.2",
     "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-promise": "^4.2.1",
-    "eslint-plugin-vue": "^7.1.0",
+    "eslint-plugin-promise": "^4.3.1",
+    "eslint-plugin-vue": "^7.6.0",
     "node-sass": "^5.0.0",
-    "sass-loader": "^10.1.0",
-    "standard-version": "^9.0.0",
-    "stylelint": "^13.8.0",
+    "sass-loader": "^10.1.1",
+    "standard-version": "^9.1.0",
+    "stylelint": "^13.9.0",
     "stylelint-config-standard": "^20.0.0",
-    "stylelint-scss": "^3.18.0",
+    "stylelint-scss": "^3.19.0",
     "vue": "^2.6.12",
     "vue-template-compiler": "^2.6.12",
-    "webpack": "^4.44.2"
+    "webpack": "^4.46.0"
   }
 }

src/common/FakerMethods.js

@@ -0,0 +1,217 @@
+export default class {
+   static get _methods () {
+      return [
+         { name: 'zipCode', group: 'address', types: ['string'] },
+         { name: 'zipCodeByState', group: 'address', types: ['string'] },
+         { name: 'city', group: 'address', types: ['string'] },
+         { name: 'cityPrefix', group: 'address', types: ['string'] },
+         { name: 'citySuffix', group: 'address', types: ['string'] },
+         { name: 'streetName', group: 'address', types: ['string'] },
+         { name: 'streetAddress', group: 'address', types: ['string'] },
+         { name: 'streetSuffix', group: 'address', types: ['string'] },
+         { name: 'streetPrefix', group: 'address', types: ['string'] },
+         { name: 'secondaryAddress', group: 'address', types: ['string'] },
+         { name: 'county', group: 'address', types: ['string'] },
+         { name: 'country', group: 'address', types: ['string'] },
+         { name: 'countryCode', group: 'address', types: ['string'] },
+         { name: 'state', group: 'address', types: ['string'] },
+         { name: 'stateAbbr', group: 'address', types: ['string'] },
+         { name: 'latitude', group: 'address', types: ['string'] },
+         { name: 'longitude', group: 'address', types: ['string'] },
+         { name: 'direction', group: 'address', types: ['string'] },
+         { name: 'cardinalDirection', group: 'address', types: ['string'] },
+         { name: 'ordinalDirection', group: 'address', types: ['string'] },
+         // { name: 'nearbyGPSCoordinate', group: 'address', types: ['string'] },
+         { name: 'timeZone', group: 'address', types: ['string'] },
+
+         { name: 'color', group: 'commerce', types: ['string'] },
+         { name: 'department', group: 'commerce', types: ['string'] },
+         { name: 'productName', group: 'commerce', types: ['string'] },
+         { name: 'price', group: 'commerce', types: ['string', 'float'] },
+         { name: 'productAdjective', group: 'commerce', types: ['string'] },
+         { name: 'productMaterial', group: 'commerce', types: ['string'] },
+         { name: 'product', group: 'commerce', types: ['string'] },
+         { name: 'productDescription', group: 'commerce', types: ['string'] },
+
+         { name: 'suffixes', group: 'company', types: ['string'] },
+         { name: 'companyName', group: 'company', types: ['string'] },
+         { name: 'companySuffix', group: 'company', types: ['string'] },
+         { name: 'catchPhrase', group: 'company', types: ['string'] },
+         { name: 'bs', group: 'company', types: ['string'] },
+         { name: 'catchPhraseAdjective', group: 'company', types: ['string'] },
+         { name: 'catchPhraseDescriptor', group: 'company', types: ['string'] },
+         { name: 'catchPhraseNoun', group: 'company', types: ['string'] },
+         { name: 'bsAdjective', group: 'company', types: ['string'] },
+         { name: 'bsBuzz', group: 'company', types: ['string'] },
+         { name: 'bsNoun', group: 'company', types: ['string'] },
+
+         { name: 'column', group: 'database', types: ['string'] },
+         { name: 'type', group: 'database', types: ['string'] },
+         { name: 'collation', group: 'database', types: ['string'] },
+         { name: 'engine', group: 'database', types: ['string'] },
+
+         { name: 'past', group: 'date', types: ['string', 'datetime'] },
+         { name: 'future', group: 'date', types: ['string', 'datetime'] },
+         // { name: 'between', group: 'date', types: ['string'] },
+         { name: 'recent', group: 'date', types: ['string', 'datetime'] },
+         { name: 'soon', group: 'date', types: ['string', 'datetime'] },
+         { name: 'month', group: 'date', types: ['string'] },
+         { name: 'weekday', group: 'date', types: ['string'] },
+
+         { name: 'account', group: 'finance', types: ['string', 'number'] },
+         { name: 'accountName', group: 'finance', types: ['string'] },
+         { name: 'routingNumber', group: 'finance', types: ['string', 'number'] },
+         { name: 'mask', group: 'finance', types: ['string', 'number'] },
+         { name: 'amount', group: 'finance', types: ['string', 'float'] },
+         { name: 'transactionType', group: 'finance', types: ['string'] },
+         { name: 'currencyCode', group: 'finance', types: ['string'] },
+         { name: 'currencyName', group: 'finance', types: ['string'] },
+         { name: 'currencySymbol', group: 'finance', types: ['string'] },
+         { name: 'bitcoinAddress', group: 'finance', types: ['string'] },
+         { name: 'litecoinAddress', group: 'finance', types: ['string'] },
+         { name: 'creditCardNumber', group: 'finance', types: ['string'] },
+         { name: 'creditCardCVV', group: 'finance', types: ['string', 'number'] },
+         { name: 'ethereumAddress', group: 'finance', types: ['string'] },
+         { name: 'iban', group: 'finance', types: ['string'] },
+         { name: 'bic', group: 'finance', types: ['string'] },
+         { name: 'transactionDescription', group: 'finance', types: ['string'] },
+
+         { name: 'branch', group: 'git', types: ['string'] },
+         { name: 'commitEntry', group: 'git', types: ['string'] },
+         { name: 'commitMessage', group: 'git', types: ['string'] },
+         { name: 'commitSha', group: 'git', types: ['string'] },
+         { name: 'shortSha', group: 'git', types: ['string'] },
+
+         { name: 'abbreviation', group: 'hacker', types: ['string'] },
+         { name: 'adjective', group: 'hacker', types: ['string'] },
+         { name: 'noun', group: 'hacker', types: ['string'] },
+         { name: 'verb', group: 'hacker', types: ['string'] },
+         { name: 'ingverb', group: 'hacker', types: ['string'] },
+         { name: 'phrase', group: 'hacker', types: ['string'] },
+
+         // { name: 'avatar', group: 'internet', types: ['string'] },
+         { name: 'email', group: 'internet', types: ['string'] },
+         { name: 'exampleEmail', group: 'internet', types: ['string'] },
+         { name: 'userName', group: 'internet', types: ['string'] },
+         { name: 'protocol', group: 'internet', types: ['string'] },
+         { name: 'url', group: 'internet', types: ['string'] },
+         { name: 'domainName', group: 'internet', types: ['string'] },
+         { name: 'domainSuffix', group: 'internet', types: ['string'] },
+         { name: 'domainWord', group: 'internet', types: ['string'] },
+         { name: 'ip', group: 'internet', types: ['string'] },
+         { name: 'ipv6', group: 'internet', types: ['string'] },
+         { name: 'userAgent', group: 'internet', types: ['string'] },
+         { name: 'color', group: 'internet', types: ['string'] },
+         { name: 'mac', group: 'internet', types: ['string'] },
+         { name: 'password', group: 'internet', types: ['string'] },
+
+         { name: 'word', group: 'lorem', types: ['string'] },
+         { name: 'words', group: 'lorem', types: ['string'] },
+         { name: 'sentence', group: 'lorem', types: ['string'] },
+         { name: 'slug', group: 'lorem', types: ['string'] },
+         { name: 'sentences', group: 'lorem', types: ['string'] },
+         { name: 'paragraph', group: 'lorem', types: ['string'] },
+         { name: 'paragraphs', group: 'lorem', types: ['string'] },
+         { name: 'text', group: 'lorem', types: ['string'] },
+         { name: 'lines', group: 'lorem', types: ['string'] },
+
+         { name: 'genre', group: 'music', types: ['string'] },
+
+         { name: 'firstName', group: 'name', types: ['string'] },
+         { name: 'lastName', group: 'name', types: ['string'] },
+         { name: 'middleName', group: 'name', types: ['string'] },
+         { name: 'findName', group: 'name', types: ['string'] },
+         { name: 'jobTitle', group: 'name', types: ['string'] },
+         { name: 'gender', group: 'name', types: ['string'] },
+         { name: 'prefix', group: 'name', types: ['string'] },
+         { name: 'suffix', group: 'name', types: ['string'] },
+         { name: 'title', group: 'name', types: ['string'] },
+         { name: 'jobDescriptor', group: 'name', types: ['string'] },
+         { name: 'jobArea', group: 'name', types: ['string'] },
+         { name: 'jobType', group: 'name', types: ['string'] },
+
+         { name: 'phoneNumber', group: 'phone', types: ['string'] },
+         { name: 'phoneNumberFormat', group: 'phone', types: ['string'] },
+         { name: 'phoneFormats', group: 'phone', types: ['string'] },
+
+         { name: 'number', group: 'random', types: ['string', 'number'], params: ['min', 'max'] },
+         { name: 'float', group: 'random', types: ['string', 'float'], params: ['min', 'max'] },
+         { name: 'arrayElement', group: 'random', types: ['string'] },
+         { name: 'arrayElements', group: 'random', types: ['string'] },
+         { name: 'objectElement', group: 'random', types: ['string'] },
+         { name: 'uuid', group: 'random', types: ['string'] },
+         { name: 'boolean', group: 'random', types: ['string'] },
+         { name: 'word', group: 'random', types: ['string'] },
+         { name: 'words', group: 'random', types: ['string'] },
+         // { name: 'image', group: 'random', types: ['string'] },
+         { name: 'locale', group: 'random', types: ['string'] },
+         { name: 'alpha', group: 'random', types: ['string'] },
+         { name: 'alphaNumeric', group: 'random', types: ['string'] },
+         { name: 'hexaDecimal', group: 'random', types: ['string'] },
+
+         { name: 'fileName', group: 'system', types: ['string'] },
+         { name: 'commonFileName', group: 'system', types: ['string'] },
+         { name: 'mimeType', group: 'system', types: ['string'] },
+         { name: 'commonFileType', group: 'system', types: ['string'] },
+         { name: 'commonFileExt', group: 'system', types: ['string'] },
+         { name: 'fileType', group: 'system', types: ['string'] },
+         { name: 'fileExt', group: 'system', types: ['string'] },
+         { name: 'directoryPath', group: 'system', types: ['string'] },
+         { name: 'filePath', group: 'system', types: ['string'] },
+         { name: 'semver', group: 'system', types: ['string'] },
+
+         { name: 'recent', group: 'time', types: ['string', 'time'] },
+
+         { name: 'vehicle', group: 'vehicle', types: ['string'] },
+         { name: 'manufacturer', group: 'vehicle', types: ['string'] },
+         { name: 'model', group: 'vehicle', types: ['string'] },
+         { name: 'type', group: 'vehicle', types: ['string'] },
+         { name: 'fuel', group: 'vehicle', types: ['string'] },
+         { name: 'vin', group: 'vehicle', types: ['string'] },
+         { name: 'color', group: 'vehicle', types: ['string'] }
+      ];
+   }
+
+   static getGroups () {
+      const groupsObj = this._methods.reduce((acc, curr) => {
+         if (curr.group in acc)
+            curr.types.forEach(type => acc[curr.group].add(type));
+         else
+            acc[curr.group] = new Set(curr.types);
+
+         return acc;
+      }, {});
+
+      const groupsArr = [];
+
+      for (const key in groupsObj)
+         groupsArr.push({ name: key, types: [...groupsObj[key]] });
+
+      return groupsArr.sort((a, b) => {
+         if (a.name < b.name)
+            return -1;
+
+         if (b.name > a.name)
+            return 1;
+
+         return 0;
+      }); ;
+   }
+
+   static getGroupsByType (type) {
+      if (!type) return [];
+      return this.getGroups().filter(group => group.types.includes(type));
+   }
+
+   static getMethods ({ type, group }) {
+      return this._methods.filter(method => method.group === group && method.types.includes(type)).sort((a, b) => {
+         if (a.name < b.name)
+            return -1;
+
+         if (b.name > a.name)
+            return 1;
+
+         return 0;
+      });
+   }
+}

src/common/data-types/mysql.js

@@ -91,7 +91,7 @@ module.exports = [
          },
          {
             name: 'TINYTEXT',
-            length: true,
+            length: false,
             collation: true,
             unsigned: false,
             zerofill: false
@@ -119,7 +119,7 @@ module.exports = [
          },
          {
             name: 'JSON',
-            length: true,
+            length: false,
             collation: true,
             unsigned: false,
             zerofill: false
@@ -279,7 +279,7 @@ module.exports = [
       types: [
          {
             name: 'UNKNOWN',
-            length: true,
+            length: false,
             collation: false,
             unsigned: false,
             zerofill: false

src/common/db-properties/mysql.js

@@ -0,0 +1 @@
+module.exports = [];

src/common/fieldTypes.js

@@ -1,12 +1,13 @@
 export const TEXT = ['CHAR', 'VARCHAR'];
-export const LONG_TEXT = ['TEXT', 'MEDIUMTEXT', 'longtext'];
+export const LONG_TEXT = ['TEXT', 'MEDIUMTEXT', 'LONGTEXT'];
 
-export const NUMBER = ['INT', 'TINYINT', 'SMALLINT', 'MEDIUMINT', 'BIGINT', 'FLOAT', 'DOUBLE', 'DECIMAL', 'BOOL'];
+export const NUMBER = ['INT', 'TINYINT', 'SMALLINT', 'MEDIUMINT', 'BIGINT', 'DECIMAL', 'BOOL'];
+export const FLOAT = ['FLOAT', 'DOUBLE'];
 
 export const DATE = ['DATE'];
 export const TIME = ['TIME'];
 export const DATETIME = ['DATETIME', 'TIMESTAMP'];
 
-export const BLOB = ['BLOB', 'MEDIUMBLOB', 'LONGBLOB'];
+export const BLOB = ['BLOB', 'TINYBLOB', 'MEDIUMBLOB', 'LONGBLOB'];
 
 export const BIT = ['BIT'];

src/main/index.js

@@ -5,8 +5,12 @@ import * as path from 'path';
 import crypto from 'crypto';
 import { format as formatUrl } from 'url';
 import keytar from 'keytar';
+import Store from 'electron-store';
+
 import ipcHandlers from './ipc-handlers';
 
+Store.initRenderer();
+
 const isDevelopment = process.env.NODE_ENV !== 'production';
 const gotTheLock = app.requestSingleInstanceLock();
 

src/main/ipc-handlers/connection.js

@@ -1,17 +1,28 @@
-
+import fs from 'fs';
 import { ipcMain } from 'electron';
 import { ClientsFactory } from '../libs/ClientsFactory';
 
 export default connections => {
    ipcMain.handle('test-connection', async (event, conn) => {
+      const params = {
+         host: conn.host,
+         port: +conn.port,
+         user: conn.user,
+         password: conn.password
+      };
+
+      if (conn.ssl) {
+         params.ssl = {
+            key: conn.key ? fs.readFileSync(conn.key) : null,
+            cert: conn.cert ? fs.readFileSync(conn.cert) : null,
+            ca: conn.ca ? fs.readFileSync(conn.ca) : null,
+            ciphers: conn.ciphers
+         };
+      }
+
       const connection = ClientsFactory.getConnection({
          client: conn.client,
-         params: {
-            host: conn.host,
-            port: +conn.port,
-            user: conn.user,
-            password: conn.password
-         }
+         params
       });
 
       await connection.connect();
@@ -32,21 +43,32 @@ export default connections => {
    });
 
    ipcMain.handle('connect', async (event, conn) => {
+      const params = {
+         host: conn.host,
+         port: +conn.port,
+         user: conn.user,
+         password: conn.password
+      };
+
+      if (conn.ssl) {
+         params.ssl = {
+            key: conn.key ? fs.readFileSync(conn.key) : null,
+            cert: conn.cert ? fs.readFileSync(conn.cert) : null,
+            ca: conn.ca ? fs.readFileSync(conn.ca) : null,
+            ciphers: conn.ciphers
+         };
+      }
+
       const connection = ClientsFactory.getConnection({
          client: conn.client,
-         params: {
-            host: conn.host,
-            port: +conn.port,
-            user: conn.user,
-            password: conn.password
-         },
+         params,
          poolSize: 1
       });
 
       try {
          await connection.connect();
 
-         const structure = await connection.getStructure();
+         const structure = await connection.getStructure(new Set());
 
          connections[conn.uid] = connection;
 

src/main/ipc-handlers/database.js

@@ -50,9 +50,9 @@ export default connections => {
       }
    });
 
-   ipcMain.handle('get-structure', async (event, uid) => {
+   ipcMain.handle('get-structure', async (event, params) => {
       try {
-         const structure = await connections[uid].getStructure();
+         const structure = await connections[params.uid].getStructure(params.schemas);
 
          return { status: 'success', response: structure };
       }
@@ -94,6 +94,17 @@ export default connections => {
       }
    });
 
+   ipcMain.handle('get-version', async (event, uid) => {
+      try {
+         const result = await connections[uid].getVersion();
+
+         return { status: 'success', response: result };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
    ipcMain.handle('use-schema', async (event, { uid, schema }) => {
       if (!schema) return;
 

src/main/ipc-handlers/functions.js

@@ -0,0 +1,43 @@
+import { ipcMain } from 'electron';
+
+export default (connections) => {
+   ipcMain.handle('get-function-informations', async (event, params) => {
+      try {
+         const result = await connections[params.uid].getFunctionInformations(params);
+         return { status: 'success', response: result };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('drop-function', async (event, params) => {
+      try {
+         await connections[params.uid].dropFunction(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('alter-function', async (event, params) => {
+      try {
+         await connections[params.uid].alterFunction(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('create-function', async (event, params) => {
+      try {
+         await connections[params.uid].createFunction(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+};

src/main/ipc-handlers/index.js

@@ -1,15 +1,27 @@
 import connection from './connection';
 import tables from './tables';
+import views from './views';
+import triggers from './triggers';
+import routines from './routines';
+import functions from './functions';
+import schedulers from './schedulers';
 import updates from './updates';
 import application from './application';
 import database from './database';
+import users from './users';
 
 const connections = {};
 
 export default () => {
    connection(connections);
    tables(connections);
+   views(connections);
+   triggers(connections);
+   routines(connections);
+   functions(connections);
+   schedulers(connections);
    database(connections);
+   users(connections);
    updates();
    application();
 };

src/main/ipc-handlers/routines.js

@@ -0,0 +1,43 @@
+import { ipcMain } from 'electron';
+
+export default (connections) => {
+   ipcMain.handle('get-routine-informations', async (event, params) => {
+      try {
+         const result = await connections[params.uid].getRoutineInformations(params);
+         return { status: 'success', response: result };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('drop-routine', async (event, params) => {
+      try {
+         await connections[params.uid].dropRoutine(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('alter-routine', async (event, params) => {
+      try {
+         await connections[params.uid].alterRoutine(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('create-routine', async (event, params) => {
+      try {
+         await connections[params.uid].createRoutine(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+};

src/main/ipc-handlers/schedulers.js

@@ -0,0 +1,43 @@
+import { ipcMain } from 'electron';
+
+export default (connections) => {
+   ipcMain.handle('get-scheduler-informations', async (event, params) => {
+      try {
+         const result = await connections[params.uid].getEventInformations(params);
+         return { status: 'success', response: result };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('drop-scheduler', async (event, params) => {
+      try {
+         await connections[params.uid].dropEvent(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('alter-scheduler', async (event, params) => {
+      try {
+         await connections[params.uid].alterEvent(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('create-scheduler', async (event, params) => {
+      try {
+         await connections[params.uid].createEvent(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+};

src/main/ipc-handlers/tables.js

@@ -1,6 +1,8 @@
 import { ipcMain } from 'electron';
+import faker from 'faker';
+import moment from 'moment';
 import { sqlEscaper } from 'common/libs/sqlEscaper';
-import { TEXT, LONG_TEXT, NUMBER, BLOB } from 'common/fieldTypes';
+import { TEXT, LONG_TEXT, NUMBER, FLOAT, BLOB, BIT, DATE, DATETIME } from 'common/fieldTypes';
 import fs from 'fs';
 
 export default (connections) => {
@@ -62,7 +64,7 @@ export default (connections) => {
          let reload = false;
          const id = typeof params.id === 'number' ? params.id : `"${params.id}"`;
 
-         if (NUMBER.includes(params.type))
+         if ([...NUMBER, ...FLOAT].includes(params.type))
             escapedParam = params.content;
          else if ([...TEXT, ...LONG_TEXT].includes(params.type))
             escapedParam = `"${sqlEscaper(params.content)}"`;
@@ -75,15 +77,40 @@ export default (connections) => {
             else
                escapedParam = '""';
          }
+         else if ([...BIT].includes(params.type)) {
+            escapedParam = `b'${sqlEscaper(params.content)}'`;
+            reload = true;
+         }
          else
             escapedParam = `"${sqlEscaper(params.content)}"`;
 
-         await connections[params.uid]
-            .update({ [params.field]: `= ${escapedParam}` })
-            .schema(params.schema)
-            .from(params.table)
-            .where({ [params.primary]: `= ${id}` })
-            .run();
+         if (params.primary) {
+            await connections[params.uid]
+               .update({ [params.field]: `= ${escapedParam}` })
+               .schema(params.schema)
+               .from(params.table)
+               .where({ [params.primary]: `= ${id}` })
+               .run();
+         }
+         else {
+            const { row } = params;
+            reload = true;
+
+            for (const key in row) {
+               if (typeof row[key] === 'string')
+                  row[key] = `'${row[key]}'`;
+
+               row[key] = `= ${row[key]}`;
+            }
+
+            await connections[params.uid]
+               .schema(params.schema)
+               .update({ [params.field]: `= ${escapedParam}` })
+               .from(params.table)
+               .where(row)
+               .limit(1)
+               .run();
+         }
 
          return { status: 'success', response: { reload } };
       }
@@ -93,24 +120,47 @@ export default (connections) => {
    });
 
    ipcMain.handle('delete-table-rows', async (event, params) => {
-      let idString;
+      if (params.primary) {
+         const idString = params.rows.map(row => typeof row[params.primary] === 'string'
+            ? `"${row[params.primary]}"`
+            : row[params.primary]).join(',');
 
-      if (typeof params.rows[0] === 'string')
-         idString = params.rows.map(row => `"${row}"`).join(',');
-      else
-         idString = params.rows.join(',');
+         try {
+            const result = await connections[params.uid]
+               .schema(params.schema)
+               .delete(params.table)
+               .where({ [params.primary]: `IN (${idString})` })
+               .run();
 
-      try {
-         const result = await connections[params.uid]
-            .schema(params.schema)
-            .delete(params.table)
-            .where({ [params.primary]: `IN (${idString})` })
-            .run();
-
-         return { status: 'success', response: result };
+            return { status: 'success', response: result };
+         }
+         catch (err) {
+            return { status: 'error', response: err.toString() };
+         }
       }
-      catch (err) {
-         return { status: 'error', response: err.toString() };
+      else {
+         try {
+            for (const row of params.rows) {
+               for (const key in row) {
+                  if (typeof row[key] === 'string')
+                     row[key] = `'${row[key]}'`;
+
+                  row[key] = `= ${row[key]}`;
+               }
+
+               await connections[params.uid]
+                  .schema(params.schema)
+                  .delete(params.table)
+                  .where(row)
+                  .limit(1)
+                  .run();
+            }
+
+            return { status: 'success', response: [] };
+         }
+         catch (err) {
+            return { status: 'error', response: err.toString() };
+         }
       }
    });
 
@@ -123,7 +173,7 @@ export default (connections) => {
 
             if (params.row[key] === null)
                escapedParam = 'NULL';
-            else if (NUMBER.includes(type))
+            else if ([...NUMBER, ...FLOAT].includes(type))
                escapedParam = params.row[key];
             else if ([...TEXT, ...LONG_TEXT].includes(type))
                escapedParam = `"${sqlEscaper(params.row[key])}"`;
@@ -141,14 +191,92 @@ export default (connections) => {
             insertObj[key] = escapedParam;
          }
 
-         for (let i = 0; i < params.repeat; i++) {
-            await connections[params.uid]
-               .schema(params.schema)
-               .into(params.table)
-               .insert(insertObj)
-               .run();
+         const rows = new Array(+params.repeat).fill(insertObj);
+
+         await connections[params.uid]
+            .schema(params.schema)
+            .into(params.table)
+            .insert(rows)
+            .run();
+
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('insert-table-fake-rows', async (event, params) => {
+      try {
+         const rows = [];
+
+         for (let i = 0; i < +params.repeat; i++) {
+            const insertObj = {};
+
+            for (const key in params.row) {
+               const type = params.fields[key];
+               let escapedParam;
+
+               if (!('group' in params.row[key]) || params.row[key].group === 'manual') { // Manual value
+                  if (params.row[key].value === null || params.row[key].value === undefined)
+                     escapedParam = 'NULL';
+                  else if ([...NUMBER, ...FLOAT].includes(type))
+                     escapedParam = params.row[key].value;
+                  else if ([...TEXT, ...LONG_TEXT].includes(type))
+                     escapedParam = `"${sqlEscaper(params.row[key].value)}"`;
+                  else if (BLOB.includes(type)) {
+                     if (params.row[key].value) {
+                        const fileBlob = fs.readFileSync(params.row[key].value);
+                        escapedParam = `0x${fileBlob.toString('hex')}`;
+                     }
+                     else
+                        escapedParam = '""';
+                  }
+                  else if (BIT.includes(type))
+                     escapedParam = `b'${sqlEscaper(params.row[key].value)}'`;
+                  else
+                     escapedParam = `"${sqlEscaper(params.row[key].value)}"`;
+
+                  insertObj[key] = escapedParam;
+               }
+               else { // Faker value
+                  const parsedParams = {};
+                  let fakeValue;
+
+                  if (params.locale)
+                     faker.locale = params.locale;
+
+                  if (Object.keys(params.row[key].params).length) {
+                     Object.keys(params.row[key].params).forEach(param => {
+                        if (!isNaN(params.row[key].params[param]))
+                           parsedParams[param] = +params.row[key].params[param];
+                     });
+                     fakeValue = faker[params.row[key].group][params.row[key].method](parsedParams);
+                  }
+                  else
+                     fakeValue = faker[params.row[key].group][params.row[key].method]();
+
+                  if (typeof fakeValue === 'string') {
+                     if (params.row[key].length)
+                        fakeValue = fakeValue.substr(0, params.row[key].length);
+                     fakeValue = `"${sqlEscaper(fakeValue)}"`;
+                  }
+                  else if ([...DATE, ...DATETIME].includes(type))
+                     fakeValue = `"${moment(fakeValue).format('YYYY-MM-DD HH:mm:ss.SSSSSS')}"`;
+
+                  insertObj[key] = fakeValue;
+               }
+            }
+
+            rows.push(insertObj);
          }
 
+         await connections[params.uid]
+            .schema(params.schema)
+            .into(params.table)
+            .insert(rows)
+            .run();
+
          return { status: 'success' };
       }
       catch (err) {

src/main/ipc-handlers/triggers.js

@@ -0,0 +1,43 @@
+import { ipcMain } from 'electron';
+
+export default (connections) => {
+   ipcMain.handle('get-trigger-informations', async (event, params) => {
+      try {
+         const result = await connections[params.uid].getTriggerInformations(params);
+         return { status: 'success', response: result };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('drop-trigger', async (event, params) => {
+      try {
+         await connections[params.uid].dropTrigger(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('alter-trigger', async (event, params) => {
+      try {
+         await connections[params.uid].alterTrigger(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('create-trigger', async (event, params) => {
+      try {
+         await connections[params.uid].createTrigger(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+};

src/main/ipc-handlers/users.js

@@ -0,0 +1,15 @@
+import { ipcMain } from 'electron';
+
+export default (connections) => {
+   ipcMain.handle('get-users', async (event, uid) => {
+      try {
+         const result = await connections[uid].getUsers();
+         return { status: 'success', response: result };
+      }
+      catch (err) {
+         if (err.code === 'ER_TABLEACCESS_DENIED_ERROR')
+            return { status: 'success', response: [] };
+         return { status: 'error', response: err.toString() };
+      }
+   });
+};

src/main/ipc-handlers/views.js

@@ -0,0 +1,43 @@
+import { ipcMain } from 'electron';
+
+export default (connections) => {
+   ipcMain.handle('get-view-informations', async (event, params) => {
+      try {
+         const result = await connections[params.uid].getViewInformations(params);
+         return { status: 'success', response: result };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('drop-view', async (event, params) => {
+      try {
+         await connections[params.uid].dropView(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('alter-view', async (event, params) => {
+      try {
+         await connections[params.uid].alterView(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+
+   ipcMain.handle('create-view', async (event, params) => {
+      try {
+         await connections[params.uid].createView(params);
+         return { status: 'success' };
+      }
+      catch (err) {
+         return { status: 'error', response: err.toString() };
+      }
+   });
+};

src/main/libs/AntaresCore.js

@@ -28,7 +28,7 @@ export class AntaresCore {
          limit: [],
          join: [],
          update: [],
-         insert: {},
+         insert: [],
          delete: false
       };
       this._query = Object.assign({}, this._queryDefaults);
@@ -120,12 +120,12 @@ export class AntaresCore {
    }
 
    /**
-    * @param {Object} obj field: value
+    * @param {Array} arr Array of row objects
     * @returns
     * @memberof AntaresCore
     */
-   insert (obj) {
-      this._query.insert = { ...this._query.insert, ...obj };
+   insert (arr) {
+      this._query.insert = [...this._query.insert, ...arr];
       return this;
    }
 

src/renderer/App.vue

@@ -24,7 +24,7 @@
 
 <script>
 import { mapActions, mapGetters } from 'vuex';
-import { ipcRenderer } from 'electron';
+import { ipcRenderer, remote } from 'electron';
 
 export default {
    name: 'App',
@@ -54,6 +54,45 @@ export default {
    },
    mounted () {
       ipcRenderer.send('check-for-updates');
+
+      const Menu = remote.Menu;
+
+      const InputMenu = Menu.buildFromTemplate([
+         {
+            label: this.$t('word.cut'),
+            role: 'cut'
+         },
+         {
+            label: this.$t('word.copy'),
+            role: 'copy'
+         },
+         {
+            label: this.$t('word.paste'),
+            role: 'paste'
+         },
+         {
+            type: 'separator'
+         },
+         {
+            label: this.$t('message.selectAll'),
+            role: 'selectall'
+         }
+      ]);
+
+      document.body.addEventListener('contextmenu', (e) => {
+         e.preventDefault();
+         e.stopPropagation();
+
+         let node = e.target;
+
+         while (node) {
+            if (node.nodeName.match(/^(input|textarea)$/i) || node.isContentEditable) {
+               InputMenu.popup(remote.getCurrentWindow());
+               break;
+            }
+            node = node.parentNode;
+         }
+      });
    },
    methods: {
       ...mapActions({

src/renderer/components/BaseConfirmModal.vue

@@ -24,7 +24,7 @@
                <slot name="body" />
             </div>
          </div>
-         <div class="modal-footer">
+         <div class="modal-footer pt-0">
             <button
                class="btn btn-primary mr-2"
                @click.stop="confirmModal"

src/renderer/components/BaseContextMenu.vue

@@ -69,75 +69,81 @@ export default {
 </script>
 
 <style lang="scss">
-  .context {
+.context {
+  display: flex;
+  color: $body-font-color;
+  font-size: 16px;
+  z-index: 400;
+  justify-content: center;
+  align-items: center;
+  overflow: hidden;
+  position: fixed;
+  height: 100vh;
+  right: 0;
+  top: 0;
+  left: 0;
+  bottom: 0;
+
+  .context-container {
+    min-width: 100px;
+    z-index: 10;
+    box-shadow: 0 0 2px 0 #000;
+    padding: 0;
+    background: #1d1d1d;
+    border-radius: 0.1rem;
     display: flex;
-    color: $body-font-color;
-    font-size: 16px;
-    z-index: 400;
-    justify-content: center;
-    align-items: center;
-    overflow: hidden;
-    position: fixed;
-    height: 100vh;
-    right: 0;
-    top: 0;
-    left: 0;
-    bottom: 0;
+    flex-direction: column;
+    position: absolute;
+    pointer-events: initial;
 
-    .context-container {
-      min-width: 100px;
-      z-index: 10;
-      box-shadow: 0 0 2px 0 #000;
-      padding: 0;
-      background: #1d1d1d;
-      border-radius: 0.1rem;
+    .context-element {
       display: flex;
-      flex-direction: column;
-      position: absolute;
-      pointer-events: initial;
+      align-items: center;
+      padding: 0.1rem 0.3rem;
+      cursor: pointer;
+      justify-content: space-between;
+      position: relative;
 
-      .context-element {
-        display: flex;
-        align-items: center;
-        padding: 0.1rem 0.3rem;
-        cursor: pointer;
-        justify-content: space-between;
-        position: relative;
+      .context-submenu {
+        opacity: 0;
+        visibility: hidden;
+        transition: opacity 0.2s;
+        position: absolute;
+        left: 100%;
+        top: 0;
+        background: #1d1d1d;
+        box-shadow: 0 0 2px 0 #000;
+        min-width: 100px;
+      }
+
+      &:hover {
+        background: $primary-color;
 
         .context-submenu {
-          opacity: 0;
-          visibility: hidden;
-          transition: opacity 0.2s;
-          position: absolute;
-          left: 100%;
-          top: 0;
-          background: #1d1d1d;
-          box-shadow: 0 0 2px 0 #000;
-          min-width: 100px;
-        }
-
-        &:hover {
-          background: $primary-color;
-
-          .context-submenu {
-            display: block;
-            visibility: visible;
-            opacity: 1;
-          }
+          display: block;
+          visibility: visible;
+          opacity: 1;
         }
       }
     }
-
-    .context-overlay {
-      background: transparent;
-      bottom: 0;
-      cursor: default;
-      display: block;
-      left: 0;
-      position: absolute;
-      right: 0;
-      top: 0;
-    }
   }
 
+  .context-overlay {
+    background: transparent;
+    bottom: 0;
+    cursor: default;
+    display: block;
+    left: 0;
+    position: absolute;
+    right: 0;
+    top: 0;
+  }
+}
+
+.disabled {
+  pointer-events: none;
+  filter: grayscale(100%);
+  opacity: 0.5;
+}
+
 </style>

src/renderer/components/BaseLoader.vue

@@ -0,0 +1,22 @@
+<template>
+   <div class="empty">
+      <div class="loading loading-lg" />
+   </div>
+</template>
+
+<script>
+export default {
+   name: 'BaseLoader'
+};
+</script>
+<style scoped>
+.empty {
+  position: absolute;
+  display: flex;
+  height: 100%;
+  flex-direction: column;
+  left: 0;
+  justify-content: center;
+  right: 0;
+}
+</style>

src/renderer/components/BaseTextEditor.vue

@@ -0,0 +1,129 @@
+<template>
+   <div class="editor-wrapper">
+      <div
+         :id="`editor-${id}`"
+         class="editor"
+         :class="editorClass"
+         :style="{height: `${height}px`}"
+      />
+   </div>
+</template>
+
+<script>
+import * as ace from 'ace-builds';
+import 'ace-builds/webpack-resolver';
+import { mapGetters } from 'vuex';
+
+export default {
+   name: 'BaseTextEditor',
+   props: {
+      value: String,
+      mode: { type: String, default: 'text' },
+      editorClass: { type: String, default: '' },
+      autoFocus: { type: Boolean, default: false },
+      readOnly: { type: Boolean, default: false },
+      height: { type: Number, default: 200 }
+   },
+   data () {
+      return {
+         editor: null,
+         id: null
+      };
+   },
+   computed: {
+      ...mapGetters({
+         editorTheme: 'settings/getEditorTheme',
+         autoComplete: 'settings/getAutoComplete',
+         lineWrap: 'settings/getLineWrap'
+      })
+   },
+   watch: {
+      mode () {
+         if (this.editor)
+            this.editor.session.setMode(`ace/mode/${this.mode}`);
+      },
+      editorTheme () {
+         if (this.editor)
+            this.editor.setTheme(`ace/theme/${this.editorTheme}`);
+      },
+      autoComplete () {
+         if (this.editor) {
+            this.editor.setOptions({
+               enableLiveAutocompletion: this.autoComplete
+            });
+         }
+      },
+      lineWrap () {
+         if (this.editor) {
+            this.editor.setOptions({
+               wrap: this.lineWrap
+            });
+         }
+      }
+   },
+   created () {
+      this.id = this._uid;
+   },
+   mounted () {
+      this.editor = ace.edit(`editor-${this.id}`, {
+         mode: `ace/mode/${this.mode}`,
+         theme: `ace/theme/${this.editorTheme}`,
+         value: this.value,
+         fontSize: '14px',
+         printMargin: false,
+         readOnly: this.readOnly
+      });
+
+      this.editor.setOptions({
+         enableBasicAutocompletion: false,
+         wrap: this.lineWrap,
+         enableSnippets: false,
+         enableLiveAutocompletion: false
+      });
+
+      this.editor.session.on('change', () => {
+         const content = this.editor.getValue();
+         this.$emit('update:value', content);
+      });
+
+      if (this.autoFocus) {
+         setTimeout(() => {
+            this.editor.focus();
+            this.editor.resize();
+         }, 20);
+      }
+
+      setTimeout(() => {
+         this.editor.resize();
+      }, 20);
+   }
+};
+</script>
+
+<style lang="scss" scoped>
+.editor-wrapper {
+  border-bottom: 1px solid #444;
+
+  .editor {
+    width: 100%;
+  }
+}
+
+.ace_.mdi {
+  display: inline-block;
+  width: 17px;
+}
+
+.ace_dark.ace_editor.ace_autocomplete .ace_marker-layer .ace_active-line {
+  background-color: #c9561a99;
+}
+
+.ace_dark.ace_editor.ace_autocomplete .ace_marker-layer .ace_line-hover {
+  background-color: #c9571a33;
+  border: none;
+}
+
+.ace_dark.ace_editor.ace_autocomplete .ace_completion-highlight {
+  color: #e0d00c;
+}
+</style>

src/renderer/components/BaseUploadInput.vue

@@ -0,0 +1,112 @@
+<template>
+   <label :for="`id_${id}`" class="file-uploader">
+      <span class="file-uploader-message">
+         <i class="mdi mdi-folder-open mr-1" />{{ message }}
+      </span>
+      <span class="text-ellipsis file-uploader-value">
+         {{ value | lastPart }}
+      </span>
+      <i
+         v-if="value.length"
+         class="file-uploader-reset mdi mdi-close"
+         @click.prevent="clear"
+      />
+      <form :ref="`form_${id}`">
+         <input
+            :id="`id_${id}`"
+            class="file-uploader-input"
+            type="file"
+            @change="$emit('change', $event)"
+         >
+      </form>
+   </label>
+</template>
+
+<script>
+export default {
+   name: 'BaseUploadInput',
+   filters: {
+      lastPart (string) {
+         if (!string) return '';
+
+         string = string.split(/[/\\]+/).pop();
+         if (string.length >= 19)
+            string = `...${string.slice(-19)}`;
+         return string;
+      }
+   },
+   props: {
+      message: {
+         default: 'Browse',
+         type: String
+      },
+      value: {
+         default: '',
+         type: String
+      }
+   },
+   data () {
+      return {
+         id: null
+      };
+   },
+   mounted () {
+      this.id = this._uid;
+   },
+   methods: {
+      clear () {
+         this.$emit('clear');
+      }
+   }
+};
+</script>
+
+<style lang="scss" scoped>
+.file-uploader {
+  border: 0.05rem solid $bg-color-light;
+  border-radius: 0.1rem;
+  height: 1.8rem;
+  line-height: 1.2rem;
+  display: flex;
+  cursor: pointer;
+  background-color: $bg-color-gray;
+  transition: background 0.2s, border 0.2s, box-shadow 0.2s, color 0.2s;
+  position: relative;
+  flex: 1 1 auto;
+
+  > span {
+    padding: 0.25rem 0.4rem;
+  }
+
+  .file-uploader-message {
+    display: flex;
+    border-right: 0.05rem solid $bg-color-light;
+    background-color: $bg-color;
+  }
+
+  .file-uploader-input {
+    display: none;
+  }
+
+  .file-uploader-value {
+    display: block;
+    width: 100%;
+    padding-right: 1rem;
+  }
+
+  .file-uploader-reset {
+    z-index: 1;
+    position: absolute;
+    right: 5px;
+    top: calc(50% - 8px);
+  }
+}
+
+:disabled {
+  .file-uploader {
+    cursor: not-allowed;
+    background-color: #151515;
+    opacity: 0.5;
+  }
+}
+</style>

src/renderer/components/FakerSelect.vue

@@ -0,0 +1,235 @@
+<template>
+   <fieldset class="input-group mb-0">
+      <select
+         v-model="selectedGroup"
+         class="form-select"
+         :disabled="!isChecked"
+         style="flex-grow: 0;"
+         @change="onChange"
+      >
+         <option value="manual">
+            {{ $t('message.manualValue') }}
+         </option>
+         <option
+            v-for="group in fakerGroups"
+            :key="group.name"
+            :value="group.name"
+         >
+            {{ $t(`faker.${group.name}`) }}
+         </option>
+      </select>
+      <select
+         v-if="selectedGroup !== 'manual'"
+         v-model="selectedMethod"
+         class="form-select"
+         :disabled="!isChecked"
+         @change="onChange"
+      >
+         <option
+            v-for="method in fakerMethods"
+            :key="method.name"
+            :value="method.name"
+         >
+            {{ $t(`faker.${method.name}`) }}
+         </option>
+      </select>
+      <ForeignKeySelect
+         v-else-if="foreignKeys.includes(field.name)"
+         ref="formInput"
+         class="form-select"
+         :value.sync="selectedValue"
+         :key-usage="getKeyUsage(field.name)"
+         :disabled="!isChecked"
+      />
+      <input
+         v-else-if="inputProps().mask"
+         ref="formInput"
+         v-model="selectedValue"
+         v-mask="inputProps().mask"
+         class="form-input"
+         :type="inputProps().type"
+         :disabled="!isChecked"
+      >
+      <BaseUploadInput
+         v-else-if="inputProps().type === 'file'"
+         :value="selectedValue"
+         :message="$t('word.browse')"
+         @clear="clearValue"
+         @change="filesChange($event)"
+      />
+      <input
+         v-else-if="inputProps().type === 'number'"
+         ref="formInput"
+         v-model="selectedValue"
+         class="form-input"
+         step="any"
+         :type="inputProps().type"
+         :disabled="!isChecked"
+      >
+      <input
+         v-else
+         ref="formInput"
+         v-model="selectedValue"
+         class="form-input"
+         :type="inputProps().type"
+         :disabled="!isChecked"
+      >
+      <template v-if="methodData && 'params' in methodData" class="columns">
+         <input
+            v-for="(option, key) in methodData.params"
+            :key="key"
+            v-model="methodParams[option]"
+            class="form-input column"
+            :type="inputProps().type"
+            :disabled="!isChecked"
+            :placeholder="option"
+         >
+      </template>
+      <slot />
+   </fieldset>
+</template>
+
+<script>
+import { mask } from 'vue-the-mask';
+import { TEXT, LONG_TEXT, NUMBER, FLOAT, DATE, TIME, DATETIME, BLOB, BIT } from 'common/fieldTypes';
+import BaseUploadInput from '@/components/BaseUploadInput';
+import ForeignKeySelect from '@/components/ForeignKeySelect';
+import FakerMethods from 'common/FakerMethods';
+
+export default {
+   name: 'FakerSelect',
+   components: {
+      ForeignKeySelect,
+      BaseUploadInput
+   },
+   directives: {
+      mask
+   },
+   props: {
+      type: String,
+      field: Object,
+      isChecked: Boolean,
+      foreignKeys: Array,
+      keyUsage: Array,
+      fieldLength: Number,
+      fieldObj: Object
+   },
+   data () {
+      return {
+         localType: null,
+         selectedGroup: 'manual',
+         selectedMethod: '',
+         selectedValue: '',
+         debounceTimeout: null,
+         methodParams: {}
+      };
+   },
+   computed: {
+      fakerGroups () {
+         if ([...TEXT, ...LONG_TEXT].includes(this.type))
+            this.localType = 'string';
+         else if (NUMBER.includes(this.type))
+            this.localType = 'number';
+         else if (FLOAT.includes(this.type))
+            this.localType = 'float';
+         else if ([...DATE, ...DATETIME].includes(this.type))
+            this.localType = 'datetime';
+         else if (TIME.includes(this.type))
+            this.localType = 'time';
+         else
+            this.localType = 'none';
+
+         return FakerMethods.getGroupsByType(this.localType);
+      },
+      fakerMethods () {
+         return FakerMethods.getMethods({ type: this.localType, group: this.selectedGroup });
+      },
+      methodData () {
+         return this.fakerMethods.find(method => method.name === this.selectedMethod);
+      }
+   },
+   watch: {
+      fieldObj () {
+         if (this.fieldObj)
+            this.selectedValue = this.fieldObj.value;
+      },
+      selectedGroup () {
+         if (this.fakerMethods.length)
+            this.selectedMethod = this.fakerMethods[0].name;
+         else
+            this.selectedMethod = '';
+      },
+      selectedMethod () {
+         this.onChange();
+      },
+      selectedValue () {
+         clearTimeout(this.debounceTimeout);
+         this.debounceTimeout = null;
+         this.debounceTimeout = setTimeout(() => {
+            this.onChange();
+         }, 200);
+      }
+   },
+   methods: {
+      inputProps () {
+         if ([...TEXT, ...LONG_TEXT].includes(this.type))
+            return { type: 'text', mask: false };
+
+         if ([...NUMBER, ...FLOAT].includes(this.type))
+            return { type: 'number', mask: false };
+
+         if (TIME.includes(this.type)) {
+            let timeMask = '##:##:##';
+            const precision = this.fieldLength;
+
+            for (let i = 0; i < precision; i++)
+               timeMask += i === 0 ? '.#' : '#';
+
+            return { type: 'text', mask: timeMask };
+         }
+
+         if (DATE.includes(this.type))
+            return { type: 'text', mask: '####-##-##' };
+
+         if (DATETIME.includes(this.type)) {
+            let datetimeMask = '####-##-## ##:##:##';
+            const precision = this.fieldLength;
+
+            for (let i = 0; i < precision; i++)
+               datetimeMask += i === 0 ? '.#' : '#';
+
+            return { type: 'text', mask: datetimeMask };
+         }
+
+         if (BLOB.includes(this.type))
+            return { type: 'file', mask: false };
+
+         if (BIT.includes(this.type))
+            return { type: 'text', mask: false };
+
+         return { type: 'text', mask: false };
+      },
+      getKeyUsage (keyName) {
+         return this.keyUsage.find(key => key.field === keyName);
+      },
+      filesChange (event) {
+         const { files } = event.target;
+         if (!files.length) return;
+
+         this.selectedValue = files[0].path;
+      },
+      clearValue () {
+         this.selectedValue = '';
+      },
+      onChange () {
+         this.$emit('update:value', {
+            group: this.selectedGroup,
+            method: this.selectedMethod,
+            params: this.methodParams,
+            value: this.selectedValue,
+            length: this.fieldLength
+         });
+      }
+   }
+};
+</script>

src/renderer/components/ForeignKeySelect.vue

@@ -50,6 +50,7 @@ export default {
          selectedWorkspace: 'workspaces/getSelected'
       }),
       isValidDefault () {
+         if (!this.foreignList.length) return true;
          return this.foreignList.some(foreign => foreign.foreignColumn.toString() === this.value.toString());
       }
    },

src/renderer/components/ModalAskCredentials.vue

@@ -15,7 +15,7 @@
                <form class="form-horizontal">
                   <div class="form-group">
                      <div class="col-3">
-                        <label class="form-label">{{ $t('word.user') }}:</label>
+                        <label class="form-label">{{ $t('word.user') }}</label>
                      </div>
                      <div class="col-9">
                         <input
@@ -28,7 +28,7 @@
                   </div>
                   <div class="form-group">
                      <div class="col-3">
-                        <label class="form-label">{{ $t('word.password') }}:</label>
+                        <label class="form-label">{{ $t('word.password') }}</label>
                      </div>
                      <div class="col-9">
                         <input

src/renderer/components/ModalAskParameters.vue

@@ -0,0 +1,102 @@
+<template>
+   <ConfirmModal
+      :confirm-text="$t('word.run')"
+      :cancel-text="$t('word.cancel')"
+      size="400"
+      @confirm="runRoutine"
+      @hide="closeModal"
+   >
+      <template slot="header">
+         <div class="d-flex">
+            <i class="mdi mdi-24px mdi-play mr-1" /> {{ $t('word.parameters') }}: {{ localRoutine.name }}
+         </div>
+      </template>
+      <div slot="body">
+         <div class="content">
+            <form class="form-horizontal">
+               <div
+                  v-for="(parameter, i) in localRoutine.parameters"
+                  :key="parameter._id"
+                  class="form-group"
+               >
+                  <div class="col-3">
+                     <label class="form-label">{{ parameter.name }}</label>
+                  </div>
+                  <div class="col-9">
+                     <div class="input-group">
+                        <input
+                           :ref="i === 0 ? 'firstInput' : ''"
+                           v-model="values[parameter.name]"
+                           class="form-input"
+                           type="text"
+                        >
+                        <span class="input-group-addon field-type" :class="`type-${parameter.type.toLowerCase()}`">
+                           {{ parameter.type }} {{ parameter.length | wrapNumber }}
+                        </span>
+                     </div>
+                  </div>
+               </div>
+            </form>
+         </div>
+      </div>
+   </ConfirmModal>
+</template>
+
+<script>
+import ConfirmModal from '@/components/BaseConfirmModal';
+
+export default {
+   name: 'ModalAskParameters',
+   components: {
+      ConfirmModal
+   },
+   filters: {
+      wrapNumber (num) {
+         if (!num) return '';
+         return `(${num})`;
+      }
+   },
+   props: {
+      localRoutine: Object
+   },
+   data () {
+      return {
+         values: {}
+      };
+   },
+   created () {
+      window.addEventListener('keydown', this.onKey);
+
+      setTimeout(() => {
+         this.$refs.firstInput[0].focus();
+      }, 20);
+   },
+   beforeDestroy () {
+      window.removeEventListener('keydown', this.onKey);
+   },
+   methods: {
+      runRoutine () {
+         const valArr = Object.keys(this.values).reduce((acc, curr) => {
+            const value = isNaN(this.values[curr]) ? `"${this.values[curr]}"` : this.values[curr];
+            acc.push(value);
+            return acc;
+         }, []);
+         this.$emit('confirm', valArr);
+      },
+      closeModal () {
+         this.$emit('close');
+      },
+      onKey (e) {
+         e.stopPropagation();
+         if (e.key === 'Escape')
+            this.closeModal();
+      }
+   }
+};
+</script>
+
+<style scoped>
+  .field-type {
+    font-size: 0.6rem;
+  }
+</style>

src/renderer/components/ModalEditConnection.vue

@@ -10,36 +10,56 @@
             </div>
             <a class="btn btn-clear c-hand" @click="closeModal" />
          </div>
-         <div class="modal-body pb-0">
-            <div class="content">
-               <form class="form-horizontal">
-                  <fieldset class="m-0" :disabled="isTesting">
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.connectionName') }}:</label>
-                        </div>
-                        <div class="col-8 col-sm-12">
-                           <input
-                              ref="firstInput"
-                              v-model="localConnection.name"
-                              class="form-input"
-                              type="text"
-                           >
-                        </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.client') }}:</label>
-                        </div>
-                        <div class="col-8 col-sm-12">
-                           <select v-model="localConnection.client" class="form-select">
-                              <option value="mysql">
-                                 MySQL
-                              </option>
-                              <option value="maria">
-                                 MariaDB
-                              </option>
-                              <!-- <option value="mssql">
+         <div class="modal-body p-0">
+            <div class="panel">
+               <div class="panel-nav">
+                  <ul class="tab tab-block">
+                     <li
+                        class="tab-item"
+                        :class="{'active': selectedTab === 'general'}"
+                        @click="selectTab('general')"
+                     >
+                        <a class="c-hand">{{ $t('word.general') }}</a>
+                     </li>
+                     <li
+                        class="tab-item"
+                        :class="{'active': selectedTab === 'ssl'}"
+                        @click="selectTab('ssl')"
+                     >
+                        <a class="c-hand">{{ $t('word.ssl') }}</a>
+                     </li>
+                  </ul>
+               </div>
+               <div v-if="selectedTab === 'general'" class="panel-body py-0">
+                  <div class="container">
+                     <form class="form-horizontal">
+                        <fieldset class="m-0" :disabled="isTesting">
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.connectionName') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    ref="firstInput"
+                                    v-model="localConnection.name"
+                                    class="form-input"
+                                    type="text"
+                                 >
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.client') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <select v-model="localConnection.client" class="form-select">
+                                    <option value="mysql">
+                                       MySQL
+                                    </option>
+                                    <option value="maria">
+                                       MariaDB
+                                    </option>
+                                    <!-- <option value="mssql">
                                  Microsoft SQL
                               </option>
                               <option value="pg">
@@ -48,99 +68,180 @@
                               <option value="oracledb">
                                  Oracle DB
                               </option> -->
-                           </select>
+                                 </select>
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.hostName') }}/IP</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    v-model="localConnection.host"
+                                    class="form-input"
+                                    type="text"
+                                 >
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.port') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    v-model="localConnection.port"
+                                    class="form-input"
+                                    type="number"
+                                    min="1"
+                                    max="65535"
+                                 >
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.user') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    v-model="localConnection.user"
+                                    class="form-input"
+                                    type="text"
+                                    :disabled="localConnection.ask"
+                                 >
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.password') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    v-model="localConnection.password"
+                                    class="form-input"
+                                    type="password"
+                                    :disabled="localConnection.ask"
+                                 >
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12" />
+                              <div class="col-8 col-sm-12">
+                                 <label class="form-checkbox form-inline">
+                                    <input v-model="localConnection.ask" type="checkbox"><i class="form-icon" /> {{ $t('message.askCredentials') }}
+                                 </label>
+                              </div>
+                           </div>
+                        </fieldset>
+                     </form>
+                  </div>
+                  <BaseToast
+                     class="mb-2"
+                     :message="toast.message"
+                     :status="toast.status"
+                  />
+               </div>
+               <div v-if="selectedTab === 'ssl'" class="panel-body py-0">
+                  <div class="container">
+                     <form class="form-horizontal">
+                        <div class="form-group">
+                           <div class="col-4 col-sm-12">
+                              <label class="form-label">
+                                 {{ $t('message.enableSsl') }}
+                              </label>
+                           </div>
+                           <div class="col-8 col-sm-12">
+                              <label class="form-switch d-inline-block" @click.prevent="toggleSsl">
+                                 <input type="checkbox" :checked="localConnection.ssl">
+                                 <i class="form-icon" />
+                              </label>
+                           </div>
                         </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.hostName') }}/IP:</label>
-                        </div>
-                        <div class="col-8 col-sm-12">
-                           <input
-                              v-model="localConnection.host"
-                              class="form-input"
-                              type="text"
-                           >
-                        </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.port') }}:</label>
-                        </div>
-                        <div class="col-8 col-sm-12">
-                           <input
-                              v-model="localConnection.port"
-                              class="form-input"
-                              type="number"
-                              min="1"
-                              max="65535"
-                           >
-                        </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.user') }}:</label>
-                        </div>
-                        <div class="col-8 col-sm-12">
-                           <input
-                              v-model="localConnection.user"
-                              class="form-input"
-                              type="text"
-                              :disabled="localConnection.ask"
-                           >
-                        </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.password') }}:</label>
-                        </div>
-                        <div class="col-8 col-sm-12">
-                           <input
-                              v-model="localConnection.password"
-                              class="form-input"
-                              type="password"
-                              :disabled="localConnection.ask"
-                           >
-                        </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12" />
-                        <div class="col-8 col-sm-12">
-                           <label class="form-checkbox form-inline">
-                              <input v-model="localConnection.ask" type="checkbox"><i class="form-icon" /> {{ $t('message.askCredentials') }}
-                           </label>
-                        </div>
-                     </div>
-                  </fieldset>
-               </form>
+                        <fieldset class="m-0" :disabled="isTesting || !localConnection.ssl">
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.privateKey') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <BaseUploadInput
+                                    :value="localConnection.key"
+                                    :message="$t('word.browse')"
+                                    @clear="pathClear('key')"
+                                    @change="pathSelection($event, 'key')"
+                                 />
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.certificate') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <BaseUploadInput
+                                    :value="localConnection.cert"
+                                    :message="$t('word.browse')"
+                                    @clear="pathClear('cert')"
+                                    @change="pathSelection($event, 'cert')"
+                                 />
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.caCertificate') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <BaseUploadInput
+                                    :value="localConnection.ca"
+                                    :message="$t('word.browse')"
+                                    @clear="pathClear('ca')"
+                                    @change="pathSelection($event, 'ca')"
+                                 />
+                              </div>
+                           </div>
+
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.ciphers') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    ref="firstInput"
+                                    v-model="localConnection.ciphers"
+                                    class="form-input"
+                                    type="text"
+                                 >
+                              </div>
+                           </div>
+                        </fieldset>
+                     </form>
+                  </div>
+                  <BaseToast
+                     class="mb-2"
+                     :message="toast.message"
+                     :status="toast.status"
+                  />
+               </div>
+               <div class="modal-footer text-light">
+                  <button
+                     class="btn btn-gray mr-2"
+                     :class="{'loading': isTesting}"
+                     @click="startTest"
+                  >
+                     {{ $t('message.testConnection') }}
+                  </button>
+                  <button class="btn btn-primary mr-2" @click="saveEditConnection">
+                     {{ $t('word.save') }}
+                  </button>
+                  <button class="btn btn-link" @click="closeModal">
+                     {{ $t('word.close') }}
+                  </button>
+               </div>
             </div>
-            <BaseToast
-               class="mb-2"
-               :message="toast.message"
-               :status="toast.status"
+            <ModalAskCredentials
+               v-if="isAsking"
+               @close-asking="closeAsking"
+               @credentials="continueTest"
             />
          </div>
-         <div class="modal-footer text-light">
-            <button
-               class="btn btn-gray mr-2"
-               :class="{'loading': isTesting}"
-               @click="startTest"
-            >
-               {{ $t('message.testConnection') }}
-            </button>
-            <button class="btn btn-primary mr-2" @click="saveEditConnection">
-               {{ $t('word.save') }}
-            </button>
-            <button class="btn btn-link" @click="closeModal">
-               {{ $t('word.close') }}
-            </button>
-         </div>
       </div>
-      <ModalAskCredentials
-         v-if="isAsking"
-         @close-asking="closeAsking"
-         @credentials="continueTest"
-      />
    </div>
 </template>
 
@@ -149,12 +250,14 @@ import { mapActions } from 'vuex';
 import Connection from '@/ipc-api/Connection';
 import ModalAskCredentials from '@/components/ModalAskCredentials';
 import BaseToast from '@/components/BaseToast';
+import BaseUploadInput from '@/components/BaseUploadInput';
 
 export default {
    name: 'ModalEditConnection',
    components: {
       ModalAskCredentials,
-      BaseToast
+      BaseToast,
+      BaseUploadInput
    },
    props: {
       connection: Object
@@ -167,7 +270,8 @@ export default {
          },
          isTesting: false,
          isAsking: false,
-         localConnection: null
+         localConnection: null,
+         selectedTab: 'general'
       };
    },
    created () {
@@ -240,6 +344,21 @@ export default {
          e.stopPropagation();
          if (e.key === 'Escape')
             this.closeModal();
+      },
+      selectTab (tab) {
+         this.selectedTab = tab;
+      },
+      toggleSsl () {
+         this.localConnection.ssl = !this.localConnection.ssl;
+      },
+      pathSelection (event, name) {
+         const { files } = event.target;
+         if (!files.length) return;
+
+         this.localConnection[name] = files[0].path;
+      },
+      pathClear (name) {
+         this.localConnection[name] = '';
       }
    }
 };
@@ -247,6 +366,8 @@ export default {
 
 <style scoped>
   .modal-container {
+    position: absolute;
     max-width: 450px;
+    top: 17.5vh;
   }
 </style>

src/renderer/components/ModalEditDatabase.vue

@@ -15,7 +15,7 @@
                <form class="form-horizontal">
                   <div class="form-group">
                      <div class="col-3">
-                        <label class="form-label">{{ $t('word.name') }}:</label>
+                        <label class="form-label">{{ $t('word.name') }}</label>
                      </div>
                      <div class="col-9">
                         <input
@@ -30,7 +30,7 @@
                   </div>
                   <div class="form-group">
                      <div class="col-3">
-                        <label class="form-label">{{ $t('word.collation') }}:</label>
+                        <label class="form-label">{{ $t('word.collation') }}</label>
                      </div>
                      <div class="col-9">
                         <select

src/renderer/components/ModalFakerRows.vue

@@ -0,0 +1,391 @@
+<template>
+   <div class="modal active">
+      <a class="modal-overlay" @click.stop="closeModal" />
+      <div class="modal-container p-0">
+         <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') }}
+               </div>
+            </div>
+            <a class="btn btn-clear c-hand" @click.stop="closeModal" />
+         </div>
+         <div class="modal-body pb-0">
+            <div class="content">
+               <form class="form-horizontal">
+                  <fieldset :disabled="isInserting">
+                     <div
+                        v-for="field in fields"
+                        :key="field.name"
+                        class="form-group"
+                     >
+                        <div class="col-3 col-sm-12">
+                           <label class="form-label" :title="field.name">{{ field.name }}</label>
+                        </div>
+                        <div class="column columns col-sm-12">
+                           <FakerSelect
+                              :type="field.type"
+                              class="column columns pr-0"
+                              :is-checked="!fieldsToExclude.includes(field.name)"
+                              :foreign-keys="foreignKeys"
+                              :key-usage="keyUsage"
+                              :field="field"
+                              :field-length="fieldLength(field)"
+                              :field-obj="localRow[field.name]"
+                              :value.sync="localRow[field.name]"
+                           >
+                              <span class="input-group-addon field-type" :class="`type-${field.type.toLowerCase()}`">
+                                 {{ field.type }} {{ fieldLength(field) | wrapNumber }}
+                              </span>
+                              <label class="form-checkbox ml-3" :title="$t('word.insert')">
+                                 <input
+                                    type="checkbox"
+                                    :checked="!field.autoIncrement"
+                                    @change.prevent="toggleFields($event, field)"
+                                 ><i class="form-icon" />
+                              </label>
+                           </FakerSelect>
+                        </div>
+                     </div>
+                  </fieldset>
+               </form>
+            </div>
+         </div>
+         <div class="modal-footer text-light columns">
+            <div class="column d-flex" :class="hasFakes ? 'col-4' : 'col-2'">
+               <div class="input-group tooltip tooltip-right" :data-tooltip="$t('message.numberOfInserts')">
+                  <input
+                     v-model="nInserts"
+                     type="number"
+                     class="form-input"
+                     min="1"
+                     :disabled="isInserting"
+                  >
+                  <span class="input-group-addon">
+                     <i class="mdi mdi-24px mdi-repeat" />
+                  </span>
+               </div>
+               <div
+                  v-if="hasFakes"
+                  class="tooltip tooltip-right ml-2"
+                  :data-tooltip="$t('message.fakeDataLanguage')"
+               >
+                  <select v-model="fakerLocale" class="form-select">
+                     <option value="ar">
+                        Arabic
+                     </option><option value="az">
+                        Azerbaijani
+                     </option><option value="zh_CN">
+                        Chinese
+                     </option><option value="zh_TW">
+                        Chinese (Taiwan)
+                     </option><option value="cz">
+                        Czech
+                     </option><option value="nl">
+                        Dutch
+                     </option><option value="nl_BE">
+                        Dutch (Belgium)
+                     </option><option value="en">
+                        English
+                     </option><option value="en_AU_ocker">
+                        English (Australia Ocker)
+                     </option><option value="en_AU">
+                        English (Australia)
+                     </option><option value="en_BORK">
+                        English (Bork)
+                     </option><option value="en_CA">
+                        English (Canada)
+                     </option><option value="en_GB">
+                        English (Great Britain)
+                     </option><option value="en_IND">
+                        English (India)
+                     </option><option value="en_IE">
+                        English (Ireland)
+                     </option><option value="en_ZA">
+                        English (South Africa)
+                     </option><option value="en_US">
+                        English (United States)
+                     </option><option value="fa">
+                        Farsi
+                     </option><option value="fi">
+                        Finnish
+                     </option><option value="fr">
+                        French
+                     </option><option value="fr_CA">
+                        French (Canada)
+                     </option><option value="fr_CH">
+                        French (Switzerland)
+                     </option><option value="ge">
+                        Georgian
+                     </option><option value="de">
+                        German
+                     </option><option value="de_AT">
+                        German (Austria)
+                     </option><option value="de_CH">
+                        German (Switzerland)
+                     </option><option value="hr">
+                        Hrvatski
+                     </option><option value="id_ID">
+                        Indonesia
+                     </option><option value="it">
+                        Italian
+                     </option><option value="ja">
+                        Japanese
+                     </option><option value="ko">
+                        Korean
+                     </option><option value="nep">
+                        Nepalese
+                     </option><option value="nb_NO">
+                        Norwegian
+                     </option><option value="pl">
+                        Polish
+                     </option><option value="pt_BR">
+                        Portuguese (Brazil)
+                     </option><option value="pt_PT">
+                        Portuguese (Portugal)
+                     </option><option value="ro">
+                        Romanian
+                     </option><option value="ru">
+                        Russian
+                     </option><option value="sk">
+                        Slovakian
+                     </option><option value="es">
+                        Spanish
+                     </option><option value="es_MX">
+                        Spanish (Mexico)
+                     </option><option value="sv">
+                        Swedish
+                     </option><option value="tr">
+                        Turkish
+                     </option><option value="uk">
+                        Ukrainian
+                     </option><option value="vi">
+                        Vietnamese
+                     </option>
+                  </select>
+               </div>
+            </div>
+            <div class="column col-auto">
+               <button
+                  class="btn btn-primary mr-2"
+                  :class="{'loading': isInserting}"
+                  @click.stop="insertRows"
+               >
+                  {{ $t('word.insert') }}
+               </button>
+               <button class="btn btn-link" @click.stop="closeModal">
+                  {{ $t('word.close') }}
+               </button>
+            </div>
+         </div>
+      </div>
+   </div>
+</template>
+
+<script>
+import moment from 'moment';
+import { TEXT, LONG_TEXT, NUMBER, FLOAT, DATE, TIME, DATETIME, BLOB, BIT } from 'common/fieldTypes';
+import { mask } from 'vue-the-mask';
+import { mapGetters, mapActions } from 'vuex';
+import Tables from '@/ipc-api/Tables';
+import FakerSelect from '@/components/FakerSelect';
+
+export default {
+   name: 'ModalFakerRows',
+   components: {
+      FakerSelect
+   },
+   directives: {
+      mask
+   },
+   filters: {
+      wrapNumber (num) {
+         if (!num) return '';
+         return `(${num})`;
+      }
+   },
+   props: {
+      tabUid: [String, Number],
+      fields: Array,
+      keyUsage: Array
+   },
+   data () {
+      return {
+         localRow: {},
+         fieldsToExclude: [],
+         nInserts: 1,
+         isInserting: false,
+         fakerLocale: 'en'
+      };
+   },
+   computed: {
+      ...mapGetters({
+         selectedWorkspace: 'workspaces/getSelected',
+         getWorkspace: 'workspaces/getWorkspace',
+         getWorkspaceTab: 'workspaces/getWorkspaceTab'
+      }),
+      workspace () {
+         return this.getWorkspace(this.selectedWorkspace);
+      },
+      foreignKeys () {
+         return this.keyUsage.map(key => key.field);
+      },
+      hasFakes () {
+         return Object.keys(this.localRow).some(field => 'group' in this.localRow[field] && this.localRow[field].group !== 'manual');
+      }
+   },
+   watch: {
+      nInserts (val) {
+         if (!val || val < 1)
+            this.nInserts = 1;
+         else if (val > 1000)
+            this.nInserts = 1000;
+      }
+   },
+   created () {
+      window.addEventListener('keydown', this.onKey);
+   },
+   mounted () {
+      const rowObj = {};
+
+      for (const field of this.fields) {
+         let fieldDefault;
+
+         if (field.default === 'NULL') fieldDefault = null;
+         else {
+            if ([...NUMBER, ...FLOAT].includes(field.type))
+               fieldDefault = +field.default;
+
+            if ([...TEXT, ...LONG_TEXT].includes(field.type))
+               fieldDefault = field.default ? field.default.substring(1, field.default.length - 1) : '';
+
+            if ([...TIME, ...DATE].includes(field.type))
+               fieldDefault = field.default;
+
+            if (BIT.includes(field.type))
+               fieldDefault = field.default.replaceAll('\'', '').replaceAll('b', '');
+
+            if (DATETIME.includes(field.type)) {
+               if (field.default && field.default.toLowerCase().includes('current_timestamp')) {
+                  let datePrecision = '';
+                  for (let i = 0; i < field.datePrecision; i++)
+                     datePrecision += i === 0 ? '.S' : 'S';
+                  fieldDefault = moment().format(`YYYY-MM-DD HH:mm:ss${datePrecision}`);
+               }
+            }
+         }
+
+         rowObj[field.name] = { value: fieldDefault };
+
+         if (field.autoIncrement)// Disable by default auto increment fields
+            this.fieldsToExclude = [...this.fieldsToExclude, field.name];
+      }
+
+      this.localRow = { ...rowObj };
+   },
+   beforeDestroy () {
+      window.removeEventListener('keydown', this.onKey);
+   },
+   methods: {
+      ...mapActions({
+         addNotification: 'notifications/addNotification'
+      }),
+      async insertRows () {
+         this.isInserting = true;
+         const rowToInsert = this.localRow;
+
+         Object.keys(rowToInsert).forEach(key => {
+            if (this.fieldsToExclude.includes(key))
+               delete rowToInsert[key];
+
+            if (typeof rowToInsert[key] === 'undefined')
+               delete rowToInsert[key];
+         });
+
+         const fieldTypes = {};
+         this.fields.forEach(field => {
+            fieldTypes[field.name] = field.type;
+         });
+
+         try {
+            const { status, response } = await Tables.insertTableFakeRows({
+               uid: this.selectedWorkspace,
+               schema: this.workspace.breadcrumbs.schema,
+               table: this.workspace.breadcrumbs.table,
+               row: rowToInsert,
+               repeat: this.nInserts,
+               fields: fieldTypes,
+               locale: this.fakerLocale
+            });
+
+            if (status === 'success') {
+               this.closeModal();
+               this.$emit('reload');
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         this.isInserting = false;
+      },
+      closeModal () {
+         this.$emit('hide');
+      },
+      fieldLength (field) {
+         if ([...BLOB, ...LONG_TEXT].includes(field.type)) return null;
+         else if (TEXT.includes(field.type)) return field.charLength;
+         return field.length;
+      },
+      toggleFields (event, field) {
+         if (event.target.checked)
+            this.fieldsToExclude = this.fieldsToExclude.filter(f => f !== field.name);
+         else
+            this.fieldsToExclude = [...this.fieldsToExclude, field.name];
+      },
+      filesChange (event, field) {
+         const { files } = event.target;
+         if (!files.length) return;
+
+         this.localRow[field] = files[0].path;
+      },
+      getKeyUsage (keyName) {
+         return this.keyUsage.find(key => key.field === keyName);
+      },
+      onKey (e) {
+         e.stopPropagation();
+         if (e.key === 'Escape')
+            this.closeModal();
+      }
+   }
+};
+</script>
+
+<style scoped>
+  .modal-container {
+    max-width: 800px;
+  }
+
+  .form-label {
+    overflow: hidden;
+    white-space: normal;
+    text-overflow: ellipsis;
+  }
+
+  .input-group-addon {
+    display: flex;
+    align-items: center;
+  }
+
+  .modal-footer {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .field-type {
+    font-size: 0.6rem;
+  }
+</style>

src/renderer/components/ModalNewConnection.vue

@@ -10,119 +10,220 @@
             </div>
             <a class="btn btn-clear c-hand" @click="closeModal" />
          </div>
-         <div class="modal-body pb-0">
-            <div class="content">
-               <form class="form-horizontal">
-                  <fieldset class="m-0" :disabled="isTesting">
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.connectionName') }}:</label>
+         <div class="modal-body p-0">
+            <div class="panel">
+               <div class="panel-nav">
+                  <ul class="tab tab-block">
+                     <li
+                        class="tab-item"
+                        :class="{'active': selectedTab === 'general'}"
+                        @click="selectTab('general')"
+                     >
+                        <a class="c-hand">{{ $t('word.general') }}</a>
+                     </li>
+                     <li
+                        class="tab-item"
+                        :class="{'active': selectedTab === 'ssl'}"
+                        @click="selectTab('ssl')"
+                     >
+                        <a class="c-hand">{{ $t('word.ssl') }}</a>
+                     </li>
+                  </ul>
+               </div>
+               <div v-if="selectedTab === 'general'" class="panel-body py-0">
+                  <div class="container">
+                     <form class="form-horizontal">
+                        <fieldset class="m-0" :disabled="isTesting">
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.connectionName') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    ref="firstInput"
+                                    v-model="connection.name"
+                                    class="form-input"
+                                    type="text"
+                                 >
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.client') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <select
+                                    v-model="connection.client"
+                                    class="form-select"
+                                    @change="setDefaults"
+                                 >
+                                    <option value="mysql">
+                                       MySQL
+                                    </option>
+                                    <option value="maria">
+                                       MariaDB
+                                    </option>
+                                 <!-- <option value="mssql">
+                                    Microsoft SQL
+                                 </option>
+                                 <option value="pg">
+                                    PostgreSQL
+                                 </option>
+                                 <option value="oracledb">
+                                    Oracle DB
+                                 </option> -->
+                                 </select>
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.hostName') }}/IP</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    v-model="connection.host"
+                                    class="form-input"
+                                    type="text"
+                                 >
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.port') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    v-model="connection.port"
+                                    class="form-input"
+                                    type="number"
+                                    min="1"
+                                    max="65535"
+                                 >
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.user') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    v-model="connection.user"
+                                    class="form-input"
+                                    type="text"
+                                    :disabled="connection.ask"
+                                 >
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.password') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    v-model="connection.password"
+                                    class="form-input"
+                                    type="password"
+                                    :disabled="connection.ask"
+                                 >
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12" />
+                              <div class="col-8 col-sm-12">
+                                 <label class="form-checkbox form-inline">
+                                    <input v-model="connection.ask" type="checkbox"><i class="form-icon" /> {{ $t('message.askCredentials') }}
+                                 </label>
+                              </div>
+                           </div>
+                        </fieldset>
+                     </form>
+                  </div>
+                  <BaseToast
+                     class="mb-2"
+                     :message="toast.message"
+                     :status="toast.status"
+                  />
+               </div>
+               <div v-if="selectedTab === 'ssl'" class="panel-body py-0">
+                  <div class="container">
+                     <form class="form-horizontal">
+                        <div class="form-group">
+                           <div class="col-4 col-sm-12">
+                              <label class="form-label">
+                                 {{ $t('message.enableSsl') }}
+                              </label>
+                           </div>
+                           <div class="col-8 col-sm-12">
+                              <label class="form-switch d-inline-block" @click.prevent="toggleSsl">
+                                 <input type="checkbox" :checked="connection.ssl">
+                                 <i class="form-icon" />
+                              </label>
+                           </div>
                         </div>
-                        <div class="col-8 col-sm-12">
-                           <input
-                              ref="firstInput"
-                              v-model="connection.name"
-                              class="form-input"
-                              type="text"
-                           >
-                        </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.client') }}:</label>
-                        </div>
-                        <div class="col-8 col-sm-12">
-                           <select
-                              v-model="connection.client"
-                              class="form-select"
-                              @change="setDefaults"
-                           >
-                              <option value="mysql">
-                                 MySQL
-                              </option>
-                              <option value="maria">
-                                 MariaDB
-                              </option>
-                              <!-- <option value="mssql">
-                                 Microsoft SQL
-                              </option>
-                              <option value="pg">
-                                 PostgreSQL
-                              </option>
-                              <option value="oracledb">
-                                 Oracle DB
-                              </option> -->
-                           </select>
-                        </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.hostName') }}/IP:</label>
-                        </div>
-                        <div class="col-8 col-sm-12">
-                           <input
-                              v-model="connection.host"
-                              class="form-input"
-                              type="text"
-                           >
-                        </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.port') }}:</label>
-                        </div>
-                        <div class="col-8 col-sm-12">
-                           <input
-                              v-model="connection.port"
-                              class="form-input"
-                              type="number"
-                              min="1"
-                              max="65535"
-                           >
-                        </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.user') }}:</label>
-                        </div>
-                        <div class="col-8 col-sm-12">
-                           <input
-                              v-model="connection.user"
-                              class="form-input"
-                              type="text"
-                              :disabled="connection.ask"
-                           >
-                        </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12">
-                           <label class="form-label">{{ $t('word.password') }}:</label>
-                        </div>
-                        <div class="col-8 col-sm-12">
-                           <input
-                              v-model="connection.password"
-                              class="form-input"
-                              type="password"
-                              :disabled="connection.ask"
-                           >
-                        </div>
-                     </div>
-                     <div class="form-group">
-                        <div class="col-4 col-sm-12" />
-                        <div class="col-8 col-sm-12">
-                           <label class="form-checkbox form-inline">
-                              <input v-model="connection.ask" type="checkbox"><i class="form-icon" /> {{ $t('message.askCredentials') }}
-                           </label>
-                        </div>
-                     </div>
-                  </fieldset>
-               </form>
+                        <fieldset class="m-0" :disabled="isTesting || !connection.ssl">
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.privateKey') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <BaseUploadInput
+                                    :value="connection.key"
+                                    :message="$t('word.browse')"
+                                    @clear="pathClear('key')"
+                                    @change="pathSelection($event, 'key')"
+                                 />
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.certificate') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <BaseUploadInput
+                                    :value="connection.cert"
+                                    :message="$t('word.browse')"
+                                    @clear="pathClear('cert')"
+                                    @change="pathSelection($event, 'cert')"
+                                 />
+                              </div>
+                           </div>
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.caCertificate') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <BaseUploadInput
+                                    :value="connection.ca"
+                                    :message="$t('word.browse')"
+                                    @clear="pathClear('ca')"
+                                    @change="pathSelection($event, 'ca')"
+                                 />
+                              </div>
+                           </div>
+
+                           <div class="form-group">
+                              <div class="col-4 col-sm-12">
+                                 <label class="form-label">{{ $t('word.ciphers') }}</label>
+                              </div>
+                              <div class="col-8 col-sm-12">
+                                 <input
+                                    ref="firstInput"
+                                    v-model="connection.ciphers"
+                                    class="form-input"
+                                    type="text"
+                                 >
+                              </div>
+                           </div>
+                        </fieldset>
+                     </form>
+                  </div>
+                  <BaseToast
+                     class="mb-2"
+                     :message="toast.message"
+                     :status="toast.status"
+                  />
+               </div>
             </div>
-            <BaseToast
-               class="mb-2"
-               :message="toast.message"
-               :status="toast.status"
-            />
          </div>
          <div class="modal-footer text-light">
             <button
@@ -154,12 +255,14 @@ import Connection from '@/ipc-api/Connection';
 import { uidGen } from 'common/libs/uidGen';
 import ModalAskCredentials from '@/components/ModalAskCredentials';
 import BaseToast from '@/components/BaseToast';
+import BaseUploadInput from '@/components/BaseUploadInput';
 
 export default {
    name: 'ModalNewConnection',
    components: {
       ModalAskCredentials,
-      BaseToast
+      BaseToast,
+      BaseUploadInput
    },
    data () {
       return {
@@ -171,14 +274,21 @@ export default {
             user: 'root',
             password: '',
             ask: false,
-            uid: uidGen('C')
+            uid: uidGen('C'),
+            ssl: false,
+            cert: '',
+            key: '',
+            ca: '',
+            ciphers: ''
+
          },
          toast: {
             status: '',
             message: ''
          },
          isTesting: false,
-         isAsking: false
+         isAsking: false,
+         selectedTab: 'general'
       };
    },
    created () {
@@ -265,6 +375,21 @@ export default {
          e.stopPropagation();
          if (e.key === 'Escape')
             this.closeModal();
+      },
+      selectTab (tab) {
+         this.selectedTab = tab;
+      },
+      toggleSsl () {
+         this.connection.ssl = !this.connection.ssl;
+      },
+      pathSelection (event, name) {
+         const { files } = event.target;
+         if (!files.length) return;
+
+         this.connection[name] = files[0].path;
+      },
+      pathClear (name) {
+         this.connection[name] = '';
       }
    }
 };
@@ -272,6 +397,8 @@ export default {
 
 <style scoped>
   .modal-container {
+    position: absolute;
     max-width: 450px;
+    top: 17.5vh;
   }
 </style>

src/renderer/components/ModalNewDatabase.vue

@@ -15,7 +15,7 @@
                <form class="form-horizontal">
                   <div class="form-group">
                      <div class="col-3">
-                        <label class="form-label">{{ $t('word.name') }}:</label>
+                        <label class="form-label">{{ $t('word.name') }}</label>
                      </div>
                      <div class="col-9">
                         <input
@@ -30,7 +30,7 @@
                   </div>
                   <div class="form-group">
                      <div class="col-3">
-                        <label class="form-label">{{ $t('word.collation') }}:</label>
+                        <label class="form-label">{{ $t('word.collation') }}</label>
                      </div>
                      <div class="col-9">
                         <select v-model="database.collation" class="form-select">

src/renderer/components/ModalNewFunction.vue

@@ -0,0 +1,184 @@
+<template>
+   <ConfirmModal
+      :confirm-text="$t('word.confirm')"
+      size="400"
+      @confirm="confirmNewFunction"
+      @hide="$emit('close')"
+   >
+      <template :slot="'header'">
+         <div class="d-flex">
+            <i class="mdi mdi-24px mdi-plus mr-1" /> {{ $t('message.createNewRoutine') }}
+         </div>
+      </template>
+      <div :slot="'body'">
+         <form class="form-horizontal">
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.name') }}
+               </label>
+               <div class="column">
+                  <input
+                     ref="firstInput"
+                     v-model="localFunction.name"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.definer') }}
+               </label>
+               <div class="column">
+                  <select
+                     v-if="workspace.users.length"
+                     v-model="localFunction.definer"
+                     class="form-select"
+                  >
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                     <option
+                        v-for="user in workspace.users"
+                        :key="`${user.name}@${user.host}`"
+                        :value="`\`${user.name}\`@\`${user.host}\``"
+                     >
+                        {{ user.name }}@{{ user.host }}
+                     </option>
+                  </select>
+                  <select v-if="!workspace.users.length" class="form-select">
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.returns') }}
+               </label>
+               <div class="column">
+                  <div class="input-group">
+                     <select
+                        v-model="localFunction.returns"
+                        class="form-select text-uppercase"
+                        style="width: 0;"
+                     >
+                        <optgroup
+                           v-for="group in workspace.dataTypes"
+                           :key="group.group"
+                           :label="group.group"
+                        >
+                           <option
+                              v-for="type in group.types"
+                              :key="type.name"
+                              :selected="localFunction.returns === type.name"
+                              :value="type.name"
+                           >
+                              {{ type.name }}
+                           </option>
+                        </optgroup>
+                     </select>
+                     <input
+                        v-model="localFunction.returnsLength"
+                        class="form-input"
+                        type="number"
+                        min="0"
+                     >
+                  </div>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.comment') }}
+               </label>
+               <div class="column">
+                  <input
+                     v-model="localFunction.comment"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('message.sqlSecurity') }}
+               </label>
+               <div class="column">
+                  <select v-model="localFunction.security" class="form-select">
+                     <option>DEFINER</option>
+                     <option>INVOKER</option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('message.dataAccess') }}
+               </label>
+               <div class="column">
+                  <select v-model="localFunction.dataAccess" class="form-select">
+                     <option>CONTAINS SQL</option>
+                     <option>NO SQL</option>
+                     <option>READS SQL DATA</option>
+                     <option>MODIFIES SQL DATA</option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <div class="col-4" />
+               <div class="column">
+                  <label class="form-checkbox form-inline">
+                     <input v-model="localFunction.deterministic" type="checkbox"><i class="form-icon" /> {{ $t('word.deterministic') }}
+                  </label>
+               </div>
+            </div>
+         </form>
+      </div>
+   </ConfirmModal>
+</template>
+
+<script>
+import ConfirmModal from '@/components/BaseConfirmModal';
+
+export default {
+   name: 'ModalNewFunction',
+   components: {
+      ConfirmModal
+   },
+   props: {
+      workspace: Object
+   },
+   data () {
+      return {
+         localFunction: {
+            definer: '',
+            sql: 'BEGIN\r\n    RETURN NULL;\r\nEND',
+            parameters: [],
+            name: '',
+            comment: '',
+            returns: 'INT',
+            returnsLength: 10,
+            security: 'DEFINER',
+            deterministic: false,
+            dataAccess: 'CONTAINS SQL'
+         },
+         isOptionsChanging: false
+      };
+   },
+   computed: {
+      schema () {
+         return this.workspace.breadcrumbs.schema;
+      }
+   },
+   mounted () {
+      setTimeout(() => {
+         this.$refs.firstInput.focus();
+      }, 20);
+   },
+   methods: {
+      confirmNewFunction () {
+         this.$emit('open-create-function-editor', this.localFunction);
+      }
+   }
+};
+</script>

src/renderer/components/ModalNewRoutine.vue

@@ -0,0 +1,147 @@
+<template>
+   <ConfirmModal
+      :confirm-text="$t('word.confirm')"
+      size="400"
+      @confirm="confirmNewRoutine"
+      @hide="$emit('close')"
+   >
+      <template :slot="'header'">
+         <div class="d-flex">
+            <i class="mdi mdi-24px mdi-plus mr-1" /> {{ $t('message.createNewRoutine') }}
+         </div>
+      </template>
+      <div :slot="'body'">
+         <form class="form-horizontal">
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.name') }}
+               </label>
+               <div class="column">
+                  <input
+                     ref="firstInput"
+                     v-model="localRoutine.name"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.definer') }}
+               </label>
+               <div class="column">
+                  <select
+                     v-if="workspace.users.length"
+                     v-model="localRoutine.definer"
+                     class="form-select"
+                  >
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                     <option
+                        v-for="user in workspace.users"
+                        :key="`${user.name}@${user.host}`"
+                        :value="`\`${user.name}\`@\`${user.host}\``"
+                     >
+                        {{ user.name }}@{{ user.host }}
+                     </option>
+                  </select>
+                  <select v-if="!workspace.users.length" class="form-select">
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.comment') }}
+               </label>
+               <div class="column">
+                  <input
+                     v-model="localRoutine.comment"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('message.sqlSecurity') }}
+               </label>
+               <div class="column">
+                  <select v-model="localRoutine.security" class="form-select">
+                     <option>DEFINER</option>
+                     <option>INVOKER</option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('message.dataAccess') }}
+               </label>
+               <div class="column">
+                  <select v-model="localRoutine.dataAccess" class="form-select">
+                     <option>CONTAINS SQL</option>
+                     <option>NO SQL</option>
+                     <option>READS SQL DATA</option>
+                     <option>MODIFIES SQL DATA</option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <div class="col-4" />
+               <div class="column">
+                  <label class="form-checkbox form-inline">
+                     <input v-model="localRoutine.deterministic" type="checkbox"><i class="form-icon" /> {{ $t('word.deterministic') }}
+                  </label>
+               </div>
+            </div>
+         </form>
+      </div>
+   </ConfirmModal>
+</template>
+
+<script>
+import ConfirmModal from '@/components/BaseConfirmModal';
+
+export default {
+   name: 'ModalNewRoutine',
+   components: {
+      ConfirmModal
+   },
+   props: {
+      workspace: Object
+   },
+   data () {
+      return {
+         localRoutine: {
+            definer: '',
+            sql: 'BEGIN\r\n\r\nEND',
+            parameters: [],
+            name: '',
+            comment: '',
+            security: 'DEFINER',
+            deterministic: false,
+            dataAccess: 'CONTAINS SQL'
+         },
+         isOptionsChanging: false
+      };
+   },
+   computed: {
+      schema () {
+         return this.workspace.breadcrumbs.schema;
+      }
+   },
+   mounted () {
+      setTimeout(() => {
+         this.$refs.firstInput.focus();
+      }, 20);
+   },
+   methods: {
+      confirmNewRoutine () {
+         this.$emit('open-create-routine-editor', this.localRoutine);
+      }
+   }
+};
+</script>

src/renderer/components/ModalNewScheduler.vue

@@ -0,0 +1,109 @@
+<template>
+   <ConfirmModal
+      :confirm-text="$t('word.confirm')"
+      size="400"
+      @confirm="confirmNewTrigger"
+      @hide="$emit('close')"
+   >
+      <template :slot="'header'">
+         <div class="d-flex">
+            <i class="mdi mdi-24px mdi-plus mr-1" /> {{ $t('message.createNewScheduler') }}
+         </div>
+      </template>
+      <div :slot="'body'">
+         <form class="form-horizontal">
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.name') }}
+               </label>
+               <div class="column">
+                  <input
+                     ref="firstInput"
+                     v-model="localScheduler.name"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.definer') }}
+               </label>
+               <div class="column">
+                  <select
+                     v-if="workspace.users.length"
+                     v-model="localScheduler.definer"
+                     class="form-select"
+                  >
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                     <option
+                        v-for="user in workspace.users"
+                        :key="`${user.name}@${user.host}`"
+                        :value="`\`${user.name}\`@\`${user.host}\``"
+                     >
+                        {{ user.name }}@{{ user.host }}
+                     </option>
+                  </select>
+                  <select v-if="!workspace.users.length" class="form-select">
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.comment') }}
+               </label>
+               <div class="column">
+                  <input
+                     v-model="localScheduler.comment"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+         </form>
+      </div>
+   </ConfirmModal>
+</template>
+
+<script>
+import ConfirmModal from '@/components/BaseConfirmModal';
+
+export default {
+   name: 'ModalNewScheduler',
+   components: {
+      ConfirmModal
+   },
+   props: {
+      workspace: Object
+   },
+   data () {
+      return {
+         localScheduler: {
+            definer: '',
+            sql: 'BEGIN\r\n\r\nEND',
+            name: '',
+            comment: '',
+            execution: 'EVERY',
+            every: ['1', 'DAY'],
+            preserve: true,
+            state: 'DISABLE'
+         }
+      };
+   },
+   mounted () {
+      setTimeout(() => {
+         this.$refs.firstInput.focus();
+      }, 20);
+   },
+   methods: {
+      confirmNewTrigger () {
+         this.$emit('open-create-scheduler-editor', this.localScheduler);
+      }
+   }
+};
+</script>

src/renderer/components/ModalNewTable.vue

@@ -84,7 +84,6 @@ export default {
       ConfirmModal
    },
    props: {
-      table: String,
       workspace: Object
    },
    data () {

src/renderer/components/ModalNewTableRow.vue

@@ -50,6 +50,16 @@
                               :tabindex="key+1"
                               @change="filesChange($event,field.name)"
                            >
+                           <input
+                              v-else-if="inputProps(field).type === 'number'"
+                              ref="formInput"
+                              v-model="localRow[field.name]"
+                              class="form-input"
+                              step="any"
+                              :type="inputProps(field).type"
+                              :disabled="fieldsToExclude.includes(field.name)"
+                              :tabindex="key+1"
+                           >
                            <input
                               v-else
                               ref="formInput"
@@ -107,7 +117,7 @@
 
 <script>
 import moment from 'moment';
-import { TEXT, LONG_TEXT, NUMBER, DATE, TIME, DATETIME, BLOB, BIT } from 'common/fieldTypes';
+import { TEXT, LONG_TEXT, NUMBER, FLOAT, DATE, TIME, DATETIME, BLOB, BIT } from 'common/fieldTypes';
 import { mask } from 'vue-the-mask';
 import { mapGetters, mapActions } from 'vuex';
 import Tables from '@/ipc-api/Tables';
@@ -157,6 +167,8 @@ export default {
       nInserts (val) {
          if (!val || val < 1)
             this.nInserts = 1;
+         else if (val > 1000)
+            this.nInserts = 1000;
       }
    },
    created () {
@@ -170,7 +182,7 @@ export default {
 
          if (field.default === 'NULL') fieldDefault = null;
          else {
-            if (NUMBER.includes(field.type))
+            if ([...NUMBER, ...FLOAT].includes(field.type))
                fieldDefault = +field.default;
 
             if ([...TEXT, ...LONG_TEXT].includes(field.type))
@@ -253,13 +265,14 @@ export default {
       },
       fieldLength (field) {
          if ([...BLOB, ...LONG_TEXT].includes(field.type)) return null;
-         return field.numLength || field.datePrecision || field.charLength || 0;
+         else if (TEXT.includes(field.type)) return field.charLength;
+         return field.length;
       },
       inputProps (field) {
          if ([...TEXT, ...LONG_TEXT].includes(field.type))
             return { type: 'text', mask: false };
 
-         if (NUMBER.includes(field.type))
+         if ([...NUMBER, ...FLOAT].includes(field.type))
             return { type: 'number', mask: false };
 
          if (TIME.includes(field.type)) {

src/renderer/components/ModalNewTrigger.vue

@@ -0,0 +1,140 @@
+<template>
+   <ConfirmModal
+      :confirm-text="$t('word.confirm')"
+      size="400"
+      @confirm="confirmNewTrigger"
+      @hide="$emit('close')"
+   >
+      <template :slot="'header'">
+         <div class="d-flex">
+            <i class="mdi mdi-24px mdi-plus mr-1" /> {{ $t('message.createNewTrigger') }}
+         </div>
+      </template>
+      <div :slot="'body'">
+         <form class="form-horizontal">
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.name') }}
+               </label>
+               <div class="column">
+                  <input
+                     ref="firstInput"
+                     v-model="localTrigger.name"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.definer') }}
+               </label>
+               <div class="column">
+                  <select
+                     v-if="workspace.users.length"
+                     v-model="localTrigger.definer"
+                     class="form-select"
+                  >
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                     <option
+                        v-for="user in workspace.users"
+                        :key="`${user.name}@${user.host}`"
+                        :value="`\`${user.name}\`@\`${user.host}\``"
+                     >
+                        {{ user.name }}@{{ user.host }}
+                     </option>
+                  </select>
+                  <select v-if="!workspace.users.length" class="form-select">
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.table') }}
+               </label>
+               <div class="column">
+                  <select v-model="localTrigger.table" class="form-select">
+                     <option v-for="table in schemaTables" :key="table.name">
+                        {{ table.name }}
+                     </option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.event') }}
+               </label>
+               <div class="column">
+                  <div class="input-group">
+                     <select v-model="localTrigger.event1" class="form-select">
+                        <option>BEFORE</option>
+                        <option>AFTER</option>
+                     </select>
+                     <select v-model="localTrigger.event2" class="form-select">
+                        <option>INSERT</option>
+                        <option>UPDATE</option>
+                        <option>DELETE</option>
+                     </select>
+                  </div>
+               </div>
+            </div>
+         </form>
+      </div>
+   </ConfirmModal>
+</template>
+
+<script>
+import ConfirmModal from '@/components/BaseConfirmModal';
+
+export default {
+   name: 'ModalNewTrigger',
+   components: {
+      ConfirmModal
+   },
+   props: {
+      workspace: Object
+   },
+   data () {
+      return {
+         localTrigger: {
+            definer: '',
+            sql: 'BEGIN\r\n\r\nEND',
+            name: '',
+            table: '',
+            event1: 'BEFORE',
+            event2: 'INSERT'
+         },
+         isOptionsChanging: false
+      };
+   },
+   computed: {
+      schema () {
+         return this.workspace.breadcrumbs.schema;
+      },
+      schemaTables () {
+         const schemaTables = this.workspace.structure
+            .filter(schema => schema.name === this.schema)
+            .map(schema => schema.tables);
+
+         return schemaTables.length ? schemaTables[0].filter(table => table.type === 'table') : [];
+      }
+   },
+   mounted () {
+      this.localTrigger.table = this.schemaTables.length ? this.schemaTables[0].name : '';
+
+      setTimeout(() => {
+         this.$refs.firstInput.focus();
+      }, 20);
+   },
+   methods: {
+      confirmNewTrigger () {
+         this.$emit('open-create-trigger-editor', this.localTrigger);
+      }
+   }
+};
+</script>

src/renderer/components/ModalNewView.vue

@@ -0,0 +1,192 @@
+<template>
+   <ConfirmModal
+      :confirm-text="$t('word.confirm')"
+      size="medium"
+      @confirm="confirmOptionsChange"
+      @hide="$emit('close')"
+   >
+      <template :slot="'header'">
+         <div class="d-flex">
+            <i class="mdi mdi-24px mdi-eye-plus mr-1" /> {{ $t('message.createNewView') }}
+         </div>
+      </template>
+      <div :slot="'body'">
+         <div class="container">
+            <div class="columns mb-4">
+               <div class="column col-6">
+                  <div class="form-group">
+                     <label class="form-label">{{ $t('word.name') }}</label>
+                     <input
+                        ref="firstInput"
+                        v-model="localView.name"
+                        class="form-input"
+                        type="text"
+                     >
+                  </div>
+               </div>
+               <div class="column col-6">
+                  <div class="form-group">
+                     <label class="form-label">{{ $t('word.definer') }}</label>
+                     <select v-model="localView.definer" class="form-select">
+                        <option value="">
+                           {{ $t('message.currentUser') }}
+                        </option>
+                        <option
+                           v-for="user in workspace.users"
+                           :key="`${user.name}@${user.host}`"
+                           :value="`\`${user.name}\`@\`${user.host}\``"
+                        >
+                           {{ user.name }}@{{ user.host }}
+                        </option>
+                     </select>
+                  </div>
+               </div>
+            </div>
+            <div class="columns">
+               <div class="column col-4">
+                  <div class="form-group">
+                     <label class="form-label">{{ $t('message.sqlSecurity') }}</label>
+                     <label class="form-radio">
+                        <input
+                           v-model="localView.security"
+                           type="radio"
+                           name="security"
+                           value="DEFINER"
+                        >
+                        <i class="form-icon" /> DEFINER
+                     </label>
+                     <label class="form-radio">
+                        <input
+                           v-model="localView.security"
+                           type="radio"
+                           name="security"
+                           value="INVOKER"
+                        >
+                        <i class="form-icon" /> INVOKER
+                     </label>
+                  </div>
+               </div>
+               <div class="column col-4">
+                  <div class="form-group">
+                     <label class="form-label">{{ $t('word.algorithm') }}</label>
+                     <label class="form-radio">
+                        <input
+                           v-model="localView.algorithm"
+                           type="radio"
+                           name="algorithm"
+                           value="UNDEFINED"
+                        >
+                        <i class="form-icon" /> UNDEFINED
+                     </label>
+                     <label class="form-radio">
+                        <input
+                           v-model="localView.algorithm"
+                           type="radio"
+                           value="MERGE"
+                           name="algorithm"
+                        >
+                        <i class="form-icon" /> MERGE
+                     </label>
+                     <label class="form-radio">
+                        <input
+                           v-model="localView.algorithm"
+                           type="radio"
+                           value="TEMPTABLE"
+                           name="algorithm"
+                        >
+                        <i class="form-icon" /> TEMPTABLE
+                     </label>
+                  </div>
+               </div>
+               <div class="column col-4">
+                  <div class="form-group">
+                     <label class="form-label">{{ $t('message.updateOption') }}</label>
+                     <label class="form-radio">
+                        <input
+                           v-model="localView.updateOption"
+                           type="radio"
+                           name="update"
+                           value=""
+                        >
+                        <i class="form-icon" /> None
+                     </label>
+                     <label class="form-radio">
+                        <input
+                           v-model="localView.updateOption"
+                           type="radio"
+                           name="update"
+                           value="CASCADED"
+                        >
+                        <i class="form-icon" /> CASCADED
+                     </label>
+                     <label class="form-radio">
+                        <input
+                           v-model="localView.updateOption"
+                           type="radio"
+                           name="update"
+                           value="LOCAL"
+                        >
+                        <i class="form-icon" /> LOCAL
+                     </label>
+                  </div>
+               </div>
+            </div>
+         </div>
+         <div class="workspace-query-results column col-12 mt-2">
+            <label class="form-label ml-2">{{ $t('message.selectStatement') }}</label>
+            <QueryEditor
+               ref="queryEditor"
+               :value.sync="localView.sql"
+               :workspace="workspace"
+               :schema="schema"
+               :height="editorHeight"
+            />
+         </div>
+      </div>
+   </ConfirmModal>
+</template>
+
+<script>
+import ConfirmModal from '@/components/BaseConfirmModal';
+import QueryEditor from '@/components/QueryEditor';
+
+export default {
+   name: 'ModalNewView',
+   components: {
+      ConfirmModal,
+      QueryEditor
+   },
+   props: {
+      workspace: Object
+   },
+   data () {
+      return {
+         localView: {
+            algorithm: 'UNDEFINED',
+            definer: '',
+            security: 'DEFINER',
+            updateOption: '',
+            sql: '',
+            name: ''
+         },
+         isOptionsChanging: false,
+         editorHeight: 300
+      };
+   },
+   computed: {
+      schema () {
+         return this.workspace.breadcrumbs.schema;
+      }
+   },
+   mounted () {
+      setTimeout(() => {
+         this.$refs.firstInput.focus();
+      }, 20);
+   },
+   methods: {
+      confirmOptionsChange () {
+         this.$emit('open-create-view-editor', this.localView);
+      }
+   }
+};
+</script>

src/renderer/components/ModalSettings.vue

@@ -56,7 +56,7 @@
                               <div class="col-6 col-sm-12">
                                  <label class="form-label">
                                     <i class="mdi mdi-18px mdi-translate mr-1" />
-                                    {{ $t('word.language') }}:
+                                    {{ $t('word.language') }}
                                  </label>
                               </div>
                               <div class="col-6 col-sm-12">
@@ -78,7 +78,7 @@
                            <div class="form-group">
                               <div class="col-6 col-sm-12">
                                  <label class="form-label">
-                                    {{ $t('message.notificationsTimeout') }}:
+                                    {{ $t('message.notificationsTimeout') }}
                                  </label>
                               </div>
                               <div class="col-6 col-sm-12">
@@ -103,7 +103,7 @@
                            <div class="form-group">
                               <div class="col-6 col-sm-12">
                                  <label class="form-label">
-                                    {{ $t('word.autoCompletion') }}:
+                                    {{ $t('word.autoCompletion') }}
                                  </label>
                               </div>
                               <div class="col-6 col-sm-12">
@@ -114,6 +114,21 @@
                               </div>
                            </div>
                         </div>
+                        <div class="column col-8 col-sm-12">
+                           <div class="form-group">
+                              <div class="col-6 col-sm-12">
+                                 <label class="form-label">
+                                    {{ $t('message.wrapLongLines') }}
+                                 </label>
+                              </div>
+                              <div class="col-6 col-sm-12">
+                                 <label class="form-switch d-inline-block" @click.prevent="toggleLineWrap">
+                                    <input type="checkbox" :checked="selectedLineWrap">
+                                    <i class="form-icon" />
+                                 </label>
+                              </div>
+                           </div>
+                        </div>
                      </form>
                   </div>
                </div>
@@ -190,9 +205,9 @@
                      <img :src="require('@/images/logo.svg').default" width="128">
                      <h4>{{ appName }}</h4>
                      <p>
-                        {{ $t('word.version') }}: {{ appVersion }}<br>
-                        <a class="c-hand" @click="openOutside('https://github.com/Fabio286/antares')">GitHub</a><br>
-                        <small>{{ $t('word.author') }}: <a class="c-hand" @click="openOutside('https://github.com/Fabio286')">Fabio Di Stasio</a></small><br>
+                        {{ $t('word.version') }} {{ appVersion }}<br>
+                        <a class="c-hand" @click="openOutside('https://github.com/Fabio286/antares')">GitHub</a> | <a class="c-hand" @click="openOutside('https://github.com/Fabio286/antares/blob/master/CHANGELOG.md')">CHANGELOG</a><br>
+                        <small>{{ $t('word.author') }} <a class="c-hand" @click="openOutside('https://github.com/Fabio286')">Fabio Di Stasio</a></small><br>
                         <small>{{ $t('message.madeWithJS') }}</small>
                      </p>
                   </div>
@@ -280,6 +295,7 @@ export default {
          selectedSettingTab: 'application/selectedSettingTab',
          selectedLocale: 'settings/getLocale',
          selectedAutoComplete: 'settings/getAutoComplete',
+         selectedLineWrap: 'settings/getLineWrap',
          notificationsTimeout: 'settings/getNotificationsTimeout',
          applicationTheme: 'settings/getApplicationTheme',
          editorTheme: 'settings/getEditorTheme',
@@ -333,6 +349,7 @@ ORDER BY
          closeModal: 'application/hideSettingModal',
          changeLocale: 'settings/changeLocale',
          changeAutoComplete: 'settings/changeAutoComplete',
+         changeLineWrap: 'settings/changeLineWrap',
          changeEditorTheme: 'settings/changeEditorTheme',
          updateNotificationsTimeout: 'settings/updateNotificationsTimeout'
       }),
@@ -355,6 +372,9 @@ ORDER BY
       },
       toggleAutoComplete () {
          this.changeAutoComplete(!this.selectedAutoComplete);
+      },
+      toggleLineWrap () {
+         this.changeLineWrap(!this.selectedLineWrap);
       }
    }
 };

src/renderer/components/QueryEditor.vue

@@ -1,7 +1,7 @@
 <template>
    <div class="editor-wrapper">
       <div
-         ref="editor"
+         :id="`editor-${id}`"
          class="editor"
          :style="{height: `${height}px`}"
       />
@@ -12,7 +12,7 @@
 import * as ace from 'ace-builds';
 import 'ace-builds/webpack-resolver';
 import '../libs/ext-language_tools';
-import { mapGetters } from 'vuex';
+import { mapGetters, mapActions } from 'vuex';
 import Tables from '@/ipc-api/Tables';
 
 export default {
@@ -20,6 +20,7 @@ export default {
    props: {
       value: String,
       workspace: Object,
+      isSelected: Boolean,
       schema: { type: String, default: '' },
       autoFocus: { type: Boolean, default: false },
       readOnly: { type: Boolean, default: false },
@@ -29,13 +30,17 @@ export default {
       return {
          editor: null,
          fields: [],
-         baseCompleter: []
+         customCompleter: [],
+         id: null,
+         lastSchema: null
       };
    },
    computed: {
       ...mapGetters({
          editorTheme: 'settings/getEditorTheme',
-         autoComplete: 'settings/getAutoComplete'
+         autoComplete: 'settings/getAutoComplete',
+         lineWrap: 'settings/getLineWrap',
+         baseCompleter: 'application/getBaseCompleter'
       }),
       tables () {
          return this.workspace
@@ -46,13 +51,68 @@ export default {
                }, []).map(table => {
                   return {
                      name: table.name,
-                     comment: table.comment,
                      type: table.type,
                      fields: []
                   };
                })
             : [];
       },
+      triggers () {
+         return this.workspace
+            ? this.workspace.structure.filter(schema => schema.name === this.schema)
+               .reduce((acc, curr) => {
+                  acc.push(...curr.triggers);
+                  return acc;
+               }, []).map(trigger => {
+                  return {
+                     name: trigger.name,
+                     type: 'trigger'
+                  };
+               })
+            : [];
+      },
+      procedures () {
+         return this.workspace
+            ? this.workspace.structure.filter(schema => schema.name === this.schema)
+               .reduce((acc, curr) => {
+                  acc.push(...curr.procedures);
+                  return acc;
+               }, []).map(procedure => {
+                  return {
+                     name: `${procedure.name}()`,
+                     type: 'routine'
+                  };
+               })
+            : [];
+      },
+      functions () {
+         return this.workspace
+            ? this.workspace.structure.filter(schema => schema.name === this.schema)
+               .reduce((acc, curr) => {
+                  acc.push(...curr.functions);
+                  return acc;
+               }, []).map(func => {
+                  return {
+                     name: `${func.name}()`,
+                     type: 'function'
+                  };
+               })
+            : [];
+      },
+      schedulers () {
+         return this.workspace
+            ? this.workspace.structure.filter(schema => schema.name === this.schema)
+               .reduce((acc, curr) => {
+                  acc.push(...curr.schedulers);
+                  return acc;
+               }, []).map(scheduler => {
+                  return {
+                     name: scheduler.name,
+                     type: 'scheduler'
+                  };
+               })
+            : [];
+      },
       mode () {
          switch (this.workspace.client) {
             case 'mysql':
@@ -100,10 +160,31 @@ export default {
                enableLiveAutocompletion: this.autoComplete
             });
          }
+      },
+      lineWrap () {
+         if (this.editor) {
+            this.editor.setOptions({
+               wrap: this.lineWrap
+            });
+         }
+      },
+      isSelected () {
+         if (this.isSelected)
+            this.lastSchema = this.schema;
+      },
+      lastSchema () {
+         if (this.editor) {
+            this.editor.completers = this.baseCompleter.map(el => Object.assign({}, el));
+            this.setCustomCompleter();
+         }
       }
    },
+   created () {
+      this.id = this._uid;
+      this.lastSchema = this.schema;
+   },
    mounted () {
-      this.editor = ace.edit(this.$refs.editor, {
+      this.editor = ace.edit(`editor-${this.id}`, {
          mode: `ace/mode/${this.mode}`,
          theme: `ace/theme/${this.editorTheme}`,
          value: this.value,
@@ -114,25 +195,15 @@ export default {
 
       this.editor.setOptions({
          enableBasicAutocompletion: true,
+         wrap: this.lineWrap,
          enableSnippets: true,
          enableLiveAutocompletion: this.autoComplete
       });
 
-      this.editor.completers.push({
-         getCompletions: (editor, session, pos, prefix, callback) => {
-            const completions = [];
-            this.tables.forEach(table => {
-               completions.push({
-                  value: table.name,
-                  meta: table.type,
-                  caption: table.comment
-               });
-            });
-            callback(null, completions);
-         }
-      });
+      if (!this.baseCompleter.length)
+         this.setBaseCompleters(this.editor.completers.map(el => Object.assign({}, el)));
 
-      this.baseCompleter = this.editor.completers;
+      this.setCustomCompleter();
 
       this.editor.commands.on('afterExec', e => {
          if (['insertstring', 'backspace', 'del'].includes(e.command.name)) {
@@ -155,13 +226,13 @@ export default {
                      }).catch(console.log);
                   }
                   else
-                     this.editor.completers = this.baseCompleter;
+                     this.editor.completers = this.customCompleter;
                }
                else
-                  this.editor.completers = this.baseCompleter;
+                  this.editor.completers = this.customCompleter;
             }
             else
-               this.editor.completers = this.baseCompleter;
+               this.editor.completers = this.customCompleter;
          }
       });
 
@@ -173,8 +244,40 @@ export default {
       if (this.autoFocus) {
          setTimeout(() => {
             this.editor.focus();
+            this.editor.resize();
          }, 20);
       }
+
+      setTimeout(() => {
+         this.editor.resize();
+      }, 20);
+   },
+   methods: {
+      ...mapActions({
+         setBaseCompleters: 'application/setBaseCompleter'
+      }),
+      setCustomCompleter () {
+         this.editor.completers.push({
+            getCompletions: (editor, session, pos, prefix, callback) => {
+               const completions = [];
+               [
+                  ...this.tables,
+                  ...this.triggers,
+                  ...this.procedures,
+                  ...this.functions,
+                  ...this.schedulers
+               ].forEach(el => {
+                  completions.push({
+                     value: el.name,
+                     meta: el.type
+                  });
+               });
+               callback(null, completions);
+            }
+         });
+
+         this.customCompleter = this.editor.completers;
+      }
    }
 };
 </script>

src/renderer/components/TheFooter.vue

@@ -2,9 +2,9 @@
    <div id="footer" class="text-light">
       <div class="footer-left-elements">
          <ul class="footer-elements">
-            <li class="footer-element" :title="$t('word.version')">
-               <i class="mdi mdi-18px mdi-memory mr-1" />
-               <small>{{ appVersion }}</small>
+            <li class="footer-element">
+               <i class="mdi mdi-18px mdi-database mr-1" />
+               <small>{{ versionString }}</small>
             </li>
          </ul>
       </div>
@@ -34,9 +34,18 @@ export default {
    name: 'TheFooter',
    computed: {
       ...mapGetters({
-         appName: 'application/appName',
+         workspace: 'workspaces/getSelected',
+         getWorkspace: 'workspaces/getWorkspace',
          appVersion: 'application/appVersion'
-      })
+      }),
+      version () {
+         return this.getWorkspace(this.workspace) ? this.getWorkspace(this.workspace).version : null;
+      },
+      versionString () {
+         if (this.version)
+            return `${this.version.name} ${this.version.number} (${this.version.arch} ${this.version.os})`;
+         return '';
+      }
    },
    methods: {
       ...mapActions({

src/renderer/components/Workspace.vue

@@ -13,25 +13,25 @@
                </a>
             </li>
             <li
-               v-if="workspace.breadcrumbs.table"
+               v-if="schemaChild"
                class="tab-item"
                :class="{'active': selectedTab === 'prop'}"
                @click="selectTab({uid: workspace.uid, tab: 'prop'})"
             >
                <a class="tab-link">
                   <i class="mdi mdi-18px mdi-tune mr-1" />
-                  <span :title="workspace.breadcrumbs.table">{{ $t('word.properties').toUpperCase() }}: {{ workspace.breadcrumbs.table }}</span>
+                  <span :title="schemaChild">{{ $t('word.settings').toUpperCase() }}: {{ schemaChild }}</span>
                </a>
             </li>
             <li
-               v-if="workspace.breadcrumbs.table"
+               v-if="workspace.breadcrumbs.table || workspace.breadcrumbs.view"
                class="tab-item"
                :class="{'active': selectedTab === 'data'}"
                @click="selectTab({uid: workspace.uid, tab: 'data'})"
             >
                <a class="tab-link">
-                  <i class="mdi mdi-18px mdi-table mr-1" />
-                  <span :title="workspace.breadcrumbs.table">{{ $t('word.data').toUpperCase() }}: {{ workspace.breadcrumbs.table }}</span>
+                  <i class="mdi mdi-18px mr-1" :class="workspace.breadcrumbs.table ? 'mdi-table' : 'mdi-table-eye'" />
+                  <span :title="schemaChild">{{ $t('word.data').toUpperCase() }}: {{ schemaChild }}</span>
                </a>
             </li>
             <li
@@ -66,20 +66,50 @@
             </li>
          </ul>
          <WorkspacePropsTab
-            v-show="selectedTab === 'prop'"
+            v-show="selectedTab === 'prop' && workspace.breadcrumbs.table"
             :is-selected="selectedTab === 'prop'"
             :connection="connection"
             :table="workspace.breadcrumbs.table"
          />
+         <WorkspacePropsTabView
+            v-show="selectedTab === 'prop' && workspace.breadcrumbs.view"
+            :is-selected="selectedTab === 'prop'"
+            :connection="connection"
+            :view="workspace.breadcrumbs.view"
+         />
+         <WorkspacePropsTabTrigger
+            v-show="selectedTab === 'prop' && workspace.breadcrumbs.trigger"
+            :is-selected="selectedTab === 'prop'"
+            :connection="connection"
+            :trigger="workspace.breadcrumbs.trigger"
+         />
+         <WorkspacePropsTabRoutine
+            v-show="selectedTab === 'prop' && workspace.breadcrumbs.procedure"
+            :is-selected="selectedTab === 'prop'"
+            :connection="connection"
+            :routine="workspace.breadcrumbs.procedure"
+         />
+         <WorkspacePropsTabFunction
+            v-show="selectedTab === 'prop' && workspace.breadcrumbs.function"
+            :is-selected="selectedTab === 'prop'"
+            :connection="connection"
+            :function="workspace.breadcrumbs.function"
+         />
+         <WorkspacePropsTabScheduler
+            v-show="selectedTab === 'prop' && workspace.breadcrumbs.scheduler"
+            :is-selected="selectedTab === 'prop'"
+            :connection="connection"
+            :scheduler="workspace.breadcrumbs.scheduler"
+         />
          <WorkspaceTableTab
             v-show="selectedTab === 'data'"
             :connection="connection"
-            :table="workspace.breadcrumbs.table"
+            :table="workspace.breadcrumbs.table || workspace.breadcrumbs.view"
          />
          <WorkspaceQueryTab
             v-for="tab of queryTabs"
             :key="tab.uid"
-            :tab-uid="tab.uid"
+            :tab="tab"
             :is-selected="selectedTab === tab.uid"
             :connection="connection"
          />
@@ -94,6 +124,11 @@ import WorkspaceExploreBar from '@/components/WorkspaceExploreBar';
 import WorkspaceQueryTab from '@/components/WorkspaceQueryTab';
 import WorkspaceTableTab from '@/components/WorkspaceTableTab';
 import WorkspacePropsTab from '@/components/WorkspacePropsTab';
+import WorkspacePropsTabView from '@/components/WorkspacePropsTabView';
+import WorkspacePropsTabTrigger from '@/components/WorkspacePropsTabTrigger';
+import WorkspacePropsTabRoutine from '@/components/WorkspacePropsTabRoutine';
+import WorkspacePropsTabFunction from '@/components/WorkspacePropsTabFunction';
+import WorkspacePropsTabScheduler from '@/components/WorkspacePropsTabScheduler';
 
 export default {
    name: 'Workspace',
@@ -101,7 +136,12 @@ export default {
       WorkspaceExploreBar,
       WorkspaceQueryTab,
       WorkspaceTableTab,
-      WorkspacePropsTab
+      WorkspacePropsTab,
+      WorkspacePropsTabView,
+      WorkspacePropsTabTrigger,
+      WorkspacePropsTabRoutine,
+      WorkspacePropsTabFunction,
+      WorkspacePropsTabScheduler
    },
    props: {
       connection: Object
@@ -123,7 +163,22 @@ export default {
          return this.selectedWorkspace === this.connection.uid;
       },
       selectedTab () {
-         if (this.workspace.breadcrumbs.table === null && ['data', 'prop'].includes(this.workspace.selected_tab))
+         if (
+            (
+               this.workspace.breadcrumbs.table === null &&
+               this.workspace.breadcrumbs.view === null &&
+               this.workspace.breadcrumbs.trigger === null &&
+               this.workspace.breadcrumbs.procedure === null &&
+               this.workspace.breadcrumbs.function === null &&
+               this.workspace.breadcrumbs.scheduler === null &&
+               ['data', 'prop'].includes(this.workspace.selected_tab)
+            ) ||
+            (
+               this.workspace.breadcrumbs.table === null &&
+               this.workspace.breadcrumbs.view === null &&
+               this.workspace.selected_tab === 'data'
+            )
+         )
             return this.queryTabs[0].uid;
 
          return this.queryTabs.find(tab => tab.uid === this.workspace.selected_tab) ||
@@ -133,6 +188,13 @@ export default {
       },
       queryTabs () {
          return this.workspace.tabs.filter(tab => tab.type === 'query');
+      },
+      schemaChild () {
+         for (const key in this.workspace.breadcrumbs) {
+            if (key === 'schema') continue;
+            if (this.workspace.breadcrumbs[key]) return this.workspace.breadcrumbs[key];
+         }
+         return false;
       }
    },
    async created () {
@@ -159,7 +221,7 @@ export default {
          removeTab: 'workspaces/removeTab'
       }),
       addTab () {
-         this.newTab(this.connection.uid);
+         this.newTab({ uid: this.connection.uid });
 
          if (!this.hasWheelEvent) {
             this.$refs.tabWrap.addEventListener('wheel', e => {

src/renderer/components/WorkspaceExploreBar.vue

@@ -27,6 +27,17 @@
                />
             </span>
          </div>
+         <div class="workspace-explorebar-search">
+            <div v-if="workspace.connected" class="has-icon-right">
+               <input
+                  v-model="searchTerm"
+                  class="form-input input-sm"
+                  type="text"
+                  :placeholder="$t('message.searchForElements')"
+               >
+               <i class="form-icon mdi mdi-magnify mdi-18px" />
+            </div>
+         </div>
          <WorkspaceConnectPanel
             v-if="!workspace.connected"
             class="workspace-explorebar-body"
@@ -40,6 +51,7 @@
                :connection="connection"
                @show-database-context="openDatabaseContext"
                @show-table-context="openTableContext"
+               @show-misc-context="openMiscContext"
             />
          </div>
       </div>
@@ -54,12 +66,47 @@
          @close="hideCreateTableModal"
          @open-create-table-editor="openCreateTableEditor"
       />
+      <ModalNewView
+         v-if="isNewViewModal"
+         :workspace="workspace"
+         @close="hideCreateViewModal"
+         @open-create-view-editor="openCreateViewEditor"
+      />
+      <ModalNewTrigger
+         v-if="isNewTriggerModal"
+         :workspace="workspace"
+         @close="hideCreateTriggerModal"
+         @open-create-trigger-editor="openCreateTriggerEditor"
+      />
+      <ModalNewRoutine
+         v-if="isNewRoutineModal"
+         :workspace="workspace"
+         @close="hideCreateRoutineModal"
+         @open-create-routine-editor="openCreateRoutineEditor"
+      />
+      <ModalNewFunction
+         v-if="isNewFunctionModal"
+         :workspace="workspace"
+         @close="hideCreateFunctionModal"
+         @open-create-function-editor="openCreateFunctionEditor"
+      />
+      <ModalNewScheduler
+         v-if="isNewSchedulerModal"
+         :workspace="workspace"
+         @close="hideCreateSchedulerModal"
+         @open-create-scheduler-editor="openCreateSchedulerEditor"
+      />
       <DatabaseContext
          v-if="isDatabaseContext"
          :selected-database="selectedDatabase"
          :context-event="databaseContextEvent"
          @close-context="closeDatabaseContext"
          @show-create-table-modal="showCreateTableModal"
+         @show-create-view-modal="showCreateViewModal"
+         @show-create-trigger-modal="showCreateTriggerModal"
+         @show-create-routine-modal="showCreateRoutineModal"
+         @show-create-function-modal="showCreateFunctionModal"
+         @show-create-scheduler-modal="showCreateSchedulerModal"
          @reload="refresh"
       />
       <TableContext
@@ -69,19 +116,38 @@
          @close-context="closeTableContext"
          @reload="refresh"
       />
+      <MiscContext
+         v-if="isMiscContext"
+         :selected-misc="selectedMisc"
+         :context-event="miscContextEvent"
+         @close-context="closeMiscContext"
+         @reload="refresh"
+      />
    </div>
 </template>
 
 <script>
 import { mapGetters, mapActions } from 'vuex';
-import _ from 'lodash';
+
 import Tables from '@/ipc-api/Tables';
+import Views from '@/ipc-api/Views';
+import Triggers from '@/ipc-api/Triggers';
+import Routines from '@/ipc-api/Routines';
+import Functions from '@/ipc-api/Functions';
+import Schedulers from '@/ipc-api/Schedulers';
+
 import WorkspaceConnectPanel from '@/components/WorkspaceConnectPanel';
 import WorkspaceExploreBarDatabase from '@/components/WorkspaceExploreBarDatabase';
 import DatabaseContext from '@/components/WorkspaceExploreBarDatabaseContext';
 import TableContext from '@/components/WorkspaceExploreBarTableContext';
+import MiscContext from '@/components/WorkspaceExploreBarMiscContext';
 import ModalNewDatabase from '@/components/ModalNewDatabase';
 import ModalNewTable from '@/components/ModalNewTable';
+import ModalNewView from '@/components/ModalNewView';
+import ModalNewTrigger from '@/components/ModalNewTrigger';
+import ModalNewRoutine from '@/components/ModalNewRoutine';
+import ModalNewFunction from '@/components/ModalNewFunction';
+import ModalNewScheduler from '@/components/ModalNewScheduler';
 
 export default {
    name: 'WorkspaceExploreBar',
@@ -90,8 +156,14 @@ export default {
       WorkspaceExploreBarDatabase,
       DatabaseContext,
       TableContext,
+      MiscContext,
       ModalNewDatabase,
-      ModalNewTable
+      ModalNewTable,
+      ModalNewView,
+      ModalNewTrigger,
+      ModalNewRoutine,
+      ModalNewFunction,
+      ModalNewScheduler
    },
    props: {
       connection: Object,
@@ -100,15 +172,30 @@ export default {
    data () {
       return {
          isRefreshing: false,
+
          isNewDBModal: false,
          isNewTableModal: false,
+         isNewViewModal: false,
+         isNewTriggerModal: false,
+         isNewRoutineModal: false,
+         isNewFunctionModal: false,
+         isNewSchedulerModal: false,
+
          localWidth: null,
+         explorebarWidthInterval: null,
+         searchTermInterval: null,
          isDatabaseContext: false,
          isTableContext: false,
+         isMiscContext: false,
+
          databaseContextEvent: null,
          tableContextEvent: null,
+         miscContextEvent: null,
+
          selectedDatabase: '',
-         selectedTable: ''
+         selectedTable: null,
+         selectedMisc: null,
+         searchTerm: ''
       };
    },
    computed: {
@@ -125,11 +212,22 @@ export default {
       }
    },
    watch: {
-      localWidth: _.debounce(function (val) {
-         this.changeExplorebarSize(val);
-      }, 500),
+      localWidth (val) {
+         clearTimeout(this.explorebarWidthInterval);
+
+         this.explorebarWidthInterval = setTimeout(() => {
+            this.changeExplorebarSize(val);
+         }, 500);
+      },
       isSelected (val) {
          if (val) this.localWidth = this.explorebarSize;
+      },
+      searchTerm () {
+         clearTimeout(this.searchTermInterval);
+
+         this.searchTermInterval = setTimeout(() => {
+            this.setSearchTerm(this.searchTerm);
+         }, 200);
       }
    },
    created () {
@@ -138,7 +236,7 @@ export default {
    mounted () {
       const resizer = this.$refs.resizer;
 
-      resizer.addEventListener('mousedown', (e) => {
+      resizer.addEventListener('mousedown', e => {
          e.preventDefault();
 
          window.addEventListener('mousemove', this.resize);
@@ -151,6 +249,7 @@ export default {
          refreshStructure: 'workspaces/refreshStructure',
          changeBreadcrumbs: 'workspaces/changeBreadcrumbs',
          selectTab: 'workspaces/selectTab',
+         setSearchTerm: 'workspaces/setSearchTerm',
          addNotification: 'notifications/addNotification',
          changeExplorebarSize: 'settings/changeExplorebarSize'
       }),
@@ -215,6 +314,129 @@ export default {
       },
       closeTableContext () {
          this.isTableContext = false;
+      },
+      openMiscContext (payload) {
+         this.selectedMisc = payload.misc;
+         this.miscContextEvent = payload.event;
+         this.isMiscContext = true;
+      },
+      closeMiscContext () {
+         this.isMiscContext = false;
+      },
+      showCreateViewModal () {
+         this.closeDatabaseContext();
+         this.isNewViewModal = true;
+      },
+      hideCreateViewModal () {
+         this.isNewViewModal = false;
+      },
+      async openCreateViewEditor (payload) {
+         const params = {
+            uid: this.connection.uid,
+            ...payload
+         };
+
+         const { status, response } = await Views.createView(params);
+
+         if (status === 'success') {
+            await this.refresh();
+            this.changeBreadcrumbs({ schema: this.selectedDatabase, view: payload.name });
+            this.selectTab({ uid: this.workspace.uid, tab: 'prop' });
+         }
+         else
+            this.addNotification({ status: 'error', message: response });
+      },
+      showCreateTriggerModal () {
+         this.closeDatabaseContext();
+         this.isNewTriggerModal = true;
+      },
+      hideCreateTriggerModal () {
+         this.isNewTriggerModal = false;
+      },
+      async openCreateTriggerEditor (payload) {
+         const params = {
+            uid: this.connection.uid,
+            ...payload
+         };
+
+         const { status, response } = await Triggers.createTrigger(params);
+
+         if (status === 'success') {
+            await this.refresh();
+            this.changeBreadcrumbs({ schema: this.selectedDatabase, trigger: payload.name });
+            this.selectTab({ uid: this.workspace.uid, tab: 'prop' });
+         }
+         else
+            this.addNotification({ status: 'error', message: response });
+      },
+      showCreateRoutineModal () {
+         this.closeDatabaseContext();
+         this.isNewRoutineModal = true;
+      },
+      hideCreateRoutineModal () {
+         this.isNewRoutineModal = false;
+      },
+      async openCreateRoutineEditor (payload) {
+         const params = {
+            uid: this.connection.uid,
+            ...payload
+         };
+
+         const { status, response } = await Routines.createRoutine(params);
+
+         if (status === 'success') {
+            await this.refresh();
+            this.changeBreadcrumbs({ schema: this.selectedDatabase, procedure: payload.name });
+            this.selectTab({ uid: this.workspace.uid, tab: 'prop' });
+         }
+         else
+            this.addNotification({ status: 'error', message: response });
+      },
+      showCreateFunctionModal () {
+         this.closeDatabaseContext();
+         this.isNewFunctionModal = true;
+      },
+      hideCreateFunctionModal () {
+         this.isNewFunctionModal = false;
+      },
+      showCreateSchedulerModal () {
+         this.closeDatabaseContext();
+         this.isNewSchedulerModal = true;
+      },
+      hideCreateSchedulerModal () {
+         this.isNewSchedulerModal = false;
+      },
+      async openCreateFunctionEditor (payload) {
+         const params = {
+            uid: this.connection.uid,
+            ...payload
+         };
+
+         const { status, response } = await Functions.createFunction(params);
+
+         if (status === 'success') {
+            await this.refresh();
+            this.changeBreadcrumbs({ schema: this.selectedDatabase, function: payload.name });
+            this.selectTab({ uid: this.workspace.uid, tab: 'prop' });
+         }
+         else
+            this.addNotification({ status: 'error', message: response });
+      },
+      async openCreateSchedulerEditor (payload) {
+         const params = {
+            uid: this.connection.uid,
+            ...payload
+         };
+
+         const { status, response } = await Schedulers.createScheduler(params);
+
+         if (status === 'success') {
+            await this.refresh();
+            this.changeBreadcrumbs({ schema: this.selectedDatabase, scheduler: payload.name });
+            this.selectTab({ uid: this.workspace.uid, tab: 'prop' });
+         }
+         else
+            this.addNotification({ status: 'error', message: response });
       }
    }
 };
@@ -280,9 +502,40 @@ export default {
       }
     }
 
+    .workspace-explorebar-search {
+      width: 100%;
+      display: flex;
+      justify-content: space-between;
+      font-size: 0.6rem;
+      height: 28px;
+
+      .has-icon-right {
+        width: 100%;
+        padding: 0.1rem;
+
+        .form-icon {
+          opacity: 0.5;
+          transition: opacity 0.2s;
+        }
+
+        .form-input {
+          height: 1.2rem;
+          padding-left: 0.2rem;
+
+          &:focus + .form-icon {
+            opacity: 0.9;
+          }
+
+          &::placeholder {
+            opacity: 0.6;
+          }
+        }
+      }
+    }
+
     .workspace-explorebar-body {
       width: 100%;
-      height: calc((100vh - 30px) - #{$excluding-size});
+      height: calc((100vh - 58px) - #{$excluding-size});
       overflow: overlay;
       padding: 0 0.1rem;
     }

src/renderer/components/WorkspaceExploreBarDatabase.vue

@@ -3,10 +3,11 @@
       <summary
          class="accordion-header database-name"
          :class="{'text-bold': breadcrumbs.schema === database.name}"
-         @click="changeBreadcrumbs({schema: database.name, table: null})"
+         @click="selectSchema(database.name)"
          @contextmenu.prevent="showDatabaseContext($event, database.name)"
       >
-         <i class="icon mdi mdi-18px mdi-chevron-right" />
+         <div v-if="isLoading" class="icon loading" />
+         <i v-else class="icon mdi mdi-18px mdi-chevron-right" />
          <i class="database-icon mdi mdi-18px mdi-database mr-1" />
          <span>{{ database.name }}</span>
       </summary>
@@ -14,23 +15,139 @@
          <div class="database-tables">
             <ul class="menu menu-nav pt-0">
                <li
-                  v-for="table of database.tables"
+                  v-for="table of filteredTables"
                   :key="table.name"
                   class="menu-item"
-                  :class="{'text-bold': breadcrumbs.schema === database.name && breadcrumbs.table === table.name}"
-                  @click="setBreadcrumbs({schema: database.name, table: table.name})"
-                  @contextmenu.prevent="showTableContext($event, table.name)"
+                  :class="{'text-bold': breadcrumbs.schema === database.name && [breadcrumbs.table, breadcrumbs.view].includes(table.name)}"
+                  @click="setBreadcrumbs({schema: database.name, [table.type]: table.name})"
+                  @contextmenu.prevent="showTableContext($event, table)"
                >
                   <a class="table-name">
                      <i class="table-icon mdi mdi-18px mr-1" :class="table.type === 'view' ? 'mdi-table-eye' : 'mdi-table'" />
-                     <span>{{ table.name }}</span>
+                     <span v-html="highlightWord(table.name)" />
                   </a>
-                  <div class="table-size  tooltip tooltip-left mr-1" :data-tooltip="formatBytes(table.size)">
+                  <div
+                     v-if="table.type === 'table'"
+                     class="table-size  tooltip tooltip-left mr-1"
+                     :data-tooltip="formatBytes(table.size)"
+                  >
                      <div class="pie" :style="piePercentage(table.size)" />
                   </div>
                </li>
             </ul>
          </div>
+
+         <div v-if="filteredTriggers.length" class="database-misc">
+            <details class="accordion">
+               <summary class="accordion-header misc-name" :class="{'text-bold': breadcrumbs.schema === database.name && breadcrumbs.trigger}">
+                  <i class="misc-icon mdi mdi-18px mdi-folder-cog mr-1" />
+                  {{ $tc('word.trigger', 2) }}
+               </summary>
+               <div class="accordion-body">
+                  <div>
+                     <ul class="menu menu-nav pt-0">
+                        <li
+                           v-for="trigger of filteredTriggers"
+                           :key="trigger.name"
+                           class="menu-item"
+                           :class="{'text-bold': breadcrumbs.schema === database.name && breadcrumbs.trigger === trigger.name}"
+                           @click="setBreadcrumbs({schema: database.name, trigger: trigger.name})"
+                           @contextmenu.prevent="showMiscContext($event, {...trigger, type: 'trigger'})"
+                        >
+                           <a class="table-name">
+                              <i class="table-icon mdi mdi-table-cog mdi-18px mr-1" />
+                              <span v-html="highlightWord(trigger.name)" />
+                           </a>
+                        </li>
+                     </ul>
+                  </div>
+               </div>
+            </details>
+         </div>
+
+         <div v-if="filteredProcedures.length" class="database-misc">
+            <details class="accordion">
+               <summary class="accordion-header misc-name" :class="{'text-bold': breadcrumbs.schema === database.name && breadcrumbs.procedure}">
+                  <i class="misc-icon mdi mdi-18px mdi-folder-sync mr-1" />
+                  {{ $tc('word.storedRoutine', 2) }}
+               </summary>
+               <div class="accordion-body">
+                  <div>
+                     <ul class="menu menu-nav pt-0">
+                        <li
+                           v-for="procedure of filteredProcedures"
+                           :key="procedure.name"
+                           class="menu-item"
+                           :class="{'text-bold': breadcrumbs.schema === database.name && breadcrumbs.procedure === procedure.name}"
+                           @click="setBreadcrumbs({schema: database.name, procedure: procedure.name})"
+                           @contextmenu.prevent="showMiscContext($event, {...procedure, type: 'procedure'})"
+                        >
+                           <a class="table-name">
+                              <i class="table-icon mdi mdi-sync-circle mdi-18px mr-1" />
+                              <span v-html="highlightWord(procedure.name)" />
+                           </a>
+                        </li>
+                     </ul>
+                  </div>
+               </div>
+            </details>
+         </div>
+
+         <div v-if="filteredFunctions.length" class="database-misc">
+            <details class="accordion">
+               <summary class="accordion-header misc-name" :class="{'text-bold': breadcrumbs.schema === database.name && breadcrumbs.function}">
+                  <i class="misc-icon mdi mdi-18px mdi-folder-move mr-1" />
+                  {{ $tc('word.function', 2) }}
+               </summary>
+               <div class="accordion-body">
+                  <div>
+                     <ul class="menu menu-nav pt-0">
+                        <li
+                           v-for="func of filteredFunctions"
+                           :key="func.name"
+                           class="menu-item"
+                           :class="{'text-bold': breadcrumbs.schema === database.name && breadcrumbs.function === func.name}"
+                           @click="setBreadcrumbs({schema: database.name, function: func.name})"
+                           @contextmenu.prevent="showMiscContext($event, {...func, type: 'function'})"
+                        >
+                           <a class="table-name">
+                              <i class="table-icon mdi mdi-arrow-right-bold-box mdi-18px mr-1" />
+                              <span v-html="highlightWord(func.name)" />
+                           </a>
+                        </li>
+                     </ul>
+                  </div>
+               </div>
+            </details>
+         </div>
+
+         <div v-if="filteredSchedulers.length" class="database-misc">
+            <details class="accordion">
+               <summary class="accordion-header misc-name" :class="{'text-bold': breadcrumbs.schema === database.name && breadcrumbs.scheduler}">
+                  <i class="misc-icon mdi mdi-18px mdi-folder-clock mr-1" />
+                  {{ $tc('word.scheduler', 2) }}
+               </summary>
+               <div class="accordion-body">
+                  <div>
+                     <ul class="menu menu-nav pt-0">
+                        <li
+                           v-for="scheduler of filteredSchedulers"
+                           :key="scheduler.name"
+                           class="menu-item"
+                           :class="{'text-bold': breadcrumbs.schema === database.name && breadcrumbs.scheduler === scheduler.name}"
+                           @click="setBreadcrumbs({schema: database.name, scheduler: scheduler.name})"
+                           @contextmenu.prevent="showMiscContext($event, {...scheduler, type: 'scheduler'})"
+                        >
+                           <a class="table-name">
+                              <i class="table-icon mdi mdi-calendar-clock mdi-18px mr-1" />
+                              <span v-html="highlightWord(scheduler.name)" />
+                           </a>
+                        </li>
+                     </ul>
+                  </div>
+               </div>
+            </details>
+         </div>
       </div>
    </details>
 </template>
@@ -45,13 +162,41 @@ export default {
       database: Object,
       connection: Object
    },
+   data () {
+      return {
+         isLoading: false
+      };
+   },
    computed: {
       ...mapGetters({
-         getWorkspace: 'workspaces/getWorkspace'
+         getLoadedSchemas: 'workspaces/getLoadedSchemas',
+         getWorkspace: 'workspaces/getWorkspace',
+         getSearchTerm: 'workspaces/getSearchTerm'
       }),
+      searchTerm () {
+         return this.getSearchTerm(this.connection.uid);
+      },
+      filteredTables () {
+         return this.database.tables.filter(table => table.name.search(this.searchTerm) >= 0);
+      },
+      filteredTriggers () {
+         return this.database.triggers.filter(trigger => trigger.name.search(this.searchTerm) >= 0);
+      },
+      filteredProcedures () {
+         return this.database.procedures.filter(procedure => procedure.name.search(this.searchTerm) >= 0);
+      },
+      filteredFunctions () {
+         return this.database.functions.filter(func => func.name.search(this.searchTerm) >= 0);
+      },
+      filteredSchedulers () {
+         return this.database.schedulers.filter(scheduler => scheduler.name.search(this.searchTerm) >= 0);
+      },
       breadcrumbs () {
          return this.getWorkspace(this.connection.uid).breadcrumbs;
       },
+      loadedSchemas () {
+         return this.getLoadedSchemas(this.connection.uid);
+      },
       maxSize () {
          return this.database.tables.reduce((acc, curr) => {
             if (curr.size > acc) acc = curr.size;
@@ -64,15 +209,31 @@ export default {
    },
    methods: {
       ...mapActions({
-         changeBreadcrumbs: 'workspaces/changeBreadcrumbs'
+         changeBreadcrumbs: 'workspaces/changeBreadcrumbs',
+         refreshSchema: 'workspaces/refreshSchema'
       }),
       formatBytes,
+      async selectSchema (schema) {
+         if (!this.loadedSchemas.has(schema)) {
+            this.isLoading = true;
+            await this.refreshSchema({ uid: this.connection.uid, schema });
+            this.isLoading = false;
+         }
+
+         this.changeBreadcrumbs({ schema, table: null });
+      },
       showDatabaseContext (event, database) {
+         this.changeBreadcrumbs({ schema: database, table: null });
          this.$emit('show-database-context', { event, database });
       },
       showTableContext (event, table) {
+         this.setBreadcrumbs({ schema: this.database.name, [table.type]: table.name });
          this.$emit('show-table-context', { event, table });
       },
+      showMiscContext (event, misc) {
+         this.setBreadcrumbs({ schema: this.database.name, [misc.type]: misc.name });
+         this.$emit('show-misc-context', { event, misc });
+      },
       piePercentage (val) {
          const perc = val / this.maxSize * 100;
          return { background: `conic-gradient(lime ${perc}%, white 0)` };
@@ -80,6 +241,14 @@ export default {
       setBreadcrumbs (payload) {
          if (this.breadcrumbs.schema === payload.schema && this.breadcrumbs.table === payload.table) return;
          this.changeBreadcrumbs(payload);
+      },
+      highlightWord (string) {
+         if (this.searchTerm) {
+            const regexp = new RegExp(`(${this.searchTerm.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')})`, 'gi');
+            return string.replace(regexp, '<span class="text-primary">$1</span>');
+         }
+         else
+            return string;
       }
    }
 };
@@ -87,7 +256,15 @@ export default {
 
 <style lang="scss">
 .workspace-explorebar-database {
+  .database-name {
+    position: sticky;
+    top: 0;
+    background: $bg-color-gray;
+    z-index: 2;
+  }
+
   .database-name,
+  .misc-name,
   a.table-name {
     display: flex;
     align-items: center;
@@ -103,15 +280,33 @@ export default {
     }
 
     .database-icon,
-    .table-icon {
+    .table-icon,
+    .misc-icon {
       opacity: 0.7;
     }
+
+    .loading {
+      height: 18px;
+      width: 18px;
+
+      &::after {
+        height: 0.6rem;
+        width: 0.6rem;
+      }
+    }
   }
 
-  .database-name {
+  .misc-name {
+    line-height: 1;
+    padding: 0.1rem 1rem 0.1rem 0.1rem;
+    position: relative;
+  }
+
+  .database-name,
+  .misc-name {
     &:hover {
       color: $body-font-color;
-      background: rgba($color: #fff, $alpha: 0.05);
+      background: $bg-color-light;
       border-radius: 2px;
     }
   }
@@ -138,6 +333,18 @@ export default {
     margin-left: 1.2rem;
   }
 
+  .database-misc {
+    margin-left: 1.6rem;
+
+    .accordion[open] .accordion-header > .misc-icon:first-child::before {
+      content: "\F0770";
+    }
+
+    .accordion-body {
+      margin-bottom: 0.2rem;
+    }
+  }
+
   .table-size {
     position: absolute;
     right: 0;

src/renderer/components/WorkspaceExploreBarDatabaseContext.vue

@@ -10,6 +10,21 @@
             <div class="context-element" @click="showCreateTableModal">
                <span class="d-flex"><i class="mdi mdi-18px mdi-table text-light pr-1" /> {{ $t('word.table') }}</span>
             </div>
+            <div class="context-element" @click="showCreateViewModal">
+               <span class="d-flex"><i class="mdi mdi-18px mdi-table-eye text-light pr-1" /> {{ $t('word.view') }}</span>
+            </div>
+            <div class="context-element" @click="showCreateTriggerModal">
+               <span class="d-flex"><i class="mdi mdi-18px mdi-table-cog text-light pr-1" /> {{ $tc('word.trigger', 1) }}</span>
+            </div>
+            <div class="context-element" @click="showCreateRoutineModal">
+               <span class="d-flex"><i class="mdi mdi-18px mdi-sync-circle pr-1" /> {{ $tc('word.storedRoutine', 1) }}</span>
+            </div>
+            <div class="context-element" @click="showCreateFunctionModal">
+               <span class="d-flex"><i class="mdi mdi-18px mdi-arrow-right-bold-box pr-1" /> {{ $tc('word.function', 1) }}</span>
+            </div>
+            <div class="context-element" @click="showCreateSchedulerModal">
+               <span class="d-flex"><i class="mdi mdi-18px mdi-calendar-clock text-light pr-1" /> {{ $tc('word.scheduler', 1) }}</span>
+            </div>
          </div>
       </div>
       <div class="context-element" @click="showEditModal">
@@ -84,6 +99,21 @@ export default {
       showCreateTableModal () {
          this.$emit('show-create-table-modal');
       },
+      showCreateViewModal () {
+         this.$emit('show-create-view-modal');
+      },
+      showCreateTriggerModal () {
+         this.$emit('show-create-trigger-modal');
+      },
+      showCreateRoutineModal () {
+         this.$emit('show-create-routine-modal');
+      },
+      showCreateFunctionModal () {
+         this.$emit('show-create-function-modal');
+      },
+      showCreateSchedulerModal () {
+         this.$emit('show-create-scheduler-modal');
+      },
       showDeleteModal () {
          this.isDeleteModal = true;
       },
@@ -124,3 +154,8 @@ export default {
    }
 };
 </script>
+<style lang="scss" scoped>
+.context-submenu {
+  min-width: 150px !important;
+}
+</style>

src/renderer/components/WorkspaceExploreBarMiscContext.vue

@@ -0,0 +1,265 @@
+<template>
+   <BaseContextMenu
+      :context-event="contextEvent"
+      @close-context="closeContext"
+   >
+      <div
+         v-if="['procedure', 'function'].includes(selectedMisc.type)"
+         class="context-element"
+         @click="runElementCheck"
+      >
+         <span class="d-flex"><i class="mdi mdi-18px mdi-play text-light pr-1" /> {{ $t('word.run') }}</span>
+      </div>
+      <div class="context-element" @click="showDeleteModal">
+         <span class="d-flex"><i class="mdi mdi-18px mdi-table-remove text-light pr-1" /> {{ $t('word.delete') }}</span>
+      </div>
+      <ConfirmModal
+         v-if="isDeleteModal"
+         @confirm="deleteMisc"
+         @hide="hideDeleteModal"
+      >
+         <template slot="header">
+            <div class="d-flex">
+               <i class="mdi mdi-24px mdi-delete mr-1" /> {{ deleteMessage }}
+            </div>
+         </template>
+         <div slot="body">
+            <div class="mb-2">
+               {{ $t('message.deleteCorfirm') }} "<b>{{ selectedMisc.name }}</b>"?
+            </div>
+         </div>
+      </ConfirmModal>
+      <ModalAskParameters
+         v-if="isAskingParameters"
+         :local-routine="localElement"
+         @confirm="runElement"
+         @close="hideAskParamsModal"
+      />
+   </BaseContextMenu>
+</template>
+
+<script>
+import { mapGetters, mapActions } from 'vuex';
+import BaseContextMenu from '@/components/BaseContextMenu';
+import ConfirmModal from '@/components/BaseConfirmModal';
+import ModalAskParameters from '@/components/ModalAskParameters';
+import Triggers from '@/ipc-api/Triggers';
+import Routines from '@/ipc-api/Routines';
+import Functions from '@/ipc-api/Functions';
+import Schedulers from '@/ipc-api/Schedulers';
+
+export default {
+   name: 'WorkspaceExploreBarMiscContext',
+   components: {
+      BaseContextMenu,
+      ConfirmModal,
+      ModalAskParameters
+   },
+   props: {
+      contextEvent: MouseEvent,
+      selectedMisc: Object
+   },
+   data () {
+      return {
+         isDeleteModal: false,
+         isRunModal: false,
+         isAskingParameters: false,
+         localElement: {}
+      };
+   },
+   computed: {
+      ...mapGetters({
+         selectedWorkspace: 'workspaces/getSelected',
+         getWorkspace: 'workspaces/getWorkspace'
+      }),
+      workspace () {
+         return this.getWorkspace(this.selectedWorkspace);
+      },
+      deleteMessage () {
+         switch (this.selectedMisc.type) {
+            case 'trigger':
+               return this.$t('message.deleteTrigger');
+            case 'procedure':
+               return this.$t('message.deleteRoutine');
+            case 'function':
+               return this.$t('message.deleteFunction');
+            case 'scheduler':
+               return this.$t('message.deleteScheduler');
+            default:
+               return '';
+         }
+      }
+   },
+   methods: {
+      ...mapActions({
+         addNotification: 'notifications/addNotification',
+         changeBreadcrumbs: 'workspaces/changeBreadcrumbs',
+         newTab: 'workspaces/newTab'
+      }),
+      showCreateTableModal () {
+         this.$emit('show-create-table-modal');
+      },
+      showDeleteModal () {
+         this.isDeleteModal = true;
+      },
+      hideDeleteModal () {
+         this.isDeleteModal = false;
+      },
+      showAskParamsModal () {
+         this.isAskingParameters = true;
+      },
+      hideAskParamsModal () {
+         this.isAskingParameters = false;
+         this.closeContext();
+      },
+      closeContext () {
+         this.$emit('close-context');
+      },
+      async deleteMisc () {
+         try {
+            let res;
+
+            switch (this.selectedMisc.type) {
+               case 'trigger':
+                  res = await Triggers.dropTrigger({
+                     uid: this.selectedWorkspace,
+                     trigger: this.selectedMisc.name
+                  });
+                  break;
+               case 'procedure':
+                  res = await Routines.dropRoutine({
+                     uid: this.selectedWorkspace,
+                     routine: this.selectedMisc.name
+                  });
+                  break;
+               case 'function':
+                  res = await Functions.dropFunction({
+                     uid: this.selectedWorkspace,
+                     func: this.selectedMisc.name
+                  });
+                  break;
+               case 'scheduler':
+                  res = await Schedulers.dropScheduler({
+                     uid: this.selectedWorkspace,
+                     scheduler: this.selectedMisc.name
+                  });
+                  break;
+            }
+
+            const { status, response } = res;
+
+            if (status === 'success') {
+               this.changeBreadcrumbs({ [this.selectedMisc.type]: null });
+
+               this.closeContext();
+               this.$emit('reload');
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+      },
+      runElementCheck () {
+         if (this.selectedMisc.type === 'procedure')
+            this.runRoutineCheck();
+         else if (this.selectedMisc.type === 'function')
+            this.runFunctionCheck();
+      },
+      runElement (params) {
+         if (this.selectedMisc.type === 'procedure')
+            this.runRoutine(params);
+         else if (this.selectedMisc.type === 'function')
+            this.runFunction(params);
+      },
+      async runRoutineCheck () {
+         const params = {
+            uid: this.selectedWorkspace,
+            schema: this.workspace.breadcrumbs.schema,
+            routine: this.workspace.breadcrumbs.procedure
+         };
+
+         try {
+            const { status, response } = await Routines.getRoutineInformations(params);
+            if (status === 'success')
+               this.localElement = response;
+
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         if (this.localElement.parameters.length)
+            this.showAskParamsModal();
+         else
+            this.runRoutine();
+      },
+      runRoutine (params) {
+         if (!params) params = [];
+
+         let sql;
+         switch (this.workspace.client) { // TODO: move in a better place
+            case 'maria':
+            case 'mysql':
+            case 'pg':
+               sql = `CALL \`${this.localElement.name}\` (${params.join(',')})`;
+               break;
+            case 'mssql':
+               sql = `EXEC ${this.localElement.name} ${params.join(',')}`;
+               break;
+            default:
+               sql = `CALL \`${this.localElement.name}\` (${params.join(',')})`;
+         }
+
+         this.newTab({ uid: this.workspace.uid, content: sql, autorun: true });
+         this.closeContext();
+      },
+      async runFunctionCheck () {
+         const params = {
+            uid: this.selectedWorkspace,
+            schema: this.workspace.breadcrumbs.schema,
+            func: this.workspace.breadcrumbs.function
+         };
+
+         try {
+            const { status, response } = await Functions.getFunctionInformations(params);
+            if (status === 'success')
+               this.localElement = response;
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         if (this.localElement.parameters.length)
+            this.showAskParamsModal();
+         else
+            this.runFunction();
+      },
+      runFunction (params) {
+         if (!params) params = [];
+
+         let sql;
+         switch (this.workspace.client) { // TODO: move in a better place
+            case 'maria':
+            case 'mysql':
+            case 'pg':
+               sql = `SELECT \`${this.localElement.name}\` (${params.join(',')})`;
+               break;
+            case 'mssql':
+               sql = `SELECT ${this.localElement.name} ${params.join(',')}`;
+               break;
+            default:
+               sql = `SELECT \`${this.localElement.name}\` (${params.join(',')})`;
+         }
+
+         this.newTab({ uid: this.workspace.uid, content: sql, autorun: true });
+         this.closeContext();
+      }
+   }
+};
+</script>

src/renderer/components/WorkspaceExploreBarTableContext.vue

@@ -3,7 +3,11 @@
       :context-event="contextEvent"
       @close-context="closeContext"
    >
-      <div class="context-element" @click="showEmptyModal">
+      <div
+         v-if="selectedTable.type === 'table'"
+         class="context-element"
+         @click="showEmptyModal"
+      >
          <span class="d-flex"><i class="mdi mdi-18px mdi-table-off text-light pr-1" /> {{ $t('message.emptyTable') }}</span>
       </div>
       <div class="context-element" @click="showDeleteModal">
@@ -22,7 +26,7 @@
          </template>
          <div slot="body">
             <div class="mb-2">
-               {{ $t('message.emptyCorfirm') }} "<b>{{ selectedTable }}</b>"?
+               {{ $t('message.emptyCorfirm') }} "<b>{{ selectedTable.name }}</b>"?
             </div>
          </div>
       </ConfirmModal>
@@ -33,12 +37,12 @@
       >
          <template slot="header">
             <div class="d-flex">
-               <i class="mdi mdi-24px mdi-table-remove mr-1" /> {{ $t('message.deleteTable') }}
+               <i class="mdi mdi-24px mdi-table-remove mr-1" /> {{ selectedTable.type === 'table' ? $t('message.deleteTable') : $t('message.deleteView') }}
             </div>
          </template>
          <div slot="body">
             <div class="mb-2">
-               {{ $t('message.deleteCorfirm') }} "<b>{{ selectedTable }}</b>"?
+               {{ $t('message.deleteCorfirm') }} "<b>{{ selectedTable.name }}</b>"?
             </div>
          </div>
       </ConfirmModal>
@@ -50,6 +54,7 @@ import { mapGetters, mapActions } from 'vuex';
 import BaseContextMenu from '@/components/BaseContextMenu';
 import ConfirmModal from '@/components/BaseConfirmModal';
 import Tables from '@/ipc-api/Tables';
+import Views from '@/ipc-api/Views';
 
 export default {
    name: 'WorkspaceExploreBarTableContext',
@@ -59,7 +64,7 @@ export default {
    },
    props: {
       contextEvent: MouseEvent,
-      selectedTable: String
+      selectedTable: Object
    },
    data () {
       return {
@@ -103,11 +108,11 @@ export default {
          try {
             const { status, response } = await Tables.truncateTable({
                uid: this.selectedWorkspace,
-               table: this.selectedTable
+               table: this.selectedTable.name
             });
 
             if (status === 'success') {
-               if (this.selectedTable === this.workspace.breadcrumbs.table)
+               if (this.selectedTable.name === this.workspace.breadcrumbs.table)
                   this.changeBreadcrumbs({ table: null });
 
                this.closeContext();
@@ -122,14 +127,26 @@ export default {
       },
       async deleteTable () {
          try {
-            const { status, response } = await Tables.dropTable({
-               uid: this.selectedWorkspace,
-               table: this.selectedTable
-            });
+            let res;
+
+            if (this.selectedTable.type === 'table') {
+               res = await Tables.dropTable({
+                  uid: this.selectedWorkspace,
+                  table: this.selectedTable.name
+               });
+            }
+            else if (this.selectedTable.type === 'view') {
+               res = await Views.dropView({
+                  uid: this.selectedWorkspace,
+                  view: this.selectedTable.name
+               });
+            }
+
+            const { status, response } = res;
 
             if (status === 'success') {
-               if (this.selectedTable === this.workspace.breadcrumbs.table)
-                  this.changeBreadcrumbs({ table: null });
+               if (this.selectedTable.name === this.workspace.breadcrumbs.table || this.selectedTable.name === this.workspace.breadcrumbs.view)
+                  this.changeBreadcrumbs({ table: null, view: null });
 
                this.closeContext();
                this.$emit('reload');

src/renderer/components/WorkspacePropsFunctionOptionsModal.vue

@@ -0,0 +1,180 @@
+<template>
+   <ConfirmModal
+      :confirm-text="$t('word.confirm')"
+      size="400"
+      @confirm="confirmOptionsChange"
+      @hide="$emit('hide')"
+   >
+      <template :slot="'header'">
+         <div class="d-flex">
+            <i class="mdi mdi-24px mdi-cogs mr-1" /> {{ $t('word.options') }} "{{ localOptions.name }}"
+         </div>
+      </template>
+      <div :slot="'body'">
+         <form class="form-horizontal">
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.name') }}
+               </label>
+               <div class="column">
+                  <input
+                     ref="firstInput"
+                     v-model="optionsProxy.name"
+                     class="form-input"
+                     :class="{'is-error': !isTableNameValid}"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.definer') }}
+               </label>
+               <div class="column">
+                  <select
+                     v-if="workspace.users.length"
+                     v-model="optionsProxy.definer"
+                     class="form-select"
+                  >
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                     <option
+                        v-for="user in workspace.users"
+                        :key="`${user.name}@${user.host}`"
+                        :value="`\`${user.name}\`@\`${user.host}\``"
+                     >
+                        {{ user.name }}@{{ user.host }}
+                     </option>
+                  </select>
+                  <select v-if="!workspace.users.length" class="form-select">
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.returns') }}
+               </label>
+               <div class="column">
+                  <div class="input-group">
+                     <select
+                        v-model="optionsProxy.returns"
+                        class="form-select text-uppercase"
+                        style="width: 0;"
+                     >
+                        <optgroup
+                           v-for="group in workspace.dataTypes"
+                           :key="group.group"
+                           :label="group.group"
+                        >
+                           <option
+                              v-for="type in group.types"
+                              :key="type.name"
+                              :selected="optionsProxy.returns === type.name"
+                              :value="type.name"
+                           >
+                              {{ type.name }}
+                           </option>
+                        </optgroup>
+                     </select>
+                     <input
+                        v-model="optionsProxy.returnsLength"
+                        class="form-input"
+                        type="number"
+                        min="0"
+                     >
+                  </div>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.comment') }}
+               </label>
+               <div class="column">
+                  <input
+                     v-model="optionsProxy.comment"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('message.sqlSecurity') }}
+               </label>
+               <div class="column">
+                  <select v-model="optionsProxy.security" class="form-select">
+                     <option>DEFINER</option>
+                     <option>INVOKER</option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('message.dataAccess') }}
+               </label>
+               <div class="column">
+                  <select v-model="optionsProxy.dataAccess" class="form-select">
+                     <option>CONTAINS SQL</option>
+                     <option>NO SQL</option>
+                     <option>READS SQL DATA</option>
+                     <option>MODIFIES SQL DATA</option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <div class="col-4" />
+               <div class="column">
+                  <label class="form-checkbox form-inline">
+                     <input v-model="optionsProxy.deterministic" type="checkbox"><i class="form-icon" /> {{ $t('word.deterministic') }}
+                  </label>
+               </div>
+            </div>
+         </form>
+      </div>
+   </ConfirmModal>
+</template>
+
+<script>
+import ConfirmModal from '@/components/BaseConfirmModal';
+
+export default {
+   name: 'WorkspacePropsFunctionOptionsModal',
+   components: {
+      ConfirmModal
+   },
+   props: {
+      localOptions: Object,
+      workspace: Object
+   },
+   data () {
+      return {
+         optionsProxy: {},
+         isOptionsChanging: false
+      };
+   },
+   computed: {
+      isTableNameValid () {
+         return this.optionsProxy.name !== '';
+      }
+   },
+   created () {
+      this.optionsProxy = JSON.parse(JSON.stringify(this.localOptions));
+
+      setTimeout(() => {
+         this.$refs.firstInput.focus();
+      }, 20);
+   },
+   methods: {
+      confirmOptionsChange () {
+         if (!this.isTableNameValid)
+            this.optionsProxy.name = this.localOptions.name;
+
+         this.$emit('options-update', this.optionsProxy);
+      }
+   }
+};
+</script>

src/renderer/components/WorkspacePropsFunctionParamsModal.vue

@@ -0,0 +1,272 @@
+<template>
+   <ConfirmModal
+      :confirm-text="$t('word.confirm')"
+      size="medium"
+      @confirm="confirmParametersChange"
+      @hide="$emit('hide')"
+   >
+      <template :slot="'header'">
+         <div class="d-flex">
+            <i class="mdi mdi-24px mdi-dots-horizontal mr-1" /> {{ $t('word.parameters') }} "{{ func }}"
+         </div>
+      </template>
+      <div :slot="'body'">
+         <div class="columns col-gapless">
+            <div class="column col-5">
+               <div class="panel" :style="{ height: modalInnerHeight + 'px'}">
+                  <div class="panel-header pt-0 pl-0">
+                     <div class="d-flex">
+                        <button class="btn btn-dark btn-sm d-flex" @click="addParameter">
+                           <span>{{ $t('word.add') }}</span>
+                           <i class="mdi mdi-24px mdi-plus ml-1" />
+                        </button>
+                        <button
+                           class="btn btn-dark btn-sm d-flex ml-2 mr-0"
+                           :title="$t('message.clearChanges')"
+                           :disabled="!isChanged"
+                           @click.prevent="clearChanges"
+                        >
+                           <span>{{ $t('word.clear') }}</span>
+                           <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
+                        </button>
+                     </div>
+                  </div>
+                  <div ref="parametersPanel" class="panel-body p-0 pr-1">
+                     <div
+                        v-for="param in parametersProxy"
+                        :key="param._id"
+                        class="tile tile-centered c-hand mb-1 p-1"
+                        :class="{'selected-param': selectedParam === param._id}"
+                        @click="selectParameter($event, param._id)"
+                     >
+                        <div class="tile-icon">
+                           <div>
+                              <i class="mdi mdi-hexagon mdi-24px" :class="`type-${param.type.toLowerCase()}`" />
+                           </div>
+                        </div>
+                        <div class="tile-content">
+                           <div class="tile-title">
+                              {{ param.name }}
+                           </div>
+                           <small class="tile-subtitle text-gray">{{ param.type }}{{ param.length ? `(${param.length})` : '' }}</small>
+                        </div>
+                        <div class="tile-action">
+                           <button
+                              class="btn btn-link remove-field p-0 mr-2"
+                              :title="$t('word.delete')"
+                              @click.prevent="removeParameter(param._id)"
+                           >
+                              <i class="mdi mdi-close" />
+                           </button>
+                        </div>
+                     </div>
+                  </div>
+               </div>
+            </div>
+
+            <div class="column col-7 pl-2 editor-col">
+               <form
+                  v-if="selectedParamObj"
+                  :style="{ height: modalInnerHeight + 'px'}"
+                  class="form-horizontal"
+               >
+                  <div class="form-group">
+                     <label class="form-label col-3">
+                        {{ $t('word.name') }}
+                     </label>
+                     <div class="column">
+                        <input
+                           v-model="selectedParamObj.name"
+                           class="form-input"
+                           type="text"
+                        >
+                     </div>
+                  </div>
+                  <div class="form-group">
+                     <label class="form-label col-3">
+                        {{ $t('word.type') }}
+                     </label>
+                     <div class="column">
+                        <select v-model="selectedParamObj.type" class="form-select text-uppercase">
+                           <optgroup
+                              v-for="group in workspace.dataTypes"
+                              :key="group.group"
+                              :label="group.group"
+                           >
+                              <option
+                                 v-for="type in group.types"
+                                 :key="type.name"
+                                 :selected="selectedParamObj.type.toUpperCase() === type.name"
+                                 :value="type.name"
+                              >
+                                 {{ type.name }}
+                              </option>
+                           </optgroup>
+                        </select>
+                     </div>
+                  </div>
+                  <div class="form-group">
+                     <label class="form-label col-3">
+                        {{ $t('word.length') }}
+                     </label>
+                     <div class="column">
+                        <input
+                           v-model="selectedParamObj.length"
+                           class="form-input"
+                           type="number"
+                           min="0"
+                        >
+                     </div>
+                  </div>
+               </form>
+               <div v-if="!parametersProxy.length" class="empty">
+                  <div class="empty-icon">
+                     <i class="mdi mdi-dots-horizontal mdi-48px" />
+                  </div>
+                  <p class="empty-title h5">
+                     {{ $t('message.thereAreNoParameters') }}
+                  </p>
+                  <div class="empty-action">
+                     <button class="btn btn-primary" @click="addParameter">
+                        {{ $t('message.createNewParameter') }}
+                     </button>
+                  </div>
+               </div>
+            </div>
+         </div>
+      </div>
+   </ConfirmModal>
+</template>
+
+<script>
+import { uidGen } from 'common/libs/uidGen';
+import ConfirmModal from '@/components/BaseConfirmModal';
+
+export default {
+   name: 'WorkspacePropsRoutineParamsModal',
+   components: {
+      ConfirmModal
+   },
+   props: {
+      localParameters: Array,
+      func: String,
+      workspace: Object
+   },
+   data () {
+      return {
+         parametersProxy: [],
+         isOptionsChanging: false,
+         selectedParam: '',
+         modalInnerHeight: 400,
+         i: 1
+      };
+   },
+   computed: {
+      selectedParamObj () {
+         return this.parametersProxy.find(param => param._id === this.selectedParam);
+      },
+      isChanged () {
+         return JSON.stringify(this.localParameters) !== JSON.stringify(this.parametersProxy);
+      }
+   },
+   mounted () {
+      this.parametersProxy = JSON.parse(JSON.stringify(this.localParameters));
+      this.i = this.parametersProxy.length + 1;
+
+      if (this.parametersProxy.length)
+         this.resetSelectedID();
+
+      this.getModalInnerHeight();
+      window.addEventListener('resize', this.getModalInnerHeight);
+   },
+   destroyed () {
+      window.removeEventListener('resize', this.getModalInnerHeight);
+   },
+   methods: {
+      confirmParametersChange () {
+         this.$emit('parameters-update', this.parametersProxy);
+      },
+      selectParameter (event, uid) {
+         if (this.selectedParam !== uid && !event.target.classList.contains('remove-field'))
+            this.selectedParam = uid;
+      },
+      getModalInnerHeight () {
+         const modalBody = document.querySelector('.modal-body');
+         if (modalBody)
+            this.modalInnerHeight = modalBody.clientHeight - (parseFloat(getComputedStyle(modalBody).paddingTop) + parseFloat(getComputedStyle(modalBody).paddingBottom));
+      },
+      addParameter () {
+         this.parametersProxy = [...this.parametersProxy, {
+            _id: uidGen(),
+            name: `Param${this.i++}`,
+            type: 'INT',
+            context: 'IN',
+            length: 10
+         }];
+
+         if (this.parametersProxy.length === 1)
+            this.resetSelectedID();
+
+         setTimeout(() => {
+            this.$refs.parametersPanel.scrollTop = this.$refs.parametersPanel.scrollHeight + 60;
+         }, 20);
+      },
+      removeParameter (uid) {
+         this.parametersProxy = this.parametersProxy.filter(param => param._id !== uid);
+
+         if (this.selectedParam === name && this.parametersProxy.length)
+            this.resetSelectedID();
+      },
+      clearChanges () {
+         this.parametersProxy = JSON.parse(JSON.stringify(this.localParameters));
+         this.i = this.parametersProxy.length + 1;
+
+         if (!this.parametersProxy.some(param => param.name === this.selectedParam))
+            this.resetSelectedID();
+      },
+      resetSelectedID () {
+         this.selectedParam = this.parametersProxy.length ? this.parametersProxy[0]._id : '';
+      }
+   }
+};
+</script>
+
+<style lang="scss" scoped>
+.tile {
+  border-radius: 2px;
+  opacity: 0.5;
+  transition: background 0.2s;
+  transition: opacity 0.2s;
+
+  .tile-action {
+    opacity: 0;
+    transition: opacity 0.2s;
+  }
+
+  &:hover {
+    background: $bg-color-light;
+
+    .tile-action {
+      opacity: 1;
+    }
+  }
+
+  &.selected-param {
+    background: $bg-color-light;
+    opacity: 1;
+  }
+}
+
+.editor-col {
+  border-left: 2px solid $bg-color-light;
+}
+
+.fields-list {
+  max-height: 300px;
+  overflow: auto;
+}
+
+.remove-field .mdi {
+  pointer-events: none;
+}
+</style>

src/renderer/components/WorkspacePropsRoutineOptionsModal.vue

@@ -0,0 +1,145 @@
+<template>
+   <ConfirmModal
+      :confirm-text="$t('word.confirm')"
+      size="400"
+      @confirm="confirmOptionsChange"
+      @hide="$emit('hide')"
+   >
+      <template :slot="'header'">
+         <div class="d-flex">
+            <i class="mdi mdi-24px mdi-cogs mr-1" /> {{ $t('word.options') }} "{{ localOptions.name }}"
+         </div>
+      </template>
+      <div :slot="'body'">
+         <form class="form-horizontal">
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.name') }}
+               </label>
+               <div class="column">
+                  <input
+                     ref="firstInput"
+                     v-model="optionsProxy.name"
+                     class="form-input"
+                     :class="{'is-error': !isTableNameValid}"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.definer') }}
+               </label>
+               <div class="column">
+                  <select
+                     v-if="workspace.users.length"
+                     v-model="optionsProxy.definer"
+                     class="form-select"
+                  >
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                     <option
+                        v-for="user in workspace.users"
+                        :key="`${user.name}@${user.host}`"
+                        :value="`\`${user.name}\`@\`${user.host}\``"
+                     >
+                        {{ user.name }}@{{ user.host }}
+                     </option>
+                  </select>
+                  <select v-if="!workspace.users.length" class="form-select">
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.comment') }}
+               </label>
+               <div class="column">
+                  <input
+                     v-model="optionsProxy.comment"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('message.sqlSecurity') }}
+               </label>
+               <div class="column">
+                  <select v-model="optionsProxy.security" class="form-select">
+                     <option>DEFINER</option>
+                     <option>INVOKER</option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('message.dataAccess') }}
+               </label>
+               <div class="column">
+                  <select v-model="optionsProxy.dataAccess" class="form-select">
+                     <option>CONTAINS SQL</option>
+                     <option>NO SQL</option>
+                     <option>READS SQL DATA</option>
+                     <option>MODIFIES SQL DATA</option>
+                  </select>
+               </div>
+            </div>
+            <div class="form-group">
+               <div class="col-4" />
+               <div class="column">
+                  <label class="form-checkbox form-inline">
+                     <input v-model="optionsProxy.deterministic" type="checkbox"><i class="form-icon" /> {{ $t('word.deterministic') }}
+                  </label>
+               </div>
+            </div>
+         </form>
+      </div>
+   </ConfirmModal>
+</template>
+
+<script>
+import ConfirmModal from '@/components/BaseConfirmModal';
+
+export default {
+   name: 'WorkspacePropsRoutineOptionsModal',
+   components: {
+      ConfirmModal
+   },
+   props: {
+      localOptions: Object,
+      workspace: Object
+   },
+   data () {
+      return {
+         optionsProxy: {},
+         isOptionsChanging: false
+      };
+   },
+   computed: {
+      isTableNameValid () {
+         return this.optionsProxy.name !== '';
+      }
+   },
+   created () {
+      this.optionsProxy = JSON.parse(JSON.stringify(this.localOptions));
+
+      setTimeout(() => {
+         this.$refs.firstInput.focus();
+      }, 20);
+   },
+   methods: {
+      confirmOptionsChange () {
+         if (!this.isTableNameValid)
+            this.optionsProxy.name = this.localOptions.name;
+
+         this.$emit('options-update', this.optionsProxy);
+      }
+   }
+};
+</script>

src/renderer/components/WorkspacePropsRoutineParamsModal.vue

@@ -0,0 +1,303 @@
+<template>
+   <ConfirmModal
+      :confirm-text="$t('word.confirm')"
+      size="medium"
+      @confirm="confirmParametersChange"
+      @hide="$emit('hide')"
+   >
+      <template :slot="'header'">
+         <div class="d-flex">
+            <i class="mdi mdi-24px mdi-dots-horizontal mr-1" /> {{ $t('word.parameters') }} "{{ routine }}"
+         </div>
+      </template>
+      <div :slot="'body'">
+         <div class="columns col-gapless">
+            <div class="column col-5">
+               <div class="panel" :style="{ height: modalInnerHeight + 'px'}">
+                  <div class="panel-header pt-0 pl-0">
+                     <div class="d-flex">
+                        <button class="btn btn-dark btn-sm d-flex" @click="addParameter">
+                           <span>{{ $t('word.add') }}</span>
+                           <i class="mdi mdi-24px mdi-plus ml-1" />
+                        </button>
+                        <button
+                           class="btn btn-dark btn-sm d-flex ml-2 mr-0"
+                           :title="$t('message.clearChanges')"
+                           :disabled="!isChanged"
+                           @click.prevent="clearChanges"
+                        >
+                           <span>{{ $t('word.clear') }}</span>
+                           <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
+                        </button>
+                     </div>
+                  </div>
+                  <div ref="parametersPanel" class="panel-body p-0 pr-1">
+                     <div
+                        v-for="param in parametersProxy"
+                        :key="param._id"
+                        class="tile tile-centered c-hand mb-1 p-1"
+                        :class="{'selected-param': selectedParam === param._id}"
+                        @click="selectParameter($event, param._id)"
+                     >
+                        <div class="tile-icon">
+                           <div>
+                              <i class="mdi mdi-hexagon mdi-24px" :class="`type-${param.type.toLowerCase()}`" />
+                           </div>
+                        </div>
+                        <div class="tile-content">
+                           <div class="tile-title">
+                              {{ param.name }}
+                           </div>
+                           <small class="tile-subtitle text-gray">{{ param.type }}{{ param.length ? `(${param.length})` : '' }} · {{ param.context }}</small>
+                        </div>
+                        <div class="tile-action">
+                           <button
+                              class="btn btn-link remove-field p-0 mr-2"
+                              :title="$t('word.delete')"
+                              @click.prevent="removeParameter(param._id)"
+                           >
+                              <i class="mdi mdi-close" />
+                           </button>
+                        </div>
+                     </div>
+                  </div>
+               </div>
+            </div>
+
+            <div class="column col-7 pl-2 editor-col">
+               <form
+                  v-if="selectedParamObj"
+                  :style="{ height: modalInnerHeight + 'px'}"
+                  class="form-horizontal"
+               >
+                  <div class="form-group">
+                     <label class="form-label col-3">
+                        {{ $t('word.name') }}
+                     </label>
+                     <div class="column">
+                        <input
+                           v-model="selectedParamObj.name"
+                           class="form-input"
+                           type="text"
+                        >
+                     </div>
+                  </div>
+                  <div class="form-group">
+                     <label class="form-label col-3">
+                        {{ $t('word.type') }}
+                     </label>
+                     <div class="column">
+                        <select v-model="selectedParamObj.type" class="form-select text-uppercase">
+                           <optgroup
+                              v-for="group in workspace.dataTypes"
+                              :key="group.group"
+                              :label="group.group"
+                           >
+                              <option
+                                 v-for="type in group.types"
+                                 :key="type.name"
+                                 :selected="selectedParamObj.type.toUpperCase() === type.name"
+                                 :value="type.name"
+                              >
+                                 {{ type.name }}
+                              </option>
+                           </optgroup>
+                        </select>
+                     </div>
+                  </div>
+                  <div class="form-group">
+                     <label class="form-label col-3">
+                        {{ $t('word.length') }}
+                     </label>
+                     <div class="column">
+                        <input
+                           v-model="selectedParamObj.length"
+                           class="form-input"
+                           type="number"
+                           min="0"
+                        >
+                     </div>
+                  </div>
+                  <div class="form-group">
+                     <label class="form-label col-3">
+                        {{ $t('word.context') }}
+                     </label>
+                     <div class="column">
+                        <label class="form-radio">
+                           <input
+                              v-model="selectedParamObj.context"
+                              type="radio"
+                              name="context"
+                              value="IN"
+                           > <i class="form-icon" /> IN
+                        </label>
+                        <label class="form-radio">
+                           <input
+                              v-model="selectedParamObj.context"
+                              type="radio"
+                              value="OUT"
+                              name="context"
+                           > <i class="form-icon" /> OUT
+                        </label>
+                        <label class="form-radio">
+                           <input
+                              v-model="selectedParamObj.context"
+                              type="radio"
+                              value="INOUT"
+                              name="context"
+                           > <i class="form-icon" /> INOUT
+                        </label>
+                     </div>
+                  </div>
+               </form>
+               <div v-if="!parametersProxy.length" class="empty">
+                  <div class="empty-icon">
+                     <i class="mdi mdi-dots-horizontal mdi-48px" />
+                  </div>
+                  <p class="empty-title h5">
+                     {{ $t('message.thereAreNoParameters') }}
+                  </p>
+                  <div class="empty-action">
+                     <button class="btn btn-primary" @click="addParameter">
+                        {{ $t('message.createNewParameter') }}
+                     </button>
+                  </div>
+               </div>
+            </div>
+         </div>
+      </div>
+   </ConfirmModal>
+</template>
+
+<script>
+import { uidGen } from 'common/libs/uidGen';
+import ConfirmModal from '@/components/BaseConfirmModal';
+
+export default {
+   name: 'WorkspacePropsRoutineParamsModal',
+   components: {
+      ConfirmModal
+   },
+   props: {
+      localParameters: Array,
+      routine: String,
+      workspace: Object
+   },
+   data () {
+      return {
+         parametersProxy: [],
+         isOptionsChanging: false,
+         selectedParam: '',
+         modalInnerHeight: 400,
+         i: 1
+      };
+   },
+   computed: {
+      selectedParamObj () {
+         return this.parametersProxy.find(param => param._id === this.selectedParam);
+      },
+      isChanged () {
+         return JSON.stringify(this.localParameters) !== JSON.stringify(this.parametersProxy);
+      }
+   },
+   mounted () {
+      this.parametersProxy = JSON.parse(JSON.stringify(this.localParameters));
+      this.i = this.parametersProxy.length + 1;
+
+      if (this.parametersProxy.length)
+         this.resetSelectedID();
+
+      this.getModalInnerHeight();
+      window.addEventListener('resize', this.getModalInnerHeight);
+   },
+   destroyed () {
+      window.removeEventListener('resize', this.getModalInnerHeight);
+   },
+   methods: {
+      confirmParametersChange () {
+         this.$emit('parameters-update', this.parametersProxy);
+      },
+      selectParameter (event, uid) {
+         if (this.selectedParam !== uid && !event.target.classList.contains('remove-field'))
+            this.selectedParam = uid;
+      },
+      getModalInnerHeight () {
+         const modalBody = document.querySelector('.modal-body');
+         if (modalBody)
+            this.modalInnerHeight = modalBody.clientHeight - (parseFloat(getComputedStyle(modalBody).paddingTop) + parseFloat(getComputedStyle(modalBody).paddingBottom));
+      },
+      addParameter () {
+         this.parametersProxy = [...this.parametersProxy, {
+            _id: uidGen(),
+            name: `Param${this.i++}`,
+            type: 'INT',
+            context: 'IN',
+            length: 10
+         }];
+
+         if (this.parametersProxy.length === 1)
+            this.resetSelectedID();
+
+         setTimeout(() => {
+            this.$refs.parametersPanel.scrollTop = this.$refs.parametersPanel.scrollHeight + 60;
+         }, 20);
+      },
+      removeParameter (uid) {
+         this.parametersProxy = this.parametersProxy.filter(param => param._id !== uid);
+
+         if (this.selectedParam === name && this.parametersProxy.length)
+            this.resetSelectedID();
+      },
+      clearChanges () {
+         this.parametersProxy = JSON.parse(JSON.stringify(this.localParameters));
+         this.i = this.parametersProxy.length + 1;
+
+         if (!this.parametersProxy.some(param => param.name === this.selectedParam))
+            this.resetSelectedID();
+      },
+      resetSelectedID () {
+         this.selectedParam = this.parametersProxy.length ? this.parametersProxy[0]._id : '';
+      }
+   }
+};
+</script>
+
+<style lang="scss" scoped>
+.tile {
+  border-radius: 2px;
+  opacity: 0.5;
+  transition: background 0.2s;
+  transition: opacity 0.2s;
+
+  .tile-action {
+    opacity: 0;
+    transition: opacity 0.2s;
+  }
+
+  &:hover {
+    background: $bg-color-light;
+
+    .tile-action {
+      opacity: 1;
+    }
+  }
+
+  &.selected-param {
+    background: $bg-color-light;
+    opacity: 1;
+  }
+}
+
+.editor-col {
+  border-left: 2px solid $bg-color-light;
+}
+
+.fields-list {
+  max-height: 300px;
+  overflow: auto;
+}
+
+.remove-field .mdi {
+  pointer-events: none;
+}
+</style>

src/renderer/components/WorkspacePropsSchedulerTimingModal.vue

@@ -0,0 +1,192 @@
+<template>
+   <ConfirmModal
+      :confirm-text="$t('word.confirm')"
+      size="400"
+      @confirm="confirmOptionsChange"
+      @hide="$emit('hide')"
+   >
+      <template :slot="'header'">
+         <div class="d-flex">
+            <i class="mdi mdi-24px mdi-timer mr-1" /> {{ $t('word.timing') }} "{{ localOptions.name }}"
+         </div>
+      </template>
+      <div :slot="'body'">
+         <form class="form-horizontal">
+            <div class="form-group">
+               <label class="form-label col-4">
+                  {{ $t('word.execution') }}
+               </label>
+               <div class="column">
+                  <select
+                     ref="firstInput"
+                     v-model="optionsProxy.execution"
+                     class="form-select"
+                  >
+                     <option>EVERY</option>
+                     <option>ONCE</option>
+                  </select>
+               </div>
+            </div>
+            <div v-if="optionsProxy.execution === 'EVERY'">
+               <div class="form-group">
+                  <div class="col-4" />
+                  <div class="column">
+                     <div class="input-group">
+                        <input
+                           v-model="optionsProxy.every[0]"
+                           class="form-input"
+                           type="text"
+                           @keypress="isNumberOrMinus($event)"
+                        >
+                        <select
+                           v-model="optionsProxy.every[1]"
+                           class="form-select text-uppercase"
+                           style="width: 0;"
+                        >
+                           <option>YEAR</option>
+                           <option>QUARTER</option>
+                           <option>MONTH</option>
+                           <option>WEEK</option>
+                           <option>DAY</option>
+                           <option>HOUR</option>
+                           <option>MINUTE</option>
+                           <option>SECOND</option>
+                           <option>YEAR_MONTH</option>
+                           <option>DAY_HOUR</option>
+                           <option>DAY_MINUTE</option>
+                           <option>DAY_SECOND</option>
+                           <option>HOUR_MINUTE</option>
+                           <option>HOUR_SECOND</option>
+                           <option>MINUTE_SECOND</option>
+                        </select>
+                     </div>
+                  </div>
+               </div>
+               <div class="form-group">
+                  <label class="form-label col-4">
+                     {{ $t('word.starts') }}
+                  </label>
+                  <div class="column">
+                     <div class="input-group">
+                        <label class="form-checkbox">
+                           <input v-model="hasStart" type="checkbox"><i class="form-icon" />
+                        </label>
+                        <input
+                           v-model="optionsProxy.starts"
+                           v-mask="'####-##-## ##:##:##'"
+                           type="text"
+                           class="form-input"
+                        >
+                        <span class="input-group-addon p-vcentered">
+                           <i class="form-icon mdi mdi-calendar" />
+                        </span>
+                     </div>
+                  </div>
+               </div>
+               <div class="form-group">
+                  <label class="form-label col-4">
+                     {{ $t('word.ends') }}
+                  </label>
+                  <div class="column">
+                     <div class="input-group">
+                        <label class="form-checkbox">
+                           <input v-model="hasEnd" type="checkbox"><i class="form-icon" />
+                        </label>
+                        <input
+                           v-model="optionsProxy.ends"
+                           v-mask="'####-##-## ##:##:##'"
+                           type="text"
+                           class="form-input"
+                        >
+                        <span class="input-group-addon p-vcentered">
+                           <i class="form-icon mdi mdi-calendar" />
+                        </span>
+                     </div>
+                  </div>
+               </div>
+            </div>
+            <div v-else>
+               <div class="form-group">
+                  <div class="col-4" />
+                  <div class="column">
+                     <div class="input-group">
+                        <input
+                           v-model="optionsProxy.at"
+                           v-mask="'####-##-## ##:##:##'"
+                           type="text"
+                           class="form-input"
+                        >
+                        <span class="input-group-addon p-vcentered">
+                           <i class="form-icon mdi mdi-calendar" />
+                        </span>
+                     </div>
+                  </div>
+               </div>
+            </div>
+            <div class="form-group">
+               <div class="col-4" />
+               <div class="column">
+                  <label class="form-checkbox form-inline mt-2">
+                     <input v-model="optionsProxy.preserve" type="checkbox"><i class="form-icon" /> {{ $t('message.preserveOnCompletion') }}
+                  </label>
+               </div>
+            </div>
+         </form>
+      </div>
+   </ConfirmModal>
+</template>
+
+<script>
+import ConfirmModal from '@/components/BaseConfirmModal';
+import { mask } from 'vue-the-mask';
+import moment from 'moment';
+
+export default {
+   name: 'WorkspacePropsSchedulerTimingModal',
+   components: {
+      ConfirmModal
+   },
+   directives: {
+      mask
+   },
+   props: {
+      localOptions: Object,
+      workspace: Object
+   },
+   data () {
+      return {
+         optionsProxy: {},
+         isOptionsChanging: false,
+         hasStart: false,
+         hasEnd: false
+      };
+   },
+   created () {
+      this.optionsProxy = JSON.parse(JSON.stringify(this.localOptions));
+
+      this.hasStart = !!this.optionsProxy.starts;
+      this.hasEnd = !!this.optionsProxy.ends;
+
+      if (!this.optionsProxy.at) this.optionsProxy.at = moment().format('YYYY-MM-DD HH:mm:ss');
+      if (!this.optionsProxy.starts) this.optionsProxy.starts = moment().format('YYYY-MM-DD HH:mm:ss');
+      if (!this.optionsProxy.ends) this.optionsProxy.ends = moment().format('YYYY-MM-DD HH:mm:ss');
+      if (!this.optionsProxy.every.length) this.optionsProxy.every = ['1', 'DAY'];
+
+      setTimeout(() => {
+         this.$refs.firstInput.focus();
+      }, 20);
+   },
+   methods: {
+      confirmOptionsChange () {
+         if (!this.hasStart) this.optionsProxy.starts = '';
+         if (!this.hasEnd) this.optionsProxy.ends = '';
+
+         this.$emit('options-update', this.optionsProxy);
+      },
+      isNumberOrMinus (event) {
+         if (!/\d/.test(event.key) && event.key !== '-')
+            return event.preventDefault();
+      }
+   }
+};
+</script>

src/renderer/components/WorkspacePropsTab.vue

@@ -51,7 +51,8 @@
             </div>
          </div>
       </div>
-      <div class="workspace-query-results column col-12">
+      <div class="workspace-query-results column col-12 p-relative">
+         <BaseLoader v-if="isLoading" />
          <WorkspacePropsTable
             v-if="localFields"
             ref="indexTable"
@@ -106,6 +107,7 @@
 import { mapGetters, mapActions } from 'vuex';
 import { uidGen } from 'common/libs/uidGen';
 import Tables from '@/ipc-api/Tables';
+import BaseLoader from '@/components/BaseLoader';
 import WorkspacePropsTable from '@/components/WorkspacePropsTable';
 import WorkspacePropsOptionsModal from '@/components/WorkspacePropsOptionsModal';
 import WorkspacePropsIndexesModal from '@/components/WorkspacePropsIndexesModal';
@@ -114,6 +116,7 @@ import WorkspacePropsForeignModal from '@/components/WorkspacePropsForeignModal'
 export default {
    name: 'WorkspacePropsTab',
    components: {
+      BaseLoader,
       WorkspacePropsTable,
       WorkspacePropsOptionsModal,
       WorkspacePropsIndexesModal,
@@ -126,7 +129,7 @@ export default {
    data () {
       return {
          tabUid: 'prop',
-         isQuering: false,
+         isLoading: false,
          isSaving: false,
          isOptionsModal: false,
          isIndexesModal: false,
@@ -200,12 +203,15 @@ export default {
       ...mapActions({
          addNotification: 'notifications/addNotification',
          refreshStructure: 'workspaces/refreshStructure',
-         setUnsavedChanges: 'workspaces/setUnsavedChanges'
+         setUnsavedChanges: 'workspaces/setUnsavedChanges',
+         changeBreadcrumbs: 'workspaces/changeBreadcrumbs'
       }),
       async getFieldsData () {
          if (!this.table) return;
+
+         this.localFields = [];
          this.newFieldsCounter = 0;
-         this.isQuering = true;
+         this.isLoading = true;
          this.localOptions = JSON.parse(JSON.stringify(this.tableOptions));
 
          const params = {
@@ -280,7 +286,7 @@ export default {
             this.addNotification({ status: 'error', message: err.stack });
          }
 
-         this.isQuering = false;
+         this.isLoading = false;
       },
       async saveChanges () {
          if (this.isSaving) return;
@@ -394,7 +400,15 @@ export default {
             const { status, response } = await Tables.alterTable(params);
 
             if (status === 'success') {
+               const oldName = this.tableOptions.name;
+
                await this.refreshStructure(this.connection.uid);
+
+               if (oldName !== this.localOptions.name) {
+                  this.setUnsavedChanges(false);
+                  this.changeBreadcrumbs({ schema: this.schema, table: this.localOptions.name });
+               }
+
                this.getFieldsData();
             }
             else
@@ -423,7 +437,7 @@ export default {
             schema: this.schema,
             table: this.table,
             numPrecision: null,
-            numLength: null,
+            numLength: 11,
             datePrecision: null,
             charLength: null,
             nullable: false,

src/renderer/components/WorkspacePropsTabFunction.vue

@@ -0,0 +1,315 @@
+<template>
+   <div class="workspace-query-tab column col-12 columns col-gapless">
+      <div class="workspace-query-runner column col-12">
+         <div class="workspace-query-runner-footer">
+            <div class="workspace-query-buttons">
+               <button
+                  class="btn btn-primary btn-sm"
+                  :disabled="!isChanged"
+                  :class="{'loading':isSaving}"
+                  @click="saveChanges"
+               >
+                  <span>{{ $t('word.save') }}</span>
+                  <i class="mdi mdi-24px mdi-content-save ml-1" />
+               </button>
+               <button
+                  :disabled="!isChanged"
+                  class="btn btn-link btn-sm mr-0"
+                  :title="$t('message.clearChanges')"
+                  @click="clearChanges"
+               >
+                  <span>{{ $t('word.clear') }}</span>
+                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
+               </button>
+
+               <div class="divider-vert py-3" />
+
+               <button
+                  class="btn btn-dark btn-sm"
+                  :disabled="isChanged"
+                  @click="runFunctionCheck"
+               >
+                  <span>{{ $t('word.run') }}</span>
+                  <i class="mdi mdi-24px mdi-play ml-1" />
+               </button>
+               <button class="btn btn-dark btn-sm" @click="showParamsModal">
+                  <span>{{ $t('word.parameters') }}</span>
+                  <i class="mdi mdi-24px mdi-dots-horizontal ml-1" />
+               </button>
+               <button class="btn btn-dark btn-sm" @click="showOptionsModal">
+                  <span>{{ $t('word.options') }}</span>
+                  <i class="mdi mdi-24px mdi-cogs ml-1" />
+               </button>
+            </div>
+         </div>
+      </div>
+      <div class="workspace-query-results column col-12 mt-2 p-relative">
+         <BaseLoader v-if="isLoading" />
+         <label class="form-label ml-2">{{ $t('message.functionBody') }}</label>
+         <QueryEditor
+            v-if="isSelected"
+            ref="queryEditor"
+            :value.sync="localFunction.sql"
+            :workspace="workspace"
+            :schema="schema"
+            :height="editorHeight"
+         />
+      </div>
+      <WorkspacePropsFunctionOptionsModal
+         v-if="isOptionsModal"
+         :local-options="localFunction"
+         :workspace="workspace"
+         @hide="hideOptionsModal"
+         @options-update="optionsUpdate"
+      />
+      <WorkspacePropsFunctionParamsModal
+         v-if="isParamsModal"
+         :local-parameters="localFunction.parameters"
+         :workspace="workspace"
+         :func="localFunction.name"
+         @hide="hideParamsModal"
+         @parameters-update="parametersUpdate"
+      />
+      <ModalAskParameters
+         v-if="isAskingParameters"
+         :local-routine="localFunction"
+         @confirm="runFunction"
+         @close="hideAskParamsModal"
+      />
+   </div>
+</template>
+
+<script>
+import { mapGetters, mapActions } from 'vuex';
+import { uidGen } from 'common/libs/uidGen';
+import BaseLoader from '@/components/BaseLoader';
+import QueryEditor from '@/components/QueryEditor';
+import WorkspacePropsFunctionOptionsModal from '@/components/WorkspacePropsFunctionOptionsModal';
+import WorkspacePropsFunctionParamsModal from '@/components/WorkspacePropsFunctionParamsModal';
+import ModalAskParameters from '@/components/ModalAskParameters';
+import Functions from '@/ipc-api/Functions';
+
+export default {
+   name: 'WorkspacePropsTabFunction',
+   components: {
+      BaseLoader,
+      QueryEditor,
+      WorkspacePropsFunctionOptionsModal,
+      WorkspacePropsFunctionParamsModal,
+      ModalAskParameters
+   },
+   props: {
+      connection: Object,
+      function: String
+   },
+   data () {
+      return {
+         tabUid: 'prop',
+         isLoading: false,
+         isSaving: false,
+         isOptionsModal: false,
+         isParamsModal: false,
+         isAskingParameters: false,
+         originalFunction: null,
+         localFunction: { sql: '' },
+         lastFunction: null,
+         sqlProxy: '',
+         editorHeight: 300
+      };
+   },
+   computed: {
+      ...mapGetters({
+         getWorkspace: 'workspaces/getWorkspace'
+      }),
+      workspace () {
+         return this.getWorkspace(this.connection.uid);
+      },
+      isSelected () {
+         return this.workspace.selected_tab === 'prop';
+      },
+      schema () {
+         return this.workspace.breadcrumbs.schema;
+      },
+      isChanged () {
+         return JSON.stringify(this.originalFunction) !== JSON.stringify(this.localFunction);
+      },
+      isDefinerInUsers () {
+         return this.originalFunction ? this.workspace.users.some(user => this.originalFunction.definer === `\`${user.name}\`@\`${user.host}\``) : true;
+      },
+      schemaTables () {
+         const schemaTables = this.workspace.structure
+            .filter(schema => schema.name === this.schema)
+            .map(schema => schema.tables);
+
+         return schemaTables.length ? schemaTables[0].filter(table => table.type === 'table') : [];
+      }
+   },
+   watch: {
+      async function () {
+         if (this.isSelected) {
+            await this.getFunctionData();
+            this.$refs.queryEditor.editor.session.setValue(this.localFunction.sql);
+            this.lastFunction = this.function;
+         }
+      },
+      async isSelected (val) {
+         if (val && this.lastFunction !== this.function) {
+            await this.getFunctionData();
+            this.$refs.queryEditor.editor.session.setValue(this.localFunction.sql);
+            this.lastFunction = this.function;
+         }
+      },
+      isChanged (val) {
+         if (this.isSelected && this.lastFunction === this.function && this.function !== null)
+            this.setUnsavedChanges(val);
+      }
+   },
+   mounted () {
+      window.addEventListener('resize', this.resizeQueryEditor);
+   },
+   destroyed () {
+      window.removeEventListener('resize', this.resizeQueryEditor);
+   },
+   methods: {
+      ...mapActions({
+         addNotification: 'notifications/addNotification',
+         refreshStructure: 'workspaces/refreshStructure',
+         setUnsavedChanges: 'workspaces/setUnsavedChanges',
+         changeBreadcrumbs: 'workspaces/changeBreadcrumbs',
+         newTab: 'workspaces/newTab'
+      }),
+      async getFunctionData () {
+         if (!this.function) return;
+
+         this.isLoading = true;
+         this.localFunction = { sql: '' };
+
+         const params = {
+            uid: this.connection.uid,
+            schema: this.schema,
+            func: this.workspace.breadcrumbs.function
+         };
+
+         try {
+            const { status, response } = await Functions.getFunctionInformations(params);
+            if (status === 'success') {
+               this.originalFunction = response;
+
+               this.originalFunction.parameters = [...this.originalFunction.parameters.map(param => {
+                  param._id = uidGen();
+                  return param;
+               })];
+
+               this.localFunction = JSON.parse(JSON.stringify(this.originalFunction));
+               this.sqlProxy = this.localFunction.sql;
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         this.resizeQueryEditor();
+         this.isLoading = false;
+      },
+      async saveChanges () {
+         if (this.isSaving) return;
+         this.isSaving = true;
+         const params = {
+            uid: this.connection.uid,
+            schema: this.schema,
+            func: {
+               ...this.localFunction,
+               oldName: this.originalFunction.name
+            }
+         };
+
+         try {
+            const { status, response } = await Functions.alterFunction(params);
+
+            if (status === 'success') {
+               const oldName = this.originalFunction.name;
+
+               await this.refreshStructure(this.connection.uid);
+
+               if (oldName !== this.localFunction.name) {
+                  this.setUnsavedChanges(false);
+                  this.changeBreadcrumbs({ schema: this.schema, function: this.localFunction.name });
+               }
+
+               this.getFunctionData();
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         this.isSaving = false;
+      },
+      clearChanges () {
+         this.localFunction = JSON.parse(JSON.stringify(this.originalFunction));
+         this.$refs.queryEditor.editor.session.setValue(this.localFunction.sql);
+      },
+      resizeQueryEditor () {
+         if (this.$refs.queryEditor) {
+            const footer = document.getElementById('footer');
+            const size = window.innerHeight - this.$refs.queryEditor.$el.getBoundingClientRect().top - footer.offsetHeight;
+            this.editorHeight = size;
+            this.$refs.queryEditor.editor.resize();
+         }
+      },
+      optionsUpdate (options) {
+         this.localFunction = options;
+      },
+      parametersUpdate (parameters) {
+         this.localFunction = { ...this.localFunction, parameters };
+      },
+      runFunctionCheck () {
+         if (this.localFunction.parameters.length)
+            this.showAskParamsModal();
+         else
+            this.runFunction();
+      },
+      runFunction (params) {
+         if (!params) params = [];
+
+         let sql;
+         switch (this.connection.client) { // TODO: move in a better place
+            case 'maria':
+            case 'mysql':
+            case 'pg':
+               sql = `SELECT \`${this.originalFunction.name}\` (${params.join(',')})`;
+               break;
+            case 'mssql':
+               sql = `SELECT ${this.originalFunction.name} ${params.join(',')}`;
+               break;
+            default:
+               sql = `SELECT \`${this.originalFunction.name}\` (${params.join(',')})`;
+         }
+
+         this.newTab({ uid: this.connection.uid, content: sql, autorun: true });
+      },
+      showOptionsModal () {
+         this.isOptionsModal = true;
+      },
+      hideOptionsModal () {
+         this.isOptionsModal = false;
+      },
+      showParamsModal () {
+         this.isParamsModal = true;
+      },
+      hideParamsModal () {
+         this.isParamsModal = false;
+      },
+      showAskParamsModal () {
+         this.isAskingParameters = true;
+      },
+      hideAskParamsModal () {
+         this.isAskingParameters = false;
+      }
+   }
+};
+</script>

src/renderer/components/WorkspacePropsTabRoutine.vue

@@ -0,0 +1,314 @@
+<template>
+   <div class="workspace-query-tab column col-12 columns col-gapless">
+      <div class="workspace-query-runner column col-12">
+         <div class="workspace-query-runner-footer">
+            <div class="workspace-query-buttons">
+               <button
+                  class="btn btn-primary btn-sm"
+                  :disabled="!isChanged"
+                  :class="{'loading':isSaving}"
+                  @click="saveChanges"
+               >
+                  <span>{{ $t('word.save') }}</span>
+                  <i class="mdi mdi-24px mdi-content-save ml-1" />
+               </button>
+               <button
+                  :disabled="!isChanged"
+                  class="btn btn-link btn-sm mr-0"
+                  :title="$t('message.clearChanges')"
+                  @click="clearChanges"
+               >
+                  <span>{{ $t('word.clear') }}</span>
+                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
+               </button>
+
+               <div class="divider-vert py-3" />
+
+               <button
+                  class="btn btn-dark btn-sm"
+                  :disabled="isChanged"
+                  @click="runRoutineCheck"
+               >
+                  <span>{{ $t('word.run') }}</span>
+                  <i class="mdi mdi-24px mdi-play ml-1" />
+               </button>
+               <button class="btn btn-dark btn-sm" @click="showParamsModal">
+                  <span>{{ $t('word.parameters') }}</span>
+                  <i class="mdi mdi-24px mdi-dots-horizontal ml-1" />
+               </button>
+               <button class="btn btn-dark btn-sm" @click="showOptionsModal">
+                  <span>{{ $t('word.options') }}</span>
+                  <i class="mdi mdi-24px mdi-cogs ml-1" />
+               </button>
+            </div>
+         </div>
+      </div>
+      <div class="workspace-query-results column col-12 mt-2 p-relative">
+         <BaseLoader v-if="isLoading" />
+         <label class="form-label ml-2">{{ $t('message.routineBody') }}</label>
+         <QueryEditor
+            v-if="isSelected"
+            ref="queryEditor"
+            :value.sync="localRoutine.sql"
+            :workspace="workspace"
+            :schema="schema"
+            :height="editorHeight"
+         />
+      </div>
+      <WorkspacePropsRoutineOptionsModal
+         v-if="isOptionsModal"
+         :local-options="localRoutine"
+         :workspace="workspace"
+         @hide="hideOptionsModal"
+         @options-update="optionsUpdate"
+      />
+      <WorkspacePropsRoutineParamsModal
+         v-if="isParamsModal"
+         :local-parameters="localRoutine.parameters"
+         :workspace="workspace"
+         :routine="localRoutine.name"
+         @hide="hideParamsModal"
+         @parameters-update="parametersUpdate"
+      />
+      <ModalAskParameters
+         v-if="isAskingParameters"
+         :local-routine="localRoutine"
+         @confirm="runRoutine"
+         @close="hideAskParamsModal"
+      />
+   </div>
+</template>
+
+<script>
+import { mapGetters, mapActions } from 'vuex';
+import { uidGen } from 'common/libs/uidGen';
+import QueryEditor from '@/components/QueryEditor';
+import BaseLoader from '@/components/BaseLoader';
+import WorkspacePropsRoutineOptionsModal from '@/components/WorkspacePropsRoutineOptionsModal';
+import WorkspacePropsRoutineParamsModal from '@/components/WorkspacePropsRoutineParamsModal';
+import ModalAskParameters from '@/components/ModalAskParameters';
+import Routines from '@/ipc-api/Routines';
+
+export default {
+   name: 'WorkspacePropsTabRoutine',
+   components: {
+      QueryEditor,
+      BaseLoader,
+      WorkspacePropsRoutineOptionsModal,
+      WorkspacePropsRoutineParamsModal,
+      ModalAskParameters
+   },
+   props: {
+      connection: Object,
+      routine: String
+   },
+   data () {
+      return {
+         tabUid: 'prop',
+         isLoading: false,
+         isSaving: false,
+         isOptionsModal: false,
+         isParamsModal: false,
+         isAskingParameters: false,
+         originalRoutine: null,
+         localRoutine: { sql: '' },
+         lastRoutine: null,
+         sqlProxy: '',
+         editorHeight: 300
+      };
+   },
+   computed: {
+      ...mapGetters({
+         getWorkspace: 'workspaces/getWorkspace'
+      }),
+      workspace () {
+         return this.getWorkspace(this.connection.uid);
+      },
+      isSelected () {
+         return this.workspace.selected_tab === 'prop';
+      },
+      schema () {
+         return this.workspace.breadcrumbs.schema;
+      },
+      isChanged () {
+         return JSON.stringify(this.originalRoutine) !== JSON.stringify(this.localRoutine);
+      },
+      isDefinerInUsers () {
+         return this.originalRoutine ? this.workspace.users.some(user => this.originalRoutine.definer === `\`${user.name}\`@\`${user.host}\``) : true;
+      },
+      schemaTables () {
+         const schemaTables = this.workspace.structure
+            .filter(schema => schema.name === this.schema)
+            .map(schema => schema.tables);
+
+         return schemaTables.length ? schemaTables[0].filter(table => table.type === 'table') : [];
+      }
+   },
+   watch: {
+      async routine () {
+         if (this.isSelected) {
+            await this.getRoutineData();
+            this.$refs.queryEditor.editor.session.setValue(this.localRoutine.sql);
+            this.lastRoutine = this.routine;
+         }
+      },
+      async isSelected (val) {
+         if (val && this.lastRoutine !== this.routine) {
+            await this.getRoutineData();
+            this.$refs.queryEditor.editor.session.setValue(this.localRoutine.sql);
+            this.lastRoutine = this.routine;
+         }
+      },
+      isChanged (val) {
+         if (this.isSelected && this.lastRoutine === this.routine && this.routine !== null)
+            this.setUnsavedChanges(val);
+      }
+   },
+   mounted () {
+      window.addEventListener('resize', this.resizeQueryEditor);
+   },
+   destroyed () {
+      window.removeEventListener('resize', this.resizeQueryEditor);
+   },
+   methods: {
+      ...mapActions({
+         addNotification: 'notifications/addNotification',
+         refreshStructure: 'workspaces/refreshStructure',
+         setUnsavedChanges: 'workspaces/setUnsavedChanges',
+         changeBreadcrumbs: 'workspaces/changeBreadcrumbs',
+         newTab: 'workspaces/newTab'
+      }),
+      async getRoutineData () {
+         if (!this.routine) return;
+         this.localRoutine = { sql: '' };
+         this.isLoading = true;
+
+         const params = {
+            uid: this.connection.uid,
+            schema: this.schema,
+            routine: this.workspace.breadcrumbs.procedure
+         };
+
+         try {
+            const { status, response } = await Routines.getRoutineInformations(params);
+            if (status === 'success') {
+               this.originalRoutine = response;
+
+               this.originalRoutine.parameters = [...this.originalRoutine.parameters.map(param => {
+                  param._id = uidGen();
+                  return param;
+               })];
+
+               this.localRoutine = JSON.parse(JSON.stringify(this.originalRoutine));
+               this.sqlProxy = this.localRoutine.sql;
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         this.resizeQueryEditor();
+         this.isLoading = false;
+      },
+      async saveChanges () {
+         if (this.isSaving) return;
+         this.isSaving = true;
+         const params = {
+            uid: this.connection.uid,
+            schema: this.schema,
+            routine: {
+               ...this.localRoutine,
+               oldName: this.originalRoutine.name
+            }
+         };
+
+         try {
+            const { status, response } = await Routines.alterRoutine(params);
+
+            if (status === 'success') {
+               const oldName = this.originalRoutine.name;
+
+               await this.refreshStructure(this.connection.uid);
+
+               if (oldName !== this.localRoutine.name) {
+                  this.setUnsavedChanges(false);
+                  this.changeBreadcrumbs({ schema: this.schema, procedure: this.localRoutine.name });
+               }
+
+               this.getRoutineData();
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         this.isSaving = false;
+      },
+      clearChanges () {
+         this.localRoutine = JSON.parse(JSON.stringify(this.originalRoutine));
+         this.$refs.queryEditor.editor.session.setValue(this.localRoutine.sql);
+      },
+      resizeQueryEditor () {
+         if (this.$refs.queryEditor) {
+            const footer = document.getElementById('footer');
+            const size = window.innerHeight - this.$refs.queryEditor.$el.getBoundingClientRect().top - footer.offsetHeight;
+            this.editorHeight = size;
+            this.$refs.queryEditor.editor.resize();
+         }
+      },
+      optionsUpdate (options) {
+         this.localRoutine = options;
+      },
+      parametersUpdate (parameters) {
+         this.localRoutine = { ...this.localRoutine, parameters };
+      },
+      runRoutineCheck () {
+         if (this.localRoutine.parameters.length)
+            this.showAskParamsModal();
+         else
+            this.runRoutine();
+      },
+      runRoutine (params) {
+         if (!params) params = [];
+
+         let sql;
+         switch (this.connection.client) { // TODO: move in a better place
+            case 'maria':
+            case 'mysql':
+            case 'pg':
+               sql = `CALL \`${this.originalRoutine.name}\` (${params.join(',')})`;
+               break;
+            case 'mssql':
+               sql = `EXEC ${this.originalRoutine.name} ${params.join(',')}`;
+               break;
+            default:
+               sql = `CALL \`${this.originalRoutine.name}\` (${params.join(',')})`;
+         }
+
+         this.newTab({ uid: this.connection.uid, content: sql, autorun: true });
+      },
+      showOptionsModal () {
+         this.isOptionsModal = true;
+      },
+      hideOptionsModal () {
+         this.isOptionsModal = false;
+      },
+      showParamsModal () {
+         this.isParamsModal = true;
+      },
+      hideParamsModal () {
+         this.isParamsModal = false;
+      },
+      showAskParamsModal () {
+         this.isAskingParameters = true;
+      },
+      hideAskParamsModal () {
+         this.isAskingParameters = false;
+      }
+   }
+};
+</script>

src/renderer/components/WorkspacePropsTabScheduler.vue

@@ -0,0 +1,316 @@
+<template>
+   <div class="workspace-query-tab column col-12 columns col-gapless">
+      <div class="workspace-query-runner column col-12">
+         <div class="workspace-query-runner-footer">
+            <div class="workspace-query-buttons">
+               <button
+                  class="btn btn-primary btn-sm"
+                  :disabled="!isChanged"
+                  :class="{'loading':isSaving}"
+                  @click="saveChanges"
+               >
+                  <span>{{ $t('word.save') }}</span>
+                  <i class="mdi mdi-24px mdi-content-save ml-1" />
+               </button>
+               <button
+                  :disabled="!isChanged"
+                  class="btn btn-link btn-sm mr-0"
+                  :title="$t('message.clearChanges')"
+                  @click="clearChanges"
+               >
+                  <span>{{ $t('word.clear') }}</span>
+                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
+               </button>
+
+               <div class="divider-vert py-3" />
+               <button class="btn btn-dark btn-sm" @click="showTimingModal">
+                  <span>{{ $t('word.timing') }}</span>
+                  <i class="mdi mdi-24px mdi-timer ml-1" />
+               </button>
+            </div>
+         </div>
+      </div>
+      <div class="container">
+         <div class="columns mb-4">
+            <div class="column col-auto">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('word.name') }}</label>
+                  <input
+                     v-model="localScheduler.name"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="column col-auto">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('word.definer') }}</label>
+                  <select
+                     v-if="workspace.users.length"
+                     v-model="localScheduler.definer"
+                     class="form-select"
+                  >
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                     <option v-if="!isDefinerInUsers" :value="originalScheduler.definer">
+                        {{ originalScheduler.definer.replaceAll('`', '') }}
+                     </option>
+                     <option
+                        v-for="user in workspace.users"
+                        :key="`${user.name}@${user.host}`"
+                        :value="`\`${user.name}\`@\`${user.host}\``"
+                     >
+                        {{ user.name }}@{{ user.host }}
+                     </option>
+                  </select>
+                  <select v-if="!workspace.users.length" class="form-select">
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                  </select>
+               </div>
+            </div>
+            <div class="column col-4">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('word.comment') }}</label>
+                  <input
+                     v-model="localScheduler.comment"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+         </div>
+         <div class="columns">
+            <div class="column">
+               <div class="form-group">
+                  <label class="form-label mr-2">{{ $t('word.state') }}</label>
+                  <label class="form-radio form-inline">
+                     <input
+                        v-model="localScheduler.state"
+                        type="radio"
+                        name="state"
+                        value="ENABLE"
+                     ><i class="form-icon" /> ENABLE
+                  </label>
+                  <label class="form-radio form-inline">
+                     <input
+                        v-model="localScheduler.state"
+                        type="radio"
+                        name="state"
+                        value="DISABLE"
+                     ><i class="form-icon" /> DISABLE
+                  </label>
+                  <label class="form-radio form-inline">
+                     <input
+                        v-model="localScheduler.state"
+                        type="radio"
+                        name="state"
+                        value="DISABLE ON SLAVE"
+                     ><i class="form-icon" /> DISABLE ON SLAVE
+                  </label>
+               </div>
+            </div>
+         </div>
+      </div>
+      <div class="workspace-query-results column col-12 mt-2 p-relative">
+         <BaseLoader v-if="isLoading" />
+         <label class="form-label ml-2">{{ $t('message.schedulerBody') }}</label>
+         <QueryEditor
+            v-if="isSelected"
+            ref="queryEditor"
+            :value.sync="localScheduler.sql"
+            :workspace="workspace"
+            :schema="schema"
+            :height="editorHeight"
+         />
+      </div>
+      <WorkspacePropsSchedulerTimingModal
+         v-if="isTimingModal"
+         :local-options="localScheduler"
+         :workspace="workspace"
+         @hide="hideTimingModal"
+         @options-update="timingUpdate"
+      />
+   </div>
+</template>
+
+<script>
+import { mapGetters, mapActions } from 'vuex';
+import BaseLoader from '@/components/BaseLoader';
+import QueryEditor from '@/components/QueryEditor';
+import WorkspacePropsSchedulerTimingModal from '@/components/WorkspacePropsSchedulerTimingModal';
+import Schedulers from '@/ipc-api/Schedulers';
+
+export default {
+   name: 'WorkspacePropsTabScheduler',
+   components: {
+      BaseLoader,
+      QueryEditor,
+      WorkspacePropsSchedulerTimingModal
+   },
+   props: {
+      connection: Object,
+      scheduler: String
+   },
+   data () {
+      return {
+         tabUid: 'prop',
+         isLoading: false,
+         isSaving: false,
+         isTimingModal: false,
+         originalScheduler: null,
+         localScheduler: { sql: '' },
+         lastScheduler: null,
+         sqlProxy: '',
+         editorHeight: 300
+      };
+   },
+   computed: {
+      ...mapGetters({
+         getWorkspace: 'workspaces/getWorkspace'
+      }),
+      workspace () {
+         return this.getWorkspace(this.connection.uid);
+      },
+      isSelected () {
+         return this.workspace.selected_tab === 'prop';
+      },
+      schema () {
+         return this.workspace.breadcrumbs.schema;
+      },
+      isChanged () {
+         return JSON.stringify(this.originalScheduler) !== JSON.stringify(this.localScheduler);
+      },
+      isDefinerInUsers () {
+         return this.originalScheduler ? this.workspace.users.some(user => this.originalScheduler.definer === `\`${user.name}\`@\`${user.host}\``) : true;
+      },
+      schemaTables () {
+         const schemaTables = this.workspace.structure
+            .filter(schema => schema.name === this.schema)
+            .map(schema => schema.tables);
+
+         return schemaTables.length ? schemaTables[0].filter(table => table.type === 'table') : [];
+      }
+   },
+   watch: {
+      async scheduler () {
+         if (this.isSelected) {
+            await this.getSchedulerData();
+            this.$refs.queryEditor.editor.session.setValue(this.localScheduler.sql);
+            this.lastScheduler = this.scheduler;
+         }
+      },
+      async isSelected (val) {
+         if (val && this.lastScheduler !== this.scheduler) {
+            await this.getSchedulerData();
+            this.$refs.queryEditor.editor.session.setValue(this.localScheduler.sql);
+            this.lastScheduler = this.scheduler;
+         }
+      },
+      isChanged (val) {
+         if (this.isSelected && this.lastScheduler === this.scheduler && this.scheduler !== null)
+            this.setUnsavedChanges(val);
+      }
+   },
+   mounted () {
+      window.addEventListener('resize', this.resizeQueryEditor);
+   },
+   destroyed () {
+      window.removeEventListener('resize', this.resizeQueryEditor);
+   },
+   methods: {
+      ...mapActions({
+         addNotification: 'notifications/addNotification',
+         refreshStructure: 'workspaces/refreshStructure',
+         setUnsavedChanges: 'workspaces/setUnsavedChanges',
+         changeBreadcrumbs: 'workspaces/changeBreadcrumbs'
+      }),
+      async getSchedulerData () {
+         if (!this.scheduler) return;
+         this.isLoading = true;
+
+         const params = {
+            uid: this.connection.uid,
+            schema: this.schema,
+            scheduler: this.workspace.breadcrumbs.scheduler
+         };
+
+         try {
+            const { status, response } = await Schedulers.getSchedulerInformations(params);
+            if (status === 'success') {
+               this.originalScheduler = response;
+               this.localScheduler = JSON.parse(JSON.stringify(this.originalScheduler));
+               this.sqlProxy = this.localScheduler.sql;
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         this.resizeQueryEditor();
+         this.isLoading = false;
+      },
+      async saveChanges () {
+         if (this.isSaving) return;
+         this.isSaving = true;
+         const params = {
+            uid: this.connection.uid,
+            schema: this.schema,
+            scheduler: {
+               ...this.localScheduler,
+               oldName: this.originalScheduler.name
+            }
+         };
+
+         try {
+            const { status, response } = await Schedulers.alterScheduler(params);
+
+            if (status === 'success') {
+               const oldName = this.originalScheduler.name;
+
+               await this.refreshStructure(this.connection.uid);
+
+               if (oldName !== this.localScheduler.name) {
+                  this.setUnsavedChanges(false);
+                  this.changeBreadcrumbs({ schema: this.schema, scheduler: this.localScheduler.name });
+               }
+
+               this.getSchedulerData();
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         this.isSaving = false;
+      },
+      clearChanges () {
+         this.localScheduler = JSON.parse(JSON.stringify(this.originalScheduler));
+         this.$refs.queryEditor.editor.session.setValue(this.localScheduler.sql);
+      },
+      resizeQueryEditor () {
+         if (this.$refs.queryEditor) {
+            const footer = document.getElementById('footer');
+            const size = window.innerHeight - this.$refs.queryEditor.$el.getBoundingClientRect().top - footer.offsetHeight;
+            this.editorHeight = size;
+            this.$refs.queryEditor.editor.resize();
+         }
+      },
+      showTimingModal () {
+         this.isTimingModal = true;
+      },
+      hideTimingModal () {
+         this.isTimingModal = false;
+      },
+      timingUpdate (options) {
+         this.localScheduler = options;
+      }
+   }
+};
+</script>

src/renderer/components/WorkspacePropsTabTrigger.vue

@@ -0,0 +1,280 @@
+<template>
+   <div class="workspace-query-tab column col-12 columns col-gapless">
+      <div class="workspace-query-runner column col-12">
+         <div class="workspace-query-runner-footer">
+            <div class="workspace-query-buttons">
+               <button
+                  class="btn btn-primary btn-sm"
+                  :disabled="!isChanged"
+                  :class="{'loading':isSaving}"
+                  @click="saveChanges"
+               >
+                  <span>{{ $t('word.save') }}</span>
+                  <i class="mdi mdi-24px mdi-content-save ml-1" />
+               </button>
+               <button
+                  :disabled="!isChanged"
+                  class="btn btn-link btn-sm mr-0"
+                  :title="$t('message.clearChanges')"
+                  @click="clearChanges"
+               >
+                  <span>{{ $t('word.clear') }}</span>
+                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
+               </button>
+            </div>
+         </div>
+      </div>
+      <div class="container">
+         <div class="columns mb-4">
+            <div class="column col-auto">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('word.name') }}</label>
+                  <input
+                     v-model="localTrigger.name"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="column col-auto">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('word.definer') }}</label>
+                  <select
+                     v-if="workspace.users.length"
+                     v-model="localTrigger.definer"
+                     class="form-select"
+                  >
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                     <option v-if="!isDefinerInUsers" :value="originalTrigger.definer">
+                        {{ originalTrigger.definer.replaceAll('`', '') }}
+                     </option>
+                     <option
+                        v-for="user in workspace.users"
+                        :key="`${user.name}@${user.host}`"
+                        :value="`\`${user.name}\`@\`${user.host}\``"
+                     >
+                        {{ user.name }}@{{ user.host }}
+                     </option>
+                  </select>
+                  <select v-if="!workspace.users.length" class="form-select">
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                  </select>
+               </div>
+            </div>
+         </div>
+         <div class="columns">
+            <div class="column col-auto">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('word.table') }}</label>
+                  <select v-model="localTrigger.table" class="form-select">
+                     <option v-for="table in schemaTables" :key="table.name">
+                        {{ table.name }}
+                     </option>
+                  </select>
+               </div>
+            </div>
+            <div class="column col-auto">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('word.event') }}</label>
+                  <div class="input-group">
+                     <select v-model="localTrigger.event1" class="form-select">
+                        <option>BEFORE</option>
+                        <option>AFTER</option>
+                     </select>
+                     <select v-model="localTrigger.event2" class="form-select">
+                        <option>INSERT</option>
+                        <option>UPDATE</option>
+                        <option>DELETE</option>
+                     </select>
+                  </div>
+               </div>
+            </div>
+         </div>
+      </div>
+      <div class="workspace-query-results column col-12 mt-2 p-relative">
+         <BaseLoader v-if="isLoading" />
+         <label class="form-label ml-2">{{ $t('message.triggerStatement') }}</label>
+         <QueryEditor
+            v-if="isSelected"
+            ref="queryEditor"
+            :value.sync="localTrigger.sql"
+            :workspace="workspace"
+            :schema="schema"
+            :height="editorHeight"
+         />
+      </div>
+   </div>
+</template>
+
+<script>
+import QueryEditor from '@/components/QueryEditor';
+import { mapGetters, mapActions } from 'vuex';
+import BaseLoader from '@/components/BaseLoader';
+import Triggers from '@/ipc-api/Triggers';
+
+export default {
+   name: 'WorkspacePropsTabTrigger',
+   components: {
+      BaseLoader,
+      QueryEditor
+   },
+   props: {
+      connection: Object,
+      trigger: String
+   },
+   data () {
+      return {
+         tabUid: 'prop',
+         isLoading: false,
+         isSaving: false,
+         originalTrigger: null,
+         localTrigger: { sql: '' },
+         lastTrigger: null,
+         sqlProxy: '',
+         editorHeight: 300
+      };
+   },
+   computed: {
+      ...mapGetters({
+         getWorkspace: 'workspaces/getWorkspace'
+      }),
+      workspace () {
+         return this.getWorkspace(this.connection.uid);
+      },
+      isSelected () {
+         return this.workspace.selected_tab === 'prop';
+      },
+      schema () {
+         return this.workspace.breadcrumbs.schema;
+      },
+      isChanged () {
+         return JSON.stringify(this.originalTrigger) !== JSON.stringify(this.localTrigger);
+      },
+      isDefinerInUsers () {
+         return this.originalTrigger ? this.workspace.users.some(user => this.originalTrigger.definer === `\`${user.name}\`@\`${user.host}\``) : true;
+      },
+      schemaTables () {
+         const schemaTables = this.workspace.structure
+            .filter(schema => schema.name === this.schema)
+            .map(schema => schema.tables);
+
+         return schemaTables.length ? schemaTables[0].filter(table => table.type === 'table') : [];
+      }
+   },
+   watch: {
+      async trigger () {
+         if (this.isSelected) {
+            await this.getTriggerData();
+            this.$refs.queryEditor.editor.session.setValue(this.localTrigger.sql);
+            this.lastTrigger = this.trigger;
+         }
+      },
+      async isSelected (val) {
+         if (val && this.lastTrigger !== this.trigger) {
+            await this.getTriggerData();
+            this.$refs.queryEditor.editor.session.setValue(this.localTrigger.sql);
+            this.lastTrigger = this.trigger;
+         }
+      },
+      isChanged (val) {
+         if (this.isSelected && this.lastTrigger === this.trigger && this.trigger !== null)
+            this.setUnsavedChanges(val);
+      }
+   },
+   mounted () {
+      window.addEventListener('resize', this.resizeQueryEditor);
+   },
+   destroyed () {
+      window.removeEventListener('resize', this.resizeQueryEditor);
+   },
+   methods: {
+      ...mapActions({
+         addNotification: 'notifications/addNotification',
+         refreshStructure: 'workspaces/refreshStructure',
+         setUnsavedChanges: 'workspaces/setUnsavedChanges',
+         changeBreadcrumbs: 'workspaces/changeBreadcrumbs'
+      }),
+      async getTriggerData () {
+         if (!this.trigger) return;
+
+         this.localTrigger = { sql: '' };
+         this.isLoading = true;
+
+         const params = {
+            uid: this.connection.uid,
+            schema: this.schema,
+            trigger: this.workspace.breadcrumbs.trigger
+         };
+
+         try {
+            const { status, response } = await Triggers.getTriggerInformations(params);
+            if (status === 'success') {
+               this.originalTrigger = response;
+               this.localTrigger = JSON.parse(JSON.stringify(this.originalTrigger));
+               this.sqlProxy = this.localTrigger.sql;
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         this.resizeQueryEditor();
+         this.isLoading = false;
+      },
+      async saveChanges () {
+         if (this.isSaving) return;
+         this.isSaving = true;
+         const params = {
+            uid: this.connection.uid,
+            schema: this.schema,
+            trigger: {
+               ...this.localTrigger,
+               oldName: this.originalTrigger.name
+            }
+         };
+
+         try {
+            const { status, response } = await Triggers.alterTrigger(params);
+
+            if (status === 'success') {
+               const oldName = this.originalTrigger.name;
+
+               await this.refreshStructure(this.connection.uid);
+
+               if (oldName !== this.localTrigger.name) {
+                  this.setUnsavedChanges(false);
+                  this.changeBreadcrumbs({ schema: this.schema, trigger: this.localTrigger.name });
+               }
+
+               this.getTriggerData();
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         this.isSaving = false;
+      },
+      clearChanges () {
+         this.localTrigger = JSON.parse(JSON.stringify(this.originalTrigger));
+         this.$refs.queryEditor.editor.session.setValue(this.localTrigger.sql);
+      },
+      resizeQueryEditor () {
+         if (this.$refs.queryEditor) {
+            const footer = document.getElementById('footer');
+            const size = window.innerHeight - this.$refs.queryEditor.$el.getBoundingClientRect().top - footer.offsetHeight;
+            this.editorHeight = size;
+            this.$refs.queryEditor.editor.resize();
+         }
+      }
+   }
+};
+</script>

src/renderer/components/WorkspacePropsTabView.vue

@@ -0,0 +1,333 @@
+<template>
+   <div class="workspace-query-tab column col-12 columns col-gapless">
+      <div class="workspace-query-runner column col-12">
+         <div class="workspace-query-runner-footer">
+            <div class="workspace-query-buttons">
+               <button
+                  class="btn btn-primary btn-sm"
+                  :disabled="!isChanged"
+                  :class="{'loading':isSaving}"
+                  @click="saveChanges"
+               >
+                  <span>{{ $t('word.save') }}</span>
+                  <i class="mdi mdi-24px mdi-content-save ml-1" />
+               </button>
+               <button
+                  :disabled="!isChanged"
+                  class="btn btn-link btn-sm mr-0"
+                  :title="$t('message.clearChanges')"
+                  @click="clearChanges"
+               >
+                  <span>{{ $t('word.clear') }}</span>
+                  <i class="mdi mdi-24px mdi-delete-sweep ml-1" />
+               </button>
+            </div>
+         </div>
+      </div>
+      <div class="container">
+         <div class="columns mb-4">
+            <div class="column col-auto">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('word.name') }}</label>
+                  <input
+                     v-model="localView.name"
+                     class="form-input"
+                     type="text"
+                  >
+               </div>
+            </div>
+            <div class="column col-auto">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('word.definer') }}</label>
+                  <select
+                     v-if="workspace.users.length"
+                     v-model="localView.definer"
+                     class="form-select"
+                  >
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                     <option v-if="!isDefinerInUsers" :value="originalView.definer">
+                        {{ originalView.definer.replaceAll('`', '') }}
+                     </option>
+                     <option
+                        v-for="user in workspace.users"
+                        :key="`${user.name}@${user.host}`"
+                        :value="`\`${user.name}\`@\`${user.host}\``"
+                     >
+                        {{ user.name }}@{{ user.host }}
+                     </option>
+                  </select>
+                  <select v-if="!workspace.users.length" class="form-select">
+                     <option value="">
+                        {{ $t('message.currentUser') }}
+                     </option>
+                  </select>
+               </div>
+            </div>
+         </div>
+         <div class="columns">
+            <div class="column col-auto mr-2">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('message.sqlSecurity') }}</label>
+                  <label class="form-radio">
+                     <input
+                        v-model="localView.security"
+                        type="radio"
+                        name="security"
+                        value="DEFINER"
+                     >
+                     <i class="form-icon" /> DEFINER
+                  </label>
+                  <label class="form-radio">
+                     <input
+                        v-model="localView.security"
+                        type="radio"
+                        name="security"
+                        value="INVOKER"
+                     >
+                     <i class="form-icon" /> INVOKER
+                  </label>
+               </div>
+            </div>
+            <div class="column col-auto mr-2">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('word.algorithm') }}</label>
+                  <label class="form-radio">
+                     <input
+                        v-model="localView.algorithm"
+                        type="radio"
+                        name="algorithm"
+                        value="UNDEFINED"
+                     >
+                     <i class="form-icon" /> UNDEFINED
+                  </label>
+                  <label class="form-radio">
+                     <input
+                        v-model="localView.algorithm"
+                        type="radio"
+                        value="MERGE"
+                        name="algorithm"
+                     >
+                     <i class="form-icon" /> MERGE
+                  </label>
+                  <label class="form-radio">
+                     <input
+                        v-model="localView.algorithm"
+                        type="radio"
+                        value="TEMPTABLE"
+                        name="algorithm"
+                     >
+                     <i class="form-icon" /> TEMPTABLE
+                  </label>
+               </div>
+            </div>
+            <div class="column col-auto mr-2">
+               <div class="form-group">
+                  <label class="form-label">{{ $t('message.updateOption') }}</label>
+                  <label class="form-radio">
+                     <input
+                        v-model="localView.updateOption"
+                        type="radio"
+                        name="update"
+                        value=""
+                     >
+                     <i class="form-icon" /> None
+                  </label>
+                  <label class="form-radio">
+                     <input
+                        v-model="localView.updateOption"
+                        type="radio"
+                        name="update"
+                        value="CASCADED"
+                     >
+                     <i class="form-icon" /> CASCADED
+                  </label>
+                  <label class="form-radio">
+                     <input
+                        v-model="localView.updateOption"
+                        type="radio"
+                        name="update"
+                        value="LOCAL"
+                     >
+                     <i class="form-icon" /> LOCAL
+                  </label>
+               </div>
+            </div>
+         </div>
+      </div>
+      <div class="workspace-query-results column col-12 mt-2 p-relative">
+         <BaseLoader v-if="isLoading" />
+         <label class="form-label ml-2">{{ $t('message.selectStatement') }}</label>
+         <QueryEditor
+            v-if="isSelected"
+            ref="queryEditor"
+            :value.sync="localView.sql"
+            :workspace="workspace"
+            :schema="schema"
+            :height="editorHeight"
+         />
+      </div>
+   </div>
+</template>
+
+<script>
+import { mapGetters, mapActions } from 'vuex';
+import BaseLoader from '@/components/BaseLoader';
+import QueryEditor from '@/components/QueryEditor';
+import Views from '@/ipc-api/Views';
+
+export default {
+   name: 'WorkspacePropsTabView',
+   components: {
+      BaseLoader,
+      QueryEditor
+   },
+   props: {
+      connection: Object,
+      view: String
+   },
+   data () {
+      return {
+         tabUid: 'prop',
+         isLoading: false,
+         isSaving: false,
+         originalView: null,
+         localView: { sql: '' },
+         lastView: null,
+         sqlProxy: '',
+         editorHeight: 300
+      };
+   },
+   computed: {
+      ...mapGetters({
+         getWorkspace: 'workspaces/getWorkspace'
+      }),
+      workspace () {
+         return this.getWorkspace(this.connection.uid);
+      },
+      isSelected () {
+         return this.workspace.selected_tab === 'prop';
+      },
+      schema () {
+         return this.workspace.breadcrumbs.schema;
+      },
+      isChanged () {
+         return JSON.stringify(this.originalView) !== JSON.stringify(this.localView);
+      },
+      isDefinerInUsers () {
+         return this.originalView ? this.workspace.users.some(user => this.originalView.definer === `\`${user.name}\`@\`${user.host}\``) : true;
+      }
+   },
+   watch: {
+      async view () {
+         if (this.isSelected) {
+            await this.getViewData();
+            this.$refs.queryEditor.editor.session.setValue(this.localView.sql);
+            this.lastView = this.view;
+         }
+      },
+      async isSelected (val) {
+         if (val && this.lastView !== this.view) {
+            await this.getViewData();
+            this.$refs.queryEditor.editor.session.setValue(this.localView.sql);
+            this.lastView = this.view;
+         }
+      },
+      isChanged (val) {
+         if (this.isSelected && this.lastView === this.view && this.view !== null)
+            this.setUnsavedChanges(val);
+      }
+   },
+   mounted () {
+      window.addEventListener('resize', this.resizeQueryEditor);
+   },
+   destroyed () {
+      window.removeEventListener('resize', this.resizeQueryEditor);
+   },
+   methods: {
+      ...mapActions({
+         addNotification: 'notifications/addNotification',
+         refreshStructure: 'workspaces/refreshStructure',
+         setUnsavedChanges: 'workspaces/setUnsavedChanges',
+         changeBreadcrumbs: 'workspaces/changeBreadcrumbs'
+      }),
+      async getViewData () {
+         if (!this.view) return;
+         this.isLoading = true;
+         this.localView = { sql: '' };
+
+         const params = {
+            uid: this.connection.uid,
+            schema: this.schema,
+            view: this.workspace.breadcrumbs.view
+         };
+
+         try {
+            const { status, response } = await Views.getViewInformations(params);
+            if (status === 'success') {
+               this.originalView = response;
+               this.localView = JSON.parse(JSON.stringify(this.originalView));
+               this.sqlProxy = this.localView.sql;
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         this.resizeQueryEditor();
+         this.isLoading = false;
+      },
+      async saveChanges () {
+         if (this.isSaving) return;
+         this.isSaving = true;
+         const params = {
+            uid: this.connection.uid,
+            schema: this.schema,
+            view: {
+               ...this.localView,
+               oldName: this.originalView.name
+            }
+         };
+
+         try {
+            const { status, response } = await Views.alterView(params);
+
+            if (status === 'success') {
+               const oldName = this.originalView.name;
+
+               await this.refreshStructure(this.connection.uid);
+
+               if (oldName !== this.localView.name) {
+                  this.setUnsavedChanges(false);
+                  this.changeBreadcrumbs({ schema: this.schema, view: this.localView.name });
+               }
+
+               this.getViewData();
+            }
+            else
+               this.addNotification({ status: 'error', message: response });
+         }
+         catch (err) {
+            this.addNotification({ status: 'error', message: err.stack });
+         }
+
+         this.isSaving = false;
+      },
+      clearChanges () {
+         this.localView = JSON.parse(JSON.stringify(this.originalView));
+         this.$refs.queryEditor.editor.session.setValue(this.localView.sql);
+      },
+      resizeQueryEditor () {
+         if (this.$refs.queryEditor) {
+            const footer = document.getElementById('footer');
+            const size = window.innerHeight - this.$refs.queryEditor.$el.getBoundingClientRect().top - footer.offsetHeight;
+            this.editorHeight = size;
+            this.$refs.queryEditor.editor.resize();
+         }
+      }
+   }
+};
+</script>

src/renderer/components/WorkspacePropsTableContext.vue

@@ -77,11 +77,3 @@ export default {
    }
 };
 </script>
-
-<style lang="scss" scoped>
-.disabled {
-  pointer-events: none;
-  filter: grayscale(100%);
-  opacity: 0.5;
-}
-</style>

src/renderer/components/WorkspacePropsTableRow.vue

@@ -318,7 +318,7 @@ export default {
          getWorkspace: 'workspaces/getWorkspace'
       }),
       localLength () {
-         return this.localRow.numLength || this.localRow.charLength || this.localRow.datePrecision || 0;
+         return this.localRow.numLength || this.localRow.charLength || this.localRow.datePrecision || this.localRow.numPrecision || 0;
       },
       fieldType () {
          const fieldType = this.dataTypes.reduce((acc, group) => [...acc, ...group.types], []).filter(type =>
@@ -400,7 +400,7 @@ export default {
             this.defaultValue.type = 'custom';
             this.defaultValue.custom = this.localRow.default.replace(/(^')|('$)/g, '');
          }
-         else if (!isNaN(this.localRow.default)) {
+         else if (!isNaN(this.localRow.default.replace(/[:.-\s]/g, ''))) {
             this.defaultValue.type = 'custom';
             this.defaultValue.custom = this.localRow.default;
          }

src/renderer/components/WorkspaceQueryTab.vue

@@ -2,19 +2,23 @@
    <div v-show="isSelected" class="workspace-query-tab column col-12 columns col-gapless">
       <div class="workspace-query-runner column col-12">
          <QueryEditor
-            v-if="isSelected"
+            v-show="isSelected"
+            ref="queryEditor"
             :auto-focus="true"
             :value.sync="query"
             :workspace="workspace"
             :schema="schema"
+            :is-selected="isSelected"
+            :height="editorHeight"
          />
+         <div ref="resizer" class="query-area-resizer" />
          <div class="workspace-query-runner-footer">
             <div class="workspace-query-buttons">
                <button
                   class="btn btn-primary btn-sm"
                   :class="{'loading':isQuering}"
                   :disabled="!query"
-                  title="F9"
+                  title="F5"
                   @click="runQuery(query)"
                >
                   <span>{{ $t('word.run') }}</span>
@@ -44,7 +48,7 @@
             v-show="!isQuering"
             ref="queryTable"
             :results="results"
-            :tab-uid="tabUid"
+            :tab-uid="tab.uid"
             :conn-uid="connection.uid"
             mode="query"
             @update-field="updateField"
@@ -70,7 +74,7 @@ export default {
    mixins: [tableTabs],
    props: {
       connection: Object,
-      tabUid: String,
+      tab: Object,
       isSelected: Boolean
    },
    data () {
@@ -80,20 +84,40 @@ export default {
          isQuering: false,
          results: [],
          resultsCount: 0,
-         affectedCount: 0
+         affectedCount: 0,
+         editorHeight: 200
       };
    },
    computed: {
       ...mapGetters({
-         getWorkspace: 'workspaces/getWorkspace'
+         getWorkspace: 'workspaces/getWorkspace',
+         selectedWorkspace: 'workspaces/getSelected'
       }),
       workspace () {
          return this.getWorkspace(this.connection.uid);
+      },
+      isWorkspaceSelected () {
+         return this.workspace.uid === this.selectedWorkspace;
       }
    },
    created () {
+      this.query = this.tab.content;
+
       window.addEventListener('keydown', this.onKey);
    },
+   mounted () {
+      const resizer = this.$refs.resizer;
+
+      resizer.addEventListener('mousedown', e => {
+         e.preventDefault();
+
+         window.addEventListener('mousemove', this.resize);
+         window.addEventListener('mouseup', this.stopResize);
+      });
+
+      if (this.tab.autorun)
+         this.runQuery(this.query);
+   },
    beforeDestroy () {
       window.removeEventListener('keydown', this.onKey);
    },
@@ -139,10 +163,25 @@ export default {
          this.resultsCount = 0;
          this.affectedCount = 0;
       },
+      resize (e) {
+         const el = this.$refs.queryEditor.$el;
+         let editorHeight = e.pageY - el.getBoundingClientRect().top;
+         if (editorHeight > 400) editorHeight = 400;
+         if (editorHeight < 50) editorHeight = 50;
+         this.editorHeight = editorHeight;
+      },
+      stopResize () {
+         window.removeEventListener('mousemove', this.resize);
+         if (this.$refs.queryTable && this.results.length)
+            this.$refs.queryTable.resizeResults();
+
+         if (this.$refs.queryEditor)
+            this.$refs.queryEditor.editor.resize();
+      },
       onKey (e) {
-         if (this.isSelected) {
+         if (this.isSelected && this.isWorkspaceSelected) {
             e.stopPropagation();
-            if (e.key === 'F9')
+            if (e.key === 'F5')
                this.runQuery(this.query);
          }
       }
@@ -155,11 +194,23 @@ export default {
   align-content: baseline;
 
   .workspace-query-runner {
+    position: relative;
+
+    .query-area-resizer {
+      position: absolute;
+      height: 5px;
+      bottom: 40px;
+      width: 100%;
+      cursor: ns-resize;
+      z-index: 99;
+    }
+
     .workspace-query-runner-footer {
       display: flex;
       justify-content: space-between;
       padding: 0.3rem 0.6rem 0.4rem;
       align-items: center;
+      height: 42px;
 
       .workspace-query-buttons {
         display: flex;

src/renderer/components/WorkspaceQueryTable.vue

@@ -41,7 +41,7 @@
                         />
                         <span>{{ field.alias || field.name }}</span>
                         <i
-                           v-if="currentSort === field.name || currentSort === `${field.table}.${field.name}`"
+                           v-if="idSortable && currentSort === field.name || currentSort === `${field.table}.${field.name}`"
                            class="mdi sort-icon"
                            :class="currentSortDir === 'asc' ? 'mdi-sort-ascending':'mdi-sort-descending'"
                         />
@@ -69,7 +69,7 @@
                   class="tr"
                   :class="{'selected': selectedRows.includes(row._id)}"
                   @select-row="selectRow($event, row._id)"
-                  @update-field="updateField($event, getPrimaryValue(row))"
+                  @update-field="updateField($event, row)"
                   @contextmenu="contextMenu"
                />
             </template>
@@ -80,7 +80,8 @@
 
 <script>
 import { uidGen } from 'common/libs/uidGen';
-import { LONG_TEXT, BLOB } from 'common/fieldTypes';
+import arrayToFile from '../libs/arrayToFile';
+import { TEXT, LONG_TEXT, BLOB } from 'common/fieldTypes';
 import BaseVirtualScroll from '@/components/BaseVirtualScroll';
 import WorkspaceQueryTableRow from '@/components/WorkspaceQueryTableRow';
 import TableContext from '@/components/WorkspaceQueryTableContext';
@@ -123,6 +124,9 @@ export default {
       primaryField () {
          return this.fields.filter(field => ['pri', 'uni'].includes(field.key))[0] || false;
       },
+      idSortable () {
+         return this.fields.every(field => field.name);
+      },
       isHardSort () {
          return this.mode === 'table' && this.localResults.length === 1000;
       },
@@ -195,7 +199,8 @@ export default {
       },
       fieldLength (field) {
          if ([...BLOB, ...LONG_TEXT].includes(field.type)) return null;
-         return field.numLength || field.datePrecision || field.charLength || 0;
+         else if (TEXT.includes(field.type)) return field.charLength;
+         return field.length;
       },
       keyName (key) {
          switch (key) {
@@ -252,37 +257,32 @@ export default {
       refreshScroller () {
          this.resizeResults();
       },
-      updateField (payload, id) {
-         if (!this.primaryField)
-            this.addNotification({ status: 'warning', message: this.$t('message.unableEditFieldWithoutPrimary') });
-         else {
-            const params = {
-               primary: this.primaryField.name,
-               schema: this.getSchema(this.resultsetIndex),
-               table: this.getTable(this.resultsetIndex),
-               id,
-               ...payload
-            };
-            this.$emit('update-field', params);
-         }
+      updateField (payload, row) {
+         delete row._id;
+
+         const params = {
+            primary: this.primaryField.name,
+            schema: this.getSchema(this.resultsetIndex),
+            table: this.getTable(this.resultsetIndex),
+            id: this.getPrimaryValue(row),
+            row,
+            ...payload
+         };
+         this.$emit('update-field', params);
       },
       deleteSelected () {
-         if (!this.primaryField)
-            this.addNotification({ status: 'warning', message: this.$t('message.unableEditFieldWithoutPrimary') });
-         else {
-            const rowIDs = this.localResults.filter(row => this.selectedRows.includes(row._id)).map(row =>
-               row[this.primaryField.name] ||
-               row[`${this.primaryField.table}.${this.primaryField.name}`] ||
-               row[`${this.primaryField.tableAlias}.${this.primaryField.name}`]
-            );
-            const params = {
-               primary: this.primaryField.name,
-               schema: this.getSchema(this.resultsetIndex),
-               table: this.getTable(this.resultsetIndex),
-               rows: rowIDs
-            };
-            this.$emit('delete-selected', params);
-         }
+         const rows = this.localResults.filter(row => this.selectedRows.includes(row._id)).map(row => {
+            delete row._id;
+            return row;
+         });
+
+         const params = {
+            primary: this.primaryField.name,
+            schema: this.getSchema(this.resultsetIndex),
+            table: this.getTable(this.resultsetIndex),
+            rows
+         };
+         this.$emit('delete-selected', params);
       },
       applyUpdate (params) {
          const { primary, id, field, table, content } = params;
@@ -324,6 +324,8 @@ export default {
             this.selectedRows = [row];
       },
       contextMenu (event, cell) {
+         if (event.target.localName === 'input') return;
+
          this.selectedCell = cell;
          if (!this.selectedRows.includes(cell.id))
             this.selectedRows = [cell.id];
@@ -331,6 +333,8 @@ export default {
          this.isContext = true;
       },
       sort (field) {
+         if (!this.idSortable) return;
+
          if (this.mode === 'query')
             field = `${this.getTable(this.resultsetIndex)}.${field}`;
 
@@ -354,6 +358,20 @@ export default {
       },
       selectResultset (index) {
          this.resultsetIndex = index;
+      },
+      downloadTable (format, filename) {
+         if (!this.sortedResults) return;
+
+         const rows = [...this.sortedResults].map(row => {
+            delete row._id;
+            return row;
+         });
+
+         arrayToFile({
+            type: format,
+            content: rows,
+            filename
+         });
       }
    }
 };

src/renderer/components/WorkspaceQueryTableRow.vue

@@ -16,7 +16,7 @@
                @dblclick="editON($event, col, cKey)"
             >{{ col | typeFormat(getFieldType(cKey), getFieldPrecision(cKey)) | cutText }}</span>
             <ForeignKeySelect
-               v-else-if="foreignKeys.includes(cKey)"
+               v-else-if="isForeignKey(cKey)"
                class="editable-field"
                :value.sync="editingContent"
                :key-usage="getKeyUsage(cKey)"
@@ -61,14 +61,52 @@
          <div :slot="'body'">
             <div class="mb-2">
                <div>
-                  <textarea
-                     v-model="editingContent"
-                     class="form-input textarea-editor"
+                  <TextEditor
+                     :value.sync="editingContent"
+                     editor-class="textarea-editor"
+                     :mode="editorMode"
                   />
                </div>
-               <div class="editor-field-info">
-                  <div><b>{{ $t('word.size') }}</b>: {{ editingContent ? editingContent.length : 0 }}</div>
-                  <div><b>{{ $t('word.type') }}</b>: {{ editingType.toUpperCase() }}</div>
+               <div class="editor-field-info p-vcentered">
+                  <div class="d-flex p-vcentered">
+                     <label for="editorMode" class="form-label mr-2">
+                        <b>{{ $t('word.content') }}</b>:
+                     </label>
+                     <select
+                        id="editorMode"
+                        v-model="editorMode"
+                        class="form-select select-sm"
+                     >
+                        <option value="text">
+                           TEXT
+                        </option>
+                        <option value="html">
+                           HTML
+                        </option>
+                        <option value="xml">
+                           XML
+                        </option>
+                        <option value="json">
+                           JSON
+                        </option>
+                        <option value="svg">
+                           SVG
+                        </option>
+                        <option value="yaml">
+                           YAML
+                        </option>
+                     </select>
+                  </div>
+                  <div class="d-flex">
+                     <div class="p-vcentered">
+                        <div class="mr-4">
+                           <b>{{ $t('word.size') }}</b>: {{ editingContent ? editingContent.length : 0 }}
+                        </div>
+                        <div>
+                           <b>{{ $t('word.type') }}</b>: {{ editingType.toUpperCase() }}
+                        </div>
+                     </div>
+                  </div>
                </div>
             </div>
          </div>
@@ -135,15 +173,17 @@ import { mimeFromHex } from 'common/libs/mimeFromHex';
 import { formatBytes } from 'common/libs/formatBytes';
 import { bufferToBase64 } from 'common/libs/bufferToBase64';
 import hexToBinary from 'common/libs/hexToBinary';
-import { TEXT, LONG_TEXT, NUMBER, DATE, TIME, DATETIME, BLOB, BIT } from 'common/fieldTypes';
+import { TEXT, LONG_TEXT, NUMBER, FLOAT, DATE, TIME, DATETIME, BLOB, BIT } from 'common/fieldTypes';
 import { mask } from 'vue-the-mask';
 import ConfirmModal from '@/components/BaseConfirmModal';
+import TextEditor from '@/components/BaseTextEditor';
 import ForeignKeySelect from '@/components/ForeignKeySelect';
 
 export default {
    name: 'WorkspaceQueryTableRow',
    components: {
       ConfirmModal,
+      TextEditor,
       ForeignKeySelect
    },
    directives: {
@@ -206,6 +246,7 @@ export default {
          editingContent: null,
          editingType: null,
          editingField: null,
+         editorMode: 'text',
          contentInfo: {
             ext: '',
             mime: '',
@@ -219,7 +260,7 @@ export default {
          if ([...TEXT, ...LONG_TEXT].includes(this.editingType))
             return { type: 'text', mask: false };
 
-         if (NUMBER.includes(this.editingType))
+         if ([...NUMBER, ...FLOAT].includes(this.editingType))
             return { type: 'number', mask: false };
 
          if (TIME.includes(this.editingType)) {
@@ -260,7 +301,19 @@ export default {
          return this.keyUsage.map(key => key.field);
       },
       isEditable () {
-         return this.fields ? !!(this.fields[0].schema && this.fields[0].table) : false;
+         if (this.fields) {
+            const nElements = this.fields.reduce((acc, curr) => {
+               acc.add(curr.table);
+               acc.add(curr.schema);
+               return acc;
+            }, new Set([]));
+
+            if (nElements.size > 2) return false;
+
+            return !!(this.fields[0].schema && this.fields[0].table);
+         }
+
+         return false;
       }
    },
    watch: {
@@ -271,6 +324,12 @@ export default {
       }
    },
    methods: {
+      isForeignKey (key) {
+         if (key.includes('.'))
+            key = key.split('.').pop();
+
+         return this.foreignKeys.includes(key);
+      },
       getFieldType (cKey) {
          let type = 'unknown';
          const field = this.getFieldObj(cKey);
@@ -423,6 +482,8 @@ export default {
          this.$emit('select-row', event, row);
       },
       getKeyUsage (keyName) {
+         if (keyName.includes('.'))
+            return this.keyUsage.find(key => key.field === keyName.split('.').pop());
          return this.keyUsage.find(key => key.field === keyName);
       }
    }
@@ -453,7 +514,7 @@ export default {
 }
 
 .editor-field-info {
-  margin-top: 0.6rem;
+  margin-top: 0.4rem;
   display: flex;
   justify-content: space-between;
   white-space: normal;

src/renderer/components/WorkspaceTableTab.vue

@@ -32,13 +32,36 @@
                      </div>
                   </div>
                </div>
+
                <button
+                  v-if="isTable"
                   class="btn btn-dark btn-sm"
-                  @click="showAddModal"
+                  :disabled="isQuering"
+                  @click="showFakerModal"
                >
-                  <span>{{ $t('word.add') }}</span>
+                  <span>{{ $t('message.tableFiller') }}</span>
                   <i class="mdi mdi-24px mdi-playlist-plus ml-1" />
                </button>
+
+               <div class="dropdown export-dropdown pr-2">
+                  <button
+                     :disabled="isQuering"
+                     class="btn btn-dark btn-sm dropdown-toggle mr-0 pr-0"
+                     tabindex="0"
+                  >
+                     <span>{{ $t('word.export') }}</span>
+                     <i class="mdi mdi-24px mdi-file-export ml-1" />
+                     <i class="mdi mdi-24px mdi-menu-down" />
+                  </button>
+                  <ul class="menu text-left">
+                     <li class="menu-item">
+                        <a class="c-hand" @click="downloadTable('json')">JSON</a>
+                     </li>
+                     <li class="menu-item">
+                        <a class="c-hand" @click="downloadTable('csv')">CSV</a>
+                     </li>
+                  </ul>
+               </div>
             </div>
             <div class="workspace-query-info">
                <div v-if="results.length && results[0].rows">
@@ -74,6 +97,14 @@
          @hide="hideAddModal"
          @reload="reloadTable"
       />
+      <ModalFakerRows
+         v-if="isFakerModal"
+         :fields="fields"
+         :key-usage="keyUsage"
+         :tab-uid="tabUid"
+         @hide="hideFakerModal"
+         @reload="reloadTable"
+      />
    </div>
 </template>
 
@@ -81,6 +112,7 @@
 import Tables from '@/ipc-api/Tables';
 import WorkspaceQueryTable from '@/components/WorkspaceQueryTable';
 import ModalNewTableRow from '@/components/ModalNewTableRow';
+import ModalFakerRows from '@/components/ModalFakerRows';
 import { mapGetters, mapActions } from 'vuex';
 import tableTabs from '@/mixins/tableTabs';
 
@@ -88,7 +120,8 @@ export default {
    name: 'WorkspaceTableTab',
    components: {
       WorkspaceQueryTable,
-      ModalNewTableRow
+      ModalNewTableRow,
+      ModalFakerRows
    },
    mixins: [tableTabs],
    props: {
@@ -102,6 +135,7 @@ export default {
          results: [],
          lastTable: null,
          isAddModal: false,
+         isFakerModal: false,
          autorefreshTimer: 0,
          refreshInterval: null,
          sortParams: {}
@@ -109,13 +143,17 @@ export default {
    },
    computed: {
       ...mapGetters({
-         getWorkspace: 'workspaces/getWorkspace'
+         getWorkspace: 'workspaces/getWorkspace',
+         selectedWorkspace: 'workspaces/getSelected'
       }),
       workspace () {
          return this.getWorkspace(this.connection.uid);
       },
       isSelected () {
-         return this.workspace.selected_tab === 'data';
+         return this.workspace.selected_tab === 'data' && this.workspace.uid === this.selectedWorkspace;
+      },
+      isTable () {
+         return !!this.workspace.breadcrumbs.table;
       },
       fields () {
          return this.results.length ? this.results[0].fields : [];
@@ -171,7 +209,7 @@ export default {
          const params = {
             uid: this.connection.uid,
             schema: this.schema,
-            table: this.workspace.breadcrumbs.table,
+            table: this.workspace.breadcrumbs.table || this.workspace.breadcrumbs.view,
             sortParams
          };
 
@@ -205,6 +243,13 @@ export default {
       hideAddModal () {
          this.isAddModal = false;
       },
+      showFakerModal () {
+         if (this.isQuering) return;
+         this.isFakerModal = true;
+      },
+      hideFakerModal () {
+         this.isFakerModal = false;
+      },
       onKey (e) {
          if (this.isSelected) {
             e.stopPropagation();
@@ -222,7 +267,21 @@ export default {
                   this.reloadTable();
             }, this.autorefreshTimer * 1000);
          }
+      },
+      downloadTable (format) {
+         this.$refs.queryTable.downloadTable(format, this.table);
       }
    }
 };
 </script>
+<style lang="scss" scoped>
+.export-dropdown {
+  .menu {
+    min-width: 100%;
+
+    .menu-item a:hover {
+      background: $bg-color-gray;
+    }
+  }
+}
+</style>

src/renderer/i18n/ar-SA.js

@@ -69,19 +69,5 @@ module.exports = {
       uploadFile: 'رفع ملف',
       addNewRow: 'إضافة صف جديد',
       numberOfInserts: 'عدد الإدراجات'
-   },
-   // Date and Time
-   short: {
-      year: 'numeric',
-      month: 'short',
-      day: 'numeric'
-   },
-   long: {
-      year: 'numeric',
-      month: 'short',
-      day: 'numeric',
-      weekday: 'short',
-      hour: 'numeric',
-      minute: 'numeric'
    }
 };

src/renderer/i18n/en-US.js

@@ -67,7 +67,37 @@ module.exports = {
       dark: 'Dark',
       autoCompletion: 'Auto Completion',
       application: 'Application',
-      editor: 'Editor'
+      editor: 'Editor',
+      view: 'View',
+      definer: 'Definer',
+      algorithm: 'Algorithm',
+      trigger: 'Trigger | Triggers',
+      storedRoutine: 'Stored routine | Stored routines',
+      scheduler: 'Scheduler | Schedulers',
+      event: 'Event',
+      parameters: 'Parameters',
+      function: 'Function | Functions',
+      deterministic: 'Deterministic',
+      context: 'Context',
+      export: 'Export',
+      returns: 'Returns',
+      timing: 'Timing',
+      state: 'State',
+      execution: 'Execution',
+      starts: 'Starts',
+      ends: 'Ends',
+      ssl: 'SSL',
+      privateKey: 'Private key',
+      certificate: 'Certificate',
+      caCertificate: 'CA certificate',
+      ciphers: 'Ciphers',
+      upload: 'Upload',
+      browse: 'Browse',
+      faker: 'Faker',
+      content: 'Content',
+      cut: 'Cut',
+      copy: 'Copy',
+      paste: 'Paste'
    },
    message: {
       appWelcome: 'Welcome to Antares SQL Client!',
@@ -131,20 +161,199 @@ module.exports = {
       invalidDefault: 'Invalid default',
       onDelete: 'On delete',
       applicationTheme: 'Application Theme',
-      editorTheme: 'Editor Theme'
+      editorTheme: 'Editor Theme',
+      wrapLongLines: 'Wrap long lines',
+      selectStatement: 'Select statement',
+      triggerStatement: 'Trigger statement',
+      sqlSecurity: 'SQL security',
+      updateOption: 'Update option',
+      deleteView: 'Delete view',
+      createNewView: 'Create new view',
+      deleteTrigger: 'Delete trigger',
+      createNewTrigger: 'Create new trigger',
+      currentUser: 'Current user',
+      routineBody: 'Routine body',
+      dataAccess: 'Data access',
+      thereAreNoParameters: 'There are no parameters',
+      createNewParameter: 'Create new parameter',
+      createNewRoutine: 'Create new stored routine',
+      deleteRoutine: 'Delete stored routine',
+      functionBody: 'Function body',
+      createNewFunction: 'Create new function',
+      deleteFunction: 'Delete function',
+      schedulerBody: 'Scheduler body',
+      createNewScheduler: 'Create new scheduler',
+      deleteScheduler: 'Delete scheduler',
+      preserveOnCompletion: 'Preserve on completion',
+      enableSsl: 'Enable SSL',
+      manualValue: 'Manual value',
+      tableFiller: 'Table Filler',
+      fakeDataLanguage: 'Fake data language',
+      searchForElements: 'Search for elements',
+      selectAll: 'Select all'
    },
-   // Date and Time
-   short: {
-      year: 'numeric',
-      month: 'short',
-      day: 'numeric'
-   },
-   long: {
-      year: 'numeric',
-      month: 'short',
-      day: 'numeric',
-      weekday: 'short',
-      hour: 'numeric',
-      minute: 'numeric'
+   faker: {
+      address: 'Address',
+      commerce: 'Commerce',
+      company: 'Company',
+      database: 'Database',
+      date: 'Date',
+      finance: 'Finance',
+      git: 'Git',
+      hacker: 'Hacker',
+      internet: 'Internet',
+      lorem: 'Lorem',
+      name: 'Name',
+      music: 'Music',
+      phone: 'Phone',
+      random: 'Random',
+      system: 'System',
+      time: 'Time',
+      vehicle: 'Vehicle',
+      zipCode: 'Zip code',
+      zipCodeByState: 'Zip code by state',
+      city: 'City',
+      cityPrefix: 'City prefix',
+      citySuffix: 'City suffix',
+      streetName: 'Street name',
+      streetAddress: 'Street address',
+      streetSuffix: 'Street suffix',
+      streetPrefix: 'Street prefix',
+      secondaryAddress: 'Secondary address',
+      county: 'County',
+      country: 'Country',
+      countryCode: 'Country code',
+      state: 'State',
+      stateAbbr: 'State abbreviation',
+      latitude: 'Latitude',
+      longitude: 'Longitude',
+      direction: 'Direction',
+      cardinalDirection: 'Cardinal direction',
+      ordinalDirection: 'Ordinal direction',
+      nearbyGPSCoordinate: 'Nearby GPS coordinate',
+      timeZone: 'Time zone',
+      color: 'Color',
+      department: 'Department',
+      productName: 'Product name',
+      price: 'Price',
+      productAdjective: 'Product adjective',
+      productMaterial: 'Product material',
+      product: 'Product',
+      productDescription: 'Product description',
+      suffixes: 'Suffixes',
+      companyName: 'Company name',
+      companySuffix: 'Company suffix',
+      catchPhrase: 'Catch phrase',
+      bs: 'BS',
+      catchPhraseAdjective: 'Catch phrase adjective',
+      catchPhraseDescriptor: 'Catch phrase descriptor',
+      catchPhraseNoun: 'Catch phrase noun',
+      bsAdjective: 'BS adjective',
+      bsBuzz: 'BS buzz',
+      bsNoun: 'BS noun',
+      column: 'Column',
+      type: 'Type',
+      collation: 'Collation',
+      engine: 'Engine',
+      past: 'Past',
+      future: 'Future',
+      between: 'Between',
+      recent: 'Recent',
+      soon: 'Soon',
+      month: 'Month',
+      weekday: 'Weekday',
+      account: 'Account',
+      accountName: 'Account name',
+      routingNumber: 'Routing number',
+      mask: 'Mask',
+      amount: 'Amount',
+      transactionType: 'Transaction type',
+      currencyCode: 'Currency code',
+      currencyName: 'Currency name',
+      currencySymbol: 'Currency symbol',
+      bitcoinAddress: 'Bitcoin address',
+      litecoinAddress: 'Litecoin address',
+      creditCardNumber: 'Credit card number',
+      creditCardCVV: 'Credit card CVV',
+      ethereumAddress: 'Ethereum address',
+      iban: 'Iban',
+      bic: 'Bic',
+      transactionDescription: 'Transaction description',
+      branch: 'Branch',
+      commitEntry: 'Commit entry',
+      commitMessage: 'Commit message',
+      commitSha: 'Commit SHA',
+      shortSha: 'Short SHA',
+      abbreviation: 'Abbreviation',
+      adjective: 'Adjective',
+      noun: 'Noun',
+      verb: 'Verb',
+      ingverb: 'Ingverb',
+      phrase: 'Phrase',
+      avatar: 'Avatar',
+      email: 'Email',
+      exampleEmail: 'Example email',
+      userName: 'Username',
+      protocol: 'Protocol',
+      url: 'Url',
+      domainName: 'Domin name',
+      domainSuffix: 'Domain suffix',
+      domainWord: 'Domain word',
+      ip: 'Ip',
+      ipv6: 'Ipv6',
+      userAgent: 'User agent',
+      mac: 'Mac',
+      password: 'Password',
+      word: 'Word',
+      words: 'Words',
+      sentence: 'Sentence',
+      slug: 'Slug',
+      sentences: 'Sentences',
+      paragraph: 'Paragraph',
+      paragraphs: 'Paragraphs',
+      text: 'Text',
+      lines: 'Lines',
+      genre: 'Genre',
+      firstName: 'First name',
+      lastName: 'Last name',
+      middleName: 'Middle name',
+      findName: 'Full name',
+      jobTitle: 'Job title',
+      gender: 'Gender',
+      prefix: 'Prefix',
+      suffix: 'Suffix',
+      title: 'Title',
+      jobDescriptor: 'Job descriptor',
+      jobArea: 'Job area',
+      jobType: 'Job type',
+      phoneNumber: 'Phone number',
+      phoneNumberFormat: 'Phone number format',
+      phoneFormats: 'Phone formats',
+      number: 'Number',
+      float: 'Float',
+      arrayElement: 'Array element',
+      arrayElements: 'Array elements',
+      objectElement: 'Object element',
+      uuid: 'Uuid',
+      boolean: 'Boolean',
+      image: 'Image',
+      locale: 'Locale',
+      alpha: 'Alpha',
+      alphaNumeric: 'Alphanumeric',
+      hexaDecimal: 'Hexadecimal',
+      fileName: 'File name',
+      commonFileName: 'Common file name',
+      mimeType: 'Mime type',
+      commonFileType: 'Common file type',
+      commonFileExt: 'Common file extension',
+      fileType: 'File type',
+      fileExt: 'File extension',
+      directoryPath: 'Directory path',
+      filePath: 'File path',
+      semver: 'Semver',
+      manufacturer: 'Manufacturer',
+      model: 'Model',
+      fuel: 'Fuel',
+      vin: 'Vin'
    }
 };

src/renderer/i18n/es-ES.js

@@ -72,19 +72,5 @@ module.exports = {
       numberOfInserts: 'Numero de inserciones',
       openNewTab: 'Abrir nueva pestaña',
       affectedRows: 'Filas afectadas'
-   },
-   // Date and Time
-   short: {
-      year: 'numeric',
-      month: 'short',
-      day: 'numeric'
-   },
-   long: {
-      year: 'numeric',
-      month: 'short',
-      day: 'numeric',
-      weekday: 'short',
-      hour: 'numeric',
-      minute: 'numeric'
    }
 };

src/renderer/i18n/fr-FR.js

@@ -0,0 +1,352 @@
+module.exports = {
+   word: {
+      edit: 'Éditer',
+      save: 'Enregistrer',
+      close: 'Fermer',
+      delete: 'Supprimer',
+      confirm: 'Confirmer',
+      cancel: 'Annuler',
+      send: 'Envoyer',
+      connectionName: 'Nom de connexion',
+      client: 'Client',
+      hostName: 'Nom d\'hôte',
+      port: 'Port',
+      user: 'Utilisateur',
+      password: 'Mot de passe',
+      credentials: 'Identifiants',
+      connect: 'Se connecter',
+      connected: 'Connecté',
+      disconnect: 'Se déconnecter',
+      disconnected: 'Déconnecté',
+      refresh: 'Rafraichir',
+      settings: 'Paramètres',
+      general: 'Général',
+      themes: 'Thèmes',
+      update: 'Mise à jour',
+      about: 'À propos',
+      language: 'Langue',
+      version: 'Version',
+      donate: 'Faire un don',
+      run: 'Exécuter',
+      schema: 'Schéma',
+      results: 'Résutats',
+      size: 'Taille',
+      seconds: 'Secondes',
+      type: 'Type',
+      mimeType: 'Mime-Type',
+      download: 'Télécharger',
+      add: 'Ajouter',
+      data: 'Données',
+      properties: 'Propriétés',
+      insert: 'Insérer',
+      connecting: 'Connexion',
+      name: 'Nom',
+      collation: 'Collation',
+      clear: 'Effacer',
+      options: 'Options',
+      autoRefresh: 'Auto-rafraichissement',
+      indexes: 'Index',
+      foreignKeys: 'Clés étrangères',
+      length: 'Taille',
+      unsigned: 'Non-signé',
+      default: 'Défaut',
+      comment: 'Commentaire',
+      key: 'Clé | Clés',
+      order: 'Ordre',
+      expression: 'Expression',
+      autoIncrement: 'Auto Increment',
+      engine: 'Engine',
+      field: 'Champ | Champs',
+      approximately: 'Approximativement',
+      total: 'Totale',
+      table: 'Table',
+      discard: 'Abandonner',
+      stay: 'Rester',
+      author: 'Auteur',
+      light: 'Clair',
+      dark: 'Sombre',
+      autoCompletion: 'Completion auto',
+      application: 'Application',
+      editor: 'Editeur',
+      view: 'Vue',
+      definer: 'Définisseur',
+      algorithm: 'Algorithme',
+      trigger: 'Déclencheur | Déclencheurs',
+      storedRoutine: 'Procedure stockée | Procedures stockées',
+      scheduler: 'Opération planifiée | Opérations planifiées',
+      event: 'Evenement',
+      parameters: 'Paramètres',
+      function: 'Fonction | Fonctions',
+      deterministic: 'Déterministe',
+      context: 'Contextz',
+      export: 'Exporter',
+      returns: 'Retourner',
+      timing: 'Horaire',
+      state: 'État',
+      execution: 'Exécution',
+      starts: 'Débuts',
+      ends: 'Fins',
+      ssl: 'SSL',
+      privateKey: 'Clé privée',
+      certificate: 'Certificat',
+      caCertificate: 'CA certificat',
+      ciphers: 'Chiffrement',
+      upload: 'Charger',
+      browse: 'Parcourir',
+      faker: 'Faker'
+   },
+   message: {
+      appWelcome: 'Bienvenu sur le client SQL Antares!',
+      appFirstStep: 'Première étape: Créer une nouvelle connexion à une base de données.',
+      addConnection: 'Ajouter une connexion',
+      createConnection: 'Créer une connexion',
+      createNewConnection: 'Créer une nouvelle connexion',
+      askCredentials: 'Demander les identifiants',
+      testConnection: 'Tester la connexion',
+      editConnection: 'Editer la connexion',
+      deleteConnection: 'Supprimer la connexion',
+      deleteCorfirm: 'Êtes-vous sûr de vouloir annuler',
+      connectionSuccessfullyMade: 'Connexion établie avec succès!',
+      madeWithJS: 'Créé avec 💛 et JavaScript!',
+      checkForUpdates: 'Rechercher des mises à jour',
+      noUpdatesAvailable: 'Aucune mise à jour disponible',
+      checkingForUpdate: 'Recherche de mise à jour',
+      checkFailure: 'Erreur lors de la recherche, essayez plus tard',
+      updateAvailable: 'Une mise à jour est disponible',
+      downloadingUpdate: 'Téléchargement de la mise à jour',
+      updateDownloaded: 'Mise à jour téléchargée',
+      restartToInstall: 'Redémarrer Antares pour l\'installer',
+      unableEditFieldWithoutPrimary: 'Impossible de modifier un champ sans clé primaire dans l\'ensemble de résultats',
+      editCell: 'Modifier une cellule',
+      deleteRows: 'Supprimer une ligne | Supprimer {count} lignes',
+      confirmToDeleteRows: 'Êtes-vous sûr de vouloir supprimer une ligne? | Êtes-vous sûr de vouloir supprimer {count} lignes?',
+      notificationsTimeout: 'Délai d\'expiration des notifications',
+      uploadFile: 'Charger un fichier',
+      addNewRow: 'Ajouter une ligne',
+      numberOfInserts: 'Nombre d\'insertions',
+      openNewTab: 'Ouvrir un nouvel onglet',
+      affectedRows: 'Lignes concernées',
+      createNewDatabase: 'Créer une nouvelle base de données',
+      databaseName: 'Nom par défaut',
+      serverDefault: 'Serveur par défaut',
+      deleteDatabase: 'Supprimer la base de données',
+      editDatabase: 'Modifier la base de données',
+      clearChanges: 'Effacer les modifications',
+      addNewField: 'Ajouter un champ',
+      manageIndexes: 'Gérer les index',
+      manageForeignKeys: 'Gérer les clés étrangères',
+      allowNull: 'NULL autorisé',
+      zeroFill: 'Remplissage zéro',
+      customValue: 'Valeur personnalisée',
+      onUpdate: 'Lors d\'une mise à jour',
+      deleteField: 'Supprimer le champ',
+      createNewIndex: 'Créer un index',
+      addToIndex: 'Ajouter à l\'index',
+      createNewTable: 'Créer une nouvelle table',
+      emptyTable: 'Table vide',
+      deleteTable: 'Supprimer la table',
+      emptyCorfirm: 'Êtes-vous sûr de vouloir videz',
+      unsavedChanges: 'Changements non sauvegardés',
+      discardUnsavedChanges: 'Vous avez des modifications non sauvegardées. En quittant cet onglet, ces changements seront supprimés.',
+      thereAreNoIndexes: 'Il n\'y a pas d\'indexes',
+      thereAreNoForeign: 'Il n\'y a pas de clés étrangères',
+      createNewForeign: 'Créer une clés étrangère',
+      referenceTable: 'Table de référence',
+      referenceField: 'CHamp de référence',
+      foreignFields: 'Champ étrangé',
+      invalidDefault: 'Valeur par défaut invalide',
+      onDelete: 'Lors de la suppression',
+      applicationTheme: 'Thème de l\'application',
+      editorTheme: 'Thème de l\'éditeur',
+      wrapLongLines: 'Retour à la ligne automatique',
+      selectStatement: 'Sélectionnez la déclaration',
+      triggerStatement: 'Déclaration de déclencheur',
+      sqlSecurity: 'Sécurité SQL',
+      updateOption: 'Options de mises à jour',
+      deleteView: 'Supprimer la vue',
+      createNewView: 'Créer une nouvelle vue',
+      deleteTrigger: 'Supprimer le déclencheur',
+      createNewTrigger: 'Créer un nouveau déclencheur',
+      currentUser: 'Utilisateur actuel',
+      routineBody: 'Contenu de la procédure',
+      dataAccess: 'Accès aux données',
+      thereAreNoParameters: 'Il n\'y a pas de paramètres',
+      createNewParameter: 'Créer un nouveau paramètre',
+      createNewRoutine: 'Créer une nouvelle procédure stockée',
+      deleteRoutine: 'Supprimer une procédure stockée',
+      functionBody: 'Contenu de la fonction',
+      createNewFunction: 'Créer une nouvelle fonction',
+      deleteFunction: 'Supprimer la fonction',
+      schedulerBody: 'Contenu du opération planifiée',
+      createNewScheduler: 'Créere une nouvelle opération planifiée',
+      deleteScheduler: 'Supprimer l\'opération planifiée',
+      preserveOnCompletion: 'Préserver à l\'achèvement',
+      enableSsl: 'Activer le SSL',
+      manualValue: 'Valeur manuelle',
+      tableFiller: 'Remplisseur de table'
+   },
+   faker: {
+      address: 'Adresse',
+      commerce: 'Commerce',
+      company: 'Entreprise',
+      database: 'Base de données',
+      date: 'Date',
+      finance: 'Finance',
+      git: 'Git',
+      hacker: 'Hacker',
+      internet: 'Internet',
+      lorem: 'Lorem',
+      name: 'Nom',
+      music: 'Musique',
+      phone: 'Téléphone',
+      random: 'Aléatoire',
+      system: 'Système',
+      time: 'Temps',
+      vehicle: 'Véhicle',
+      zipCode: 'Code postal',
+      zipCodeByState: 'Code postal par région',
+      city: 'Ville',
+      cityPrefix: 'Préfixe de la ville',
+      citySuffix: 'Suffixe de la ville',
+      streetName: 'Ne de la rue',
+      streetAddress: 'Adresse',
+      streetSuffix: 'Suffixe de la rue',
+      streetPrefix: 'Préfixe de la rue',
+      secondaryAddress: 'Adresse secondaire',
+      county: 'Comté',
+      country: 'Pays',
+      countryCode: 'Code du pays',
+      state: 'Région',
+      stateAbbr: 'Abbreviation de la région',
+      latitude: 'Latitude',
+      longitude: 'Longitude',
+      direction: 'Direction',
+      cardinalDirection: 'Orientation cardinale',
+      ordinalDirection: 'Orientation originale',
+      nearbyGPSCoordinate: 'Coordonnées GPS des environs',
+      timeZone: 'Fuseau horaire',
+      color: 'Couleur',
+      department: 'Département',
+      productName: 'Nom de produit',
+      price: 'Prix',
+      productAdjective: 'Adjectif du produit',
+      productMaterial: 'Matériau du produit',
+      product: 'Produit',
+      productDescription: 'Description du produit',
+      suffixes: 'Suffixes',
+      companyName: 'Nom de l\'entreprise',
+      companySuffix: 'Suffixe de l\'entreprise',
+      catchPhrase: 'Slogan',
+      bs: 'BS',
+      catchPhraseAdjective: 'Adjectif du slogan',
+      catchPhraseDescriptor: 'Descripteur de slogan',
+      catchPhraseNoun: 'Nom de la phrase d\'accroche',
+      bsAdjective: 'Adjectif BS',
+      bsBuzz: 'BS buzz',
+      bsNoun: 'Nom BS',
+      column: 'Colonne',
+      type: 'Type',
+      collation: 'Collation',
+      engine: 'Engine',
+      past: 'Passé',
+      future: 'Futur',
+      between: 'Entre',
+      recent: 'Récent',
+      soon: 'Bientôt',
+      month: 'Mois',
+      weekday: 'Mercredi',
+      account: 'Compte',
+      accountName: 'Nom de compte',
+      routingNumber: 'Numéros de routage',
+      mask: 'Masque',
+      amount: 'Quantité',
+      transactionType: 'Type de transaction',
+      currencyCode: 'Code de la devise',
+      currencyName: 'Nom de la devise',
+      currencySymbol: 'Symbole de la devise',
+      bitcoinAddress: 'Adresse Bitcoin',
+      litecoinAddress: 'Adresse Litecoin',
+      creditCardNumber: 'Numero de carte de crédit',
+      creditCardCVV: 'Cryptogramme',
+      ethereumAddress: 'Adresse Ethereum',
+      iban: 'Iban',
+      bic: 'Bic',
+      transactionDescription: 'Description de la transaction',
+      branch: 'Branche',
+      commitEntry: 'Valider l\'entrée',
+      commitMessage: 'Valider le message',
+      commitSha: 'Valider le SHA',
+      shortSha: 'SHA court',
+      abbreviation: 'Abbréviation',
+      adjective: 'Adjectif',
+      noun: 'Nom',
+      verb: 'Verbe',
+      ingverb: 'Ingverb',
+      phrase: 'Phrase',
+      avatar: 'Avatar',
+      email: 'Email',
+      exampleEmail: 'Exemple d\'email',
+      userName: 'Nom d\'utilisateur',
+      protocol: 'Protocole',
+      url: 'Url',
+      domainName: 'Nom de domaine',
+      domainSuffix: 'Suffixe du nom de domaine',
+      domainWord: 'Mot de domaine',
+      ip: 'Ip',
+      ipv6: 'Ipv6',
+      userAgent: 'User agent',
+      mac: 'Mac',
+      password: 'Mot de passe',
+      word: 'Mot',
+      words: 'Mots',
+      sentence: 'Phrase',
+      slug: 'Slug',
+      sentences: 'Phrases',
+      paragraph: 'Paragraphe',
+      paragraphs: 'Paragraphes',
+      text: 'Texte',
+      lines: 'Lignes',
+      genre: 'Genre',
+      firstName: 'Prénom',
+      lastName: 'Nom',
+      middleName: 'Deuxième prénom',
+      findName: 'Nom et prénom',
+      jobTitle: 'Intitulé du poste',
+      gender: 'Genre',
+      prefix: 'Préfixe',
+      suffix: 'Suffixe',
+      title: 'Titre',
+      jobDescriptor: 'Descripteur de poste',
+      jobArea: 'Domaine d\'activité',
+      jobType: 'Type de poste',
+      phoneNumber: 'Numéro de téléphone',
+      phoneNumberFormat: 'Format du numéro de téléphone',
+      phoneFormats: 'Formats de téléphone',
+      number: 'Numéro',
+      float: 'Nombre décimaux',
+      arrayElement: 'Élément de Liste',
+      arrayElements: 'Éléments de liste',
+      objectElement: 'Élément d\'objet',
+      uuid: 'Uuid',
+      boolean: 'Boolean',
+      image: 'Image',
+      locale: 'Locale',
+      alpha: 'Alpha',
+      alphaNumeric: 'Alphanumerique',
+      hexaDecimal: 'Hexadecimale',
+      fileName: 'Nom deu fichier',
+      commonFileName: 'Nom de fichier commun',
+      mimeType: 'Mime type',
+      commonFileType: 'Type de dossier commun',
+      commonFileExt: 'Extension de fichier commun',
+      fileType: 'Type de fichier',
+      fileExt: 'Extension de fichier',
+      directoryPath: 'Chemin du répertoire',
+      filePath: 'Chemin d\'accès au fichier',
+      semver: 'Semver',
+      manufacturer: 'Fabricant',
+      model: 'Modèle',
+      fuel: 'Carburant',
+      vin: 'Vin'
+   }
+};

src/renderer/i18n/index.js

@@ -8,7 +8,8 @@ const i18n = new VueI18n({
       'en-US': require('./en-US'),
       'it-IT': require('./it-IT'),
       'ar-SA': require('./ar-SA'),
-      'es-ES': require('./es-ES')
+      'es-ES': require('./es-ES'),
+      'fr-FR': require('./fr-FR')
    }
 });
 export default i18n;

src/renderer/i18n/it-IT.js

@@ -72,19 +72,5 @@ module.exports = {
       numberOfInserts: 'Numero di insert',
       openNewTab: 'Apri nuova scheda',
       affectedRows: 'Righe interessate'
-   },
-   // Date and Time
-   short: {
-      year: 'numeric',
-      month: 'short',
-      day: 'numeric'
-   },
-   long: {
-      year: 'numeric',
-      month: 'short',
-      day: 'numeric',
-      weekday: 'short',
-      hour: 'numeric',
-      minute: 'numeric'
    }
 };

src/renderer/i18n/supported-locales.js

@@ -2,5 +2,6 @@ export default {
    'en-US': 'English',
    'it-IT': 'Italiano',
    'ar-SA': 'العربية',
-   'es-ES': 'Español'
+   'es-ES': 'Español',
+   'fr-FR': 'Français'
 };

src/renderer/ipc-api/Database.js

@@ -18,8 +18,8 @@ export default class {
       return ipcRenderer.invoke('delete-database', params);
    }
 
-   static getStructure (uid) {
-      return ipcRenderer.invoke('get-structure', uid);
+   static getStructure (params) {
+      return ipcRenderer.invoke('get-structure', params);
    }
 
    static getCollations (uid) {
@@ -34,6 +34,10 @@ export default class {
       return ipcRenderer.invoke('get-engines', uid);
    }
 
+   static getVersion (uid) {
+      return ipcRenderer.invoke('get-version', uid);
+   }
+
    static useSchema (params) {
       return ipcRenderer.invoke('use-schema', params);
    }

src/renderer/ipc-api/Functions.js

@@ -0,0 +1,20 @@
+'use strict';
+import { ipcRenderer } from 'electron';
+
+export default class {
+   static getFunctionInformations (params) {
+      return ipcRenderer.invoke('get-function-informations', params);
+   }
+
+   static dropFunction (params) {
+      return ipcRenderer.invoke('drop-function', params);
+   }
+
+   static alterFunction (params) {
+      return ipcRenderer.invoke('alter-function', params);
+   }
+
+   static createFunction (params) {
+      return ipcRenderer.invoke('create-function', params);
+   }
+}

src/renderer/ipc-api/Routines.js

@@ -0,0 +1,20 @@
+'use strict';
+import { ipcRenderer } from 'electron';
+
+export default class {
+   static getRoutineInformations (params) {
+      return ipcRenderer.invoke('get-routine-informations', params);
+   }
+
+   static dropRoutine (params) {
+      return ipcRenderer.invoke('drop-routine', params);
+   }
+
+   static alterRoutine (params) {
+      return ipcRenderer.invoke('alter-routine', params);
+   }
+
+   static createRoutine (params) {
+      return ipcRenderer.invoke('create-routine', params);
+   }
+}

src/renderer/ipc-api/Schedulers.js

@@ -0,0 +1,20 @@
+'use strict';
+import { ipcRenderer } from 'electron';
+
+export default class {
+   static getSchedulerInformations (params) {
+      return ipcRenderer.invoke('get-scheduler-informations', params);
+   }
+
+   static dropScheduler (params) {
+      return ipcRenderer.invoke('drop-scheduler', params);
+   }
+
+   static alterScheduler (params) {
+      return ipcRenderer.invoke('alter-scheduler', params);
+   }
+
+   static createScheduler (params) {
+      return ipcRenderer.invoke('create-scheduler', params);
+   }
+}

src/renderer/ipc-api/Tables.js

@@ -30,6 +30,10 @@ export default class {
       return ipcRenderer.invoke('insert-table-rows', params);
    }
 
+   static insertTableFakeRows (params) {
+      return ipcRenderer.invoke('insert-table-fake-rows', params);
+   }
+
    static getForeignList (params) {
       return ipcRenderer.invoke('get-foreign-list', params);
    }

src/renderer/ipc-api/Triggers.js

@@ -0,0 +1,20 @@
+'use strict';
+import { ipcRenderer } from 'electron';
+
+export default class {
+   static getTriggerInformations (params) {
+      return ipcRenderer.invoke('get-trigger-informations', params);
+   }
+
+   static dropTrigger (params) {
+      return ipcRenderer.invoke('drop-trigger', params);
+   }
+
+   static alterTrigger (params) {
+      return ipcRenderer.invoke('alter-trigger', params);
+   }
+
+   static createTrigger (params) {
+      return ipcRenderer.invoke('create-trigger', params);
+   }
+}

src/renderer/ipc-api/Users.js

@@ -0,0 +1,8 @@
+'use strict';
+import { ipcRenderer } from 'electron';
+
+export default class {
+   static getUsers (params) {
+      return ipcRenderer.invoke('get-users', params);
+   }
+}

src/renderer/ipc-api/Views.js

@@ -0,0 +1,20 @@
+'use strict';
+import { ipcRenderer } from 'electron';
+
+export default class {
+   static getViewInformations (params) {
+      return ipcRenderer.invoke('get-view-informations', params);
+   }
+
+   static dropView (params) {
+      return ipcRenderer.invoke('drop-view', params);
+   }
+
+   static alterView (params) {
+      return ipcRenderer.invoke('alter-view', params);
+   }
+
+   static createView (params) {
+      return ipcRenderer.invoke('create-view', params);
+   }
+}

src/renderer/libs/arrayToFile.js

@@ -0,0 +1,37 @@
+const arrayToFile = args => {
+   let mime;
+   let content;
+
+   switch (args.type) {
+      case 'csv': {
+         mime = 'text/csv';
+         const csv = [];
+
+         if (args.content.length)
+            csv.push(Object.keys(args.content[0]).join(';'));
+
+         for (const row of args.content)
+            csv.push(Object.values(row).map(col => typeof col === 'string' ? `"${col}"` : col).join(';'));
+
+         content = csv.join('\n');
+         break;
+      }
+      case 'json':
+         mime = 'application/json';
+         content = JSON.stringify(args.content, null, 3);
+         break;
+      default:
+         break;
+   }
+
+   const file = new Blob([content], { type: mime });
+   const downloadLink = document.createElement('a');
+   downloadLink.download = `${args.filename}.${args.type}`;
+   downloadLink.href = window.URL.createObjectURL(file);
+   downloadLink.style.display = 'none';
+   document.body.appendChild(downloadLink);
+   downloadLink.click();
+   downloadLink.remove();
+};
+
+export default arrayToFile;

src/renderer/libs/ext-language_tools.js

@@ -1239,6 +1239,18 @@ ace.define('ace/autocomplete/popup', ['require', 'exports', 'module', 'ace/virtu
                case 'view':
                   iconClass = 'mdi-table-eye';
                   break;
+               case 'trigger':
+                  iconClass = 'mdi-table-cog';
+                  break;
+               case 'routine':
+                  iconClass = 'mdi-sync-circle';
+                  break;
+               case 'function':
+                  iconClass = 'mdi-arrow-right-bold-box';
+                  break;
+               case 'scheduler':
+                  iconClass = 'mdi-calendar-clock';
+                  break;
                case 'keyword':
                   iconClass = 'mdi-cube';
                   break;

src/renderer/scss/main.scss

@@ -210,8 +210,13 @@ body {
   border-color: $primary-color;
 }
 
+.form-input[type="file"] {
+  overflow: hidden;
+}
+
 .input-group .input-group-addon {
   border-color: #3f3f3f;
+  z-index: 1;
 }
 
 .menu {
@@ -225,7 +230,7 @@ body {
 }
 
 .accordion-body {
-  max-height: 500rem !important;
+  max-height: 5000rem !important;
 }
 
 .btn.loading {

src/renderer/store/index.js

@@ -2,7 +2,6 @@
 
 import Vue from 'vue';
 import Vuex from 'vuex';
-import VuexPersist from 'vuex-persist';
 
 import application from './modules/application.store';
 import settings from './modules/settings.store';
@@ -12,15 +11,6 @@ import notifications from './modules/notifications.store';
 
 import ipcUpdates from './plugins/ipcUpdates';
 
-const vuexLocalStorage = new VuexPersist({
-   key: 'application', // The key to store the state on in the storage provider.
-   storage: window.localStorage,
-   reducer: state => ({
-      connections: state.connections,
-      settings: state.settings
-   })
-});
-
 Vue.use(Vuex);
 
 export default new Vuex.Store({
@@ -33,7 +23,6 @@ export default new Vuex.Store({
       notifications
    },
    plugins: [
-      vuexLocalStorage.plugin,
       ipcUpdates
    ]
 });

src/renderer/store/modules/application.store.js

@@ -11,12 +11,14 @@ export default {
       selected_setting_tab: 'general',
       selected_conection: {},
       update_status: 'noupdate', // noupdate, available, checking, nocheck, downloading, downloaded
-      download_progress: 0
+      download_progress: 0,
+      base_completer: [] // Needed to reset ace editor, due global-only ace completer
    },
    getters: {
       isLoading: state => state.is_loading,
       appName: state => state.app_name,
       appVersion: state => state.app_version,
+      getBaseCompleter: state => state.base_completer,
       getSelectedConnection: state => state.selected_conection,
       isNewModal: state => state.is_new_modal,
       isSettingModal: state => state.is_setting_modal,
@@ -28,6 +30,9 @@ export default {
       SET_LOADING_STATUS (state, payload) {
          state.is_loading = payload;
       },
+      SET_BASE_COMPLETER (state, payload) {
+         state.base_completer = payload;
+      },
       SHOW_NEW_CONNECTION_MODAL (state) {
          state.is_new_modal = true;
       },
@@ -52,6 +57,9 @@ export default {
       setLoadingStatus ({ commit }, payload) {
          commit('SET_LOADING_STATUS', payload);
       },
+      setBaseCompleter ({ commit }, payload) {
+         commit('SET_BASE_COMPLETER', payload);
+      },
       // Modals
       showNewConnModal ({ commit }) {
          commit('SHOW_NEW_CONNECTION_MODAL');

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

@@ -11,6 +11,7 @@ export default {
       explorebar_size: persistentStore.get('explorebar_size') || null,
       notifications_timeout: persistentStore.get('notifications_timeout') || 5,
       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'
    },
@@ -19,6 +20,7 @@ export default {
       getExplorebarSize: state => state.explorebar_size,
       getNotificationsTimeout: state => state.notifications_timeout,
       getAutoComplete: state => state.auto_complete,
+      getLineWrap: state => state.line_wrap,
       getApplicationTheme: state => state.application_theme,
       getEditorTheme: state => state.editor_theme
    },
@@ -36,6 +38,10 @@ export default {
          state.auto_complete = val;
          persistentStore.set('auto_complete', state.auto_complete);
       },
+      SET_LINE_WRAP (state, val) {
+         state.line_wrap = val;
+         persistentStore.set('line_wrap', state.line_wrap);
+      },
       SET_EXPLOREBAR_SIZE (state, size) {
          state.explorebar_size = size;
          persistentStore.set('explorebar_size', state.explorebar_size);
@@ -57,6 +63,9 @@ export default {
       changeAutoComplete ({ commit }, val) {
          commit('SET_AUTO_COMPLETE', val);
       },
+      changeLineWrap ({ commit }, val) {
+         commit('SET_LINE_WRAP', val);
+      },
       changeEditorTheme ({ commit }, theme) {
          commit('SET_EDITOR_THEME', theme);
       }

src/renderer/store/modules/workspaces.store.js

@@ -1,6 +1,7 @@
 'use strict';
 import Connection from '@/ipc-api/Connection';
 import Database from '@/ipc-api/Database';
+import Users from '@/ipc-api/Users';
 import { uidGen } from 'common/libs/uidGen';
 const tabIndex = [];
 let lastBreadcrumbs = {};
@@ -39,6 +40,12 @@ export default {
             .filter(workspace => workspace.connected)
             .map(workspace => workspace.uid);
       },
+      getLoadedSchemas: state => uid => {
+         return state.workspaces.find(workspace => workspace.uid === uid).loaded_schemas;
+      },
+      getSearchTerm: state => uid => {
+         return state.workspaces.find(workspace => workspace.uid === uid).search_term;
+      },
       isUnsavedDiscardModal: state => {
          return state.is_unsaved_discard_modal;
       }
@@ -47,7 +54,9 @@ export default {
       SELECT_WORKSPACE (state, uid) {
          state.selected_workspace = uid;
       },
-      ADD_CONNECTED (state, { uid, client, dataTypes, indexTypes, structure }) {
+      ADD_CONNECTED (state, payload) {
+         const { uid, client, dataTypes, indexTypes, structure, version } = payload;
+
          state.workspaces = state.workspaces.map(workspace => workspace.uid === uid
             ? {
                ...workspace,
@@ -55,7 +64,8 @@ export default {
                dataTypes,
                indexTypes,
                structure,
-               connected: true
+               connected: true,
+               version
             }
             : workspace);
       },
@@ -64,6 +74,8 @@ export default {
             ? {
                ...workspace,
                structure: {},
+               breadcrumbs: {},
+               loaded_schemas: new Set(),
                connected: false
             }
             : workspace);
@@ -76,6 +88,19 @@ export default {
             }
             : workspace);
       },
+      REFRESH_SCHEMA (state, { uid, schema, schemaElements }) {
+         state.workspaces = state.workspaces.map(workspace => {
+            if (workspace.uid === uid) {
+               const schemaIndex = workspace.structure.findIndex(s => s.name === schema);
+
+               if (schemaIndex !== -1)
+                  workspace.structure[schemaIndex] = schemaElements;
+               else
+                  workspace.structure.push(schemaElements);
+            }
+            return workspace;
+         });
+      },
       REFRESH_COLLATIONS (state, { uid, collations }) {
          state.workspaces = state.workspaces.map(workspace => workspace.uid === uid
             ? {
@@ -100,6 +125,14 @@ export default {
             }
             : workspace);
       },
+      REFRESH_USERS (state, { uid, users }) {
+         state.workspaces = state.workspaces.map(workspace => workspace.uid === uid
+            ? {
+               ...workspace,
+               users
+            }
+            : workspace);
+      },
       ADD_WORKSPACE (state, workspace) {
          state.workspaces.push(workspace);
       },
@@ -111,7 +144,15 @@ export default {
             }
             : workspace);
       },
-      NEW_TAB (state, { uid, tab }) {
+      SET_SEARCH_TERM (state, { uid, term }) {
+         state.workspaces = state.workspaces.map(workspace => workspace.uid === uid
+            ? {
+               ...workspace,
+               search_term: term
+            }
+            : workspace);
+      },
+      NEW_TAB (state, { uid, tab, content, autorun }) {
          tabIndex[uid] = tabIndex[uid] ? ++tabIndex[uid] : 1;
          const newTab = {
             uid: tab,
@@ -119,7 +160,9 @@ export default {
             selected: false,
             type: 'query',
             fields: [],
-            keyUsage: []
+            keyUsage: [],
+            content: content || '',
+            autorun: !!autorun
          };
          state.workspaces = state.workspaces.map(workspace => {
             if (workspace.uid === uid) {
@@ -189,6 +232,13 @@ export default {
       },
       SET_PENDING_BREADCRUMBS (state, payload) {
          state.pending_breadcrumbs = payload;
+      },
+      ADD_LOADED_SCHEMA (state, payload) {
+         state.workspaces = state.workspaces.map(workspace => {
+            if (workspace.uid === payload.uid)
+               workspace.loaded_schemas.add(payload.schema);
+            return workspace;
+         });
       }
    },
    actions: {
@@ -211,25 +261,47 @@ export default {
                      indexTypes = require('common/index-types/mysql');
                      break;
                }
+
+               const { status, response: version } = await Database.getVersion(connection.uid);
+
+               if (status === 'error')
+                  dispatch('notifications/addNotification', { status, message: version }, { root: true });
+
+               const isMySQL = version.name.includes('MySQL');
+
+               if (isMySQL && connection.client !== 'mysql') {
+                  const connProxy = Object.assign({}, connection);
+                  connProxy.client = 'mysql';
+                  dispatch('connections/editConnection', connProxy, { root: true });
+               }
+               else if (!isMySQL && connection.client === 'mysql') {
+                  const connProxy = Object.assign({}, connection);
+                  connProxy.client = 'maria';
+                  dispatch('connections/editConnection', connProxy, { root: true });
+               }
+
                commit('ADD_CONNECTED', {
                   uid: connection.uid,
                   client: connection.client,
                   dataTypes,
                   indexTypes,
-                  structure: response
+                  structure: response,
+                  version
                });
                dispatch('refreshCollations', connection.uid);
                dispatch('refreshVariables', connection.uid);
                dispatch('refreshEngines', connection.uid);
+               dispatch('refreshUsers', connection.uid);
             }
          }
          catch (err) {
             dispatch('notifications/addNotification', { status: 'error', message: err.stack }, { root: true });
          }
       },
-      async refreshStructure ({ dispatch, commit }, uid) {
+      async refreshStructure ({ dispatch, commit, getters }, uid) {
          try {
-            const { status, response } = await Database.getStructure(uid);
+            const { status, response } = await Database.getStructure({ uid, schemas: getters.getLoadedSchemas(uid) });
+
             if (status === 'error')
                dispatch('notifications/addNotification', { status, message: response }, { root: true });
             else
@@ -239,6 +311,18 @@ export default {
             dispatch('notifications/addNotification', { status: 'error', message: err.stack }, { root: true });
          }
       },
+      async refreshSchema ({ dispatch, commit }, { uid, schema }) {
+         try {
+            const { status, response } = await Database.getStructure({ uid, schemas: new Set([schema]) });
+            if (status === 'error')
+               dispatch('notifications/addNotification', { status, message: response }, { root: true });
+            else
+               commit('REFRESH_SCHEMA', { uid, schema, schemaElements: response.find(_schema => _schema.name === schema) });
+         }
+         catch (err) {
+            dispatch('notifications/addNotification', { status: 'error', message: err.stack }, { root: true });
+         }
+      },
       async refreshCollations ({ dispatch, commit }, uid) {
          try {
             const { status, response } = await Database.getCollations(uid);
@@ -275,6 +359,18 @@ export default {
             dispatch('notifications/addNotification', { status: 'error', message: err.stack }, { root: true });
          }
       },
+      async refreshUsers ({ dispatch, commit }, uid) {
+         try {
+            const { status, response } = await Users.getUsers(uid);
+            if (status === 'error')
+               dispatch('notifications/addNotification', { status, message: response }, { root: true });
+            else
+               commit('REFRESH_USERS', { uid, users: response });
+         }
+         catch (err) {
+            dispatch('notifications/addNotification', { status: 'error', message: err.stack }, { root: true });
+         }
+      },
       removeConnected ({ commit }, uid) {
          Connection.disconnect(uid);
          commit('REMOVE_CONNECTED', uid);
@@ -285,28 +381,20 @@ export default {
             uid,
             connected: false,
             selected_tab: 0,
-            tabs: [{
-               uid: 'data',
-               type: 'table',
-               fields: [],
-               keyUsage: []
-            },
-            {
-               uid: 'prop',
-               type: 'table',
-               fields: [],
-               keyUsage: []
-            }],
+            search_term: '',
+            tabs: [],
             structure: {},
             variables: [],
             collations: [],
-            breadcrumbs: {}
+            users: [],
+            breadcrumbs: {},
+            loaded_schemas: new Set()
          };
 
          commit('ADD_WORKSPACE', workspace);
 
          if (getters.getWorkspace(uid).tabs.length < 3)
-            dispatch('newTab', uid);
+            dispatch('newTab', { uid });
 
          dispatch('setUnsavedChanges', false);
       },
@@ -322,7 +410,9 @@ export default {
             table: null,
             trigger: null,
             procedure: null,
-            scheduler: null
+            function: null,
+            scheduler: null,
+            view: null
          };
 
          const hasLastChildren = Object.keys(lastBreadcrumbs).filter(b => b !== 'schema').some(b => lastBreadcrumbs[b]);
@@ -335,11 +425,17 @@ export default {
 
          commit('CHANGE_BREADCRUMBS', { uid: getters.getSelected, breadcrumbs: { ...breadcrumbsObj, ...payload } });
          lastBreadcrumbs = { ...breadcrumbsObj, ...payload };
+
+         if (payload.schema)
+            commit('ADD_LOADED_SCHEMA', { uid: getters.getSelected, schema: payload.schema });
       },
-      newTab ({ commit }, uid) {
+      setSearchTerm ({ commit, getters }, term) {
+         commit('SET_SEARCH_TERM', { uid: getters.getSelected, term });
+      },
+      newTab ({ commit }, { uid, content, autorun }) {
          const tab = uidGen('T');
 
-         commit('NEW_TAB', { uid, tab });
+         commit('NEW_TAB', { uid, tab, content, autorun });
          commit('SELECT_TAB', { uid, tab });
       },
       removeTab ({ commit }, payload) {