Make dev environment (#42)

Author: joe-re

README.md

@@ -26,6 +26,13 @@ let g:LanguageClient_serverCommands = {
     \ }
 ```
 
+#### Monaco Editor([monaco-languageclient](https://github.com/TypeFox/monaco-languageclient))
+
+https://github.com/joe-re/sql-language-server/blob/master/example/monaco_editor
+
+It's also used to develop sql-language-server.
+You can follow [development section](#development) to check Mocaco Editor working.
+
 ## Usage
 
 ### CLI
@@ -111,7 +118,7 @@ Please restart sql-language-server process after create .sqllsrc.json.
 | Key          | Description                                                                                                               | value                   | required | default                           |
 | ------------ | ------------------------------------------------------------------------------------------------------------------------- | ----------------------- | -------- | --------------------------------- |
 | name         | Connection name(free-form text)                                                                                           |                         | true     |                                   |
-| adapter      | Database type                                                                                                             | "mysql" #124; "postgres" #124; "sqlite3"  | true     |                                   |
+| adapter      | Database type                                                                                                             | "mysql" or "postgres" or "sqlite3"  | true     |                                   |
 | host         | Database host                                                                                                             | string                  | false    |                                   |
 | port         | Database port                                                                                                             | string                  | false    | mysql:3306, postgres:5432         |
 | user         | Database user                                                                                                             | string                  | false    | mysql:"root", postgres:"postgres" |
@@ -272,3 +279,30 @@ method: workspace/executeCommand
 command: fixAllFixableProblems
 arguments: string(document uri)
 ```
+
+## Contributing on sql-language-server
+
+### Bug Repots and Feature Requests
+
+[GitHub Issues](https://github.com/joe-re/sql-language-server/issues) are opening for asking question, reporting problems, and suggests improvement.
+
+You can start a disccustion about new rule for SQLint there also.
+
+### Development
+
+Code contributions are always appreciated. Feel free to fork the repo and submit pull requests.
+
+You can start to develop sql-language-server on docker-compose.
+Please follows below steps.
+
+1. Setup docker-compose on your machine.
+  - https://docs.docker.com/compose/install/
+2. Start development process on your docker.
+
+```sh
+$ docker-compose up
+```
+
+3. Open `http://localhost:3000` on your browser.
+
+

docker-compose.yaml

@@ -0,0 +1,22 @@
+version: '3'
+services:
+  assets:
+    build:
+      context: .
+      dockerfile: dockerfile
+    volumes:
+      - .:/opt/sql-language-server:rw
+    command: 'yarn dev' # 'tail -f /dev/null'
+    ports:
+      - '3000:3000'
+  postgres:
+    image: postgres:10
+    restart: always
+    environment:
+      POSTGRES_DB: postgres_db
+      POSTGRES_USER: sqlls
+      POSTGRES_PASSWORD: sqlls
+    volumes:
+      - postgres:/var/lib/postgresql/data
+volumes:
+  postgres:

dockerfile

@@ -0,0 +1,9 @@
+FROM node:12
+
+COPY ./example /opt/sql-language-server/example
+COPY ./package.json yarn.lock /opt/sql-language-server/
+COPY ./packages/server/package.json /opt/sql-language-server/packages/server/
+COPY ./packages/sql-parser/package.json /opt/sql-language-server/packages/sql-parser/
+COPY ./packages/sqlint/package.json /opt/sql-language-server/packages/sqlint/
+WORKDIR /opt/sql-language-server
+RUN yarn

dockerfile_dev_example_server

@@ -0,0 +1,9 @@
+FROM node:12
+
+COPY ./example /opt/sql-language-server/example
+COPY ./package.json yarn.lock /opt/sql-language-server/
+COPY ./packages/server/package.json /opt/sql-language-server/packages/server/
+COPY ./packages/sql-parser/package.json /opt/sql-language-server/packages/sql-parser/
+COPY ./packages/sqlint/package.json /opt/sql-language-server/packages/sqlint/
+WORKDIR /opt/sql-language-server
+RUN yarn

example/monaco_editor/.gitignore

@@ -0,0 +1 @@
+dist

example/monaco_editor/.sqllsrc.json

@@ -0,0 +1,8 @@
+{
+  "adapter": "postgres",
+  "host": "postgres",
+  "port": 5432,
+  "user": "sqlls",
+  "password": "sqlls",
+  "database": "postgres_db"
+}

packages/server/example/monaco_editor/README.md renamed to example/monaco_editor/README.md

@@ -0,0 +1,16 @@
+{
+  "postgres": {
+    "username": "sqlls",
+    "password": "sqlls",
+    "database": "postgres_db",
+    "host": "postgres",
+    "dialect": "postgres"
+  },
+  "mysql": {
+    "username": "root",
+    "password": null,
+    "database": "database_test",
+    "host": "127.0.0.1",
+    "dialect": "mysql"
+  }
+}

example/monaco_editor/config/config.json

@@ -0,0 +1,33 @@
+'use strict';
+module.exports = {
+  up: async (queryInterface, Sequelize) => {
+    await queryInterface.createTable('Users', {
+      id: {
+        allowNull: false,
+        autoIncrement: true,
+        primaryKey: true,
+        type: Sequelize.INTEGER
+      },
+      firstName: {
+        type: Sequelize.STRING
+      },
+      lastName: {
+        type: Sequelize.STRING
+      },
+      email: {
+        type: Sequelize.STRING
+      },
+      createdAt: {
+        allowNull: false,
+        type: Sequelize.DATE
+      },
+      updatedAt: {
+        allowNull: false,
+        type: Sequelize.DATE
+      }
+    });
+  },
+  down: async (queryInterface, Sequelize) => {
+    await queryInterface.dropTable('Users');
+  }
+};

example/monaco_editor/migrations/20200715005652-create-user.js

@@ -0,0 +1,37 @@
+'use strict';
+
+const fs = require('fs');
+const path = require('path');
+const Sequelize = require('sequelize');
+const basename = path.basename(__filename);
+const env = process.env.NODE_ENV || 'development';
+const config = require(__dirname + '/../config/config.json')[env];
+const db = {};
+
+let sequelize;
+if (config.use_env_variable) {
+  sequelize = new Sequelize(process.env[config.use_env_variable], config);
+} else {
+  sequelize = new Sequelize(config.database, config.username, config.password, config);
+}
+
+fs
+  .readdirSync(__dirname)
+  .filter(file => {
+    return (file.indexOf('.') !== 0) && (file !== basename) && (file.slice(-3) === '.js');
+  })
+  .forEach(file => {
+    const model = require(path.join(__dirname, file))(sequelize, Sequelize.DataTypes);
+    db[model.name] = model;
+  });
+
+Object.keys(db).forEach(modelName => {
+  if (db[modelName].associate) {
+    db[modelName].associate(db);
+  }
+});
+
+db.sequelize = sequelize;
+db.Sequelize = Sequelize;
+
+module.exports = db;

example/monaco_editor/models/index.js

@@ -0,0 +1,25 @@
+'use strict';
+const {
+  Model
+} = require('sequelize');
+module.exports = (sequelize, DataTypes) => {
+  class User extends Model {
+    /**
+     * Helper method for defining associations.
+     * This method is not a part of Sequelize lifecycle.
+     * The `models/index` file will call this method automatically.
+     */
+    static associate(models) {
+      // define association here
+    }
+  };
+  User.init({
+    firstName: DataTypes.STRING,
+    lastName: DataTypes.STRING,
+    email: DataTypes.STRING
+  }, {
+    sequelize,
+    modelName: 'User',
+  });
+  return User;
+};

example/monaco_editor/models/user.js

@@ -5,12 +5,13 @@
   "main": "index.js",
   "license": "MIT",
   "scripts": {
-    "compile": "tsc",
-    "copy": "cp src/index.html lib/index.html",
-    "build": "yarn build:server && yarn build:client",
-    "build:client": "yarn compile && webpack && yarn run copy",
-    "build:server": "cd ../../ && yarn",
-    "start": "node lib/server.js"
+    "tsc": "tsc",
+    "tsc:watch": "tsc -w",
+    "webpack:watch": "webpack -w",
+    "copy": "cp src/index.html dist/index.html",
+    "build": "yarn tsc && webpack && yarn run copy",
+    "watch": "run-p copy webpack:watch",
+    "start": "ts-node-dev --transpile-only ./src/server/server.ts"
   },
   "dependencies": {
     "express": "^4.17.1",
@@ -25,9 +26,17 @@
     "@types/ws": "^7.2.6",
     "css-loader": "^3.6.0",
     "file-loader": "^6.0.0",
+    "npm-run-all": "^4.1.5",
+    "sequelize": "^6.3.3",
+    "sequelize-cli": "^6.2.0",
     "source-map-loader": "^1.0.1",
     "style-loader": "^1.2.1",
+    "svelte": "^3.24.0",
+    "svelte-loader": "^2.13.6",
+    "ts-loader": "^7.0.5",
+    "ts-node-dev": "^1.0.0-pre.50",
     "typescript": "^3.9.6",
+    "wait-on": "^5.0.1",
     "webpack": "^4.43.0",
     "webpack-cli": "^3.3.12"
   }

packages/server/example/monaco_editor/package.json renamed to example/monaco_editor/package.json

@@ -0,0 +1,32 @@
+<script>
+  import { executeFixAllFixableProblemsCommand } from './client'
+
+  const commands = [
+    { id: 'fixAllFixableProblems', text: 'fixAllFixableProblems' },
+    // TODO
+    // { id: 'switchDatabaseConnection', text: 'switchDatabaseConnection' },
+  ]
+
+  let command = commands[0]
+
+  function handleSubmitCommand() {
+    if (command.id === 'fixAllFixableProblems') {
+      executeFixAllFixableProblemsCommand()
+    }
+  }
+</script>
+
+<h1>Monaco Language Client SQLLanguageServer Sample</h1>
+
+<form on:submit|preventDefault={handleSubmitCommand}>
+  <select bind:value={command}>
+    {#each commands as command}
+      <option value={command}>
+        {command.text}
+      </option>
+    {/each}
+  </select>
+  <button type=submit>Submit</button>
+</form>
+
+<div id="container" style="width:800px;height:600px;border:1px solid grey"></div>

example/monaco_editor/src/client/App.svelte

@@ -0,0 +1,92 @@
+/// <reference types="monaco-editor-core/monaco"/>
+
+import { listen, MessageConnection } from "vscode-ws-jsonrpc";
+import {
+  MonacoLanguageClient,
+  MonacoServices,
+  createConnection,
+  ExecuteCommandParams,
+} from "monaco-languageclient";
+import ReconnectingWebSocket from "reconnecting-websocket";
+import { URI } from 'vscode-uri'
+
+let languageClient: MonacoLanguageClient;
+export function initClient() {
+  monaco.languages.register({
+    id: "sql",
+    extensions: [".sql"],
+    aliases: ["SQL", "sql"],
+    mimetypes: ["application/json"],
+  });
+
+  const value = `SELECT * FROM users`;
+  const editor = monaco.editor.create(document.getElementById("container")!, {
+    model: monaco.editor.createModel(
+      value,
+      "sql",
+      monaco.Uri.parse("inmemory://model.sql")
+    ),
+    glyphMargin: true,
+    tabCompletion: "on",
+  });
+
+  MonacoServices.install(editor);
+
+  const URL = "ws://localhost:3000/server";
+  const webSocket = createWebSocket(URL) as WebSocket;
+  listen({
+    webSocket,
+    onConnection: (connection) => {
+      languageClient = createLanguageClient(connection);
+      const disposable = languageClient.start();
+      connection.onClose(() => disposable.dispose());
+    },
+  });
+
+  function createLanguageClient(
+    connection: MessageConnection
+  ): MonacoLanguageClient {
+    return new MonacoLanguageClient({
+      name: "SQL Language Server MonacoClient",
+      clientOptions: {
+        documentSelector: ["sql"],
+        workspaceFolder: {
+          uri: URI.file('/opt/sql-language-server/example/monaco_editor'),
+          name: 'workspace',
+          index: 0
+        }
+      },
+      connectionProvider: {
+        get: (errorHandler, closeHandler) => {
+          return Promise.resolve(
+            createConnection(connection, errorHandler, closeHandler)
+          );
+        },
+      },
+    });
+  }
+
+  function createWebSocket(url: string): ReconnectingWebSocket {
+    const socketOptions = {
+      maxReconnectionDelay: 10000,
+      minReconnectionDelay: 1000,
+      reconnectionDelayGrowFactor: 1.3,
+      connectionTimeout: 10000,
+      maxRetries: Infinity,
+      debug: false,
+    };
+    return new ReconnectingWebSocket(url, [], socketOptions);
+  }
+}
+
+export function getLanguageClient() {
+  return languageClient;
+}
+
+export function executeFixAllFixableProblemsCommand() {
+  const params: ExecuteCommandParams = {
+    command: 'fixAllFixableProblems',
+    arguments: ['inmemory://model.sql']
+  }
+  languageClient.sendRequest('workspace/executeCommand', params)
+}