-
+const AccList = ({
+ accounts, defaultAccount, changeAccount, isLoading, classNameNavDropdown,
+}) => (
+
+ {!isLoading ?
+
+
+
+
+
+
+
+
+ : Loading...
}
+
+);
- }
+AccList.propTypes = {
+ accounts: arrayOf(shape({ address: string, balance: string })).isRequired,
+ defaultAccount: string,
+ changeAccount: func.isRequired,
+ isLoading: bool.isRequired,
+ classNameNavDropdown: string
+}
- export default AccList;
\ No newline at end of file
+const mapStateToProps = state => ({
+ accounts: getAccounts(state),
+ defaultAccount: getDefaultAccount(state),
+ isLoading: accountsIsLoading(state),
+});
+
+const mapDispatchToProps = dispatch => ({
+ changeAccount(address) {
+ web3.eth.defaultAccount = address;
+ dispatch(accountActions.updateDefaultAccount(address));
+ },
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(AccList);
diff --git a/app/components/erc20token.js b/app/components/erc20token.js
index 6695adf..173b706 100644
--- a/app/components/erc20token.js
+++ b/app/components/erc20token.js
@@ -1,27 +1,24 @@
import EmbarkJS from 'Embark/EmbarkJS';
import ERC20Token from 'Embark/contracts/ERC20Token';
import React from 'react';
+import { connect } from 'react-redux';
import { Form, FormGroup, FormControl, HelpBlock, Button } from 'react-bootstrap';
+import { getCurrentAccount, accountsIsLoading } from '../reducers/accounts';
class ERC20TokenUI extends React.Component {
constructor(props) {
super(props);
+ ERC20Token.options.address = props.address;
this.state = {
-
balanceOf: 0,
transferTo: "",
transferAmount: 0,
- logs: []
+ accountBalance: 0,
+ accountB: web3.eth.defaultAccount,
}
}
- contractAddress(e){
- e.preventDefault();
- var tokenAddress = e.target.value;
- ERC20Token.options.address = tokenAddress;
- }
-
update_transferTo(e){
this.setState({transferTo: e.target.value});
}
@@ -50,7 +47,6 @@ class ERC20TokenUI extends React.Component {
if (EmbarkJS.isNewWeb3()) {
ERC20Token.methods.balanceOf(who).call()
.then(_value => this.setState({balanceOf: _value}))
-
} else {
ERC20Token.balanceOf(who)
.then(_value => this.x({balanceOf: _value}));
@@ -58,74 +54,79 @@ class ERC20TokenUI extends React.Component {
this._addToLog(ERC20Token.options.address+".balanceOf(" + who + ")");
}
+ getDefaultAccountBalance(){
+ if (EmbarkJS.isNewWeb3()) {
+ ERC20Token.methods.balanceOf(web3.eth.defaultAccount).call()
+ .then(_value => this.setState({accountBalance: _value}))
+ } else {
+ ERC20Token.balanceOf(web3.eth.defaultAccount)
+ .then(_value => this.x({valueGet: _value}))
+ }
+ this._addToLog(ERC20Token.options.address + ".balanceOf(" + web3.eth.defaultAccount + ")");
+ }
_addToLog(txt){
- this.state.logs.push(txt);
- this.setState({logs: this.state.logs});
+ console.log(txt);
}
- render(){
- return (
-
- Set token contract address
-
-
- Read account token balance
-
-
- Transfer/Approve token balance
-
-
- Contract Calls
- Javascript calls being made:
-
- {
- this.state.logs.map((item, i) =>
{item}
)
- }
-
+ Transfer/Approve token balance
+
+
- );
- }
+ );
+ }
}
- export default ERC20TokenUI;
\ No newline at end of file
+const mapStateToProps = state => ({
+ account: getCurrentAccount(state),
+ isLoading: accountsIsLoading(state),
+});
+
+export default connect(mapStateToProps)(ERC20TokenUI);
diff --git a/app/components/testtoken.js b/app/components/testtoken.js
index 3618caa..0670abc 100644
--- a/app/components/testtoken.js
+++ b/app/components/testtoken.js
@@ -2,17 +2,16 @@ import EmbarkJS from 'Embark/EmbarkJS';
import TestToken from 'Embark/contracts/TestToken';
import React from 'react';
import { Form, FormGroup, FormControl, HelpBlock, Button } from 'react-bootstrap';
-
+import ERC20TokenUI from './erc20token';
+import { connect } from 'react-redux';
+import { actions as accountActions } from '../reducers/accounts';
+
class TestTokenUI extends React.Component {
constructor(props) {
super(props);
this.state = {
amountToMint: 100,
- accountBalance: 0,
- accountB: web3.eth.defaultAccount,
- balanceOf: 0,
- logs: []
}
}
@@ -20,41 +19,25 @@ class TestTokenUI extends React.Component {
this.setState({amountToMint: e.target.value});
}
- mint(e){
+ mint(e){
+ const { addToBalance } = this.props;
e.preventDefault();
var value = parseInt(this.state.amountToMint, 10);
if (EmbarkJS.isNewWeb3()) {
- TestToken.methods.mint(value).send({from: web3.eth.defaultAccount});
+ TestToken.methods.mint(value).send({from: web3.eth.defaultAccount})
+ .then(r => { addToBalance(value) });
} else {
- TestToken.mint(value);
- this._addToLog("#blockchain", "TestToken.mint(" + value + ")");
+ TestToken.mint(value).send({from: web3.eth.defaultAccount})
+ .then(r => { addToBalance(value) });
}
- this._addToLog(TestToken.options.address +".mint("+value+").send({from: " + web3.eth.defaultAccount + "})");
+ console.log(TestToken.options.address +".mint("+value+").send({from: " + web3.eth.defaultAccount + "})");
}
-
- getBalance(e){
- e.preventDefault();
-
- if (EmbarkJS.isNewWeb3()) {
- TestToken.methods.balanceOf(web3.eth.defaultAccount).call()
- .then(_value => this.setState({accountBalance: _value}))
- } else {
- TestToken.balanceOf(web3.eth.defaultAccount)
- .then(_value => this.x({valueGet: _value}))
- }
- this._addToLog(TestToken.options.address + ".balanceOf(" + web3.eth.defaultAccount + ")");
- }
-
- _addToLog(txt){
- this.state.logs.push(txt);
- this.setState({logs: this.state.logs});
- }
-
+
render(){
return (
- 1. Mint Test Token
+ Mint Test Token
- 2. Read your account token balance
-
-
- 3. Contract Calls
- Javascript calls being made:
-
- {
- this.state.logs.map((item, i) =>
{item}
)
- }
-
+
+
);
}
}
- export default TestTokenUI;
\ No newline at end of file
+const mapDispatchToProps = dispatch => ({
+ addToBalance(amount) {
+ dispatch(accountActions.addToErc20TokenBalance(amount));
+ },
+});
+
+export default connect(null, mapDispatchToProps)(TestTokenUI);
diff --git a/app/dapp.js b/app/dapp.js
index a0744b3..ca9825c 100644
--- a/app/dapp.js
+++ b/app/dapp.js
@@ -5,7 +5,6 @@ import { Tabs, Tab } from 'react-bootstrap';
import EmbarkJS from 'Embark/EmbarkJS';
import TopNavbar from './components/topnavbar';
import TestTokenUI from './components/testtoken';
-import ERC20TokenUI from './components/erc20token';
import './dapp.css';
@@ -40,12 +39,9 @@ class App extends React.Component {
-
-
-
, document.getElementById('app'));
+export default App;
diff --git a/app/index.html b/app/index.html
index 1fb8607..43438ee 100644
--- a/app/index.html
+++ b/app/index.html
@@ -7,6 +7,6 @@