echojs-redux

ECHO redux module (echojs-redux)

ECHO redux module for React apps. Can be used to easily connect to and obtain data from the ECHO blockchain via public APIs or local nodes.

Setup

This library can be obtained through npm:

npm install echojs-redux

Usage

Module contain methods for connect, disconnect and fetch data from blockchain. All data stored at redux store and automatically updated via chain subscriptions.

Connect to store

echojs-redux this is easy connect to your store. Here is an example:

import { combineReducers, createStore } from 'redux';
import { EchoJSReducer } from 'echojs-redux';
 
const store = createStore(
      combineReducers({
   	  echojs: EchoJSReducer.reducer,
     })
 );
 
ReactDOM.render(
  <Provider store={store} />
  ...
 document.getElementById('root'),
);

Import our actions:

import { EchoJSActions } from 'echojs-redux';

After it let's lock at action methods:

• connect(address) - used for connect to blockchain.
• disconnect(address) - used for disconnect and clean our state.
• fetch(key) - used for get data from chain.
• setSubscribe(object) - set external subscribe method
• resetSubscribe() - reset external subscribe
• clearStore() - clear echo js redux store (data)

Connect

Syntax: connect([address])

address - string of web-socket URL address to ECHO blockchain.

example:

const address = 'wss://your-chain-address.io/ws';
dispatch(EchoJSActions.connect(address));

In this example we connect to wss://your-chain-address.io/ws.

Fetch

After connect we can fetch some data.

Syntax: fetch(key)

key - string, can be id, user_name or asset_name(if we fetched it before via asset_id).

return - Promise with our requested object.

example:

const userId = '1.2.30';
const userName = 'myUserName234';
const assetId = '1.3.0';
const resultId = '1.17.5';
 
const user = dispatch(EchoJSActions.fetch(userId));
const userByName = dispatch(EchoJSActions.fetch(userName));
const firstAsset = dispatch(EchoJSActions.fetch(assetId));
const result = dispatch(EchoJSActions.fetch(resultId));
 
Promise.all([user, userByName, firstAsset, result]).then(() => { ... })

All our requested data will be stored at redux and if it possible it will be updated, this is our redux state scheme:

import { Map } from 'immutable';
 
"echojs": {
    "system": new Map({
        "ws": EchoJSWSInstance,
        "isSubscribed": false,
        "initPromise": null,
        "instance": EchojsLibInstance,
        "isConnected": false,
    }),
    "data": new Map({
          "accounts": new Map(),
          "assets": new Map(),
          "blocks": new Map(),
          "objects": new Map(),
          "latestBlocks": new List(),
        }),
    "meta": new Map({
          "maxBlockSize": 100,
          "latency": {
              "value": 0,
              "error": null,
          },
          "lastBlockNumber": 0,
          "connectionWatcherDelay": 2000,
    }),
}

We use immutable.js to handle data.

After connect we initialize system.ws and system.instance. You can use system.instance to make your custom request via echojs-lib, more details about it here.

We provide simple tracking system, system.isConnected show us connection node status. You can track latency to your connected node via meta.latency.value, and get information about meta.lastBlockNumber.

All data you ever fetch we store at data. In data.accounts your fetched accounts, data.assets assets, data.latestBlocks last 100 chain blocks, data.blocks fetched blocks, data.objects other objects like results, contracts, statistics ect.

Disconnect

Finally we could clear our storage.

Syntax: disconnect(address)

address - string of web-socket URL address to ECHO blockchain.

example:

const address = 'wss://your-chain-address.io/ws';
dispatch(EchoJSActions.disconnect(address));

address - should be equal with address were you connect before.

Set subscribe method

Syntax: setSubscribe(object)

object = { types, method } - object contain array of types we want to grab from subscribe and function which get data.

example:

const getObject = (subscribeObject) => (dispatch) => {
  switch (subscribeObject.type) {  ... }
};
const subscribeObject = {{ types: ['objects', 'block'], method: getObject };
EchoJSActions.setSubscribe(subscribeObject);

Get each new block and each new object in getObject method when it possible. We provide subscribeObject, to have an opportunity write custom handlers.

Remove subscribe method

Syntax: resetSubscribe()

example:

EchoJSActions.resetSubscribe();

Remove custom subscribe handler.

Clear store data

Syntax: clearStore()

example:

EchoJSActions.clearStore();

Clear all fetched up data.

Tests

To run our test, simply typed npm run test.