Skip to content
This repository has been archived by the owner on May 19, 2023. It is now read-only.

rsksmart/rconnect

 
 

Repository files navigation

RConnect Browser Extension

RConnect is a browser extension to operate with the RSK blockchain and the RIF Lumino Network. It's a fork of the Metamask-based wallet Nifty Wallet. This wallet lets you make payments using Lumino, manage your RNS domains and operate over RSK blockchain networks.

How to use

You can use RConnect by simply adding a generated build of this plugin into your browser. To do so you need to build the plugin first, and for this you need to follow the steps under How to build section.

After you successfully generate a build then you need to add that build to your browser, you can do that following the steps depending on what browser are you working on:

How to Build

  • Clone this repo if you didn't already
  • Install Node.js version 10.x.x
    • If you are using nvm (recommended) running nvm install 10 will automatically choose the right node version for you.
    • If you don't use nvm then you need to install npm globally: npm install -g npm@6.9.0
  • Clone Lumino Light Client SDK from here.
    • The SDK repository folder needs to be at the same level as the RConnect folder in order to work properly.
    • You need to go to the SDK folder and run npm install && npm run build to generate the SDK build.
  • Go to the parent root folder of the project on your terminal
  • Install dependencies: npm install
  • Install gulp globally with npm install -g gulp-cli.
  • Build the project to the ./dist/ folder with gulp build.
  • Optionally, to rebuild on file changes, run gulp dev.
  • To package .zip files for distribution, run gulp zip, or run the full build & zip with gulp dist.

Uncompressed builds can be found in /dist, compressed builds can be found in /builds once they're built.

Running Tests

Requires mocha installed. Run npm install -g mocha.

Then just run npm test.

You can also test with a continuously watching process, via npm run watch.

You can run the linter by itself with gulp lint.

Architecture

RConnect Internal Architecture:

Architecture Diagram

RConnect General Architecture:

General Diagram

Build for Development

If you are going to develop and use local RIF Services see here to configure for local development.

Execute this in the terminal:

npm install
npm start

After you see something like this the plugin is ready and watching changes.

[18:13:40] Starting 'manifest:chrome'...
[18:13:40] Finished 'manifest:chrome' after 24 ms
[18:13:40] Starting 'manifest:opera'...
[18:13:40] Finished 'manifest:opera' after 6.87 ms
[18:13:40] Finished 'dev:copy' after 51 s
[18:13:40] Finished 'dev:extension:js:ui' after 48 s
[18:13:40] Finished 'dev:extension:js' after 51 s

Build for Publishing

Execute this on a terminal:

npm run dist

When you see something like this Finished 'dist' after 1.15 min you can kill gulp, the build is ready.

Multi Language Support

You can add new translations to support new languages. To do this you need to follow some steps:

  • First you need to check the folder languages inside the project root to see if your language isn't already there, if the language it's there you should add the translation.
  • If your language file is not there you should:
    • Create a json file inside the folder languages with the name as the language key code (ex: on english language we use en.json)
    • Add a content similar to this on the new file:
    {
      "name": "The language name to display (ex: English)",
      "key": "The language key code (ex: en)",
      "translations": {
        "key in default language that's english": "translation on the language that we want"
      }
    }
    • Next you need to add the translations for your language in this file removing the example translation. You can do that by just taking other language file by example. Translations should be added in the translations object inside the language json file as a key value map.
    • Now as the last step you need to add your file into the languages/index.js file like a javascript module and exported as the language key. Here we have an example for English and Spanish:
      import en from './en.json';
      import es from './es.json';
      
      export default {
        en,
        es,
      }

Writing Browser Tests

To write tests that will be run in the browser using QUnit, add your test files to test/integration/lib.

Other Docs

Packages

No packages published

Languages

  • JavaScript 81.2%
  • CSS 18.1%
  • HTML 0.4%
  • SCSS 0.2%
  • Solidity 0.1%
  • Shell 0.0%