Rain Language Support for Visual Studio Code (vscode extention)

Rain language support for vscode. Uses Rain Language Services from rainlang repo under the hood.

Functionality

Rain Language Server works for rain files with .rain, .rainlang or .rl extentions and also syntax highlighting and code completion in Tagged Template Literals of javascript/typescript files in form of:

rainlang`result: add(1 2);`

It has the following language features:

• Completions
• Diagnostics
• Hovers

It also includes an End-to-End test.

Tutorial

Configuring Op Meta

After installing the extention from vscode marketplace, if .vscode/settings.json does not already exists in your workspace, create it and add the following property:

"rainlang.opmeta": "0x123abcd...   // op meta compressed bytes in hex string"

or

"rainlang.opmeta": {
  "deployerAddress": "0x12345...",
  "source": {
    "subgraphUrl": "https://api.thegraph.com/..." 
  }
}

or

"rainlang.opmeta": {
  "deployerAddress": "0x12345...",
  "source": {
    "chainId": 524289
  }
}

• 524289 is Mumbai (Polygon testnet) chain id.
• if no chainId or subgraphUrl are provided, the default Mumbai subgraph will be used and if both are provided, subgraph URL will be prioritized.
  

Compilation

Use Rainlang Compile command accessible from Command Palette or from editor's context menu (right-click) to compile the selected rainlang document and get the ExpressionConfig.

Developers Guide

• Clone the repo and open VS Code on this folder.
• Run npm install in this folder or nix-shell if you have nix installed on your machine. This installs all necessary npm modules in both the client and server folder
• Switch to the Run and Debug View in the Sidebar (Ctrl+Shift+D).
• Select Launch Client from the drop down (if it is not already).
• Press ▷ to run the launch config (F5) which will open a new instance of vscode called Extension Development Host.
• In the Extension Development Host instance of VSCode, open or create a new workscpace and then create .vscode/settings.json and set the opmeta as explained above in Tutorial section.
• Create a document that ends with .rain to start the language mode for that. (save this workspace to have them ready for future).
  • Start typing your expression and get the completion for opcodes.
  • Hover over some of the opcodes or values to get hover items.
  • The diagnostics will be generated automatically.
    

Structure

.
├── client // Rain Language Client
│   ├── src
│   │   ├── test // End to End tests for Language Client / Server
│   │   └── extension.ts // Language Client entry point
├── package.json // The extension manifest.
└── server // Rain Language Server
    └── src
        └── server.ts // Language Server entry point