Merge pull request #807 from antares-sql/all-contributors/add-mangas

docs: add mangas as a contributor for code

.all-contributorsrc

@@ -266,6 +266,33 @@
       "contributions": [
         "translation"
       ]
+    },
+    {
+      "login": "bagusindrayana",
+      "name": "Bagus Indrayana",
+      "avatar_url": "https://avatars.githubusercontent.com/u/36830534?v=4",
+      "profile": "https://github.com/bagusindrayana",
+      "contributions": [
+        "code"
+      ]
+    },
+    {
+      "login": "penguinlab",
+      "name": "Naoki Ishikawa",
+      "avatar_url": "https://avatars.githubusercontent.com/u/10959317?v=4",
+      "profile": "https://github.com/penguinlab",
+      "contributions": [
+        "translation"
+      ]
+    },
+    {
+      "login": "mangas",
+      "name": "Filipe Azevedo",
+      "avatar_url": "https://avatars.githubusercontent.com/u/1640325?v=4",
+      "profile": "https://fazevedo.dev",
+      "contributions": [
+        "code"
+      ]
     }
   ],
   "contributorsPerLine": 7,

.github/FUNDING.yml

@@ -1,6 +1,6 @@
 # These are supported funding model platforms
 
-github: [fabio286]
+github: [antares-sql,fabio286]
 patreon: #fabio286
 open_collective: # Replace with a single Open Collective username
 ko_fi: # Replace with a single Ko-fi username
@@ -9,4 +9,4 @@ community_bridge: # Replace with a single Community Bridge project-name e.g., cl
 liberapay: # Replace with a single Liberapay username
 issuehunt: # Replace with a single IssueHunt username
 otechie: # Replace with a single Otechie username
-custom: ['https://paypal.me/fabiodistasio']
+custom: ['https://paypal.me/fabiodistasio']

.github/workflows/create-artifact-linux-arm64.yml

@@ -15,7 +15,7 @@ jobs:
       - name: Install Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 20
       
       - name: Install dependencies
         run: npm i

.github/workflows/create-generated-sources.yml

@@ -0,0 +1,50 @@
+name: Create generated-rources.json
+
+on: 
+  workflow_dispatch: {}
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      # Install flatpak-node-generator
+      - name: Install Python
+        uses: actions/setup-python@v5
+        with:
+          python-version: '3.8'
+
+      - name: Install pipx
+        uses: CfirTsabari/actions-pipx@v1
+
+      - name: Install flatpak-node-generator
+        run: |
+         cd ../
+         git clone https://github.com/flatpak/flatpak-builder-tools.git
+         cd flatpak-builder-tools/node
+         pipx install .
+
+      # Install Antares
+      - name: Check out Git repository
+        uses: actions/checkout@v3
+
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+
+      # - name: Delete old package-lock.json
+      #   run: rm package-lock.json
+
+      - name: Install dependencies
+        run: npm i --lockfile-version 2
+
+      - name: Generate generated-sources.json
+        run: flatpak-node-generator npm -r package-lock.json --electron-node-headers
+
+      - name: Upload Artifact
+        uses: actions/upload-artifact@v3
+        with:
+          name: generated-sources
+          retention-days: 3
+          path: |
+            generated-sources.json

.github/workflows/test-e2e-win.yml

@@ -1,9 +1,9 @@
-name: Test end-to-end [WINDOWS]
+name: Test end-to-end
 
 on: 
   push:
     branches:
-        - master
+        - develop
 
 jobs:
   release:
@@ -20,7 +20,7 @@ jobs:
       - name: Install Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 20
       
       - name: Install dependencies
         run: npm i

.husky/commit-msg

@@ -0,0 +1 @@
+npx --no -- commitlint --edit $1

.husky/pre-commit

@@ -0,0 +1 @@
+npm run lint

.stylelintrc

@@ -5,14 +5,14 @@
   ],
   "fix": true,
   "formatter": "verbose",
+  "customSyntax": "postcss-html",
   "plugins": [
     "stylelint-scss"
   ],
   "rules": {
     "at-rule-no-unknown": null,
     "no-descending-specificity": null,
-    "font-family-no-missing-generic-family-keyword": null,
-    "declaration-colon-newline-after": "always-multi-line"
+    "font-family-no-missing-generic-family-keyword": null
   },
   "syntax": "scss"
 }

.vscode/launch.json

@@ -17,15 +17,6 @@
       "sourceMaps": true,
       "type": "chrome",
       "webRoot": "${workspaceFolder}"
-    },
-    {
-      "name": "Electron: Worker",
-      "cwd": "${workspaceFolder}",
-      "port": 9224,
-      "request": "attach",
-      "sourceMaps": true,
-      "type": "node",
-      "timeout": 1000000
     }
   ],
   "compounds": [

CHANGELOG.md

@@ -2,6 +2,167 @@
 
 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.7.24](https://github.com/antares-sql/antares/compare/v0.7.24-beta.1...v0.7.24) (2024-05-03)
+
+
+### Bug Fixes
+
+* missing accent color change ([09c274a](https://github.com/antares-sql/antares/commit/09c274a724b5020efc650aaf7eecb2404343a6fc))
+
+### [0.7.24-beta.1](https://github.com/antares-sql/antares/compare/v0.7.24-beta.0...v0.7.24-beta.1) (2024-04-30)
+
+
+### Features
+
+* accent color based on folder color, closes [#762](https://github.com/antares-sql/antares/issues/762) ([058fc2f](https://github.com/antares-sql/antares/commit/058fc2fc0b34cde5aa19233a4a999ef3624dae71))
+
+
+### Bug Fixes
+
+* **PostgreSQL:** better handle connection errors, should fix [#794](https://github.com/antares-sql/antares/issues/794) ([33bbc0e](https://github.com/antares-sql/antares/commit/33bbc0e7e6be370c944e979a34ab2cb19562d1e3))
+* **PostgreSQL:** issue with similar tabs on differend databases ([23c59b4](https://github.com/antares-sql/antares/commit/23c59b4d4e8f250acad75f54d157c7c162e1c4f8))
+
+
+### Improvements
+
+* **UI:** hide "insert row" button in read-only mode, closes [#695](https://github.com/antares-sql/antares/issues/695) ([6600197](https://github.com/antares-sql/antares/commit/6600197b8286ced4c79378883594d21e69a83d8c))
+* **UI:** improvements on light theme ([ece2ee0](https://github.com/antares-sql/antares/commit/ece2ee05cc90a58c1926e882e3ccf4f057f02d68))
+
+### [0.7.24-beta.0](https://github.com/antares-sql/antares/compare/v0.7.23...v0.7.24-beta.0) (2024-04-12)
+
+
+### Features
+
+* add shortcut open,save, and save as file ([6b56c60](https://github.com/antares-sql/antares/commit/6b56c60b68647bc7182548a137cccc3413e3fbd5))
+* add translation for  open,save, and save as file ([f7204dc](https://github.com/antares-sql/antares/commit/f7204dc0ae721534eaefbde097d1c26c1d72ad41))
+* open,save, and save as file in query tab ([c1e58eb](https://github.com/antares-sql/antares/commit/c1e58eb695de78fbf1d2b26c608692f0962373df))
+* unsaved file reminder closing file tabs ([8d8650f](https://github.com/antares-sql/antares/commit/8d8650fbe76c79fd66be857d049b3baaa9ab1f9f))
+
+
+### Bug Fixes
+
+* **translation:** missing translation for "Open notes" shortcut ([0565ae1](https://github.com/antares-sql/antares/commit/0565ae12042901b9d67fe3e0ea269562ec444994))
+
+### [0.7.23](https://github.com/antares-sql/antares/compare/v0.7.23-beta.1...v0.7.23) (2024-04-07)
+
+### [0.7.23-beta.1](https://github.com/antares-sql/antares/compare/v0.7.23-beta.0...v0.7.23-beta.1) (2024-04-02)
+
+
+### Features
+
+* add the page reference in the export file name, closes [#772](https://github.com/antares-sql/antares/issues/772) ([2064294](https://github.com/antares-sql/antares/commit/2064294119ed9dfab2a9968dfb5b35d52e2ae03b))
+* move connections out of folder from context menu, related to [#773](https://github.com/antares-sql/antares/issues/773) ([62e3115](https://github.com/antares-sql/antares/commit/62e311586073ae7ee4896305198c7168f637c1af))
+* move connections to folders from context menu, related to [#773](https://github.com/antares-sql/antares/issues/773) ([9aef287](https://github.com/antares-sql/antares/commit/9aef287a983754158cdbdc9b2a72db9ab82f76c8))
+
+
+### Bug Fixes
+
+* bad format of timestamp fields on CSV export, fixes 776 ([65ec4c5](https://github.com/antares-sql/antares/commit/65ec4c5da6187a7ab2dfff59326cd12bfa788c3b))
+
+### [0.7.23-beta.0](https://github.com/antares-sql/antares/compare/v0.7.22...v0.7.23-beta.0) (2024-03-21)
+
+
+### Bug Fixes
+
+* CSV export does not escape strings when needed, fixes [#770](https://github.com/antares-sql/antares/issues/770) ([dd5b417](https://github.com/antares-sql/antares/commit/dd5b41716a10cf9500f2c611b232f5b5b0756a68))
+* query result sort not working with aliased tables, fixes [#765](https://github.com/antares-sql/antares/issues/765) ([de9dac3](https://github.com/antares-sql/antares/commit/de9dac3e8abf3b3261f8c54c88cf2386a5be2207))
+* shortcut not working on mac os ([0bb5ced](https://github.com/antares-sql/antares/commit/0bb5cedda6a67ccbeea8c127b799f533395101a2))
+
+### [0.7.22](https://github.com/antares-sql/antares/compare/v0.7.22-beta.2...v0.7.22) (2024-02-26)
+
+
+### Bug Fixes
+
+* delete record modal pressing del when editing a field, fixes [#767](https://github.com/antares-sql/antares/issues/767) ([586f901](https://github.com/antares-sql/antares/commit/586f901bae9a80c0e53ac1d804cbae3f05e26d8e))
+
+### [0.7.22-beta.2](https://github.com/antares-sql/antares/compare/v0.7.22-beta.1...v0.7.22-beta.2) (2024-02-18)
+
+
+### Features
+
+* **MySQL:** option to enable single connection mode ([d3f71e6](https://github.com/antares-sql/antares/commit/d3f71e65cef88838f03f95a4b34e197fb61878f8))
+
+### [0.7.22-beta.1](https://github.com/antares-sql/antares/compare/v0.7.22-beta.0...v0.7.22-beta.1) (2024-02-12)
+
+
+### Features
+
+* update dutch translation + fix spelling mistake ([30ada13](https://github.com/antares-sql/antares/commit/30ada13663e88f89beb3dd7291010837059585d5))
+
+
+### Bug Fixes
+
+* some issues related to previous commit ([259d051](https://github.com/antares-sql/antares/commit/259d051a21e334496d3a52b662f1855ba9a9046d))
+* unable to edit tables containing SET fields, fixes [#755](https://github.com/antares-sql/antares/issues/755) ([d698f27](https://github.com/antares-sql/antares/commit/d698f2798a2423f86e6d786dd3ab80439b372a08))
+
+
+### Improvements
+
+* **MySQL:** improvements in connection handling ([876d5ea](https://github.com/antares-sql/antares/commit/876d5ea48185334e9e2fc981c4282a9c42d22b10))
+
+### [0.7.22-beta.0](https://github.com/antares-sql/antares/compare/v0.7.21...v0.7.22-beta.0) (2024-02-04)
+
+
+### Features
+
+* **UI:** resizable textarea in new/edito note, closes [#747](https://github.com/antares-sql/antares/issues/747) ([1a0c5da](https://github.com/antares-sql/antares/commit/1a0c5da2f14b99d6f5581b2bf6e916d67d097245))
+
+
+### Improvements
+
+* **UI:** improved notes, fixes [#746](https://github.com/antares-sql/antares/issues/746) ([bb36e98](https://github.com/antares-sql/antares/commit/bb36e98bebc5e1e55735e98d272428df2ab682e8))
+
+### [0.7.21](https://github.com/antares-sql/antares/compare/v0.7.21-beta.1...v0.7.21) (2024-01-13)
+
+
+### Features
+
+* **SQLite:** enable schema reloat button on sidebar ([20b2734](https://github.com/antares-sql/antares/commit/20b27343cd95998bd83403b7556ea35fcad9fa1b))
+
+
+### Bug Fixes
+
+* **SQLite:** unable to change integer fields length to 0, fixes [#732](https://github.com/antares-sql/antares/issues/732) ([3b9228a](https://github.com/antares-sql/antares/commit/3b9228a7230dcd9f47f5794a83b60d28207bdce1))
+
+### [0.7.21-beta.1](https://github.com/antares-sql/antares/compare/v0.7.21-beta.0...v0.7.21-beta.1) (2024-01-06)
+
+
+### Bug Fixes
+
+* **PostgreSQL:** error adding MONEY fields to a table ([0f8d2cb](https://github.com/antares-sql/antares/commit/0f8d2cb4ef5c327f96f788179be0b309689b4ce8))
+* **PostgreSQL:** exception deleting a table with one or less tabs open ([23946ff](https://github.com/antares-sql/antares/commit/23946ff2cef6d63e1529e2c8c4357d7fdedc3284))
+* **PostgreSQL:** unhandled error on connection lost, fixes [#740](https://github.com/antares-sql/antares/issues/740) ([cdd2a11](https://github.com/antares-sql/antares/commit/cdd2a11f8e33d6607337989723774d60c7c1a030))
+
+### [0.7.21-beta.0](https://github.com/antares-sql/antares/compare/v0.7.20...v0.7.21-beta.0) (2023-12-25)
+
+
+### Features
+
+* ability to edit notes ([08e5a13](https://github.com/antares-sql/antares/commit/08e5a13f723bc3ae95b0f529b79f0b558bc2a377))
+* buttons to save and access to saved queryes from query tab ([a52fc3f](https://github.com/antares-sql/antares/commit/a52fc3fd923fec30cfdd3d804554e6fe4534c400))
+* highlithg sql in notes, history and console ([bfa3924](https://github.com/antares-sql/antares/commit/bfa3924d57c2ea2cc2857006d6bd6279865dbc99))
+* new notes system ([eaaf1b7](https://github.com/antares-sql/antares/commit/eaaf1b756a6b5ffb77f7f07f3e4c0971822d48c3))
+* open saved queries in a tab ([9a732ea](https://github.com/antares-sql/antares/commit/9a732ea1971d223f3278ad02d3dd77837fecb377))
+
+
+### Bug Fixes
+
+* JavaScript error at first startup, fixes [#736](https://github.com/antares-sql/antares/issues/736) ([b734b24](https://github.com/antares-sql/antares/commit/b734b246795fb240f6728714be68c22cc221bbe9))
+
+### [0.7.20](https://github.com/antares-sql/antares/compare/v0.7.20-beta.2...v0.7.20) (2023-12-08)
+
+
+### Bug Fixes
+
+* missing update indicator on setting icon ([b055350](https://github.com/antares-sql/antares/commit/b055350726774e05a4e04ea6d890c46f64f2112e))
+
+### [0.7.20-beta.2](https://github.com/antares-sql/antares/compare/v0.7.20-beta.1...v0.7.20-beta.2) (2023-12-06)
+
+
+### Bug Fixes
+
+* communication with worker thread not working ([6a72f6b](https://github.com/antares-sql/antares/commit/6a72f6b4ae3f4c1d6c42ca7a817d2f2c135696a7))
+
 ### [0.7.20-beta.1](https://github.com/antares-sql/antares/compare/v0.7.20-beta.0...v0.7.20-beta.1) (2023-12-02)
 
 

README.md

@@ -7,7 +7,7 @@
 
 # Antares SQL Client
 
-![GitHub package.json version](https://img.shields.io/github/package-json/v/fabio286/antares) ![GitHub](https://img.shields.io/github/license/fabio286/antares) [![Build Status](https://img.shields.io/endpoint.svg?url=https%3A%2F%2Factions-badge.atrox.dev%2Ffabio286%2Fantares%2Fbadge&style=flat)](https://actions-badge.atrox.dev/fabio286/antares/goto) ![Mastodon Follow](https://img.shields.io/mastodon/follow/%20110860460902482117?domain=https%3A%2F%2Ffosstodon.org&style=social) [![Twitter Follow](https://img.shields.io/twitter/follow/AntaresSQL?style=social)](https://twitter.com/AntaresSQL) [![Plant a Tree](https://raw.githubusercontent.com/Fabio286/treedom-badge/master/svg/plant-a-tree.svg)](https://www.treedom.net/en/user/fabio-di-stasio/event/antares-for-the-planet)
+![GitHub package.json version](https://img.shields.io/github/package-json/v/fabio286/antares) ![GitHub](https://img.shields.io/github/license/fabio286/antares) ![Test e2e](https://github.com/antares-sql/antares/actions/workflows/test-e2e-win.yml/badge.svg?branch=develop) ![Mastodon Follow](https://img.shields.io/mastodon/follow/%20110860460902482117?domain=https%3A%2F%2Ffosstodon.org&style=social) [![Plant a Tree](https://raw.githubusercontent.com/Fabio286/treedom-badge/master/svg/plant-a-tree.svg)](https://www.treedom.net/en/user/fabio-di-stasio/event/antares-for-the-planet)
 
 Antares is an SQL client based on [Electron.js](https://github.com/electron/electron) and [Vue.js](https://github.com/vuejs/vue) that aims to become a useful tool, especially for developers.  
 Our target is to support as many databases as possible, and all major operating systems, including the ARM versions.  
@@ -17,7 +17,7 @@ However, there are all the features necessary to have a pleasant database manage
 We are actively working on it, hoping to provide new cool features, improvements and fixes as soon as possible.  
 
 🔗 If you are curious to try Antares you can download and install the [latest release](https://github.com/Fabio286/antares/releases/latest).  
-👁 To stay tuned for new releases follow Antares SQL on [Mastodon](https://fosstodon.org/@AntaresSQL) or [Twitter](https://twitter.com/AntaresSQL).  
+👁 To stay tuned for new releases follow Antares SQL on [Mastodon](https://fosstodon.org/@AntaresSQL).  
 🌟 Don't forget to **leave a star** if you appreciate this project.  
 
 🗳️ Polls:
@@ -35,6 +35,7 @@ We are actively working on it, hoping to provide new cool features, improvements
 - Fake table data filler to generate tons of data for test purpose.
 - Query suggestions and auto complete.
 - Query history: search through the last 1000 queries.
+- Save queries, notes or todo.
 - SSH tunnel support.
 - Manual commit mode.
 - Import and export database dumps.
@@ -70,17 +71,6 @@ On macOS you can run `.dmg` distribution following [this guide](https://support.
 [<img height='56' alt='Download on Flathub' src='https://dl.flathub.org/assets/badges/flathub-badge-en.svg'/>](https://flathub.org/apps/it.fabiodistasio.AntaresSQL) [![Get it from the Snap Store](https://snapcraft.io/static/images/badges/en/snap-store-black.svg)](https://snapcraft.io/antares) [![Get it from AUR](https://raw.githubusercontent.com/antares-sql/antares/master/docs/aur-badge.svg)](https://aur.archlinux.org/packages/antares-sql-bin) [<img src="https://developer.microsoft.com/store/badges/images/English_get-it-from-MS.png" style="height: 56px">](https://www.microsoft.com/p/antares-sql-client/9nhtb9sq51r1?cid=storebadge&ocid=badge&rtc=1&activetab=pivot:overviewtab)  
 🚀 **[Other Downloads](https://github.com/antares-sql/antares/releases/latest)**
 
-## Coming soon
-
-This is a roadmap with major features will come in near future.
-
-- Database tools.
-- Users management (add/edit/delete).
-- More context menu shortcuts.
-- More keyboard shortcuts.
-- Support for other databases.
-- Apple Silicon distribution
-
 ## Currently supported
 
 ### Databases
@@ -89,6 +79,7 @@ This is a roadmap with major features will come in near future.
 - [x] PostgreSQL
 - [x] SQLite
 - [x] Firebird SQL
+- [ ] DuckDB
 - [ ] SQL Server
 - [ ] More...
 
@@ -110,7 +101,7 @@ This is a roadmap with major features will come in near future.
 
 - 🌍 [Translate Antares](https://github.com/Fabio286/antares/wiki/Translate-Antares)
 - 📖 [Contributors Guide](https://github.com/Fabio286/antares/wiki/Contributors-Guide)
-- 🚧 [Project Board](https://github.com/antares-sql/antares/projects/1)
+- 🚧 [Project Board](https://github.com/orgs/antares-sql/projects/3/views/2)
 
 ## Contributors ✨
 
@@ -157,6 +148,11 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/Lawondyss"><img src="https://avatars.githubusercontent.com/u/272130?v=4?s=100" width="100px;" alt="Ladislav Vondráček"/><br /><sub><b>Ladislav Vondráček</b></sub></a><br /><a href="#translation-Lawondyss" title="Translation">🌍</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/zvlad"><img src="https://avatars.githubusercontent.com/u/9055134?v=4?s=100" width="100px;" alt="Vladyslav"/><br /><sub><b>Vladyslav</b></sub></a><br /><a href="#translation-zvlad" title="Translation">🌍</a></td>
     </tr>
+    <tr>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/bagusindrayana"><img src="https://avatars.githubusercontent.com/u/36830534?v=4?s=100" width="100px;" alt="Bagus Indrayana"/><br /><sub><b>Bagus Indrayana</b></sub></a><br /><a href="https://github.com/antares-sql/antares/commits?author=bagusindrayana" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/penguinlab"><img src="https://avatars.githubusercontent.com/u/10959317?v=4?s=100" width="100px;" alt="Naoki Ishikawa"/><br /><sub><b>Naoki Ishikawa</b></sub></a><br /><a href="#translation-penguinlab" title="Translation">🌍</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://fazevedo.dev"><img src="https://avatars.githubusercontent.com/u/1640325?v=4?s=100" width="100px;" alt="Filipe Azevedo"/><br /><sub><b>Filipe Azevedo</b></sub></a><br /><a href="https://github.com/antares-sql/antares/commits?author=mangas" title="Code">💻</a></td>
+    </tr>
   </tbody>
 </table>
 

commitlint.config.js

@@ -0,0 +1,33 @@
+module.exports = {
+   extends: ['@commitlint/config-conventional'],
+   rules: {
+      //   TODO Add Scope Enum Here
+      // 'scope-enum': [2, 'always', ['yourscope', 'yourscope']],
+      'type-enum': [
+         2,
+         'always',
+         [
+            'feat',
+            'fix',
+            'docs',
+            'chore',
+            'style',
+            'refactor',
+            'build',
+            'ci',
+            'test',
+            'revert',
+            'perf'
+         ]
+      ],
+      'subject-case': [
+         2,
+         'never',
+         [
+            'upper-case',
+            'pascal-case',
+            'start-case'
+         ]
+      ]
+   }
+};

package.json

@@ -1,7 +1,7 @@
 {
   "name": "antares",
   "productName": "Antares",
-  "version": "0.7.20-beta.1",
+  "version": "0.7.24",
   "description": "A modern, fast and productivity driven SQL client with a focus in UX.",
   "license": "MIT",
   "repository": "https://github.com/antares-sql/antares.git",
@@ -25,7 +25,8 @@
     "lint": "eslint . --ext .js,.ts,.vue && stylelint \"./src/**/*.{css,scss,sass,vue}\"",
     "lint:fix": "eslint . --ext .js,.ts,.vue --fix && stylelint \"./src/**/*.{css,scss,sass,vue}\" --fix",
     "contributors:add": "all-contributors add",
-    "contributors:generate": "all-contributors generate"
+    "contributors:generate": "all-contributors generate",
+    "prepare": "husky"
   },
   "author": "Fabio Di Stasio <info@fabiodistasio.it>",
   "main": "./dist/main.js",
@@ -124,38 +125,63 @@
     "@jamescoyle/vue-icon": "~0.1.2",
     "@mdi/js": "~7.2.96",
     "@turf/helpers": "~6.5.0",
+    "@vue/compiler-sfc": "~3.2.33",
     "@vueuse/core": "~10.4.1",
     "ace-builds": "~1.24.1",
-    "better-sqlite3": "~9.1.1",
+    "babel-loader": "~8.2.3",
+    "better-sqlite3": "~9.4.1",
+    "chalk": "~4.1.2",
+    "cross-env": "~7.0.2",
+    "css-loader": "~6.5.0",
     "electron-log": "~5.0.1",
     "electron-store": "~8.1.0",
     "electron-updater": "~4.6.5",
     "electron-window-state": "~5.0.3",
     "encoding": "~0.1.13",
+    "file-loader": "~6.2.0",
     "floating-vue": "~2.0.0-beta.20",
+    "html-webpack-plugin": "~5.5.0",
     "json2php": "~0.0.7",
     "leaflet": "~1.7.1",
-    "marked": "~4.0.19",
-    "moment": "~2.29.4",
-    "mysql2": "~3.5.2",
+    "marked": "~12.0.0",
+    "mini-css-extract-plugin": "~2.4.5",
+    "moment": "~2.30.1",
+    "mysql2": "~3.9.1",
     "node-firebird": "~1.1.4",
-    "pg": "~8.11.1",
+    "node-loader": "~2.0.0",
+    "pg": "~8.11.3",
     "pg-connection-string": "~2.5.0",
     "pg-query-stream": "~4.2.3",
     "pgsql-ast-parser": "~7.2.1",
-    "pinia": "~2.1.6",
+    "pinia": "~2.1.7",
+    "postcss-html": "~1.5.0",
+    "progress-webpack-plugin": "~1.0.12",
+    "rimraf": "~3.0.2",
+    "sass": "~1.42.1",
+    "sass-loader": "~12.3.0",
     "source-map-support": "~0.5.20",
     "spectre.css": "~0.5.9",
     "sql-formatter": "~13.0.0",
+    "sql-highlight": "~4.4.0",
+    "style-loader": "~3.3.1",
+    "tree-kill": "~1.2.2",
+    "ts-loader": "~9.2.8",
+    "typescript": "~4.6.3",
+    "unzip-crx-3": "~0.2.0",
     "v-mask": "~2.3.0",
-    "vue": "~3.3.4",
+    "vue": "~3.4.19",
     "vue-i18n": "~9.2.2",
-    "vuedraggable": "~4.1.0"
+    "vue-loader": "~16.8.3",
+    "vuedraggable": "~4.1.0",
+    "webpack": "~5.72.0",
+    "webpack-cli": "~4.9.1"
   },
   "devDependencies": {
     "@babel/eslint-parser": "~7.15.7",
     "@babel/preset-env": "~7.15.8",
     "@babel/preset-typescript": "~7.16.7",
+    "@commitlint/cli": "~19.0.3",
+    "@commitlint/config-conventional": "~19.0.3",
     "@playwright/test": "~1.28.1",
     "@types/better-sqlite3": "~7.5.0",
     "@types/leaflet": "~1.7.9",
@@ -165,13 +191,8 @@
     "@types/ssh2": "~1.11.6",
     "@typescript-eslint/eslint-plugin": "~5.18.0",
     "@typescript-eslint/parser": "~5.18.0",
-    "@vue/compiler-sfc": "~3.2.33",
     "all-contributors-cli": "~6.20.0",
-    "babel-loader": "~8.2.3",
-    "chalk": "~4.1.2",
-    "cross-env": "~7.0.2",
-    "css-loader": "~6.5.0",
-    "electron": "~22.3.27",
+    "electron": "~26.6.9",
     "electron-builder": "~24.6.4",
     "eslint": "~7.32.0",
     "eslint-config-standard": "~16.0.3",
@@ -180,32 +201,16 @@
     "eslint-plugin-promise": "~5.2.0",
     "eslint-plugin-simple-import-sort": "~10.0.0",
     "eslint-plugin-vue": "~8.0.3",
-    "file-loader": "~6.2.0",
-    "html-webpack-plugin": "~5.5.0",
-    "mini-css-extract-plugin": "~2.4.5",
-    "node-loader": "~2.0.0",
+    "husky": "~9.0.11",
     "playwright": "~1.28.1",
     "playwright-core": "~1.28.1",
-    "postcss-html": "~1.5.0",
-    "progress-webpack-plugin": "~1.0.12",
-    "rimraf": "~3.0.2",
-    "sass": "~1.42.1",
-    "sass-loader": "~12.3.0",
     "standard-version": "~9.3.1",
-    "style-loader": "~3.3.1",
     "stylelint": "^15.11.0",
     "stylelint-config-recommended-vue": "~1.5.0",
     "stylelint-config-standard": "~34.0.0",
     "stylelint-scss": "~5.3.0",
-    "tree-kill": "~1.2.2",
-    "ts-loader": "~9.2.8",
     "ts-node": "~10.9.1",
-    "typescript": "~4.6.3",
-    "unzip-crx-3": "~0.2.0",
     "vue-eslint-parser": "~8.3.0",
-    "vue-loader": "~16.8.3",
-    "webpack": "~5.72.0",
-    "webpack-cli": "~4.9.1",
     "webpack-dev-server": "~4.11.1",
     "xvfb-maybe": "~0.2.1"
   }

scripts/devRunner.js

@@ -111,6 +111,7 @@ function startRenderer (callback) {
 
    const server = new WebpackDevServer(compiler, {
       port: 9080,
+      hot: true,
       client: {
          overlay: true,
          logging: 'warn'

src/common/customizations/defaults.ts

@@ -19,6 +19,7 @@ export const defaults: Customizations = {
    sshConnection: false,
    fileConnection: false,
    cancelQueries: false,
+   singleConnectionMode: false,
    // Tools
    processesList: false,
    usersManagement: false,

src/common/customizations/mysql.ts

@@ -29,6 +29,7 @@ export const customizations: Customizations = {
    sslConnection: true,
    sshConnection: true,
    cancelQueries: true,
+   singleConnectionMode: true,
    // Tools
    processesList: true,
    // Structure

src/common/data-types/postgresql.ts

@@ -66,7 +66,7 @@ export default [
       group: 'monetary',
       types: [
          {
-            name: 'money',
+            name: 'MONEY',
             length: false,
             unsigned: true
          }

src/common/interfaces/antares.ts

@@ -52,6 +52,7 @@ export interface ConnectionParams {
    password: string;
    ask: boolean;
    readonly: boolean;
+   singleConnectionMode: boolean;
    ssl: boolean;
    cert?: string;
    key?: string;
@@ -363,7 +364,7 @@ export interface QueryBuilderObject {
    offset: number;
    join: string[];
    update: string[];
-   insert: {[key: string]: string | boolean | number }[];
+   insert: Record<string, string | boolean | number>[];
    delete: boolean;
 }
 

src/common/interfaces/customizations.ts

@@ -19,6 +19,7 @@ export interface Customizations {
    sshConnection?: boolean;
    fileConnection?: boolean;
    cancelQueries?: boolean;
+   singleConnectionMode?: boolean;
    // Tools
    processesList?: boolean;
    usersManagement?: boolean;

src/common/interfaces/exporter.ts

@@ -13,7 +13,7 @@ export interface ExportOptions {
       includeContent: boolean;
       includeDropStatement: boolean;
    }[];
-   includes: {[key: string]: boolean};
+   includes: Record<string, boolean>;
    outputFormat: 'sql' | 'sql.zip';
    outputFile: string;
    sqlInsertAfter: number;

src/common/interfaces/tableApis.ts

@@ -18,7 +18,7 @@ export interface TableDeleteParams {
    primary?: string;
    field: string;
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-   rows: {[key: string]: any};
+   rows: Record<string, any>;
 }
 
 export type TableFilterOperator = '=' | '!=' | '>' | '<' | '>=' | '<=' | 'IN' | 'NOT IN' | 'LIKE' | 'NOT LIKE' | 'RLIKE' | 'NOT RLIKE' | 'BETWEEN' | 'IS NULL' | 'IS NOT NULL'
@@ -35,17 +35,16 @@ export interface InsertRowsParams {
    uid: string;
    schema: string;
    table: string;
-   row: {[key: string]: {
-         group: string;
-         method: string;
-         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-         params: any;
-         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-         value: any;
-         length: number;
-      };
-   };
+   row: Record<string, {
+      group: string;
+      method: string;
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      params: any;
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      value: any;
+      length: number;
+   }>;
    repeat: number;
-   fields: {[key: string]: string};
+   fields: Record<string, string>;
    locale: UsableLocale;
 }

src/common/libs/sqlUtils.ts

@@ -41,7 +41,7 @@ export const escapeAndQuote = (val: string, client: ClientCode) => {
    const { stringsWrapper: sw } = customizations[client];
    // eslint-disable-next-line no-control-regex
    const CHARS_TO_ESCAPE = /[\0\b\t\n\r\x1a"'\\]/g;
-   const CHARS_ESCAPE_MAP: {[key: string]: string} = {
+   const CHARS_ESCAPE_MAP: Record<string, string> = {
       '\0': '\\0',
       '\b': '\\b',
       '\t': '\\t',
@@ -153,9 +153,9 @@ export const valueToSqlString = (args: {
 };
 
 export const jsonToSqlInsert = (args: {
-      json: { [key: string]: any}[];
+      json: Record<string, any>[];
       client: ClientCode;
-      fields: { [key: string]: {type: string; datePrecision: number}};
+      fields: Record<string, {type: string; datePrecision: number}>;
       table: string;
       options?: {sqlInsertAfter: number; sqlInsertDivider: 'bytes' | 'rows'};
    }) => {

src/common/shortcuts.ts

@@ -1,4 +1,4 @@
-export const shortcutEvents: { [key: string]: { l18n: string; l18nParam?: string | number; context?: 'tab' }} = {
+export const shortcutEvents: Record<string, { l18n: string; l18nParam?: string | number; context?: 'tab' }> = {
    'run-or-reload': { l18n: 'application.runOrReload', context: 'tab' },
    'open-new-tab': { l18n: 'application.openNewTab', context: 'tab' },
    'close-tab': { l18n: 'application.closeTab', context: 'tab' },
@@ -6,6 +6,9 @@ export const shortcutEvents: { [key: string]: { l18n: string; l18nParam?: string
    'kill-query': { l18n: 'database.killQuery', context: 'tab' },
    'query-history': { l18n: 'database.queryHistory', context: 'tab' },
    'clear-query': { l18n: 'database.clearQuery', context: 'tab' },
+   // 'save-file': { l18n: 'application.saveFile', context: 'tab' },
+   'open-file': { l18n: 'application.openFile', context: 'tab' },
+   'save-file-as': { l18n: 'application.saveFileAs', context: 'tab' },
    'next-tab': { l18n: 'application.nextTab' },
    'prev-tab': { l18n: 'application.previousTab' },
    'open-all-connections': { l18n: 'application.openAllConnections' },
@@ -16,7 +19,7 @@ export const shortcutEvents: { [key: string]: { l18n: string; l18nParam?: string
    'save-content': { l18n: 'application.saveContent' },
    'create-connection': { l18n: 'connection.createNewConnection' },
    'open-settings': { l18n: 'application.openSettings' },
-   'open-scratchpad': { l18n: 'application.openScratchpad' }
+   'open-scratchpad': { l18n: 'application.openNotes' }
 };
 
 interface ShortcutRecord {
@@ -119,6 +122,21 @@ const shortcuts: ShortcutRecord[] = [
       event: 'toggle-console',
       keys: ['CommandOrControl+`'],
       os: ['darwin', 'linux', 'win32']
+   },
+   // {
+   //    event: 'save-file',
+   //    keys: ['CommandOrControl+S'],
+   //    os: ['darwin', 'linux', 'win32']
+   // },
+   {
+      event: 'open-file',
+      keys: ['CommandOrControl+O'],
+      os: ['darwin', 'linux', 'win32']
+   },
+   {
+      event: 'save-file-as',
+      keys: ['Shift+CommandOrControl+S'],
+      os: ['darwin', 'linux', 'win32']
    }
 ];
 

src/main/ipc-handlers/application.ts

@@ -1,5 +1,6 @@
 import { app, dialog, ipcMain, safeStorage } from 'electron';
 import * as Store from 'electron-store';
+import * as fs from 'fs';
 
 import { validateSender } from '../libs/misc/validateSender';
 import { ShortcutRegister } from '../libs/ShortcutRegister';
@@ -36,9 +37,15 @@ export default () => {
          name: 'session',
          fileExtension: ''
       });
-      const encrypted = sessionStore.get('key') as string;
-      const key = safeStorage.decryptString(Buffer.from(encrypted, 'utf-8'));
-      event.returnValue = key;
+
+      try {
+         const encrypted = sessionStore.get('key') as string;
+         const key = safeStorage.decryptString(Buffer.from(encrypted, 'utf-8'));
+         event.returnValue = key;
+      }
+      catch (error) {
+         event.returnValue = false;
+      }
    });
 
    ipcMain.handle('show-open-dialog', (event, options) => {
@@ -46,6 +53,11 @@ export default () => {
       return dialog.showOpenDialog(options);
    });
 
+   ipcMain.handle('show-save-dialog', (event, options) => {
+      if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
+      return dialog.showSaveDialog(options);
+   });
+
    ipcMain.handle('get-download-dir-path', (event) => {
       if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
       return app.getPath('downloads');
@@ -74,4 +86,26 @@ export default () => {
       const shortCutRegister = ShortcutRegister.getInstance();
       shortCutRegister.unregister();
    });
+
+   ipcMain.handle('read-file', (event, filePath) => {
+      if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
+      try {
+         const content = fs.readFileSync(filePath, 'utf-8');
+         return content;
+      }
+      catch (error) {
+         return { status: 'error', response: error.toString() };
+      }
+   });
+
+   ipcMain.handle('write-file', (event, filePath, content) => {
+      if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
+      try {
+         fs.writeFileSync(filePath, content, 'utf-8');
+         return { status: 'success' };
+      }
+      catch (error) {
+         return { status: 'error', response: error.toString() };
+      }
+   });
 };

src/main/ipc-handlers/connection.ts

@@ -6,7 +6,7 @@ import { SslOptions } from 'mysql2';
 import { ClientsFactory } from '../libs/ClientsFactory';
 import { validateSender } from '../libs/misc/validateSender';
 
-export default (connections: {[key: string]: antares.Client}) => {
+export default (connections: Record<string, antares.Client>) => {
    ipcMain.handle('test-connection', async (event, conn: antares.ConnectionParams) => {
       if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
 
@@ -146,7 +146,7 @@ export default (connections: {[key: string]: antares.Client}) => {
             uid: conn.uid,
             client: conn.client,
             params,
-            poolSize: 5
+            poolSize: conn.singleConnectionMode ? 0 : 5
          });
 
          await connection.connect();

src/main/ipc-handlers/database.ts

@@ -3,7 +3,7 @@ import { ipcMain } from 'electron';
 
 import { validateSender } from '../libs/misc/validateSender';
 
-export default (connections: {[key: string]: antares.Client}) => {
+export default (connections: Record<string, antares.Client>) => {
    ipcMain.handle('get-databases', async (event, uid) => {
       if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
 

src/main/ipc-handlers/functions.ts

@@ -3,7 +3,7 @@ import { ipcMain } from 'electron';
 
 import { validateSender } from '../libs/misc/validateSender';
 
-export default (connections: {[key: string]: antares.Client}) => {
+export default (connections: Record<string, antares.Client>) => {
    ipcMain.handle('get-function-informations', async (event, params) => {
       if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
 

src/main/ipc-handlers/index.ts

@@ -13,7 +13,7 @@ import updates from './updates';
 import users from './users';
 import views from './views';
 
-const connections: {[key: string]: antares.Client} = {};
+const connections: Record<string, antares.Client> = {};
 
 export default () => {
    connection(connections);

src/main/ipc-handlers/routines.ts

@@ -3,7 +3,7 @@ import { ipcMain } from 'electron';
 
 import { validateSender } from '../libs/misc/validateSender';
 
-export default (connections: {[key: string]: antares.Client}) => {
+export default (connections: Record<string, antares.Client>) => {
    ipcMain.handle('get-routine-informations', async (event, params) => {
       if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
 

src/main/ipc-handlers/schedulers.ts

@@ -3,7 +3,7 @@ import { ipcMain } from 'electron';
 
 import { validateSender } from '../libs/misc/validateSender';
 
-export default (connections: {[key: string]: antares.Client}) => {
+export default (connections: Record<string, antares.Client>) => {
    ipcMain.handle('get-scheduler-informations', async (event, params) => {
       if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
 

src/main/ipc-handlers/schema.ts

@@ -6,7 +6,7 @@ import { Worker } from 'worker_threads';
 
 import { validateSender } from '../libs/misc/validateSender';
 
-export default (connections: {[key: string]: antares.Client}) => {
+export default (connections: Record<string, antares.Client>) => {
    let exporter: Worker = null;
    let importer: Worker = null;
 
@@ -240,17 +240,8 @@ export default (connections: {[key: string]: antares.Client}) => {
             });
 
             // Exporter message listener
-            exporter.stdout.on('data', (buff: Buffer) => {
-               let message;
-               try { // Ignore non-JSON data (console.log output)
-                  message = JSON.parse(buff.toString());
-               }
-               catch (_) {
-                  if (process.env.NODE_ENV === 'development') console.log('EXPORTER:', buff.toString());
-                  return;
-               }
-
-               const { type, payload } = message as workers.WorkerIpcMessage;
+            exporter.on('message', (message: workers.WorkerIpcMessage) => {
+               const { type, payload } = message;
 
                switch (type) {
                   case 'export-progress':
@@ -331,17 +322,8 @@ export default (connections: {[key: string]: antares.Client}) => {
             });
 
             // Importer message listener
-            importer.stdout.on('data', (buff: Buffer) => {
-               let message;
-               try { // Ignore non-JSON data (console.log output)
-                  message = JSON.parse(buff.toString());
-               }
-               catch (_) {
-                  if (process.env.NODE_ENV === 'development') console.log('IMPORTER:', buff.toString());
-                  return;
-               }
-
-               const { type, payload } = message as workers.WorkerIpcMessage;
+            importer.on('message', (message: workers.WorkerIpcMessage) => {
+               const { type, payload } = message;
 
                switch (type) {
                   case 'import-progress':

src/main/ipc-handlers/tables.ts

@@ -10,7 +10,7 @@ import * as moment from 'moment';
 
 import { validateSender } from '../libs/misc/validateSender';
 
-export default (connections: {[key: string]: antares.Client}) => {
+export default (connections: Record<string, antares.Client>) => {
    ipcMain.handle('get-table-columns', async (event, params) => {
       if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
 
@@ -249,7 +249,7 @@ export default (connections: {[key: string]: antares.Client}) => {
 
       if (params.primary) {
          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-         const idString = params.rows.map((row: {[key: string]: any}) => {
+         const idString = params.rows.map((row: Record<string, any>) => {
             const fieldName = Object.keys(row)[0].includes('.') ? `${params.table}.${params.primary}` : params.primary;
 
             return typeof row[fieldName] === 'string'
@@ -304,10 +304,10 @@ export default (connections: {[key: string]: antares.Client}) => {
       if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
 
       try { // TODO: move to client classes
-         const rows: {[key: string]: string | number | boolean | Date | Buffer}[] = [];
+         const rows: Record<string, string | number | boolean | Date | Buffer>[] = [];
 
          for (let i = 0; i < +params.repeat; i++) {
-            const insertObj: {[key: string]: string | number | boolean | Date | Buffer} = {};
+            const insertObj: Record<string, string | number | boolean | Date | Buffer> = {};
 
             for (const key in params.row) {
                const type = params.fields[key];
@@ -367,7 +367,7 @@ export default (connections: {[key: string]: antares.Client}) => {
                   insertObj[key] = escapedParam;
                }
                else { // Faker value
-                  const parsedParams: {[key: string]: string | number | boolean | Date | Buffer} = {};
+                  const parsedParams: Record<string, string | number | boolean | Date | Buffer> = {};
                   let fakeValue;
 
                   if (params.locale)
@@ -437,12 +437,12 @@ export default (connections: {[key: string]: antares.Client}) => {
          if (description)
             query.select(`LEFT(${description}, 20) AS foreign_description`);
 
-         const results = await query.run<{[key: string]: string}>();
+         const results = await query.run<Record<string, string>>();
 
-         const parsedResults: {[key: string]: string}[] = [];
+         const parsedResults: Record<string, string>[] = [];
 
          for (const row of results.rows) {
-            const remappedRow: {[key: string]: string} = {};
+            const remappedRow: Record<string, string> = {};
 
             for (const key in row)
                remappedRow[key.toLowerCase()] = row[key];// Thanks Firebird -.-

src/main/ipc-handlers/triggers.ts

@@ -3,7 +3,7 @@ import { ipcMain } from 'electron';
 
 import { validateSender } from '../libs/misc/validateSender';
 
-export default (connections: {[key: string]: antares.Client}) => {
+export default (connections: Record<string, antares.Client>) => {
    ipcMain.handle('get-trigger-informations', async (event, params) => {
       if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
 

src/main/ipc-handlers/users.ts

@@ -3,7 +3,7 @@ import { ipcMain } from 'electron';
 
 import { validateSender } from '../libs/misc/validateSender';
 
-export default (connections: {[key: string]: antares.Client}) => {
+export default (connections: Record<string, antares.Client>) => {
    ipcMain.handle('get-users', async (event, uid) => {
       if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
 

src/main/ipc-handlers/views.ts

@@ -3,7 +3,7 @@ import { ipcMain } from 'electron';
 
 import { validateSender } from '../libs/misc/validateSender';
 
-export default (connections: {[key: string]: antares.Client}) => {
+export default (connections: Record<string, antares.Client>) => {
    ipcMain.handle('get-view-informations', async (event, params) => {
       if (!validateSender(event.senderFrame)) return { status: 'error', response: 'Unauthorized process' };
 

src/main/libs/ShortcutRegister.ts

@@ -70,23 +70,21 @@ export class ShortcutRegister {
    }
 
    private setLocalShortcuts () {
+      const isMenuVisible = process.platform === 'darwin';
+      const submenu = [];
       for (const shortcut of this.shortcuts) {
          if (shortcut.os.includes(process.platform)) {
             for (const key of shortcut.keys) {
                try {
-                  this._menu.append(new MenuItem({
-                     label: '.',
-                     visible: false,
-                     submenu: [{
-                        label: String(key),
-                        accelerator: key,
-                        visible: false,
-                        click: () => {
-                           this._mainWindow.webContents.send(shortcut.event);
-                           if (isDevelopment) console.log('LOCAL EVENT:', shortcut);
-                        }
-                     }]
-                  }));
+                  submenu.push({
+                     label: String(shortcut.event),
+                     accelerator: key,
+                     visible: isMenuVisible,
+                     click: () => {
+                        this._mainWindow.webContents.send(shortcut.event);
+                        if (isDevelopment) console.log('LOCAL EVENT:', shortcut);
+                     }
+                  });
                }
                catch (error) {
                   if (isDevelopment) console.log(error);
@@ -96,6 +94,11 @@ export class ShortcutRegister {
             }
          }
       }
+      this._menu.append(new MenuItem({
+         label: 'Shortcut',
+         visible: isMenuVisible,
+         submenu
+      }));
    }
 
    private setGlobalShortcuts () {

src/main/libs/clients/BaseClient.ts

@@ -136,7 +136,7 @@ export abstract class BaseClient {
    }
 
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-   insert (arr: {[key: string]: any}[]) {
+   insert (arr: Record<string, any>[]) {
       this._query.insert = [...this._query.insert, ...arr];
       return this;
    }

src/main/libs/clients/FirebirdSQLClient.ts

@@ -13,7 +13,7 @@ export class FirebirdSQLClient extends BaseClient {
    protected _connection?: firebird.Database | firebird.ConnectionPool;
    _params: firebird.Options;
 
-   private _types: {[key: number]: string} ={
+   private _types: Record<number, string> ={
       452: 'CHAR', // Array of char
       448: 'VARCHAR',
       500: 'SMALLINT',

src/main/libs/clients/MySQLClient.ts

@@ -12,10 +12,11 @@ export class MySQLClient extends BaseClient {
    private _connectionsToCommit: Map<string, mysql.Connection | mysql.PoolConnection>;
    private _keepaliveTimer: NodeJS.Timer;
    private _keepaliveMs: number;
+   private sqlMode?: string[];
    _connection?: mysql.Connection | mysql.Pool;
    _params: mysql.ConnectionOptions & {schema: string; ssl?: mysql.SslOptions; ssh?: SSHConfig; readonly: boolean};
 
-   private types: {[key: number]: string} = {
+   private types: Record<number, string> = {
       0: 'DECIMAL',
       1: 'TINYINT',
       2: 'SMALLINT',
@@ -58,6 +59,10 @@ export class MySQLClient extends BaseClient {
       this._keepaliveMs = 10*60*1000;
    }
 
+   private get isPool () {
+      return 'getConnection' in this._connection;
+   }
+
    private _getType (field: mysql.FieldPacket & { columnType?: number; columnLength?: number }) {
       let name = this.types[field.columnType];
       let length = field.columnLength;
@@ -181,9 +186,32 @@ export class MySQLClient extends BaseClient {
 
    async connect () {
       if (!this._poolSize)
-         this._connection = await this.getConnection();
+         this._connection = await this.getSingleConnection();
       else
          this._connection = await this.getConnectionPool();
+
+      // ANSI_QUOTES check
+      const [response] = await this._connection.query<mysql.RowDataPacket[]>('SHOW GLOBAL VARIABLES LIKE \'%sql_mode%\'');
+      this.sqlMode = response[0]?.Value?.split(',');
+      const hasAnsiQuotes = this.sqlMode.includes('ANSI') || this.sqlMode.includes('ANSI_QUOTES');
+
+      if (hasAnsiQuotes)
+         await this._connection.query(`SET SESSION sql_mode = '${this.sqlMode.filter((m: string) => !['ANSI', 'ANSI_QUOTES'].includes(m)).join(',')}'`);
+
+      if (this._params.readonly)
+         await this._connection.query('SET SESSION TRANSACTION READ ONLY');
+
+      if (this._poolSize) {
+         const hasAnsiQuotes = this.sqlMode.includes('ANSI') || this.sqlMode.includes('ANSI_QUOTES');
+
+         this._connection.on('connection', conn => {
+            if (this._params.readonly)
+               conn.query('SET SESSION TRANSACTION READ ONLY');
+
+            if (hasAnsiQuotes)
+               conn.query(`SET SESSION sql_mode = '${this.sqlMode.filter((m: string) => !['ANSI', 'ANSI_QUOTES'].includes(m)).join(',')}'`);
+         });
+      }
    }
 
    destroy () {
@@ -196,7 +224,7 @@ export class MySQLClient extends BaseClient {
       }
    }
 
-   async getConnection () {
+   async getSingleConnection () {
       const dbConfig = await this.getDbConfig();
       const connection = await mysql.createConnection({
          ...dbConfig,
@@ -208,17 +236,6 @@ export class MySQLClient extends BaseClient {
          }
       });
 
-      // ANSI_QUOTES check
-      const [response] = await connection.query<mysql.RowDataPacket[]>('SHOW GLOBAL VARIABLES LIKE \'%sql_mode%\'');
-      const sqlMode: string[] = response[0]?.Value?.split(',');
-      const hasAnsiQuotes = sqlMode.includes('ANSI') || sqlMode.includes('ANSI_QUOTES');
-
-      if (this._params.readonly)
-         await connection.query('SET SESSION TRANSACTION READ ONLY');
-
-      if (hasAnsiQuotes)
-         await connection.query(`SET SESSION sql_mode = '${sqlMode.filter((m: string) => !['ANSI', 'ANSI_QUOTES'].includes(m)).join(',')}'`);
-
       return connection;
    }
 
@@ -227,6 +244,7 @@ export class MySQLClient extends BaseClient {
       const connection = mysql.createPool({
          ...dbConfig,
          connectionLimit: this._poolSize,
+         enableKeepAlive: true,
          typeCast: (field, next) => {
             if (field.type === 'DATETIME')
                return field.string();
@@ -235,25 +253,6 @@ export class MySQLClient extends BaseClient {
          }
       });
 
-      // ANSI_QUOTES check
-      const [res] = await connection.query<mysql.RowDataPacket[]>('SHOW GLOBAL VARIABLES LIKE \'%sql_mode%\'');
-      const sqlMode: string[] = res[0]?.Value?.split(',');
-      const hasAnsiQuotes = sqlMode.includes('ANSI') || sqlMode.includes('ANSI_QUOTES');
-
-      if (hasAnsiQuotes)
-         await connection.query(`SET SESSION sql_mode = '${sqlMode.filter((m: string) => !['ANSI', 'ANSI_QUOTES'].includes(m)).join(',')}'`);
-
-      if (this._params.readonly)
-         await connection.query('SET SESSION TRANSACTION READ ONLY');
-
-      connection.on('connection', conn => {
-         if (this._params.readonly)
-            conn.query('SET SESSION TRANSACTION READ ONLY');
-
-         if (hasAnsiQuotes)
-            conn.query(`SET SESSION sql_mode = '${sqlMode.filter((m: string) => !['ANSI', 'ANSI_QUOTES'].includes(m)).join(',')}'`);
-      });
-
       this._keepaliveTimer = setInterval(async () => {
          await this.keepAlive();
       }, this._keepaliveMs);
@@ -261,6 +260,43 @@ export class MySQLClient extends BaseClient {
       return connection;
    }
 
+   async getConnection (args?: antares.QueryParams, retry?: boolean): Promise<mysql.Pool | mysql.PoolConnection | mysql.Connection> {
+      let connection;
+
+      try {
+         if (args && !args.autocommit && args.tabUid) { // autocommit OFF
+            if (this._connectionsToCommit.has(args.tabUid))
+               connection = this._connectionsToCommit.get(args.tabUid);
+            else {
+               connection = await this.getSingleConnection();
+               await connection.query('SET SESSION autocommit=0');
+               this._connectionsToCommit.set(args.tabUid, connection);
+            }
+         }
+         else// autocommit ON
+            connection = this.isPool ? await (this._connection as mysql.Pool).getConnection() : this._connection;
+
+         if (args && args.tabUid && this.isPool) {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            this._runningConnections.set(args.tabUid, (connection as any).connection.connectionId);
+         }
+
+         if (args && args.schema)
+            await connection.query(`USE \`${args.schema}\``);
+
+         return connection;
+      }
+      catch (error) {
+         if (error.code === 'ECONNRESET' && !retry) {
+            this.destroy();
+            await this.connect();
+            return this.getConnection(args, true);
+         }
+         else
+            throw new Error(error.message);
+      }
+   }
+
    private async keepAlive () {
       try {
          const connection = await (this._connection as mysql.Pool).getConnection();
@@ -582,7 +618,7 @@ export class MySQLClient extends BaseClient {
                }
             })
             .filter(Boolean)
-            .reduce((acc: {[key: string]: { name: string; type: string; length: string; default: string}}, curr) => {
+            .reduce((acc: Record<string, { name: string; type: string; length: string; default: string}>, curr) => {
                acc[curr.name] = curr;
                return acc;
             }, {});
@@ -591,7 +627,7 @@ export class MySQLClient extends BaseClient {
       return rows.map((field) => {
          const numLengthMatch = field.COLUMN_TYPE.match(/int\(([^)]+)\)/);
          const numLength = numLengthMatch ? +numLengthMatch.pop() : field.NUMERIC_PRECISION || null;
-         const enumValues = /(enum)/.test(field.COLUMN_TYPE)
+         const enumValues = /(enum|set)/.test(field.COLUMN_TYPE)
             ? field.COLUMN_TYPE.match(/\(([^)]+)\)/)[0].slice(1, -1)
             : null;
 
@@ -1648,28 +1684,7 @@ export class MySQLClient extends BaseClient {
             .map(q => q.trim())
          : [sql];
 
-      let connection: mysql.Connection | mysql.Pool | mysql.PoolConnection;
-      const isPool = 'getConnection' in this._connection;
-
-      if (!args.autocommit && args.tabUid) { // autocommit OFF
-         if (this._connectionsToCommit.has(args.tabUid))
-            connection = this._connectionsToCommit.get(args.tabUid);
-         else {
-            connection = await this.getConnection();
-            await connection.query('SET SESSION autocommit=0');
-            this._connectionsToCommit.set(args.tabUid, connection);
-         }
-      }
-      else// autocommit ON
-         connection = isPool ? await (this._connection as mysql.Pool).getConnection() : this._connection;
-
-      if (args.tabUid && isPool) {
-         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-         this._runningConnections.set(args.tabUid, (connection as any).connection.connectionId);
-      }
-
-      if (args.schema)
-         await connection.query(`USE \`${args.schema}\``);
+      const connection = await this.getConnection(args);
 
       for (const query of queries) {
          if (!query) continue;
@@ -1729,7 +1744,7 @@ export class MySQLClient extends BaseClient {
                            });
                         }
                         catch (err) {
-                           if (isPool && args.autocommit) {
+                           if (this.isPool && args.autocommit) {
                               (connection as mysql.PoolConnection).release();
                               this._runningConnections.delete(args.tabUid);
                            }
@@ -1741,7 +1756,7 @@ export class MySQLClient extends BaseClient {
                            keysArr = keysArr ? [...keysArr, ...response] : response;
                         }
                         catch (err) {
-                           if (isPool && args.autocommit) {
+                           if (this.isPool && args.autocommit) {
                               (connection as mysql.PoolConnection).release();
                               this._runningConnections.delete(args.tabUid);
                            }
@@ -1759,7 +1774,7 @@ export class MySQLClient extends BaseClient {
                   keys: keysArr
                });
             }).catch((err) => {
-               if (isPool && args.autocommit) {
+               if (this.isPool && args.autocommit) {
                   (connection as mysql.PoolConnection).release();
                   this._runningConnections.delete(args.tabUid);
                }
@@ -1776,7 +1791,7 @@ export class MySQLClient extends BaseClient {
          });
       }
 
-      if (isPool && args.autocommit) {
+      if (this.isPool && args.autocommit) {
          (connection as mysql.PoolConnection).release();
          this._runningConnections.delete(args.tabUid);
       }

src/main/libs/clients/PostgreSQLClient.ts

@@ -88,8 +88,8 @@ export class PostgreSQLClient extends BaseClient {
    private _keepaliveTimer: NodeJS.Timer;
    private _keepaliveMs: number;
    protected _connection?: pg.Client | pg.Pool;
-   private types: {[key: string]: string} = {};
-   private _arrayTypes: {[key: string]: string} = {
+   private types: Record<string, string> = {};
+   private _arrayTypes: Record<string, string> = {
       _int2: 'SMALLINT',
       _int4: 'INTEGER',
       _int8: 'BIGINT',
@@ -210,6 +210,10 @@ export class PostgreSQLClient extends BaseClient {
       if (this._params.readonly)
          await connection.query('SET SESSION CHARACTERISTICS AS TRANSACTION READ ONLY');
 
+      connection.on('error', err => { // Intercepts errors and converts to rejections
+         Promise.reject(err);
+      });
+
       return connection;
    }
 
@@ -232,6 +236,10 @@ export class PostgreSQLClient extends BaseClient {
          await this.keepAlive();
       }, this._keepaliveMs);
 
+      connection.on('error', err => { // Intercepts errors and converts to rejections
+         Promise.reject(err);
+      });
+
       return connection;
    }
 
@@ -652,7 +660,7 @@ export class PostgreSQLClient extends BaseClient {
       let createSql = '';
       const sequences = [];
       const columnsSql = [];
-      const arrayTypes: {[key: string]: string} = {
+      const arrayTypes: Record<string, string> = {
          _int2: 'smallint',
          _int4: 'integer',
          _int8: 'bigint',

src/main/libs/clients/SQLiteClient.ts

@@ -166,7 +166,7 @@ export class SQLiteClient extends BaseClient {
             type: type.trim(),
             schema: schema,
             table: table,
-            numPrecision: [...NUMBER, ...FLOAT].includes(type) ? length : null,
+            numLength: [...NUMBER, ...FLOAT].includes(type) ? length : null,
             datePrecision: null,
             charLength: ![...NUMBER, ...FLOAT].includes(type) ? length : null,
             nullable: !field.notnull,
@@ -658,7 +658,7 @@ export class SQLiteClient extends BaseClient {
                let queryAllResult: any[];
                let affectedRows;
                let fields;
-               const detectedTypes: {[key: string]: string} = {};
+               const detectedTypes: Record<string, string> = {};
 
                try {
                   const stmt = connection.prepare(query);

src/main/libs/exporters/sql/MysqlExporter.ts

@@ -354,7 +354,7 @@ CREATE TABLE \`${view.Name}\`(
    escapeAndQuote (val: string) {
       // eslint-disable-next-line no-control-regex
       const CHARS_TO_ESCAPE = /[\0\b\t\n\r\x1a"'\\]/g;
-      const CHARS_ESCAPE_MAP: {[key: string]: string} = {
+      const CHARS_ESCAPE_MAP: Record<string, string> = {
          '\0': '\\0',
          '\b': '\\b',
          '\t': '\\t',

src/main/libs/exporters/sql/PostgreSQLExporter.ts

@@ -59,7 +59,7 @@ SET row_security = off;\n\n\n`;
       let createSql = '';
       const sequences = [];
       const columnsSql = [];
-      const arrayTypes: {[key: string]: string} = {
+      const arrayTypes: Record<string, string> = {
          _int2: 'smallint',
          _int4: 'integer',
          _int8: 'bigint',
@@ -440,7 +440,7 @@ SET row_security = off;\n\n\n`;
    escapeAndQuote (val: string) {
       // eslint-disable-next-line no-control-regex
       const CHARS_TO_ESCAPE = /[\0\b\t\n\r\x1a"'\\]/g;
-      const CHARS_ESCAPE_MAP: {[key: string]: string} = {
+      const CHARS_ESCAPE_MAP: Record<string, string> = {
          '\0': '\\0',
          '\b': '\\b',
          '\t': '\\t',

src/main/main.ts

@@ -127,8 +127,8 @@ app.on('ready', async () => {
    if (isWindows)
       mainWindow.show();
 
-   // if (isDevelopment)
-   //    mainWindow.webContents.openDevTools();
+   if (isDevelopment && !isWindows)// Because on Windows you can open devtools from title-bar
+      mainWindow.webContents.openDevTools();
 
    process.on('uncaughtException', error => {
       mainWindow.webContents.send('unhandled-exception', error);

src/renderer/components/BaseConfirmModal.vue

@@ -56,8 +56,8 @@ const { t } = useI18n();
 
 const props = defineProps({
    size: {
-      type: String as PropType<'small' | 'medium' | '400' | 'large'>,
-      validator: (prop: string) => ['small', 'medium', '400', 'large'].includes(prop),
+      type: String as PropType<'small' | 'medium' | '400' | 'large' | 'resize'>,
+      validator: (prop: string) => ['small', 'medium', '400', 'large', 'resize'].includes(prop),
       default: 'small'
    },
    hideFooter: {
@@ -88,6 +88,8 @@ const modalSizeClass = computed(() => {
       return 'modal-sm';
    if (props.size === '400')
       return 'modal-400';
+   if (props.size === 'resize')
+      return 'modal-resize';
    else if (props.size === 'large')
       return 'modal-lg';
    else return '';
@@ -120,6 +122,12 @@ onBeforeUnmount(() => {
   max-width: 400px;
 }
 
+.modal-resize .modal-container {
+  max-width: 95vw;
+  max-height: 95vh;
+  width: auto;
+}
+
 .modal.modal-sm .modal-container {
   padding: 0;
 }

src/renderer/components/BaseMap.vue

@@ -99,7 +99,7 @@ onMounted(() => {
   display: flex;
   justify-content: center;
   align-items: center;
-  background: $primary-color;
+  background: var(--primary-color);
   border-radius: 50%;
   box-shadow: 0 0 5px 1px darken($body-font-color-dark, 40%);
 }

src/renderer/components/BaseSelect.vue

@@ -280,7 +280,6 @@ export default defineComponent({
 
          if (props.searchable)
             searchInput.value.focus();
-
          else
             el.value.focus();
 

src/renderer/components/BaseTextEditor.vue

@@ -4,7 +4,11 @@
          :id="`editor-${id}`"
          class="editor"
          :class="editorClass"
-         :style="{height: `${height}px`}"
+         :style="{
+            height: `${height}px`,
+            width: width ? `${width}px` : null,
+            resize: resizable ? 'both' : 'none'
+         }"
       />
    </div>
 </template>
@@ -17,7 +21,7 @@ import 'ace-builds/webpack-resolver';
 
 import { uidGen } from 'common/libs/uidGen';
 import { storeToRefs } from 'pinia';
-import { onMounted, watch } from 'vue';
+import { PropType, onMounted, watch } from 'vue';
 
 import { useSettingsStore } from '@/stores/settings';
 
@@ -25,10 +29,12 @@ const props = defineProps({
    modelValue: String,
    mode: { type: String, default: 'text' },
    editorClass: { type: String, default: '' },
+   resizable: { type: Boolean, default: false },
    autoFocus: { type: Boolean, default: false },
    readOnly: { type: Boolean, default: false },
    showLineNumbers: { type: Boolean, default: true },
-   height: { type: Number, default: 200 }
+   height: { type: Number, default: 200 },
+   width: { type: [Number, Boolean] as PropType<number|false>, default: false }
 });
 const emit = defineEmits(['update:modelValue']);
 const settingsStore = useSettingsStore();
@@ -132,8 +138,10 @@ onMounted(() => {
 
 <style lang="scss" scoped>
 .editor-wrapper {
-  .editor {
-    width: 100%;
-  }
+   .editor {
+      width: 100%;
+      height: 100%;
+      max-width: 90vw;
+   }
 }
 </style>

src/renderer/components/BaseVirtualScroll.vue

@@ -54,7 +54,7 @@ const updateWindow = () => {
    const totalScrollHeight = props.items.length * props.itemHeight;
    const offset = 50;
 
-   const scrollTop = localScrollElement.value.scrollTop;
+   const scrollTop = localScrollElement.value?.scrollTop;
 
    const firstVisibleIndex = Math.floor(scrollTop / props.itemHeight);
    const lastVisibleIndex = firstVisibleIndex + visibleItemsCount;

src/renderer/components/FakerSelect.vue

@@ -113,7 +113,7 @@ const selectedGroup: Ref<string> = ref('manual');
 const selectedMethod: Ref<string> = ref('');
 const selectedValue: Ref<string> = ref('');
 const debounceTimeout: Ref<NodeJS.Timeout> = ref(null);
-const methodParams: Ref<{[key: string]: string}> = ref({});
+const methodParams: Ref<Record<string, string>> = ref({});
 const enumArray: Ref<string[]> = ref(null);
 
 const fakerGroups = computed(() => {

src/renderer/components/ModalAllConnections.vue

@@ -152,6 +152,14 @@
                                  />
                                  SSH
                               </div>
+                              <div v-if="connection.readonly" class="chip bg-success mt-2">
+                                 <BaseIcon
+                                    icon-name="mdiLock"
+                                    class="mr-1"
+                                    :size="18"
+                                 />
+                                 Read-only
+                              </div>
                            </div>
                         </div>
                      </div>
@@ -352,7 +360,7 @@ onBeforeUnmount(() => {
   outline: none;
 
   &:focus {
-    box-shadow: 0 0 3px 0.1rem rgba($primary-color, 80%);
+    box-shadow: 0 0 3px 0.1rem rgba(var(--primary-color), 80%);
   }
 
   &:hover {

src/renderer/components/ModalAskParameters.vue

@@ -73,7 +73,7 @@ const props = defineProps({
 const emit = defineEmits(['confirm', 'close']);
 
 const firstInput: Ref<HTMLInputElement[]> = ref(null);
-const values: Ref<{[key: string]: string}> = ref({});
+const values: Ref<Record<string, string>> = ref({});
 
 const inParameters = computed(() => {
    return props.localRoutine.parameters.filter(param => param.context === 'IN');

src/renderer/components/ModalConnectionAppearance.vue

@@ -204,7 +204,7 @@ onBeforeUnmount(() => {
          cursor: pointer;
 
          &.selected {
-            outline: 2px solid $primary-color;
+            outline: 2px solid var(--primary-color);
             border-radius: 8px;
          }
      }

src/renderer/components/ModalExportSchema.vue

@@ -327,7 +327,7 @@ const tables: Ref<{
 }[]> = ref([]);
 const options: Ref<Partial<ExportOptions>> = ref({
    schema: selectedSchema.value,
-   includes: {} as {[key: string]: boolean},
+   includes: {} as Record<string, boolean>,
    outputFormat: 'sql' as 'sql' | 'sql.zip',
    sqlInsertAfter: 250,
    sqlInsertDivider: 'bytes' as 'bytes' | 'rows'

src/renderer/components/ModalFakerRows.vue

@@ -142,7 +142,7 @@ const { getSelected: selectedWorkspace } = storeToRefs(workspacesStore);
 const { trapRef } = useFocusTrap({ disableAutofocus: true });
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-const localRow: Ref<{[key: string]: any}> = ref({});
+const localRow: Ref<Record<string, any>> = ref({});
 const fieldsToExclude = ref([]);
 const nInserts = ref(1);
 const isInserting = ref(false);
@@ -225,7 +225,7 @@ const insertRows = async () => {
          delete rowToInsert[key];
    });
 
-   const fieldTypes: {[key: string]: string} = {};
+   const fieldTypes: Record<string, string> = {};
    props.fields.forEach(field => {
       fieldTypes[field.name] = field.type;
    });
@@ -290,7 +290,7 @@ onMounted(() => {
       }
    }, 50);
 
-   const rowObj: {[key: string]: unknown} = {};
+   const rowObj: Record<string, unknown> = {};
 
    if (!props.rowToDuplicate) {
       // Set default values

src/renderer/components/ModalHistory.vue

@@ -75,7 +75,7 @@
                                     <code
                                        class="cut-text"
                                        :title="query.sql"
-                                       v-html="highlightWord(query.sql)"
+                                       v-html="highlight(highlightWord(query.sql), {html: true})"
                                     />
                                  </div>
                                  <div class="tile-bottom-content">
@@ -115,7 +115,7 @@
                      <BaseIcon icon-name="mdiHistory" :size="48" />
                   </div>
                   <p class="empty-title h5">
-                     {{ t('database.thereIsNoQueriesYet') }}
+                     {{ t('database.thereAreNoQueriesYet') }}
                   </p>
                </div>
             </div>
@@ -126,7 +126,19 @@
 
 <script setup lang="ts">
 import { ConnectionParams } from 'common/interfaces/antares';
-import { Component, computed, ComputedRef, onBeforeUnmount, onMounted, onUpdated, Prop, Ref, ref, watch } from 'vue';
+import { highlight } from 'sql-highlight';
+import {
+   Component,
+   computed,
+   ComputedRef,
+   onBeforeUnmount,
+   onMounted,
+   onUpdated,
+   Prop,
+   Ref,
+   ref,
+   watch
+} from 'vue';
 import { useI18n } from 'vue-i18n';
 
 import BaseIcon from '@/components/BaseIcon.vue';
@@ -163,7 +175,7 @@ const localSearchTerm = ref('');
 
 const connectionName = computed(() => getConnectionName(props.connection.uid));
 const history: ComputedRef<HistoryRecord[]> = computed(() => (getHistoryByWorkspace(props.connection.uid) || []));
-const filteredHistory = computed(() => history.value.filter(q => q.sql.toLowerCase().search(searchTerm.value.toLowerCase()) >= 0));
+const filteredHistory = computed(() => history.value.filter(q => q.sql.toLowerCase().search(localSearchTerm.value.toLowerCase()) >= 0));
 
 watch(searchTerm, () => {
    clearTimeout(searchTermInterval.value);
@@ -275,7 +287,7 @@ onBeforeUnmount(() => {
       max-width: 100%;
       display: inline-block;
       font-size: 100%;
-      // color: $primary-color;
+      // color: var(--primary-color);
       opacity: 0.8;
       font-weight: 600;
     }

src/renderer/components/ModalNoteEdit.vue

@@ -0,0 +1,124 @@
+<template>
+   <ConfirmModal
+      size="resize"
+      :disable-autofocus="true"
+      :close-on-confirm="!!localNote.note.length"
+      :confirm-text="t('general.save')"
+      @confirm="updateNote"
+      @hide="$emit('hide')"
+   >
+      <template #header>
+         <div class="d-flex">
+            <BaseIcon
+               icon-name="mdiNoteEditOutline"
+               class="mr-1"
+               :size="24"
+            /> {{ t('application.editNote') }}
+         </div>
+      </template>
+      <template #body>
+         <form class="form">
+            <div class="form-group columns">
+               <div class="column col-8">
+                  <label class="form-label">{{ t('connection.connection') }}</label>
+                  <BaseSelect
+                     v-model="localNote.cUid"
+                     class="form-select"
+                     :options="connectionOptions"
+                     option-track-by="code"
+                     option-label="name"
+                     @change="null"
+                  />
+               </div>
+               <div class="column col-4">
+                  <label class="form-label">{{ t('application.tag') }}</label>
+                  <BaseSelect
+                     v-model="localNote.type"
+                     class="form-select"
+                     :options="noteTags"
+                     option-track-by="code"
+                     option-label="name"
+                     @change="null"
+                  />
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label">{{ t('general.content') }} <small
+                  v-if="localNote.type !== 'query'"
+                  style="line-height: 1;"
+                  class="text-gray"
+               >({{ t('application.markdownSupported') }})</small></label>
+               <BaseTextEditor
+                  v-model="localNote.note"
+                  :mode="editorMode"
+                  :show-line-numbers="false"
+                  :auto-focus="true"
+                  :height="400"
+                  :width="640"
+                  :resizable="true"
+               />
+            </div>
+         </form>
+      </template>
+   </ConfirmModal>
+</template>
+
+<script lang="ts" setup>
+import { inject, onBeforeMount, PropType, Ref, ref, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+import ConfirmModal from '@/components/BaseConfirmModal.vue';
+import BaseIcon from '@/components/BaseIcon.vue';
+import BaseSelect from '@/components/BaseSelect.vue';
+import BaseTextEditor from '@/components/BaseTextEditor.vue';
+import { ConnectionNote, TagCode, useScratchpadStore } from '@/stores/scratchpad';
+
+const { t } = useI18n();
+const { editNote } = useScratchpadStore();
+
+const emit = defineEmits(['hide']);
+
+const props = defineProps({
+   note: {
+      type: Object as PropType<ConnectionNote>,
+      required: true
+   }
+});
+
+const noteTags = inject<{code: TagCode; name: string}[]>('noteTags');
+const connectionOptions = inject<{code: string; name: string}[]>('connectionOptions');
+
+const editorMode = ref('markdown');
+const localNote: Ref<ConnectionNote> = ref({
+   uid: 'dummy',
+   cUid: null,
+   title: undefined,
+   note: '',
+   date: new Date(),
+   type: 'note',
+   isArchived: false
+});
+
+const updateNote = () => {
+   if (localNote.value.note) {
+      if (!localNote.value.title)// Set a default title
+         localNote.value.title = `${localNote.value.type.toLocaleUpperCase()}: ${localNote.value.uid}`;
+
+      localNote.value.date = new Date();
+      editNote(localNote.value);
+      emit('hide');
+   }
+};
+
+watch(() => localNote.value.type, () => {
+   if (localNote.value.type === 'query')
+      editorMode.value = 'sql';
+   else
+      editorMode.value = 'markdown';
+});
+
+onBeforeMount(() => {
+   localNote.value = JSON.parse(JSON.stringify(props.note));
+});
+
+</script>

src/renderer/components/ModalNoteNew.vue

@@ -0,0 +1,122 @@
+<template>
+   <ConfirmModal
+      size="resize"
+      :disable-autofocus="true"
+      :close-on-confirm="!!newNote.note.length"
+      :confirm-text="t('general.save')"
+      @confirm="createNote"
+      @hide="$emit('hide')"
+   >
+      <template #header>
+         <div class="d-flex">
+            <BaseIcon
+               icon-name="mdiNotePlusOutline"
+               class="mr-1"
+               :size="24"
+            /> {{ t('application.addNote') }}
+         </div>
+      </template>
+      <template #body>
+         <form class="form">
+            <div class="form-group columns">
+               <div class="column col-8">
+                  <label class="form-label">{{ t('connection.connection') }}</label>
+                  <BaseSelect
+                     v-model="newNote.cUid"
+                     class="form-select"
+                     :options="connectionOptions"
+                     option-track-by="code"
+                     option-label="name"
+                     @change="null"
+                  />
+               </div>
+               <div class="column col-4">
+                  <label class="form-label">{{ t('application.tag') }}</label>
+                  <BaseSelect
+                     v-model="newNote.type"
+                     class="form-select"
+                     :options="noteTags"
+                     option-track-by="code"
+                     option-label="name"
+                     @change="null"
+                  />
+               </div>
+            </div>
+            <div class="form-group">
+               <label class="form-label">{{ t('general.content') }} <small
+                  v-if="newNote.type !== 'query'"
+                  style="line-height: 1;"
+                  class="text-gray"
+               >({{ t('application.markdownSupported') }})</small></label>
+               <BaseTextEditor
+                  v-model="newNote.note"
+                  :mode="editorMode"
+                  :show-line-numbers="false"
+                  :auto-focus="true"
+                  :height="400"
+                  :width="640"
+                  :resizable="true"
+               />
+            </div>
+         </form>
+      </template>
+   </ConfirmModal>
+</template>
+
+<script lang="ts" setup>
+import { uidGen } from 'common/libs/uidGen';
+import { inject, Ref, ref, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+import ConfirmModal from '@/components/BaseConfirmModal.vue';
+import BaseIcon from '@/components/BaseIcon.vue';
+import BaseSelect from '@/components/BaseSelect.vue';
+import BaseTextEditor from '@/components/BaseTextEditor.vue';
+import { ConnectionNote, TagCode, useScratchpadStore } from '@/stores/scratchpad';
+
+const { t } = useI18n();
+const { addNote } = useScratchpadStore();
+
+const emit = defineEmits(['hide']);
+
+const noteTags = inject<{code: TagCode; name: string}[]>('noteTags');
+const selectedConnection = inject<Ref<null | string>>('selectedConnection');
+const selectedTag = inject<Ref<TagCode>>('selectedTag');
+const connectionOptions = inject<{code: string; name: string}[]>('connectionOptions');
+
+const editorMode = ref('markdown');
+
+const newNote: Ref<ConnectionNote> = ref({
+   uid: uidGen('N'),
+   cUid: null,
+   title: undefined,
+   note: '',
+   date: new Date(),
+   type: 'note',
+   isArchived: false
+});
+
+const createNote = () => {
+   if (newNote.value.note) {
+      if (!newNote.value.title)// Set a default title
+         newNote.value.title = `${newNote.value.type.toLocaleUpperCase()}: ${newNote.value.uid}`;
+
+      newNote.value.date = new Date();
+      addNote(newNote.value);
+      emit('hide');
+   }
+};
+
+watch(() => newNote.value.type, () => {
+   if (newNote.value.type === 'query')
+      editorMode.value = 'sql';
+   else
+      editorMode.value = 'markdown';
+});
+
+newNote.value.cUid = selectedConnection.value;
+
+if (selectedTag.value !== 'all')
+   newNote.value.type = selectedTag.value;
+
+</script>

src/renderer/components/ModalProcessesListRow.vue

@@ -67,7 +67,7 @@ const props = defineProps({
 
 const emit = defineEmits(['select-row', 'contextmenu', 'stop-refresh']);
 
-const isInlineEditor: Ref<{[key: string]: boolean}> = ref({});
+const isInlineEditor: Ref<Record<string, boolean>> = ref({});
 const isInfoModal = ref(false);
 const editorMode = ref('sql');
 

src/renderer/components/ModalSettings.vue

@@ -166,19 +166,6 @@
                                     </label>
                                  </div>
                               </div>
-                              <div class="form-group column col-12 mb-0">
-                                 <div class="col-5 col-sm-12">
-                                    <label class="form-label">
-                                       {{ t('application.disableScratchpad') }}
-                                    </label>
-                                 </div>
-                                 <div class="col-3 col-sm-12">
-                                    <label class="form-switch d-inline-block" @click.prevent="toggleDisableScratchpad">
-                                       <input type="checkbox" :checked="disableScratchpad">
-                                       <i class="form-icon" />
-                                    </label>
-                                 </div>
-                              </div>
                               <div class="form-group column col-12">
                                  <div class="col-5 col-sm-12">
                                     <label class="form-label">
@@ -422,14 +409,6 @@
                               class="d-inline mr-1"
                               :size="16"
                            /> Mastodon</a> • <a
-                              class="c-hand"
-                              :style="'align-items: center; display: inline-flex;'"
-                              @click="openOutside('https://twitter.com/AntaresSQL')"
-                           ><BaseIcon
-                              icon-name="mdiTwitter"
-                              class="d-inline mr-1"
-                              :size="16"
-                           /> Twitter</a> • <a
                               class="c-hand"
                               :style="'align-items: center; display: inline-flex;'"
                               @click="openOutside('https://antares-sql.app/')"
@@ -499,7 +478,6 @@ const {
    restoreTabs,
    showTableSize,
    disableBlur,
-   disableScratchpad,
    applicationTheme,
    editorTheme,
    editorFontSize
@@ -512,7 +490,6 @@ const {
    changePageSize,
    changeRestoreTabs,
    changeDisableBlur,
-   changeDisableScratchpad,
    changeAutoComplete,
    changeLineWrap,
    changeExecuteSelected,
@@ -671,10 +648,6 @@ const toggleDisableBlur = () => {
    changeDisableBlur(!disableBlur.value);
 };
 
-const toggleDisableScratchpad = () => {
-   changeDisableScratchpad(!disableScratchpad.value);
-};
-
 const toggleAutoComplete = () => {
    changeAutoComplete(!selectedAutoComplete.value);
 };
@@ -730,7 +703,7 @@ onBeforeUnmount(() => {
 
           &.selected {
             img {
-              box-shadow: 0 0 0 3px $primary-color;
+              box-shadow: 0 0 0 3px var(--primary-color);
             }
           }
 
@@ -758,7 +731,7 @@ onBeforeUnmount(() => {
 
       .badge-update::after {
         bottom: initial;
-        background: $primary-color;
+        background: var(--primary-color);
       }
 
       .form-label {

src/renderer/components/QueryEditor.vue

@@ -409,7 +409,7 @@ defineExpose({ editor });
     position: absolute;
     left: 3px;
     top: 2px;
-    color: $primary-color;
+    color: var(--primary-color);
     display: inline-block;
     font: normal normal normal 24px/1 "Material Design Icons", sans-serif;
     font-size: inherit;

src/renderer/components/ScratchpadNote.vue

@@ -0,0 +1,352 @@
+<template>
+   <div
+      class="tile my-2"
+      tabindex="0"
+      @click="$emit('select-note', note.uid)"
+   >
+      <BaseIcon
+         v-if="isBig"
+         class="tile-compress c-hand"
+         :icon-name="isSelected ? 'mdiChevronUp' : 'mdiChevronDown'"
+         :size="36"
+         @click.stop="$emit('toggle-note', note.uid)"
+      />
+      <div class="tile-icon">
+         <BaseIcon
+            :icon-name="note.type === 'query'
+               ? 'mdiHeartOutline'
+               : note.type === 'todo'
+                  ? note.isArchived
+                     ? 'mdiCheckboxMarkedOutline'
+                     : 'mdiCheckboxBlankOutline'
+                  : 'mdiNoteEditOutline'"
+            :size="36"
+         />
+         <div class="tile-icon-type">
+            {{ note.type }}
+         </div>
+      </div>
+      <div class="tile-content">
+         <div class="tile-content-message" :class="[{'opened': isSelected}]">
+            <code
+               v-if="note.type === 'query'"
+               ref="noteParagraph"
+               class="tile-paragraph sql"
+               v-html="highlight(highlightWord(note.note), {html: true})"
+            />
+            <div
+               v-else
+               ref="noteParagraph"
+               class="tile-paragraph"
+               v-html="parseMarkdown(highlightWord(note.note))"
+            />
+            <div v-if="isBig && !isSelected" class="tile-paragraph-overlay" />
+         </div>
+         <div class="tile-bottom-content">
+            <small class="tile-subtitle">{{ getConnectionName(note.cUid) || t('general.all') }} · {{ formatDate(note.date) }}</small>
+            <div class="tile-history-buttons">
+               <button
+                  v-if="note.type === 'todo' && !note.isArchived"
+                  class="btn btn-link pl-1"
+                  @click.stop="$emit('archive-note', note.uid)"
+               >
+                  <BaseIcon
+                     icon-name="mdiCheck"
+                     class="pr-1"
+                     :size="22"
+                  /> {{ t('general.archive') }}
+               </button>
+               <button
+                  v-if="note.type === 'todo' && note.isArchived"
+                  class="btn btn-link pl-1"
+                  @click.stop="$emit('restore-note', note.uid)"
+               >
+                  <BaseIcon
+                     icon-name="mdiRestore"
+                     class="pr-1"
+                     :size="22"
+                  /> {{ t('general.undo') }}
+               </button>
+               <button
+                  v-if="note.type === 'query'"
+                  class="btn btn-link pl-1"
+                  @click.stop="$emit('select-query', note.note)"
+               >
+                  <BaseIcon
+                     icon-name="mdiOpenInApp"
+                     class="pr-1"
+                     :size="22"
+                  /> {{ t('general.select') }}
+               </button>
+               <button
+                  v-if="note.type === 'query'"
+                  class="btn btn-link pl-1"
+                  @click.stop="copyText(note.note)"
+               >
+                  <BaseIcon
+                     icon-name="mdiContentCopy"
+                     class="pr-1"
+                     :size="22"
+                  /> {{ t('general.copy') }}
+               </button>
+               <button
+                  v-if=" !note.isArchived"
+                  class="btn btn-link pl-1"
+                  @click.stop="$emit('edit-note')"
+               >
+                  <BaseIcon
+                     icon-name="mdiPencil"
+                     class="pr-1"
+                     :size="22"
+                  /> {{ t('general.edit') }}
+               </button>
+               <button class="btn btn-link pl-1" @click.stop="$emit('delete-note', note.uid)">
+                  <BaseIcon
+                     icon-name="mdiDeleteForever"
+                     class="pr-1"
+                     :size="22"
+                  /> {{ t('general.delete') }}
+               </button>
+            </div>
+         </div>
+      </div>
+   </div>
+</template>
+<script setup lang="ts">
+import { useElementBounding } from '@vueuse/core';
+import { marked } from 'marked';
+import { highlight } from 'sql-highlight';
+import { computed, PropType, Ref, ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+import BaseIcon from '@/components/BaseIcon.vue';
+import { useFilters } from '@/composables/useFilters';
+import { copyText } from '@/libs/copyText';
+import { useConnectionsStore } from '@/stores/connections';
+import { ConnectionNote } from '@/stores/scratchpad';
+
+const props = defineProps({
+   note: {
+      type: Object as PropType<ConnectionNote>,
+      required: true
+   },
+   searchTerm: {
+      type: String,
+      default: () => ''
+   },
+   selectedNote: {
+      type: String,
+      default: () => ''
+   }
+});
+
+const { t } = useI18n();
+const { formatDate } = useFilters();
+const { getConnectionName } = useConnectionsStore();
+
+defineEmits([
+   'edit-note',
+   'delete-note',
+   'select-note',
+   'toggle-note',
+   'archive-note',
+   'restore-note',
+   'select-query'
+]);
+
+const noteParagraph: Ref<HTMLDivElement> = ref(null);
+const noteHeight = ref(useElementBounding(noteParagraph)?.height);
+
+const isSelected = computed(() => props.selectedNote === props.note.uid);
+const isBig = computed(() => noteHeight.value > 75);
+
+const parseMarkdown = (text: string) => {
+   const renderer = {
+      listitem (text: string) {
+         return `<li>${text.replace(/ *\([^)]*\) */g, '')}</li>`;
+      },
+      link (href: string, title: string, text: string) {
+         return `<a>${text}</a>`;
+      }
+   };
+
+   marked.use({ renderer });
+
+   return marked(text);
+};
+
+const highlightWord = (string: string) => {
+   string = string.replaceAll('<', '&lt;').replaceAll('>', '&gt;');
+
+   if (props.searchTerm) {
+      const regexp = new RegExp(`(${props.searchTerm.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')})`, 'gi');
+      return string.replace(regexp, '<span class="text-primary text-bold">$1</span>');
+   }
+   else
+      return string;
+};
+</script>
+<style scoped lang="scss">
+.tile {
+   border-radius: $border-radius;
+   display: flex;
+   position: relative;
+   transition: none;
+
+   &:hover,
+   &:focus {
+     .tile-content {
+       .tile-bottom-content {
+         .tile-history-buttons {
+           opacity: 1;
+         }
+       }
+     }
+   }
+
+   .tile-compress {
+      position: absolute;
+      right: 2px;
+      top: 0px;
+      opacity: .7;
+      z-index: 2;
+   }
+
+   .tile-icon {
+     font-size: 1.2rem;
+     margin-left: 0.3rem;
+     margin-right: 0.3rem;
+     margin-top: 0.6rem;
+     width: 40px;
+     display: flex;
+     align-items: center;
+     flex-direction: column;
+     justify-content: center;
+     opacity: .8;
+
+     .tile-icon-type {
+       text-transform: uppercase;
+       font-size: .5rem;
+     }
+   }
+
+   .tile-content {
+     padding: 0.3rem;
+     padding-left: 0.1rem;
+     min-height: 75px;
+     display: flex;
+     flex-direction: column;
+     justify-content: space-between;
+
+     .tile-content-message{
+         position: relative;
+
+         &:not(.opened) {
+            max-height: 36px;
+            overflow: hidden;
+         }
+
+         .tile-paragraph-overlay {
+            height: 36px;
+            width: 100%;
+            position: absolute;
+            top: 0;
+         }
+     }
+
+     code, pre {
+       max-width: 100%;
+       width: 100%;
+       display: inline-block;
+       font-size: 100%;
+       opacity: 0.8;
+       font-weight: 600;
+       white-space: break-spaces;
+     }
+
+     .tile-subtitle {
+       opacity: 0.8;
+     }
+
+     .tile-bottom-content {
+       display: flex;
+       justify-content: space-between;
+
+       .tile-history-buttons {
+          opacity: 0;
+          transition: opacity 0.2s;
+
+          button {
+             font-size: 0.7rem;
+             height: 1rem;
+             line-height: 1rem;
+             display: inline-flex;
+             align-items: center;
+             justify-content: center;
+          }
+       }
+     }
+   }
+ }
+
+ .theme-dark {
+   .tile {
+      .tile-paragraph-overlay {
+         background-image: linear-gradient(
+            to bottom,
+            rgba(255,0,0,0) 70%,
+            $body-bg-dark);
+      }
+
+      &:focus {
+         .tile-paragraph-overlay {
+            background-image: linear-gradient(
+               to bottom,
+               rgba(255,0,0,0)70%,
+               #323232);
+         }
+      }
+
+      &:hover{
+         .tile-paragraph-overlay {
+            background-image: linear-gradient(
+               to bottom,
+               rgba(255,0,0,0) 70%,
+               $bg-color-light-dark);
+         }
+      }
+   }
+ }
+
+ .theme-light {
+   .tile {
+      .tile-paragraph-overlay {
+         background-image: linear-gradient(
+            to bottom,
+            rgba(255,0,0,0) 70%,
+            #FFFF);
+      }
+
+      &:hover,
+      &:focus {
+         .tile-paragraph-overlay {
+            background-image: linear-gradient(
+               to bottom,
+               rgba(255,0,0,0) 70%,
+               $bg-color-light-gray);
+         }
+      }
+   }
+ }
+ </style>
+ <style lang="scss">
+ .tile-paragraph {
+   white-space: initial;
+   word-break: break-word;
+   user-select: text;
+
+    h1, h2, h3, h4, h5, h6, p, li {
+       margin: 0;
+    }
+ }
+ </style>

src/renderer/components/SettingBarContext.vue

@@ -15,6 +15,56 @@
                :size="18"
             /> {{ t('connection.disconnect') }}</span>
       </div>
+      <div v-if="!contextConnection.isFolder" class="context-element">
+         <span class="d-flex">
+            <BaseIcon
+               class="text-light mt-1 mr-1"
+               icon-name="mdiFolderMove"
+               :size="18"
+            /> {{ t('general.moveTo') }}</span>
+         <BaseIcon
+            class="text-light ml-1"
+            icon-name="mdiChevronRight"
+            :size="18"
+         />
+         <div class="context-submenu">
+            <div class="context-element" @click.stop="moveToFolder(null)">
+               <span class="d-flex">
+                  <BaseIcon
+                     class="text-light mt-1 mr-1"
+                     icon-name="mdiFolderPlus"
+                     :size="18"
+                  /> {{ t('application.newFolder') }}</span>
+            </div>
+            <div
+               v-for="folder in filteredFolders"
+               :key="folder.uid"
+               class="context-element"
+               @click.stop="moveToFolder(folder.uid)"
+            >
+               <span class="d-flex">
+                  <BaseIcon
+                     class="text-light mt-1 mr-1"
+                     icon-name="mdiFolder"
+                     :size="18"
+                     :style="`color: ${folder.color}!important`"
+                  /> {{ folder.name || t('general.folder') }}</span>
+            </div>
+
+            <div
+               v-if="isInFolder"
+               class="context-element"
+               @click="outOfFolder"
+            >
+               <span class="d-flex">
+                  <BaseIcon
+                     class="text-light mt-1 mr-1"
+                     icon-name="mdiFolderOff"
+                     :size="18"
+                  /> {{ t('application.outOfFolder') }}</span>
+            </div>
+         </div>
+      </div>
       <div class="context-element" @click.stop="showAppearanceModal">
          <span class="d-flex">
             <BaseIcon
@@ -79,6 +129,7 @@
 
 <script setup lang="ts">
 import { uidGen } from 'common/libs/uidGen';
+import { storeToRefs } from 'pinia';
 import { computed, Prop, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 
@@ -98,9 +149,14 @@ const {
    getConnectionByUid,
    getConnectionName,
    addConnection,
-   deleteConnection
+   deleteConnection,
+   addFolder,
+   addToFolder,
+   removeFromFolders
 } = connectionsStore;
 
+const { getFolders: folders } = storeToRefs(connectionsStore);
+
 const workspacesStore = useWorkspacesStore();
 
 const {
@@ -121,6 +177,8 @@ const isConnectionEdit = ref(false);
 
 const connectionName = computed(() => props.contextConnection.name || getConnectionName(props.contextConnection.uid) || t('general.folder', 1));
 const isConnected = computed(() => getWorkspace(props.contextConnection.uid)?.connectionStatus === 'connected');
+const filteredFolders = computed(() => folders.value.filter(f => !f.connections.includes(props.contextConnection.uid)));
+const isInFolder = computed(() => folders.value.some(f => f.connections.includes(props.contextConnection.uid)));
 
 const confirmDeleteConnection = () => {
    if (isConnected.value)
@@ -129,6 +187,27 @@ const confirmDeleteConnection = () => {
    closeContext();
 };
 
+const moveToFolder = (folderUid?: string) => {
+   if (!folderUid) {
+      addFolder({
+         connections: [props.contextConnection.uid]
+      });
+   }
+   else {
+      addToFolder({
+         folder: folderUid,
+         connection: props.contextConnection.uid
+      });
+   }
+
+   closeContext();
+};
+
+const outOfFolder = () => {
+   removeFromFolders(props.contextConnection.uid);
+   closeContext();
+};
+
 const duplicateConnection = () => {
    let connectionCopy = getConnectionByUid(props.contextConnection.uid);
    connectionCopy = {

src/renderer/components/TheFooter.vue

@@ -1,8 +1,8 @@
 <template>
    <div
       id="footer"
-      :class="[lightColors.includes(footerColor) ? 'text-dark' : 'text-light']"
-      :style="`background-color: ${footerColor};`"
+      :class="[lightColors.includes(accentColor) ? 'text-dark' : 'text-light']"
+      :style="`background-color: ${accentColor};`"
    >
       <div class="footer-left-elements">
          <ul class="footer-elements">
@@ -85,10 +85,11 @@
 <script setup lang="ts">
 import { shell } from 'electron';
 import { storeToRefs } from 'pinia';
-import { computed, ComputedRef } from 'vue';
+import { computed, ComputedRef, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 
 import BaseIcon from '@/components/BaseIcon.vue';
+import { hexToRGBA } from '@/libs/hexToRgba';
 import { useApplicationStore } from '@/stores/application';
 import { useConnectionsStore } from '@/stores/connections';
 import { useConsoleStore } from '@/stores/console';
@@ -117,7 +118,11 @@ const { getWorkspace } = workspacesStore;
 const { getConnectionFolder, getConnectionByUid } = connectionsStore;
 
 const workspace = computed(() => getWorkspace(workspaceUid.value));
-const footerColor = computed(() => getConnectionFolder(workspaceUid.value)?.color || '#E36929');
+const accentColor = computed(() => {
+   if (getConnectionFolder(workspaceUid.value)?.color)
+      return getConnectionFolder(workspaceUid.value).color;
+   return '#E36929';
+});
 const connectionInfos = computed(() => getConnectionByUid(workspaceUid.value));
 const version: ComputedRef<DatabaseInfos> = computed(() => {
    return getWorkspace(workspaceUid.value) ? workspace.value.version : null;
@@ -129,7 +134,17 @@ const versionString = computed(() => {
    return '';
 });
 
+watch(accentColor, () => {
+   changeAccentColor();
+});
+
 const openOutside = (link: string) => shell.openExternal(link);
+const changeAccentColor = () => {
+   document.querySelector<HTMLBodyElement>(':root').style.setProperty('--primary-color', accentColor.value);
+   document.querySelector<HTMLBodyElement>(':root').style.setProperty('--primary-color-shadow', hexToRGBA(accentColor.value, 0.2));
+};
+
+changeAccentColor();
 </script>
 
 <style lang="scss">

src/renderer/components/TheNotificationsBoard.vue

@@ -32,7 +32,7 @@ const { removeNotification } = notificationsStore;
 const { notifications } = storeToRefs(notificationsStore);
 const { notificationsTimeout } = storeToRefs(settingsStore);
 
-const timeouts: Ref<{[key: string]: NodeJS.Timeout}> = ref({});
+const timeouts: Ref<Record<string, NodeJS.Timeout>> = ref({});
 
 const latestNotifications = computed(() => notifications.value.slice(0, 10));
 

src/renderer/components/TheScratchpad.vue

@@ -1,66 +1,368 @@
 <template>
-   <ConfirmModal
-      :confirm-text="t('application.update')"
-      :cancel-text="t('general.close')"
-      size="large"
-      :hide-footer="true"
-      @hide="hideScratchpad"
-   >
-      <template #header>
-         <div class="d-flex">
-            <BaseIcon
-               icon-name="mdiNotebookEditOutline"
-               class="mr-1"
-               :size="24"
-            /> {{ t('application.scratchpad') }}
-         </div>
-      </template>
-      <template #body>
-         <div>
-            <div>
-               <TextEditor
-                  v-model="localNotes"
-                  editor-class="textarea-editor"
-                  mode="markdown"
-                  :auto-focus="true"
-                  :show-line-numbers="false"
-               />
+   <Teleport to="#window-content">
+      <div class="modal active">
+         <a class="modal-overlay" @click.stop="hideScratchpad" />
+         <div ref="trapRef" class="modal-container p-0 pb-4">
+            <div class="modal-header pl-2">
+               <div class="modal-title h6">
+                  <div class="d-flex">
+                     <BaseIcon
+                        icon-name="mdiNotebookOutline"
+                        class="mr-1"
+                        :size="24"
+                     />
+                     <span>{{ t('application.note', 2) }}</span>
+                  </div>
+               </div>
+               <a class="btn btn-clear c-hand" @click.stop="hideScratchpad" />
+            </div>
+            <div class="modal-body p-0 workspace-query-results">
+               <div
+                  ref="noteFilters"
+                  class="d-flex p-vcentered p-2"
+                  style="gap: 0 10px"
+               >
+                  <div style="flex: 1;">
+                     <BaseSelect
+                        v-model="localConnection"
+                        class="form-select"
+                        :options="connectionOptions"
+                        option-track-by="code"
+                        option-label="name"
+                        @change="null"
+                     />
+                  </div>
+                  <div class="btn-group btn-group-block text-uppercase">
+                     <div
+                        v-for="tag in [{ code: 'all', name: t('general.all') }, ...noteTags]"
+                        :key="tag.code"
+                        class="btn"
+                        :class="[selectedTag === tag.code ? 'btn-primary': 'btn-dark']"
+                        @click="setTag(tag.code)"
+                     >
+                        {{ tag.name }}
+                     </div>
+                  </div>
+                  <div class="">
+                     <div
+                        class="btn px-1 tooltip tooltip-left s-rounded archived-button"
+                        :class="[showArchived ? 'btn-primary' : 'btn-link']"
+                        :data-tooltip="showArchived ? t('application.hideArchivedNotes') : t('application.showArchivedNotes')"
+                        @click="showArchived = !showArchived"
+                     >
+                        <BaseIcon
+                           :icon-name="!showArchived ? 'mdiArchiveEyeOutline' : 'mdiArchiveCancelOutline'"
+                           class=""
+                           :size="24"
+                        />
+                     </div>
+                  </div>
+               </div>
+               <div>
+                  <div
+                     v-show="filteredNotes.length || searchTerm.length"
+                     ref="searchForm"
+                     class="form-group has-icon-right m-0 p-2"
+                  >
+                     <input
+                        v-model="searchTerm"
+                        class="form-input"
+                        type="text"
+                        :placeholder="t('general.search')"
+                     >
+                     <BaseIcon
+                        v-if="!searchTerm"
+                        icon-name="mdiMagnify"
+                        class="form-icon pr-2"
+                        :size="18"
+                     />
+                     <BaseIcon
+                        v-else
+                        icon-name="mdiBackspace"
+                        class="form-icon c-hand pr-2"
+                        :size="18"
+                        @click="searchTerm = ''"
+                     />
+                  </div>
+               </div>
+
+               <div
+                  v-if="filteredNotes.length"
+                  ref="tableWrapper"
+                  class="vscroll px-2"
+                  :style="{'height': resultsSize+'px'}"
+               >
+                  <div ref="table">
+                     <BaseVirtualScroll
+                        ref="resultTable"
+                        :items="filteredNotes"
+                        :item-height="83"
+                        :visible-height="resultsSize"
+                        :scroll-element="scrollElement"
+                     >
+                        <template #default="{ items }">
+                           <ScratchpadNote
+                              v-for="note in items"
+                              :key="note.uid"
+                              :search-term="searchTerm"
+                              :note="note"
+                              :selected-note="selectedNote"
+                              @select-note="selectedNote = note.uid"
+                              @toggle-note="toggleNote"
+                              @edit-note="startEditNote(note)"
+                              @delete-note="deleteNote"
+                              @archive-note="archiveNote"
+                              @restore-note="restoreNote"
+                              @select-query="selectQuery"
+                           />
+                        </template>
+                     </BaseVirtualScroll>
+                  </div>
+               </div>
+               <div v-else class="empty">
+                  <div class="empty-icon">
+                     <BaseIcon icon-name="mdiNoteSearch" :size="48" />
+                  </div>
+                  <p class="empty-title h5">
+                     {{ t('application.thereAreNoNotesYet') }}
+                  </p>
+               </div>
+               <div
+                  class="btn btn-primary p-0 add-button tooltip tooltip-left"
+                  :data-tooltip="t('application.addNote')"
+                  @click="isAddModal = true"
+               >
+                  <BaseIcon
+                     icon-name="mdiPlus"
+                     :size="48"
+                  />
+               </div>
             </div>
-            <small class="text-gray">{{ t('application.markdownSupported') }}</small>
          </div>
-      </template>
-   </ConfirmModal>
+      </div>
+   </Teleport>
+   <ModalNoteNew v-if="isAddModal" @hide="isAddModal = false" />
+   <ModalNoteEdit
+      v-if="isEditModal"
+      :note="noteToEdit"
+      @hide="closeEditModal"
+   />
 </template>
 
 <script setup lang="ts">
 import { storeToRefs } from 'pinia';
-import { Ref, ref, watch } from 'vue';
+import {
+   Component,
+   computed,
+   ComputedRef,
+   onBeforeUnmount,
+   onMounted,
+   onUpdated,
+   provide,
+   Ref,
+   ref,
+   watch
+} from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import ConfirmModal from '@/components/BaseConfirmModal.vue';
 import BaseIcon from '@/components/BaseIcon.vue';
-import TextEditor from '@/components/BaseTextEditor.vue';
+import BaseSelect from '@/components/BaseSelect.vue';
+import BaseVirtualScroll from '@/components/BaseVirtualScroll.vue';
+import ModalNoteEdit from '@/components/ModalNoteEdit.vue';
+import ModalNoteNew from '@/components/ModalNoteNew.vue';
+import ScratchpadNote from '@/components/ScratchpadNote.vue';
 import { useApplicationStore } from '@/stores/application';
-import { useScratchpadStore } from '@/stores/scratchpad';
+import { useConnectionsStore } from '@/stores/connections';
+import { ConnectionNote, TagCode, useScratchpadStore } from '@/stores/scratchpad';
+import { useWorkspacesStore } from '@/stores/workspaces';
 
 const { t } = useI18n();
 
 const applicationStore = useApplicationStore();
 const scratchpadStore = useScratchpadStore();
+const workspacesStore = useWorkspacesStore();
 
-const { notes } = storeToRefs(scratchpadStore);
+const { connectionNotes, selectedTag } = storeToRefs(scratchpadStore);
 const { changeNotes } = scratchpadStore;
 const { hideScratchpad } = applicationStore;
+const { getConnectionName } = useConnectionsStore();
+const { connections } = storeToRefs(useConnectionsStore());
+const { getSelected: selectedWorkspace } = storeToRefs(workspacesStore);
+const { getWorkspaceTab, getWorkspace, newTab, updateTabContent } = workspacesStore;
 
-const localNotes = ref(notes.value);
-const debounceTimeout: Ref<NodeJS.Timeout> = ref(null);
+const localConnection = ref(null);
+const table: Ref<HTMLDivElement> = ref(null);
+const resultTable: Ref<Component & { updateWindow: () => void }> = ref(null);
+const tableWrapper: Ref<HTMLDivElement> = ref(null);
+const noteFilters: Ref<HTMLInputElement> = ref(null);
+const searchForm: Ref<HTMLInputElement> = ref(null);
+const resultsSize = ref(1000);
+const searchTermInterval: Ref<NodeJS.Timeout> = ref(null);
+const scrollElement: Ref<HTMLDivElement> = ref(null);
+const searchTerm = ref('');
+const localSearchTerm = ref('');
+const showArchived = ref(false);
+const isAddModal = ref(false);
+const isEditModal = ref(false);
+const noteToEdit: Ref<ConnectionNote> = ref(null);
+const selectedNote = ref(null);
 
-watch(localNotes, () => {
-   clearTimeout(debounceTimeout.value);
+const noteTags: ComputedRef<{code: TagCode; name: string}[]> = computed(() => [
+   { code: 'note', name: t('application.note') },
+   { code: 'todo', name: 'TODO' },
+   { code: 'query', name: 'Query' }
+]);
+const filteredNotes = computed(() => connectionNotes.value.filter(n => (
+   (n.type === selectedTag.value || selectedTag.value === 'all') &&
+   (n.cUid === localConnection.value || localConnection.value === null) &&
+   (!n.isArchived || showArchived.value) &&
+   (n.note.toLowerCase().search(localSearchTerm.value.toLowerCase()) >= 0)
+)));
+const connectionOptions = computed(() => {
+   return [
+      { code: null, name: t('general.all') },
+      ...connections.value.map(c => ({ code: c.uid, name: getConnectionName(c.uid) }))
+   ];
+});
 
-   debounceTimeout.value = setTimeout(() => {
-      changeNotes(localNotes.value);
+provide('noteTags', noteTags);
+provide('connectionOptions', connectionOptions);
+provide('selectedConnection', localConnection);
+provide('selectedTag', selectedTag);
+
+const resizeResults = () => {
+   if (resultTable.value) {
+      const el = tableWrapper.value.parentElement;
+
+      if (el)
+         resultsSize.value = el.offsetHeight - searchForm.value.offsetHeight - noteFilters.value.offsetHeight;
+
+      resultTable.value.updateWindow();
+   }
+};
+
+const refreshScroller = () => resizeResults();
+
+const setTag = (tag: string) => {
+   selectedTag.value = tag;
+};
+
+const toggleNote = (uid: string) => {
+   selectedNote.value = selectedNote.value !== uid ? uid : null;
+};
+
+const startEditNote = (note: ConnectionNote) => {
+   isEditModal.value = true;
+   noteToEdit.value = note;
+};
+
+const archiveNote = (uid: string) => {
+   const remappedNotes = connectionNotes.value.map(n => {
+      if (n.uid === uid)
+         n.isArchived = true;
+      return n;
+   });
+   changeNotes(remappedNotes);
+};
+
+const restoreNote = (uid: string) => {
+   const remappedNotes = connectionNotes.value.map(n => {
+      if (n.uid === uid)
+         n.isArchived = false;
+      return n;
+   });
+   changeNotes(remappedNotes);
+};
+
+const deleteNote = (uid: string) => {
+   const otherNotes = connectionNotes.value.filter(n => n.uid !== uid);
+   changeNotes(otherNotes);
+};
+
+const selectQuery = (query: string) => {
+   const workspace = getWorkspace(selectedWorkspace.value);
+   const selectedTab = getWorkspaceTab(workspace.selectedTab);
+
+   if (workspace.connectionStatus !== 'connected') return;
+
+   if (selectedTab.type === 'query') {
+      updateTabContent({
+         tab: selectedTab.uid,
+         uid: selectedWorkspace.value,
+         type: 'query',
+         content: query,
+         schema: workspace.breadcrumbs.schema
+      });
+   }
+   else {
+      newTab({
+         uid: selectedWorkspace.value,
+         type: 'query',
+         content: query,
+         autorun: false,
+         schema: workspace.breadcrumbs.schema
+      });
+   }
+
+   hideScratchpad();
+};
+
+const closeEditModal = () => {
+   isEditModal.value = false;
+   noteToEdit.value = null;
+};
+
+watch(searchTerm, () => {
+   clearTimeout(searchTermInterval.value);
+
+   searchTermInterval.value = setTimeout(() => {
+      localSearchTerm.value = searchTerm.value;
    }, 200);
 });
 
+onUpdated(() => {
+   if (table.value)
+      refreshScroller();
+
+   if (tableWrapper.value)
+      scrollElement.value = tableWrapper.value;
+});
+
+onMounted(() => {
+   resizeResults();
+   window.addEventListener('resize', resizeResults);
+
+   if (selectedWorkspace.value && selectedWorkspace.value !== 'NEW')
+      localConnection.value = selectedWorkspace.value;
+});
+
+onBeforeUnmount(() => {
+   window.removeEventListener('resize', resizeResults);
+   clearInterval(searchTermInterval.value);
+});
+
 </script>
+
+<style lang="scss" scoped>
+.vscroll {
+  height: 1000px;
+  overflow: auto;
+  overflow-anchor: none;
+}
+
+.add-button{
+   border: none;
+   height: 48px;
+   width: 48px;
+   border-radius: 50%;
+   position: fixed;
+   margin-top: -40px;
+   margin-left: 580px;
+   z-index: 9;
+}
+.archived-button {
+   border-radius: 50%;
+   width: 36px;
+   height: 36px;
+}
+</style>

src/renderer/components/TheSettingBar.vue

@@ -59,17 +59,16 @@
       <div class="settingbar-bottom-elements">
          <ul class="settingbar-elements">
             <li
-               v-if="!disableScratchpad"
                v-tooltip="{
                   strategy: 'fixed',
                   placement: 'right',
-                  content: t('application.scratchpad')
+                  content: t('application.note', 2)
                }"
                class="settingbar-element btn btn-link"
-               @click="showScratchpad"
+               @click="showScratchpad()"
             >
                <BaseIcon
-                  icon-name="mdiNotebookEditOutline"
+                  icon-name="mdiNotebookOutline"
                   class="settingbar-element-icon text-light"
                   :size="24"
                />
@@ -84,12 +83,15 @@
                @click="showSettingModal('general')"
             >
                <div class="settingbar-element-icon-wrapper">
-                  <BaseIcon
-                     icon-name="mdiCog"
+                  <div
                      class="settingbar-element-icon text-light"
                      :class="{ 'badge badge-update': hasUpdates }"
-                     :size="24"
-                  />
+                  >
+                     <BaseIcon
+                        icon-name="mdiCog"
+                        :size="24"
+                     />
+                  </div>
                </div>
             </li>
          </ul>
@@ -108,7 +110,6 @@ import SettingBarConnections from '@/components/SettingBarConnections.vue';
 import SettingBarContext from '@/components/SettingBarContext.vue';
 import { useApplicationStore } from '@/stores/application';
 import { SidebarElement, useConnectionsStore } from '@/stores/connections';
-import { useSettingsStore } from '@/stores/settings';
 import { useWorkspacesStore } from '@/stores/workspaces';
 
 const { t } = useI18n();
@@ -117,12 +118,10 @@ localStorage.setItem('opened-folders', '[]');
 const applicationStore = useApplicationStore();
 const connectionsStore = useConnectionsStore();
 const workspacesStore = useWorkspacesStore();
-const settingsStore = useSettingsStore();
 
 const { updateStatus } = storeToRefs(applicationStore);
 const { getSelected: selectedWorkspace } = storeToRefs(workspacesStore);
 const { connectionsOrder } = storeToRefs(connectionsStore);
-const { disableScratchpad } = storeToRefs(settingsStore);
 
 const { showSettingModal, showScratchpad } = applicationStore;
 const { updateConnectionsOrder, initConnectionsOrder } = connectionsStore;
@@ -187,7 +186,7 @@ if (!connectionsArr.value.length)
    .settingbar-top-elements {
       overflow-x: hidden;
       overflow-y: overlay;
-      // max-height: calc((100vh - 3.5rem) - #{$excluding-size});
+      width: 100%;
 
       &::-webkit-scrollbar {
          width: 3px;
@@ -234,6 +233,7 @@ if (!connectionsArr.value.length)
          border-radius: 0;
          padding: 0;
          position: relative;
+         border: none;
 
          &:hover {
             opacity: 1;
@@ -266,7 +266,7 @@ if (!connectionsArr.value.length)
             .settingbar-element-icon {
                &.badge::after {
                   top: 10px;
-                  right: -6px;
+                  right: -3px;
                   position: absolute;
                }
 

src/renderer/components/TheTitleBar.vue

@@ -21,7 +21,7 @@
             class="titlebar-element"
             @click="openDevTools"
          >
-            <BaseIcon icon-name="mdiCodeTags" :size="24" />
+            <BaseIcon icon-name="mdiBugPlayOutline" :size="24" />
          </div>
          <div
             v-if="isDevelopment"

src/renderer/components/Workspace.vue

@@ -42,11 +42,11 @@
                   >
                      <BaseIcon
                         class="mt-1 mr-1"
-                        icon-name="mdiCodeTags"
+                        :icon-name="element.filePath ? 'mdiFileCodeOutline' : 'mdiCodeTags'"
                         :size="18"
                      />
                      <span>
-                        <span>{{ cutText(element.content || 'Query', 20, true) }} #{{ element.index }}</span>
+                        <span>{{ cutText(element.elementName || element.content || 'Query', 20, true) }} #{{ element.index }}</span>
                         <span
                            class="btn btn-clear"
                            :title="t('general.close')"
@@ -695,7 +695,7 @@ const openAsPermanentTab = (tab: WorkspaceTab) => {
       routine: 'routine-props',
       procedure: 'routine-props',
       scheduler: 'scheduler-props'
-   } as {[key: string]: string};
+   } as Record<string, string>;
 
    newTab({
       uid: props.connection.uid,

src/renderer/components/WorkspaceAddConnectionPanel.vue

@@ -163,22 +163,30 @@
                            >
                         </div>
                      </div>
-                     <div v-if="clientCustomizations.readOnlyMode" class="form-group columns">
+                     <div v-if="clientCustomizations.readOnlyMode" class="form-group columns mb-0">
                         <div class="column col-5 col-sm-12" />
                         <div class="column col-7 col-sm-12">
-                           <label class="form-checkbox form-inline">
+                           <label class="form-checkbox form-inline my-0">
                               <input v-model="connection.readonly" type="checkbox"><i class="form-icon" /> {{ t('connection.readOnlyMode') }}
                            </label>
                         </div>
                      </div>
-                     <div v-if="!clientCustomizations.fileConnection" class="form-group columns">
+                     <div v-if="!clientCustomizations.fileConnection" class="form-group columns mb-0">
                         <div class="column col-5 col-sm-12" />
                         <div class="column col-7 col-sm-12">
-                           <label class="form-checkbox form-inline">
+                           <label class="form-checkbox form-inline my-0">
                               <input v-model="connection.ask" type="checkbox"><i class="form-icon" /> {{ t('connection.askCredentials') }}
                            </label>
                         </div>
                      </div>
+                     <div v-if="clientCustomizations.singleConnectionMode" class="form-group columns mb-0">
+                        <div class="column col-5 col-sm-12" />
+                        <div class="column col-7 col-sm-12">
+                           <label class="form-checkbox form-inline my-0">
+                              <input v-model="connection.singleConnectionMode" type="checkbox"><i class="form-icon" /> {{ t('connection.singleConnection') }}
+                           </label>
+                        </div>
+                     </div>
                   </fieldset>
                </form>
             </div>
@@ -572,11 +580,11 @@ const pathSelection = (event: Event & {target: {files: {path: string}[]}}, name:
    const { files } = event.target;
    if (!files.length) return;
 
-   (connection.value as unknown as {[key: string]: string})[name] = files[0].path as string;
+   (connection.value as unknown as Record<string, string>)[name] = files[0].path as string;
 };
 
 const pathClear = (name: keyof ConnectionParams) => {
-   (connection.value as unknown as {[key: string]: string})[name] = '';
+   (connection.value as unknown as Record<string, string>)[name] = '';
 };
 
 setDefaults();

src/renderer/components/WorkspaceEditConnectionPanel.vue

@@ -165,22 +165,30 @@
                            >
                         </div>
                      </div>
-                     <div v-if="clientCustomizations.readOnlyMode" class="form-group columns">
+                     <div v-if="clientCustomizations.readOnlyMode" class="form-group columns mb-0">
                         <div class="column col-5 col-sm-12" />
                         <div class="column col-7 col-sm-12">
-                           <label class="form-checkbox form-inline">
+                           <label class="form-checkbox form-inline my-0">
                               <input v-model="localConnection.readonly" type="checkbox"><i class="form-icon" /> {{ t('connection.readOnlyMode') }}
                            </label>
                         </div>
                      </div>
-                     <div v-if="!clientCustomizations.fileConnection" class="form-group columns">
+                     <div v-if="!clientCustomizations.fileConnection" class="form-group columns mb-0">
                         <div class="column col-5 col-sm-12" />
                         <div class="column col-7 col-sm-12">
-                           <label class="form-checkbox form-inline">
+                           <label class="form-checkbox form-inline my-0">
                               <input v-model="localConnection.ask" type="checkbox"><i class="form-icon" /> {{ t('connection.askCredentials') }}
                            </label>
                         </div>
                      </div>
+                     <div v-if="clientCustomizations.singleConnectionMode" class="form-group columns mb-0">
+                        <div class="column col-5 col-sm-12" />
+                        <div class="column col-7 col-sm-12">
+                           <label class="form-checkbox form-inline my-0">
+                              <input v-model="localConnection.singleConnectionMode" type="checkbox"><i class="form-icon" /> {{ t('connection.singleConnection') }}
+                           </label>
+                        </div>
+                     </div>
                   </fieldset>
                </form>
             </div>
@@ -569,11 +577,11 @@ const pathSelection = (event: Event & {target: {files: {path: string}[]}}, name:
    const { files } = event.target;
    if (!files.length) return;
 
-   (localConnection.value as unknown as {[key: string]: string})[name] = files[0].path;
+   (localConnection.value as unknown as Record<string, string>)[name] = files[0].path;
 };
 
 const pathClear = (name: keyof ConnectionParams) => {
-   (localConnection.value as unknown as {[key: string]: string})[name] = '';
+   (localConnection.value as unknown as Record<string, string>)[name] = '';
 };
 
 localConnection.value = JSON.parse(JSON.stringify(props.connection));

src/renderer/components/WorkspaceExploreBar.vue

@@ -34,7 +34,6 @@
                </div>
                <div :title="t('general.refresh')">
                   <BaseIcon
-                     v-if="customizations.schemas"
                      icon-name="mdiRefresh"
                      :size="18"
                      class="c-hand mr-2"
@@ -502,7 +501,7 @@ const toggleSearchMethod = () => {
     transition: background 0.2s;
 
     &:hover {
-      background: rgba($primary-color, 50%);
+      background: rgba(var(--primary-color), 50%);
     }
   }
 

src/renderer/components/WorkspaceExploreBarSchema.vue

@@ -513,7 +513,13 @@ const selectMisc = ({ schema, misc, type }: { schema: string; misc: { name: stri
 };
 
 const openDataTab = ({ schema, table }: { schema: string; table: TableInfos }) => {
-   newTab({ uid: props.connection.uid, elementName: table.name, schema: props.database.name, type: 'data', elementType: table.type });
+   newTab({
+      uid: props.connection.uid,
+      elementName: table.name,
+      schema: props.database.name,
+      type: 'data',
+      elementType: table.type
+   });
    setBreadcrumbs({ schema, [table.type]: table.name });
 };
 

src/renderer/components/WorkspaceQueryConsole.vue

@@ -24,7 +24,7 @@
                tabindex="0"
                @contextmenu.prevent="contextMenu($event, wLog)"
             >
-               <span class="type-datetime">{{ moment(wLog.date).format('HH:mm:ss') }}</span>: <code class="query-console-log-sql">{{ wLog.sql }}</code>
+               <span class="type-datetime">{{ moment(wLog.date).format('HH:mm:ss') }}</span>: <code class="query-console-log-sql" v-html="highlight(wLog.sql, {html: true})" />
             </div>
          </div>
       </div>
@@ -47,6 +47,7 @@
 <script setup lang="ts">
 import * as moment from 'moment';
 import { storeToRefs } from 'pinia';
+import { highlight } from 'sql-highlight';
 import { computed, nextTick, onMounted, Ref, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 
@@ -144,7 +145,7 @@ onMounted(() => {
     transition: background 0.2s;
 
     &:hover {
-      background: rgba($primary-color, 50%);
+      background: rgba(var(--primary-color), 50%);
     }
   }
 

src/renderer/components/WorkspaceTabPropsTable.vue

@@ -382,7 +382,7 @@ const getFieldsData = async () => {
       if (status === 'success') {
          const indexesObj = response
             .filter((index: TableIndex) => index.type !== 'FOREIGN KEY')
-            .reduce((acc: {[key: string]: TableIndex[]}, curr: TableIndex) => {
+            .reduce((acc: Record<string, TableIndex[]>, curr: TableIndex) => {
                acc[curr.name] = acc[curr.name] || [];
                acc[curr.name].push(curr);
                return acc;

src/renderer/components/WorkspaceTabPropsTableContext.vue

@@ -101,7 +101,13 @@ const props = defineProps({
    selectedField: Object
 });
 
-const emit = defineEmits(['close-context', 'duplicate-selected', 'delete-selected', 'add-new-index', 'add-to-index']);
+const emit = defineEmits([
+   'close-context',
+   'duplicate-selected',
+   'delete-selected',
+   'add-new-index',
+   'add-to-index'
+]);
 
 const hasPrimary = computed(() => props.indexes.some(index => index.type === 'PRIMARY'));
 

src/renderer/components/WorkspaceTabPropsTableFields.vue

@@ -150,7 +150,13 @@ const props = defineProps({
    mode: String
 });
 
-const emit = defineEmits(['add-new-index', 'add-to-index', 'rename-field', 'duplicate-field', 'remove-field']);
+const emit = defineEmits([
+   'add-new-index',
+   'add-to-index',
+   'rename-field',
+   'duplicate-field',
+   'remove-field'
+]);
 
 const workspacesStore = useWorkspacesStore();
 const consoleStore = useConsoleStore();

src/renderer/components/WorkspaceTabPropsTableForeignModal.vue

@@ -258,7 +258,7 @@ const indexesPanel: Ref<HTMLDivElement> = ref(null);
 const foreignProxy = ref([]);
 const selectedForeignID = ref('');
 const modalInnerHeight = ref(400);
-const refFields = ref({} as {[key: string]: TableField[]});
+const refFields = ref({} as Record<string, TableField[]>);
 
 const foreignActions = computed(() => props.workspace.customizations.foreignActions);
 const selectedForeignObj = computed(() => foreignProxy.value.find(foreign => foreign._antares_id === selectedForeignID.value));

src/renderer/components/WorkspaceTabQuery.vue

@@ -19,7 +19,10 @@
          <div ref="resizer" class="query-area-resizer" />
          <div ref="queryAreaFooter" class="workspace-query-runner-footer">
             <div class="workspace-query-buttons">
-               <div @mouseenter="setCancelButtonVisibility(true)" @mouseleave="setCancelButtonVisibility(false)">
+               <div
+                  @mouseenter="setCancelButtonVisibility(true)"
+                  @mouseleave="setCancelButtonVisibility(false)"
+               >
                   <button
                      v-if="showCancel && isQuering"
                      class="btn btn-primary btn-sm cancellable"
@@ -89,26 +92,60 @@
                <button
                   class="btn btn-dark btn-sm"
                   :disabled="!query || isQuering"
+                  :title="t('general.format')"
                   @click="beautify()"
                >
-                  <BaseIcon
-                     class="mr-1"
-                     icon-name="mdiBrush"
-                     :size="24"
-                  />
-                  <span>{{ t('general.format') }}</span>
+                  <BaseIcon icon-name="mdiBrush" :size="24" />
                </button>
+               <div class="btn-group">
+                  <button
+                     class="btn btn-dark btn-sm mr-0"
+                     :disabled="!filePath || lastSavedQuery === query"
+                     :title="t('application.saveFile')"
+                     @click="saveFile()"
+                  >
+                     <BaseIcon icon-name="mdiContentSaveCheckOutline" :size="24" />
+                  </button>
+                  <button
+                     class="btn btn-dark btn-sm mr-0"
+                     :title="t('application.saveFileAs')"
+                     @click="saveFileAs()"
+                  >
+                     <BaseIcon icon-name="mdiContentSavePlusOutline" :size="24" />
+                  </button>
+                  <button
+                     class="btn btn-dark btn-sm"
+                     :title="t('application.openFile')"
+                     @click="openFile()"
+                  >
+                     <BaseIcon icon-name="mdiFolderOpenOutline" :size="24" />
+                  </button>
+               </div>
+               <div class="btn-group">
+                  <button
+                     class="btn btn-dark btn-sm mr-0"
+                     :disabled="isQuering || (isQuerySaved || query.length < 5)"
+                     :title="t('application.saveAsNote')"
+                     @click="saveQuery()"
+                  >
+                     <BaseIcon icon-name="mdiHeartPlusOutline" :size="24" />
+                  </button>
+                  <button
+                     class="btn btn-dark btn-sm"
+                     :disabled="isQuering"
+                     :title="t('database.savedQueries')"
+                     @click="openSavedModal()"
+                  >
+                     <BaseIcon icon-name="mdiNotebookHeartOutline" :size="24" />
+                  </button>
+               </div>
                <button
                   class="btn btn-dark btn-sm"
                   :disabled="isQuering"
+                  :title="t('general.history')"
                   @click="openHistoryModal()"
                >
-                  <BaseIcon
-                     class="mr-1"
-                     icon-name="mdiHistory"
-                     :size="24"
-                  />
-                  <span>{{ t('general.history') }}</span>
+                  <BaseIcon icon-name="mdiHistory" :size="24" />
                </button>
                <div class="dropdown table-dropdown pr-2">
                   <button
@@ -237,10 +274,11 @@
 <script setup lang="ts">
 import { Ace } from 'ace-builds';
 import { ConnectionParams } from 'common/interfaces/antares';
+import { uidGen } from 'common/libs/uidGen';
 import { ipcRenderer } from 'electron';
 import { storeToRefs } from 'pinia';
 import { format } from 'sql-formatter';
-import { Component, computed, onBeforeUnmount, onMounted, Prop, Ref, ref, watch } from 'vue';
+import { Component, computed, onBeforeUnmount, onMounted, Prop, Ref, ref, toRaw, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 
 import BaseIcon from '@/components/BaseIcon.vue';
@@ -251,10 +289,13 @@ import QueryEditor from '@/components/QueryEditor.vue';
 import WorkspaceTabQueryEmptyState from '@/components/WorkspaceTabQueryEmptyState.vue';
 import WorkspaceTabQueryTable from '@/components/WorkspaceTabQueryTable.vue';
 import { useResultTables } from '@/composables/useResultTables';
+import Application from '@/ipc-api/Application';
 import Schema from '@/ipc-api/Schema';
+import { useApplicationStore } from '@/stores/application';
 import { useConsoleStore } from '@/stores/console';
 import { useHistoryStore } from '@/stores/history';
 import { useNotificationsStore } from '@/stores/notifications';
+import { useScratchpadStore } from '@/stores/scratchpad';
 import { useSettingsStore } from '@/stores/settings';
 import { useWorkspacesStore } from '@/stores/workspaces';
 
@@ -279,6 +320,8 @@ const {
 const { saveHistory } = useHistoryStore();
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { showScratchpad } = useApplicationStore();
+const { addNote } = useScratchpadStore();
 
 const { consoleHeight } = storeToRefs(useConsoleStore());
 const { executeSelected } = storeToRefs(useSettingsStore());
@@ -287,14 +330,18 @@ const {
    getWorkspace,
    changeBreadcrumbs,
    updateTabContent,
-   setUnsavedChanges
+   setUnsavedChanges,
+   newTab
 } = workspacesStore;
 
 const queryEditor: Ref<Component & { editor: Ace.Editor; $el: HTMLElement }> = ref(null);
 const queryAreaFooter: Ref<HTMLDivElement> = ref(null);
 const resizer: Ref<HTMLDivElement> = ref(null);
+const queryName = ref('');
 const query = ref('');
+const filePath = ref('');
 const lastQuery = ref('');
+const lastSavedQuery = ref('');
 const isCancelling = ref(false);
 const showCancel = ref(false);
 const autocommit = ref(true);
@@ -304,6 +351,7 @@ const resultsCount = ref(0);
 const durationsCount = ref(0);
 const affectedCount = ref(null);
 const editorHeight = ref(200);
+const isQuerySaved = ref(false);
 const isHistoryOpen = ref(false);
 const debounceTimeout = ref(null);
 
@@ -317,18 +365,44 @@ const databaseSchemas = computed(() => {
 });
 const hasResults = computed(() => results.value.length && results.value[0].rows);
 const hasAffected = computed(() => affectedCount.value || (!resultsCount.value && affectedCount.value !== null));
+const isChanged = computed(() => {
+   return filePath.value && lastSavedQuery.value !== query.value;
+});
 
 watch(query, (val) => {
    clearTimeout(debounceTimeout.value);
 
    debounceTimeout.value = setTimeout(() => {
       updateTabContent({
+         elementName: queryName.value,
+         filePath: filePath.value,
          uid: props.connection.uid,
          tab: props.tab.uid,
          type: 'query',
          schema: selectedSchema.value,
          content: val
+
       });
+
+      isQuerySaved.value = false;
+   }, 200);
+});
+
+watch(queryName, (val) => {
+   clearTimeout(debounceTimeout.value);
+
+   debounceTimeout.value = setTimeout(() => {
+      updateTabContent({
+         elementName: val,
+         filePath: filePath.value,
+         uid: props.connection.uid,
+         tab: props.tab.uid,
+         type: 'query',
+         schema: selectedSchema.value,
+         content: query.value
+      });
+
+      isQuerySaved.value = false;
    }, 200);
 });
 
@@ -351,6 +425,18 @@ watch(databaseSchemas, () => {
       selectedSchema.value = null;
 }, { deep: true });
 
+watch(() => props.tab.content, () => {
+   query.value = props.tab.content;
+   const editorValue = queryEditor.value.editor.session.getValue();
+
+   if (editorValue !== query.value)// If change not rendered in editor
+      queryEditor.value.editor.session.setValue(query.value);
+});
+
+watch(isChanged, (val) => {
+   setUnsavedChanges({ uid: props.connection.uid, tUid: props.tabUid, isChanged: val });
+});
+
 const runQuery = async (query: string) => {
    if (!query || isQuering.value) return;
    isQuering.value = true;
@@ -496,6 +582,23 @@ const openHistoryModal = () => {
    isHistoryOpen.value = true;
 };
 
+const saveQuery = () => {
+   addNote({
+      uid: uidGen('N'),
+      cUid: workspace.value.uid,
+      type: 'query',
+      date: new Date(),
+      note: query.value,
+      isArchived: false,
+      title: queryName.value
+   });
+   isQuerySaved.value = true;
+};
+
+const openSavedModal = () => {
+   showScratchpad('query');
+};
+
 const selectQuery = (sql: string) => {
    if (queryEditor.value)
       queryEditor.value.editor.session.setValue(sql);
@@ -554,6 +657,8 @@ const rollbackTab = async () => {
 defineExpose({ resizeResults });
 
 query.value = props.tab.content as string;
+queryName.value = props.tab.elementName as string;
+filePath.value = props.tab.filePath as string;
 selectedSchema.value = props.tab.schema || breadcrumbsSchema.value;
 
 window.addEventListener('resize', onWindowResize);
@@ -588,6 +693,73 @@ const historyListener = () => {
       openHistoryModal();
 };
 
+const openFileListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen)
+      openFile();
+};
+
+const saveFileAsListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen)
+      saveFileAs();
+};
+
+const saveContentListener = () => {
+   const hasModalOpen = !!document.querySelectorAll('.modal.active').length;
+   if (props.isSelected && !hasModalOpen && filePath)
+      saveFile();
+};
+
+const openFile = async () => {
+   const result = await Application.showOpenDialog({ properties: ['openFile'], filters: [{ name: 'SQL', extensions: ['sql', 'txt'] }] });
+   if (result && !result.canceled) {
+      const file = result.filePaths[0];
+      const content = await Application.readFile(file);
+      const fileName = file.split('/').pop().split('\\').pop();
+      if (props.tab.filePath && props.tab.filePath !== file) {
+         newTab({
+            uid: props.connection.uid,
+            type: 'query',
+            filePath: file,
+            content: '',
+            schema: selectedSchema.value,
+            elementName: fileName
+         });
+      }
+      else {
+         filePath.value = file;
+         queryName.value = fileName;
+         query.value = content;
+         lastSavedQuery.value = content;
+      }
+   }
+};
+
+const saveFileAs = async () => {
+   // eslint-disable-next-line @typescript-eslint/no-explicit-any
+   const result: any = await Application.showSaveDialog({ filters: [{ name: 'SQL', extensions: ['sql'] }], defaultPath: `${queryName.value || 'query'}.sql` });
+   if (result && !result.canceled) {
+      await Application.writeFile(result.filePath, query.value);
+      addNotification({ status: 'success', message: t('general.actionSuccessful', { action: t('application.saveFile') }) });
+      queryName.value = result.filePath.split('/').pop().split('\\').pop();
+      filePath.value = result.filePath;
+      lastSavedQuery.value = toRaw(query.value);
+   }
+};
+
+const saveFile = async () => {
+   await Application.writeFile(filePath.value, query.value);
+   addNotification({ status: 'success', message: t('general.actionSuccessful', { action: t('application.saveFile') }) });
+   lastSavedQuery.value = toRaw(query.value);
+};
+
+const loadFileContent = async (file: string) => {
+   const content = await Application.readFile(file);
+   query.value = content;
+   lastSavedQuery.value = content;
+};
+
 onMounted(() => {
    const localResizer = resizer.value;
 
@@ -596,6 +768,9 @@ onMounted(() => {
    ipcRenderer.on('kill-query', killQueryListener);
    ipcRenderer.on('clear-query', clearQueryListener);
    ipcRenderer.on('query-history', historyListener);
+   ipcRenderer.on('open-file', openFileListener);
+   ipcRenderer.on('save-file-as', saveFileAsListener);
+   ipcRenderer.on('save-content', saveContentListener);
 
    localResizer.addEventListener('mousedown', (e: MouseEvent) => {
       e.preventDefault();
@@ -606,6 +781,9 @@ onMounted(() => {
 
    if (props.tab.autorun)
       runQuery(query.value);
+
+   if (props.tab.filePath)
+      loadFileContent(props.tab.filePath);
 });
 
 onBeforeUnmount(() => {
@@ -621,6 +799,9 @@ onBeforeUnmount(() => {
    ipcRenderer.removeListener('kill-query', killQueryListener);
    ipcRenderer.removeListener('clear-query', clearQueryListener);
    ipcRenderer.removeListener('query-history', historyListener);
+   ipcRenderer.removeListener('open-file', openFileListener);
+   ipcRenderer.removeListener('save-file-as', saveFileAsListener);
+   ipcRenderer.removeListener('save-content', saveContentListener);
 });
 </script>
 
@@ -640,7 +821,7 @@ onBeforeUnmount(() => {
       transition: background 0.2s;
 
       &:hover {
-        background: rgba($primary-color, 50%);
+        background: rgba(var(--primary-color), 50%);
       }
     }
 
@@ -679,4 +860,4 @@ onBeforeUnmount(() => {
     min-height: 200px;
   }
 }
-</style>
+</style>filePathsfilePathsfilePaths

src/renderer/components/WorkspaceTabQueryTable.vue

@@ -31,7 +31,7 @@
             :class="{ 'active': resultsetIndex === index }"
             @click="selectResultset(index)"
          >
-            <a>{{ result.fields ? result.fields[0]?.table : '' }} ({{ result.rows.length }})</a>
+            <a>{{ result.fields ? result.fields[0]?.tableAlias ?? result.fields[0]?.table : `${t('general.results')} #${index}` }} ({{ result.rows.length }})</a>
          </li>
       </ul>
       <div ref="table" class="table table-hover">
@@ -44,7 +44,7 @@
                   :title="`${field.type} ${fieldLength(field) ? `(${fieldLength(field)})` : ''}`"
                >
                   <div ref="columnResize" class="column-resizable">
-                     <div class="table-column-title" @click="sort(field.name)">
+                     <div class="table-column-title" @click="sort(field)">
                         <div v-if="field.key" :title="keyName(field.key)">
                            <BaseIcon
                               icon-name="mdiKey"
@@ -56,8 +56,8 @@
                         </div>
                         <span>{{ field.alias || field.name }}</span>
                         <BaseIcon
-                           v-if="isSortable && currentSort === field.name || currentSort === `${field.table}.${field.name}`"
-                           :icon-name="currentSortDir === 'asc' ? 'mdiSortAscending' : 'mdiSortDescending'"
+                           v-if="isSortable && currentSort[resultsetIndex]?.field === field.name || currentSort[resultsetIndex]?.field === `${field.tableAlias || field.table}.${field.name}`"
+                           :icon-name="currentSort[resultsetIndex].dir === 'asc' ? 'mdiSortAscending' : 'mdiSortDescending'"
                            :size="18"
                            class="sort-icon ml-1"
                         />
@@ -292,6 +292,10 @@ const props = defineProps({
    results: Array as Prop<QueryResult[]>,
    connUid: String,
    mode: String as Prop<'table' | 'query'>,
+   page: {
+      type: Number,
+      required: false
+   },
    isSelected: Boolean,
    elementType: { type: String, default: 'table' }
 });
@@ -314,8 +318,7 @@ const hasFocus = ref(false);
 const contextEvent = ref(null);
 const selectedCell = ref(null);
 const selectedRows = ref([]);
-const currentSort = ref('');
-const currentSortDir = ref('asc');
+const currentSort: Ref<{field: string; dir: 'asc' | 'desc'}[]> = ref([]);
 const resultsetIndex = ref(0);
 const scrollElement = ref(null);
 const rowHeight = ref(23);
@@ -358,14 +361,16 @@ const isHardSort = computed(() => {
 });
 
 const sortedResults = computed(() => {
-   if (currentSort.value && !isHardSort.value) {
+   if (currentSort.value[resultsetIndex.value] && !isHardSort.value) {
+      const sortObj = currentSort.value[resultsetIndex.value];
+
       return [...localResults.value].sort((a: any, b: any) => {
          let modifier = 1;
-         let valA = typeof a[currentSort.value] === 'string' ? a[currentSort.value].toLowerCase() : a[currentSort.value];
+         let valA = typeof a[sortObj.field] === 'string' ? a[sortObj.field].toLowerCase() : a[sortObj.field];
          if (!isNaN(valA)) valA = Number(valA);
-         let valB = typeof b[currentSort.value] === 'string' ? b[currentSort.value].toLowerCase() : b[currentSort.value];
+         let valB = typeof b[sortObj.field] === 'string' ? b[sortObj.field].toLowerCase() : b[sortObj.field];
          if (!isNaN(valB)) valB = Number(valB);
-         if (currentSortDir.value === 'desc') modifier = -1;
+         if (sortObj.dir === 'desc') modifier = -1;
          if (valA < valB) return -1 * modifier;
          if (valA > valB) return 1 * modifier;
          return 0;
@@ -784,32 +789,42 @@ const contextMenu = (event: MouseEvent, cell: any) => {
    isContext.value = true;
 };
 
-const sort = (field: string) => {
+const sort = (field: TableField) => {
    if (!isSortable.value) return;
 
    selectedRows.value = [];
+   let fieldName = field.name;
+   const hasTableInFieldname = Object.keys(localResults.value[0]).find(k => k !== '_antares_id').includes('.');
 
-   if (props.mode === 'query')
-      field = `${getTable(resultsetIndex.value)}.${field}`;
+   if (props.mode === 'query' && hasTableInFieldname)
+      fieldName = `${field.tableAlias || field.table}.${field.name}`;
 
-   if (field === currentSort.value) {
-      if (currentSortDir.value === 'asc')
-         currentSortDir.value = 'desc';
+   if (fieldName === currentSort.value[resultsetIndex.value]?.field) {
+      if (currentSort.value[resultsetIndex.value].dir === 'asc')
+         currentSort.value[resultsetIndex.value].dir = 'desc';
       else
          resetSort();
    }
    else {
-      currentSortDir.value = 'asc';
-      currentSort.value = field;
+      currentSort.value[resultsetIndex.value] = {
+         field: fieldName,
+         dir: 'asc'
+      };
    }
 
-   if (isHardSort.value)
-      emit('hard-sort', { field: currentSort.value, dir: currentSortDir.value });
+   if (isHardSort.value) {
+      emit('hard-sort', {
+         field: currentSort.value[resultsetIndex.value].field,
+         dir: currentSort.value[resultsetIndex.value].dir
+      });
+   }
 };
 
 const resetSort = () => {
-   currentSort.value = '';
-   currentSortDir.value = 'asc';
+   currentSort.value[resultsetIndex.value] = {
+      field: null,
+      dir: 'asc'
+   };
 };
 
 const selectResultset = (index: number) => {
@@ -857,6 +872,7 @@ const downloadTable = (format: 'csv' | 'json' | 'sql' | 'php', table: string, po
       },
       client: workspaceClient.value,
       table,
+      page: props.page,
       sqlOptions: popup ? { ...sqlExportOptions.value } : null,
       csvOptions: popup ? { ...csvExportOptions.value } : null
    });

src/renderer/components/WorkspaceTabQueryTableRow.vue

@@ -43,6 +43,7 @@
                   autofocus
                   class="editable-field form-input input-sm px-1"
                   @blur="editOFF"
+                  @keyup.delete.stop
                >
                <BaseSelect
                   v-else-if="inputProps.type === 'boolean'"
@@ -50,6 +51,7 @@
                   :options="['true', 'false']"
                   class="form-select small-select editable-field"
                   @blur="editOFF"
+                  @keyup.delete.stop
                />
                <BaseSelect
                   v-else-if="enumArray"
@@ -58,6 +60,7 @@
                   class="form-select small-select editable-field"
                   dropdown-class="small-select"
                   @blur="editOFF"
+                  @keyup.delete.stop
                />
                <input
                   v-else
@@ -67,6 +70,7 @@
                   autofocus
                   class="editable-field form-input input-sm px-1"
                   @blur="editOFF"
+                  @keyup.delete.stop
                >
             </template>
          </template>
@@ -382,7 +386,7 @@ const isBaseSelectField = computed(() => {
 });
 
 const enumArray = computed(() => {
-   if (props.fields[editingField.value] && props.fields[editingField.value].enumValues)
+   if (props.fields[editingField.value] && props.fields[editingField.value].enumValues && props.fields[editingField.value].type !== 'SET')
       return props.fields[editingField.value].enumValues.replaceAll('\'', '').split(',');
    return false;
 });

src/renderer/components/WorkspaceTabTable.vue

@@ -91,7 +91,7 @@
                   <BaseIcon icon-name="mdiMagnify" :size="24" />
                </button>
                <button
-                  v-if="isTable"
+                  v-if="isTable && !connection.readonly"
                   class="btn btn-dark btn-sm"
                   :disabled="isQuering"
                   @click="showFakerModal()"
@@ -202,6 +202,7 @@
             v-if="results"
             ref="queryTable"
             :results="results"
+            :page="page"
             :tab-uid="tabUid"
             :conn-uid="connection.uid"
             :is-selected="isSelected"

src/renderer/composables/useFilters.ts

@@ -28,7 +28,7 @@ export function useFilters () {
       return `(${num})`;
    };
 
-   const parseKeys = (keys: {[key: number]: string}[]) => {
+   const parseKeys = (keys: Record<number, string>[]) => {
       const isMacOS = process.platform === 'darwin';
       return (keys as string[]).map(k => (
          k.split('+')

src/renderer/i18n/ca-ES.ts

@@ -232,7 +232,7 @@ export const caES = {
       newFunction: 'Nova funció',
       newScheduler: 'Nou planificador',
       newTriggerFunction: 'Nova funció de disparador',
-      thereIsNoQueriesYet: 'Encara no hi ha consultes',
+      thereAreNoQueriesYet: 'Encara no hi ha consultes',
       searchForQueries: 'Cerca consultes',
       killProcess: 'Mata procés',
       exportSchema: 'Exporta esquema',

src/renderer/i18n/cs-CZ.ts

@@ -233,7 +233,7 @@ export const csCZ = {
       newFunction: 'Nová funkce',
       newScheduler: 'Nový scheduler',
       newTriggerFunction: 'Nová trigger funkce',
-      thereIsNoQueriesYet: 'Nejsou tu žádné dotazy',
+      thereAreNoQueriesYet: 'Nejsou tu žádné dotazy',
       searchForQueries: 'Hledání dotazů',
       killProcess: 'Zabít proces',
       exportSchema: 'Exportovat schéma',

src/renderer/i18n/en-US.ts

@@ -1,3 +1,12 @@
+/**
+ * [TRANSLATION UPDATE HELPER]
+ * - Open a terminal in antares folder and run `npm run translation:check short-code` replacing short-code with the one you are updating.
+ * - The command will output which terms are missing or not translated from english.
+ * - Open antares folder with your editor of choice.
+ * - Go to antares/src/renderer/i18n/ and open the locale file you want to translate.
+ * - Add and translate missing terms and consider whether to translate untranslated terms.
+ */
+
 export const enUS = {
    general: { // General purpose terms
       edit: 'Edit',
@@ -66,9 +75,15 @@ export const enUS = {
       outputFormat: 'Output format',
       singleFile: 'Single {ext} file',
       zipCompressedFile: 'ZIP compressed {ext} file',
-      copyName: 'Copy name'
+      copyName: 'Copy name',
+      search: 'Search',
+      title: 'Title',
+      archive: 'Archive', // verb
+      undo: 'Undo',
+      moveTo: 'Move to'
    },
    connection: { // Database connection
+      connection: 'Connection',
       connectionName: 'Connection name',
       hostName: 'Host name',
       client: 'Client',
@@ -102,7 +117,8 @@ export const enUS = {
       readOnlyMode: 'Read-only mode',
       allConnections: 'All connections',
       searchForConnections: 'Search for connections',
-      keepAliveInterval: 'Keep alive interval'
+      keepAliveInterval: 'Keep alive interval',
+      singleConnection: 'Single connection'
    },
    database: { // Database related terms
       schema: 'Schema',
@@ -237,7 +253,7 @@ export const enUS = {
       newFunction: 'New function',
       newScheduler: 'New scheduler',
       newTriggerFunction: 'New trigger function',
-      thereIsNoQueriesYet: 'There is no queries yet',
+      thereAreNoQueriesYet: 'There are no queries yet',
       searchForQueries: 'Search for queries',
       killProcess: 'Kill process',
       exportSchema: 'Export schema',
@@ -266,12 +282,11 @@ export const enUS = {
       targetTable: 'Target table',
       switchDatabase: 'Switch the database',
       searchForElements: 'Search for elements',
-      searchForSchemas: 'Search for schemas'
+      searchForSchemas: 'Search for schemas',
+      savedQueries: 'Saved queries'
    },
    application: { // Application related terms
       settings: 'Settings',
-      scratchpad: 'Scratchpad',
-      disableScratchpad: 'Disable scratchpad',
       console: 'Console',
       general: 'General',
       themes: 'Themes',
@@ -318,7 +333,7 @@ export const enUS = {
       wrapLongLines: 'Wrap long lines',
       markdownSupported: 'Markdown supported',
       plantATree: 'Plant a Tree',
-      dataTabPageSize: 'DATA tab page size',
+      dataTabPageSize: 'Results per page',
       noOpenTabs: 'There are no open tabs, navigate on the left bar or:',
       restorePreviousSession: 'Restore previous session',
       closeTab: 'Close tab',
@@ -342,7 +357,6 @@ export const enUS = {
       saveContent: 'Save content',
       openAllConnections: 'Open all connections',
       openSettings: 'Open settings',
-      openScratchpad: 'Open scratchpad',
       runOrReload: 'Run or reload',
       openFilter: 'Open filter',
       nextResultsPage: 'Next results page',
@@ -350,6 +364,8 @@ export const enUS = {
       editFolder: 'Edit folder',
       folderName: 'Folder name',
       deleteFolder: 'Delete folder',
+      newFolder: 'New folder',
+      outOfFolder: 'Out of folder',
       editConnectionAppearance: 'Edit connection appearance',
       defaultCopyType: 'Default copy type',
       showTableSize: 'Show table size in sidebar',
@@ -376,7 +392,20 @@ export const enUS = {
       ignoreDuplicates: 'Ignore duplicates',
       wrongImportPassword: 'Wrong import password',
       wrongFileFormat: 'Wrong file format',
-      dataImportSuccess: 'Data successfully imported'
+      dataImportSuccess: 'Data successfully imported',
+      note: 'Note | Notes',
+      thereAreNoNotesYet: 'There are no notes yet',
+      addNote: 'Add note',
+      editNote: 'Edit note',
+      saveAsNote: 'Save as note',
+      showArchivedNotes: 'Show archived notes',
+      hideArchivedNotes: 'Hide archived notes',
+      tag: 'Tag', // Note tag,
+      saveFile: 'Save file',
+      saveFileAs: 'Save file as',
+      openFile: 'Open file',
+      openNotes: 'Open notes'
+
    },
    faker: { // Faker.js methods, used in random generated content
       address: 'Address',

src/renderer/i18n/fr-FR.ts

@@ -229,7 +229,7 @@ export const frFR = {
       newFunction: 'Nouvelle function',
       newScheduler: 'Nouveau déclencheur',
       newTriggerFunction: 'Nouvelle fonction de déclencheur',
-      thereIsNoQueriesYet: 'Il n\'y a pas encore de requête',
+      thereAreNoQueriesYet: 'Il n\'y a pas encore de requête',
       searchForQueries: 'Rechercher des requêtes',
       killProcess: 'Terminer un processus',
       exportSchema: 'Exporter un schéma',

src/renderer/i18n/id-ID.ts

@@ -227,7 +227,7 @@ export const idID = {
       newFunction: 'Fungsi baru',
       newScheduler: 'Penjadwal baru',
       newTriggerFunction: 'Fungsi pemicu baru',
-      thereIsNoQueriesYet: 'Belum ada kueri',
+      thereAreNoQueriesYet: 'Belum ada kueri',
       searchForQueries: 'Telusuri kueri',
       killProcess: 'Membunuh proses',
       exportSchema: 'Skema ekspor',

src/renderer/i18n/it-IT.ts

@@ -228,7 +228,7 @@ export const itIT = {
       newFunction: 'Nuova funzione',
       newScheduler: 'Nuovo scheduler',
       newTriggerFunction: 'Nuova funzione di trigger',
-      thereIsNoQueriesYet: 'Non ci sono ancora query',
+      thereAreNoQueriesYet: 'Non ci sono ancora query',
       searchForQueries: 'Cerca query',
       killProcess: 'Uccidi processo',
       exportSchema: 'Esporta schema',

src/renderer/i18n/ja-JP.ts

@@ -198,7 +198,7 @@ export const jaJP = {
       newFunction: '新しい関数',
       newScheduler: '新規スケジューラ',
       newTriggerFunction: '新しいトリガー機能',
-      thereIsNoQueriesYet: 'まだ問い合わせはありません',
+      thereAreNoQueriesYet: 'まだ問い合わせはありません',
       searchForQueries: 'クエリの検索',
       killProcess: 'プロセスの停止'
    },

src/renderer/i18n/ko-KR.ts

@@ -228,7 +228,7 @@ export const koKR = {
       newFunction: '새 함수',
       newScheduler: '새 스케줄러',
       newTriggerFunction: '새 트리거 함수',
-      thereIsNoQueriesYet: '아직 쿼리가 없습니다',
+      thereAreNoQueriesYet: '아직 쿼리가 없습니다',
       searchForQueries: '쿼리 검색',
       killProcess: '프로세스 종료',
       exportSchema: '스키마 내보내기',

src/renderer/i18n/nl-NL.ts

@@ -100,7 +100,7 @@ export const nlNL = {
       readOnlyMode: 'Alleen lezen modus',
       untrustedConnection: 'Niet vertrouwde verbinding',
       allConnections: 'Alle verbindingen',
-      searchForConnections: 'Search for connections'
+      searchForConnections: 'Zoek naar verbindingen'
    },
    database: {
       schema: 'Schema',
@@ -233,8 +233,8 @@ export const nlNL = {
       newFunction: 'Nieuwe function',
       newScheduler: 'Nieuwe scheduler',
       newTriggerFunction: 'Nieuwe trigger function',
-      thereIsNoQueriesYet: 'There is no queries yet',
-      searchForQueries: 'Search for queries',
+      thereAreNoQueriesYet: 'Er zijn nog geen queries',
+      searchForQueries: 'Zoek naar queries',
       killProcess: 'Sluit proces af',
       exportSchema: 'Exporteer schema',
       importSchema: 'Importeer schema',

src/renderer/i18n/pt-BR.ts

@@ -231,7 +231,7 @@ export const ptBR = {
       newFunction: 'Nova função',
       newScheduler: 'Novo agendento',
       newTriggerFunction: 'Novo gatinho de função',
-      thereIsNoQueriesYet: 'Nenhuma consulta ainda',
+      thereAreNoQueriesYet: 'Nenhuma consulta ainda',
       searchForQueries: 'Pesquisar por consultas',
       killProcess: 'Matar processo',
       exportSchema: 'Exportar banco de dados',

src/renderer/i18n/ru-RU.ts

@@ -229,7 +229,7 @@ export const ruRU = {
       newFunction: 'Новая функция',
       newScheduler: 'Новый планировщик',
       newTriggerFunction: 'Новая функция триггера',
-      thereIsNoQueriesYet: 'Запросы пока отсутствуют',
+      thereAreNoQueriesYet: 'Запросы пока отсутствуют',
       searchForQueries: 'Поиск по запросам',
       killProcess: 'Убить процесс',
       exportSchema: 'Экспорт схемы',

src/renderer/i18n/supported-locales.ts

@@ -1,4 +1,4 @@
-export const localesNames: {[key: string]: string} = {
+export const localesNames: Record<string, string> = {
    'en-US': 'English',
    'it-IT': 'Italiano',
    'ar-SA': 'العربية',

src/renderer/i18n/uk-UA.ts

@@ -238,7 +238,7 @@ export const ukUA = {
       newFunction: 'Нова функція',
       newScheduler: 'Новий планувальник',
       newTriggerFunction: 'Нова функція тригера',
-      thereIsNoQueriesYet: 'Поки що немає запитів',
+      thereAreNoQueriesYet: 'Поки що немає запитів',
       searchForQueries: 'Пошук запитів',
       killProcess: 'Завершити процес',
       exportSchema: 'Експорт схеми',

src/renderer/i18n/vi-VN.ts

@@ -222,7 +222,7 @@ export const viVN = {
       newFunction: 'Chức năng mới',
       newScheduler: 'Bộ lập lịch mới',
       newTriggerFunction: 'Chức năng kích hoạt mới',
-      thereIsNoQueriesYet: 'Không có truy vấn nào',
+      thereAreNoQueriesYet: 'Không có truy vấn nào',
       searchForQueries: 'Tìm kiếm truy vấn',
       killProcess: 'Huỷ quá trình',
       exportSchema: 'Xuất lược đồ',

src/renderer/i18n/zh-CN.ts

@@ -65,9 +65,16 @@ export const zhCN = {
       actionSuccessful: '{action} 成功',
       outputFormat: '输出格式',
       singleFile: '单个 {ext} 文件',
-      zipCompressedFile: 'ZIP 压缩 {ext} 文件'
+      zipCompressedFile: 'ZIP 压缩 {ext} 文件',
+      copyName: '复制名称',
+      search: '搜索',
+      title: '标题',
+      archive: '归档',
+      undo: '重做',
+      moveTo: '移动到'
    },
    connection: { // 数据库连接
+      connection: '连接',
       connectionName: '连接名称',
       hostName: '主机名',
       client: '数据库类型',
@@ -101,7 +108,8 @@ export const zhCN = {
       readOnlyMode: '只读模式',
       allConnections: '所有连接',
       searchForConnections: '搜索连接',
-      keepAliveInterval: '保持活跃间隔'
+      keepAliveInterval: '保持活跃间隔',
+      singleConnection: '单一连接'
    },
    database: { // 数据库相关术语
       schema: '模式(schema)',
@@ -236,7 +244,7 @@ export const zhCN = {
       newFunction: '新函数',
       newScheduler: '新调度器',
       newTriggerFunction: '新触发器函数',
-      thereIsNoQueriesYet: '目前还没有任何查询',
+      thereAreNoQueriesYet: '目前还没有任何查询',
       searchForQueries: '搜索查询',
       killProcess: '终止进程',
       exportSchema: '导出模式(schema)',
@@ -265,12 +273,11 @@ export const zhCN = {
       targetTable: '目标表',
       switchDatabase: '切换数据库',
       searchForElements: '搜索元素',
-      searchForSchemas: '搜索模式(schema)'
+      searchForSchemas: '搜索模式(schema)',
+      savedQueries: '已保存的查询'
    },
    application: { // 应用程序相关术语
       settings: '设置',
-      scratchpad: '草稿栏',
-      disableScratchpad: '禁用草稿栏',
       console: '控制台',
       general: '常规',
       themes: '主题',
@@ -375,7 +382,19 @@ export const zhCN = {
       ignoreDuplicates: '忽略重复',
       wrongImportPassword: '错误的导入密码',
       wrongFileFormat: '错误的文件格式',
-      dataImportSuccess: '数据已成功导入'
+      dataImportSuccess: '数据已成功导入',
+      note: '笔记 | 笔记',
+      thereAreNoNotesYet: '目前还没有笔记',
+      addNote: '添加笔记',
+      editNote: '编辑笔记',
+      saveAsNote: '另存为笔记',
+      showArchivedNotes: '显示归档笔记',
+      hideArchivedNotes: '隐藏归档笔记',
+      tag: '笔记标签', // Note tag,
+      saveFile: '保存文件',
+      saveFileAs: '将文件另存为',
+      openFile: '打开文件',
+      openNotes: '打开笔记'
    },
    faker: { // Faker.js 方法，用于随机生成的内容
       address: '地址',