Adding account balances

This commit is contained in:
Richard Ramos 2018-05-14 10:58:48 -04:00
parent e1be0cfd41
commit c6c162adcb
3 changed files with 69 additions and 6 deletions

View File

@ -0,0 +1,36 @@
import Web3 from 'web3';
import React from 'react';
import { Grid, Row, Form, FormGroup, FormControl, HelpBlock, Button, ControlLabel, Col, InputGroup, Alert } from 'react-bootstrap';
class AccountBalance extends React.Component {
constructor(props) {
super(props);
this.state = {
eth: 0,
rnd: 0
};
}
async updateBalances(ev){
ev.preventDefault();
this.setState({
eth: await this.props.web3.eth.getBalance(this.props.address),
rnd: await this.props.RND.methods.balanceOf(this.props.address).call()
});
}
render(){
return <div>
<h3>{this.props.name}</h3>
<small>{this.props.address}</small>
<p><b>RDN</b><br /><small>{this.state.rnd}</small></p>
<p><b>ETH</b><br /><small>{this.state.eth}</small></p>
<a href="#" onClick={(ev) => this.updateBalances(ev)}>Update balances</a>
</div>;
}
};
export default AccountBalance;

View File

@ -2,13 +2,16 @@ import Web3 from 'web3';
import React from 'react';
import { Grid, Row, Form, FormGroup, FormControl, HelpBlock, Button, ControlLabel, Col, InputGroup, Alert } from 'react-bootstrap';
import AccountBalance from './accountBalance';
class ApproveAndCallGasRelayed extends React.Component {
constructor(props) {
super(props);
this.state = {
account: '0x1847ab5a71eaa95315c3fc2d3dfb53b7e6e8f313',
address: this.props.IdentityGasRelay.options.address,
topic: '0x4964656e',
to: '0x00',
@ -153,6 +156,17 @@ class ApproveAndCallGasRelayed extends React.Component {
</React.Fragment> : ''
}
<Form>
<Row>
<Col md={3}>
<AccountBalance name="Identity" address={this.state.address} web3={this.props.web3} RND={this.props.RND} />
</Col>
<Col md={3}>
<AccountBalance name="To" address={this.state.to} web3={this.props.web3} RND={this.props.RND} />
</Col>
<Col md={3}>
<AccountBalance name="Gas Relayer Node" address={this.state.account} web3={this.props.web3} RND={this.props.RND} />
</Col>
</Row>
<Row>
<Col md={8}>
<ControlLabel>Identity Address</ControlLabel>
@ -199,11 +213,11 @@ class ApproveAndCallGasRelayed extends React.Component {
<FormControl type="string" defaultValue={this.state.nonce} onChange={(ev) => this.handleChange(ev, 'nonce')} />
</Col>
<Col md={1}>
<ControlLabel>Gas Price</ControlLabel>
<ControlLabel>Gas Price in Tokens</ControlLabel>
<FormControl type="string" defaultValue={this.state.gasPrice} onChange={(ev) => this.handleChange(ev, 'gasPrice')} />
</Col>
<Col md={1}>
<ControlLabel>Gas Limit</ControlLabel>
<ControlLabel>Gas Limit in Ether</ControlLabel>
<FormControl type="string" defaultValue={this.state.gasLimit} onChange={(ev) => this.handleChange(ev, 'gasLimit')} />
</Col>
<Col md={6}>

View File

@ -2,13 +2,15 @@ import Web3 from 'web3';
import React from 'react';
import { Grid, Row, Form, FormGroup, FormControl, HelpBlock, Button, ControlLabel, Col, InputGroup, Alert } from 'react-bootstrap';
import AccountBalance from './accountBalance';
class CallGasRelayed extends React.Component {
constructor(props) {
super(props);
this.state = {
account: '0x1847ab5a71eaa95315c3fc2d3dfb53b7e6e8f313',
address: this.props.IdentityGasRelay.options.address,
topic: '0x4964656e',
to: '0x00',
@ -153,6 +155,17 @@ class CallGasRelayed extends React.Component {
</React.Fragment> : ''
}
<Form>
<Row>
<Col md={3}>
<AccountBalance name="Identity" address={this.state.address} web3={this.props.web3} RND={this.props.RND} />
</Col>
<Col md={3}>
<AccountBalance name="To" address={this.state.to} web3={this.props.web3} RND={this.props.RND} />
</Col>
<Col md={3}>
<AccountBalance name="Gas Relayer Node" address={this.state.account} web3={this.props.web3} RND={this.props.RND} />
</Col>
</Row>
<Row>
<Col md={9}>
<ControlLabel>Identity Address</ControlLabel>
@ -188,11 +201,11 @@ class CallGasRelayed extends React.Component {
<FormControl type="string" defaultValue={this.state.nonce} onChange={(ev) => this.handleChange(ev, 'nonce')} />
</Col>
<Col md={1}>
<ControlLabel>Gas Price</ControlLabel>
<ControlLabel>Gas Price in Tokens</ControlLabel>
<FormControl type="string" defaultValue={this.state.gasPrice} onChange={(ev) => this.handleChange(ev, 'gasPrice')} />
</Col>
<Col md={1}>
<ControlLabel>Gas Limit</ControlLabel>
<ControlLabel>Gas Limit in Ether</ControlLabel>
<FormControl type="string" defaultValue={this.state.gasLimit} onChange={(ev) => this.handleChange(ev, 'gasLimit')} />
</Col>
<Col md={6}>