diff --git a/js/src/ui/MethodDecoding/methodDecoding.js b/js/src/ui/MethodDecoding/methodDecoding.js index d35f12d5b..648ff271b 100644 --- a/js/src/ui/MethodDecoding/methodDecoding.js +++ b/js/src/ui/MethodDecoding/methodDecoding.js @@ -19,12 +19,11 @@ import React, { Component, PropTypes } from 'react'; import { connect } from 'react-redux'; import { bindActionCreators } from 'redux'; +import Contracts from '../../contracts'; import IdentityIcon from '../IdentityIcon'; import IdentityName from '../IdentityName'; import { Input, InputAddress } from '../Form'; -import { fetchBytecode, fetchMethod } from '../../redux/providers/blockchainActions'; - import styles from './methodDecoding.css'; const CONTRACT_CREATE = '0x60606040'; @@ -41,12 +40,7 @@ class MethodDecoding extends Component { address: PropTypes.string.isRequired, tokens: PropTypes.object, transaction: PropTypes.object, - historic: PropTypes.bool, - - fetchBytecode: PropTypes.func, - fetchMethod: PropTypes.func, - bytecodes: PropTypes.object, - methods: PropTypes.object + historic: PropTypes.bool } state = { @@ -63,58 +57,7 @@ class MethodDecoding extends Component { } componentWillMount () { - const { transaction } = this.props; - this.lookup(transaction); - } - - componentDidMount () { - this.setMethod(this.props); - } - - componentWillReceiveProps (newProps) { - const { transaction } = this.props; - this.setMethod(newProps); - - if (newProps.transaction.hash !== transaction.hash) { - this.lookup(transaction); - return; - } - } - - setMethod (props) { - const { bytecodes, methods } = props; - const { contractAddress, methodSignature, methodParams } = this.state; - - if (contractAddress && bytecodes[contractAddress]) { - const bytecode = bytecodes[contractAddress]; - - if (bytecode && bytecode !== '0x') { - this.setState({ isContract: true }); - } - } - - if (methodSignature && methods[methodSignature]) { - const method = methods[methodSignature]; - const { api } = this.context; - - let methodInputs = null; - let methodName = null; - - if (method && method.length) { - const abi = api.util.methodToAbi(method); - - methodName = abi.name; - methodInputs = api.util - .decodeMethodInput(abi, methodParams) - .map((value, index) => { - const type = abi.inputs[index].type; - - return { type, value }; - }); - } - - this.setState({ method, methodName, methodInputs }); - } + this.lookup(); } render () { @@ -321,7 +264,9 @@ class MethodDecoding extends Component { ); } - lookup (transaction) { + lookup () { + const { transaction } = this.props; + if (!transaction) { return; } @@ -347,26 +292,51 @@ class MethodDecoding extends Component { return; } - const { fetchBytecode, fetchMethod } = this.props; + Promise + .all([ + api.eth.getCode(contractAddress), + Contracts.get().signatureReg.lookup(signature) + ]) + .then(([bytecode, method]) => { + let methodInputs = null; + let methodName = null; - fetchBytecode(contractAddress); - fetchMethod(signature); + if (method && method.length) { + const { methodParams } = this.state; + const abi = api.util.methodToAbi(method); + + methodName = abi.name; + methodInputs = api.util + .decodeMethodInput(abi, methodParams) + .map((value, index) => { + const type = abi.inputs[index].type; + + return { type, value }; + }); + } + + this.setState({ + method, + methodName, + methodInputs, + bytecode, + isContract: bytecode && bytecode !== '0x' + }); + }) + .catch((error) => { + console.warn('lookup', error); + }); } } function mapStateToProps (state) { const { tokens } = state.balances; - const { bytecodes, methods } = state.blockchain; - return { - tokens, bytecodes, methods - }; + return { tokens }; } function mapDispatchToProps (dispatch) { - return bindActionCreators({ - fetchBytecode, fetchMethod - }, dispatch); + return bindActionCreators({}, dispatch); } export default connect( diff --git a/js/src/views/Account/Transactions/Transaction/transaction.js b/js/src/views/Account/Transactions/Transaction/transaction.js index 3eed8bbfb..d84917d6b 100644 --- a/js/src/views/Account/Transactions/Transaction/transaction.js +++ b/js/src/views/Account/Transactions/Transaction/transaction.js @@ -17,46 +17,37 @@ import BigNumber from 'bignumber.js'; import React, { Component, PropTypes } from 'react'; import moment from 'moment'; -import { connect } from 'react-redux'; -import { bindActionCreators } from 'redux'; - -import { fetchBlock, fetchTransaction } from '../../../../redux/providers/blockchainActions'; import { IdentityIcon, IdentityName, MethodDecoding } from '../../../../ui'; import { txLink, addressLink } from '../../../../3rdparty/etherscan/links'; import styles from '../transactions.css'; -class Transaction extends Component { +export default class Transaction extends Component { static contextTypes = { api: PropTypes.object.isRequired } static propTypes = { - transaction: PropTypes.object.isRequired, address: PropTypes.string.isRequired, isTest: PropTypes.bool.isRequired, - - fetchBlock: PropTypes.func.isRequired, - fetchTransaction: PropTypes.func.isRequired, - - block: PropTypes.object, - transactionInfo: PropTypes.object + transaction: PropTypes.object.isRequired } state = { isContract: false, - isReceived: false + isReceived: false, + transaction: null, + block: null } componentDidMount () { - const { address, transaction } = this.props; - - this.lookup(address, transaction); + this.lookup(); } render () { - const { block, transaction } = this.props; + const { block } = this.state; + const { transaction } = this.props; return ( @@ -75,9 +66,10 @@ class Transaction extends Component { } renderMethod () { - const { address, transactionInfo } = this.props; + const { address } = this.props; + const { transaction } = this.state; - if (!transactionInfo) { + if (!transaction) { return null; } @@ -85,12 +77,13 @@ class Transaction extends Component { + transaction={ transaction } /> ); } renderTransaction () { - const { transaction, isTest } = this.props; + const { isTest } = this.props; + const { transaction } = this.props; return ( @@ -138,13 +131,13 @@ class Transaction extends Component { renderEtherValue () { const { api } = this.context; - const { transactionInfo } = this.props; + const { transaction } = this.state; - if (!transactionInfo) { + if (!transaction) { return null; } - const value = api.util.fromWei(transactionInfo.value); + const value = api.util.fromWei(transaction.value); if (value.eq(0)) { return
{ ' ' }
; @@ -177,34 +170,22 @@ class Transaction extends Component { return moment(block.timestamp).fromNow(); } - lookup (address, transaction) { - const { transactionInfo } = this.props; - - if (transactionInfo) { - return; - } + lookup () { + const { api } = this.context; + const { transaction, address } = this.props; this.setState({ isReceived: address === transaction.to }); - const { fetchBlock, fetchTransaction } = this.props; - const { blockNumber, hash } = transaction; - - fetchBlock(blockNumber); - fetchTransaction(hash); + Promise + .all([ + api.eth.getBlockByNumber(transaction.blockNumber), + api.eth.getTransactionByHash(transaction.hash) + ]) + .then(([block, transaction]) => { + this.setState({ block, transaction }); + }) + .catch((error) => { + console.warn('lookup', error); + }); } } - -function mapStateToProps () { - return {}; -} - -function mapDispatchToProps (dispatch) { - return bindActionCreators({ - fetchBlock, fetchTransaction - }, dispatch); -} - -export default connect( - mapStateToProps, - mapDispatchToProps -)(Transaction); diff --git a/js/src/views/Account/Transactions/transactions.js b/js/src/views/Account/Transactions/transactions.js index 77bdf60a3..fcbb2ce41 100644 --- a/js/src/views/Account/Transactions/transactions.js +++ b/js/src/views/Account/Transactions/transactions.js @@ -38,9 +38,7 @@ class Transactions extends Component { contracts: PropTypes.object, tokens: PropTypes.object, isTest: PropTypes.bool, - traceMode: PropTypes.bool, - blocks: PropTypes.object, - transactionsInfo: PropTypes.object + traceMode: PropTypes.bool } state = { @@ -121,7 +119,7 @@ class Transactions extends Component { } renderRows () { - const { address, accounts, contacts, contracts, tokens, isTest, blocks, transactionsInfo } = this.props; + const { address, accounts, contacts, contracts, tokens, isTest } = this.props; const { transactions } = this.state; return (transactions || []) @@ -130,16 +128,9 @@ class Transactions extends Component { }) .slice(0, 25) .map((transaction, index) => { - const { blockNumber, hash } = transaction; - - const block = blocks[blockNumber.toString()]; - const transactionInfo = transactionsInfo[hash]; - return ( { - if (traceMode) { - return this.fetchTraceTransactions(address); - } + // if (traceMode) { + // return this.fetchTraceTransactions(address); + // } return this.fetchEtherscanTransactions(isTest, address); } @@ -211,7 +202,6 @@ function mapStateToProps (state) { const { isTest, traceMode } = state.nodeStatus; const { accounts, contacts, contracts } = state.personal; const { tokens } = state.balances; - const { blocks, transactions } = state.blockchain; return { isTest, @@ -219,9 +209,7 @@ function mapStateToProps (state) { accounts, contacts, contracts, - tokens, - blocks, - transactionsInfo: transactions + tokens }; } diff --git a/js/src/views/Contract/Events/Event/event.js b/js/src/views/Contract/Events/Event/event.js index ba24c1c8f..f45975f94 100644 --- a/js/src/views/Contract/Events/Event/event.js +++ b/js/src/views/Contract/Events/Event/event.js @@ -17,27 +17,24 @@ import BigNumber from 'bignumber.js'; import moment from 'moment'; import React, { Component, PropTypes } from 'react'; -import { connect } from 'react-redux'; -import { bindActionCreators } from 'redux'; -import { fetchBlock, fetchTransaction } from '../../../../redux/providers/blockchainActions'; import { IdentityIcon, IdentityName, Input, InputAddress } from '../../../../ui'; import { txLink } from '../../../../3rdparty/etherscan/links'; import styles from '../../contract.css'; -class Event extends Component { +export default class Event extends Component { static contextTypes = { api: PropTypes.object.isRequired } static propTypes = { event: PropTypes.object.isRequired, - blocks: PropTypes.object, - transactions: PropTypes.object, - isTest: PropTypes.bool, - fetchBlock: PropTypes.func.isRequired, - fetchTransaction: PropTypes.func.isRequired + isTest: PropTypes.bool + } + + state = { + transaction: {} } componentDidMount () { @@ -45,10 +42,9 @@ class Event extends Component { } render () { - const { event, blocks, transactions, isTest } = this.props; + const { event, isTest } = this.props; + const { block, transaction } = this.state; - const block = blocks[event.blockNumber.toString()]; - const transaction = transactions[event.transactionHash] || {}; const classes = `${styles.event} ${styles[event.state]}`; const url = txLink(event.transactionHash, isTest); const keys = Object.keys(event.params).join(', '); @@ -156,31 +152,19 @@ class Event extends Component { } retrieveTransaction () { - const { event, fetchBlock, fetchTransaction } = this.props; + const { api } = this.context; + const { event } = this.props; - fetchBlock(event.blockNumber); - fetchTransaction(event.transactionHash); + Promise + .all([ + api.eth.getBlockByNumber(event.blockNumber), + api.eth.getTransactionByHash(event.transactionHash) + ]) + .then(([block, transaction]) => { + this.setState({ block, transaction }); + }) + .catch((error) => { + console.warn('retrieveTransaction', error); + }); } } - -function mapStateToProps (state) { - const { isTest } = state.nodeStatus; - const { blocks, transactions } = state.blockchain; - - return { - isTest, - blocks, - transactions - }; -} - -function mapDispatchToProps (dispatch) { - return bindActionCreators({ - fetchBlock, fetchTransaction - }, dispatch); -} - -export default connect( - mapStateToProps, - mapDispatchToProps -)(Event); diff --git a/js/src/views/Contract/Events/events.js b/js/src/views/Contract/Events/events.js index 0428a0ee3..382a1c658 100644 --- a/js/src/views/Contract/Events/events.js +++ b/js/src/views/Contract/Events/events.js @@ -27,21 +27,31 @@ export default class Events extends Component { } static propTypes = { - events: PropTypes.array + events: PropTypes.array, + isTest: PropTypes.bool.isRequired } render () { - const { events } = this.props; + const { events, isTest } = this.props; if (!events || !events.length) { return null; } + const list = events.map((event) => { + return ( + + ); + }); + return ( - { events.map((event) => ) } + { list }
); diff --git a/js/src/views/Contract/contract.js b/js/src/views/Contract/contract.js index 4e9e0a9f0..5a65a69b5 100644 --- a/js/src/views/Contract/contract.js +++ b/js/src/views/Contract/contract.js @@ -116,6 +116,7 @@ class Contract extends Component { contract={ contract } values={ queryValues } />