feat: add codemirror commands

package.json

@@ -12,13 +12,15 @@
   },
   "license": "MIT",
   "dependencies": {
+    "@codemirror/commands": "^6.2.5",
     "@codemirror/lang-sql": "^6.5.2",
     "@codemirror/state": "^6.2.1",
     "@codemirror/view": "^6.14.1",
     "@replit/codemirror-vim": "^6.0.14",
     "@solid-primitives/event-bus": "^1.0.8",
     "@tauri-apps/api": "^1.4.0",
     "@uiw/codemirror-theme-dracula": "^4.21.7",
+    "codemirror": "^6.0.1",
     "fuse.js": "^6.6.2",
     "i18next": "^23.1.0",
     "solid-codemirror": "^2.3.0",
@@ -37,8 +39,8 @@
   },
   "devDependencies": {
     "@tauri-apps/cli": "^1.4.0",
-    "@types/tabulator-tables": "^5.4.10",
     "@types/node": "^20.3.2",
+    "@types/tabulator-tables": "^5.4.10",
     "autoprefixer": "^10.4.14",
     "daisyui": "^3.1.7",
     "postcss": "^8.4.24",

src/components/Screens/Console/Content/QueryTab/QueryTextArea.tsx

@@ -5,15 +5,14 @@ import {
 } from "solid-codemirror";
 import { Accessor, createSignal, For, onMount, Setter, Show } from "solid-js";
 import {
-  lineNumbers,
   EditorView,
   drawSelection,
   highlightWhitespace,
   highlightActiveLine,
 } from "@codemirror/view";
-import { sql } from "@codemirror/lang-sql";
+import { MySQL, sql } from "@codemirror/lang-sql";
 import { dracula } from "@uiw/codemirror-theme-dracula";
-import { vim } from "@replit/codemirror-vim";
+import { vim, Vim } from "@replit/codemirror-vim";
 import { format } from "sql-formatter";
 import { invoke } from "@tauri-apps/api";
 import { EditIcon, FireIcon, VimIcon } from "components/UI/Icons";
@@ -23,6 +22,7 @@ import { QueryResult } from "interfaces";
 import { commandPaletteEmitter } from "components/CommandPalette/actions";
 import { t } from "utils/i18n";
 import { Alert } from "components/UI";
+import { basicSetup } from "codemirror";
 
 export const QueryTextArea = (props: {
   idx: Accessor<number>;
@@ -54,22 +54,26 @@ export const QueryTextArea = (props: {
     onValueChange,
   });
   createEditorControlledValue(editorView, code);
-  createExtension(() => lineNumbers());
-  createExtension(() => sql());
   createExtension(() => drawSelection());
   createExtension(() => highlightWhitespace());
   createExtension(() => highlightActiveLine());
   createExtension(dracula);
   createExtension(() => (vimModeOn() ? vim() : []));
+  createExtension(() => basicSetup);
+  // TODO: add dialect and schema
+  createExtension(() =>
+    sql({
+      dialect: MySQL,
+      schema: { account: ["added_on"] },
+    })
+  );
   const { setFocused } = createEditorFocus(editorView);
-  // Vim.map("jj", "<Esc>", "insert"); // in insert mode
-  // Vim.map("Y", "y$"); // in normal mode
-  // saved for reference, TODO: add execute in normal mode
+  // TODO: add option to scroll inside autocompletion list with c-l and c-k
   // defaultKeymap.push({ keys: "gq", type: "operator", operator: "hardWrap" });
   // Vim.defineOperator(
   //   "hardWrap",
   //   function(cm, operatorArgs, ranges, oldAnchor, newHead) {
-  //     // make changes and return new cursor position
+  //     console.log('hardwrap')
   //   }
   // );