second-state/interest-earner-user-interface

A user interface for the interest earner smart contract

Interest Earner User Interface (UI)

What does it do?

Interacts with the interest earner smart contract, which allows users to stake and unstake tokens.

How do end users interact with the interest earner UI

Users simply load the page, (the user's account details are automatically pre-filled in the address input box)

Staking tokens

The user then simply types in the amount of tokens they would like to stake

The user then clicks the "Stake Tokens" button

Unstaking tokens

The user clicks the "Unstake Tokens" button

Where is the interest earner smart contract

The interest earner smart contract is deployed on the Ethereum mainnet and then this UI source code is updated with the interest earner contract's ABI, deployment address and so forth. This interest earner UI instantiates the staking contract in order to interact and transfer tokens to end users and so forth.

How to deploy this UI

Clone this repository

git clone [email protected]:second-state/interest-earner-user-interface.git

ABI and address of interest earner contract

Paste the ABI into the interest_earner_abi.json file and the address of the interest earner contract's successfully deployed contract instance into the interest_earner_contract_address.json file.

Contract address of ERC20 contract (NOT staking contract)

Paste the ABI into the erc20_abi.json file and the address of the ERC20's successfully deployed contract instance into the erc20_contract_address.json file.

Installing

Then simply type

npm install

Running

Run on local

To run on local system, type

node server.js

The site will then be hosted at http://localhost/

GitHub pages

To publish/deploy on GitHub pages, simply type

npm run deploy

The site will then be hosted to https://second-state.github.io/interest-earner-user-interface/html/index.html

Usage

Just browse to the URL where the UI is hosted and ensure that your MetaMask wallet is configured to run on the same network (where the contracts are deployed). Default is Ethereum mainnet.

interest-earner-user-interface's Issues

Implement functionality for pop-up (disclaimer i.e. beta release)

Replace text

At present there is a message which says Rn-stake
Find and replace with Re-stake

New feature coming - requires UI update

In the future users will be allowed to re-stake principle and interest without performing the round trip to and from wallet software. This is a new Solidity function which has been implemented at a new branch of the interest earner smart contract

https://github.com/second-state/interest-earner-smart-contract/blob/with_re_stake_capability/InterestEarner.sol

This UI needs to have a new page/button which can call this function.

Create Toastify message for when pool is empty

The interface for re-staking requires a pop up message when the contract reverts because the reserve pool is empty.

This is the current console output