Don't query chain in Signer, use Redux isTest

This commit is contained in:
Jaco Greeff 2016-11-18 19:07:13 +01:00
parent 51012d1fae
commit 1686d23522
12 changed files with 117 additions and 87 deletions

View File

@ -25,7 +25,7 @@ export default class Account extends Component {
static propTypes = {
className: PropTypes.string,
address: PropTypes.string.isRequired,
chain: PropTypes.string.isRequired,
isTest: PropTypes.bool.isRequired,
balance: PropTypes.object // eth BigNumber, not required since it mght take time to fetch
};
@ -51,11 +51,13 @@ export default class Account extends Component {
}
render () {
const { address, chain, className } = this.props;
const { address, isTest, className } = this.props;
return (
<div className={ `${styles.acc} ${className}` }>
<AccountLink address={ address } chain={ chain }>
<AccountLink
address={ address }
isTest={ isTest }>
<IdentityIcon
center
address={ address } />
@ -74,19 +76,23 @@ export default class Account extends Component {
}
renderName () {
const { address } = this.props;
const { address, isTest } = this.props;
const name = <IdentityName address={ address } empty />;
if (!name) {
return (
<AccountLink address={ address } chain={ this.props.chain }>
<AccountLink
address={ address }
isTest={ isTest }>
[{ this.shortAddress(address) }]
</AccountLink>
);
}
return (
<AccountLink address={ address } chain={ this.props.chain } >
<AccountLink
address={ address }
isTest={ isTest } >
<span>
<span className={ styles.name }>{ name }</span>
<span className={ styles.address }>[{ this.tinyAddress(address) }]</span>

View File

@ -21,7 +21,7 @@ import styles from './AccountLink.css';
export default class AccountLink extends Component {
static propTypes = {
chain: PropTypes.string.isRequired,
isTest: PropTypes.bool.isRequired,
address: PropTypes.string.isRequired,
className: PropTypes.string,
children: PropTypes.node
@ -32,15 +32,15 @@ export default class AccountLink extends Component {
};
componentWillMount () {
const { address, chain } = this.props;
const { address, isTest } = this.props;
this.updateLink(address, chain);
this.updateLink(address, isTest);
}
componentWillReceiveProps (nextProps) {
const { address, chain } = nextProps;
const { address, isTest } = nextProps;
this.updateLink(address, chain);
this.updateLink(address, isTest);
}
render () {
@ -56,8 +56,8 @@ export default class AccountLink extends Component {
);
}
updateLink (address, chain) {
const link = addressLink(address, chain === 'morden' || chain === 'testnet');
updateLink (address, isTest) {
const link = addressLink(address, isTest);
this.setState({
link

View File

@ -31,14 +31,16 @@ export default class RequestFinishedWeb3 extends Component {
msg: PropTypes.string,
status: PropTypes.string,
error: PropTypes.string,
className: PropTypes.string
className: PropTypes.string,
isTest: PropTypes.bool.isRequired
}
render () {
const { payload, id, result, msg, status, error, date, className } = this.props;
const { payload, id, result, msg, status, error, date, className, isTest } = this.props;
if (payload.sign) {
const { sign } = payload;
return (
<SignRequest
className={ className }
@ -49,12 +51,14 @@ export default class RequestFinishedWeb3 extends Component {
msg={ msg }
status={ status }
error={ error }
isTest={ isTest }
/>
);
}
if (payload.transaction) {
const { transaction } = payload;
return (
<TransactionFinished
className={ className }
@ -69,6 +73,7 @@ export default class RequestFinishedWeb3 extends Component {
date={ date }
status={ status }
error={ error }
isTest={ isTest }
/>
);
}

View File

@ -30,7 +30,8 @@ export default class RequestPendingWeb3 extends Component {
PropTypes.shape({ transaction: PropTypes.object.isRequired }),
PropTypes.shape({ sign: PropTypes.object.isRequired })
]).isRequired,
className: PropTypes.string
className: PropTypes.string,
isTest: PropTypes.bool.isRequired
};
onConfirm = data => {
@ -41,10 +42,11 @@ export default class RequestPendingWeb3 extends Component {
};
render () {
const { payload, id, className, isSending, date, onReject } = this.props;
const { payload, id, className, isSending, date, onReject, isTest } = this.props;
if (payload.sign) {
const { sign } = payload;
return (
<SignRequest
className={ className }
@ -55,12 +57,14 @@ export default class RequestPendingWeb3 extends Component {
id={ id }
address={ sign.address }
hash={ sign.hash }
isTest={ isTest }
/>
);
}
if (payload.transaction) {
const { transaction } = payload;
return (
<TransactionPending
className={ className }
@ -75,6 +79,7 @@ export default class RequestPendingWeb3 extends Component {
to={ transaction.to }
value={ transaction.value }
date={ date }
isTest={ isTest }
/>
);
}

View File

@ -39,24 +39,15 @@ export default class SignRequest extends Component {
onReject: PropTypes.func,
status: PropTypes.string,
className: PropTypes.string,
chain: nullable(PropTypes.object),
isTest: PropTypes.bool.isRequired,
balance: nullable(PropTypes.object)
};
state = {
chain: null,
balance: null
}
componentWillMount () {
this.context.api.parity.netChain()
.then((chain) => {
this.setState({ chain });
})
.catch((err) => {
console.error('could not fetch chain', err);
});
this.context.api.eth.getBalance(this.props.address)
.then((balance) => {
this.setState({ balance });
@ -68,6 +59,7 @@ export default class SignRequest extends Component {
render () {
const { className } = this.props;
return (
<div className={ `${styles.container} ${className || ''}` }>
{ this.renderDetails() }
@ -77,15 +69,20 @@ export default class SignRequest extends Component {
}
renderDetails () {
const { address, hash } = this.props;
const { balance, chain } = this.state;
const { address, hash, isTest } = this.props;
const { balance } = this.state;
if (!balance || !chain) return (<div />);
if (!balance) {
return <div />;
}
return (
<div className={ styles.signDetails }>
<div className={ styles.address }>
<Account address={ address } balance={ balance } chain={ chain } />
<Account
address={ address }
balance={ balance }
isTest={ isTest } />
</div>
<div className={ styles.info } title={ hash }>
<p>Dapp is requesting to sign arbitrary transaction using this account.</p>
@ -100,15 +97,17 @@ export default class SignRequest extends Component {
if (isFinished) {
if (status === 'confirmed') {
const { hash } = this.props;
const { chain } = this.state;
const { hash, isTest } = this.props;
return (
<div className={ styles.actions }>
<span className={ styles.isConfirmed }>Confirmed</span>
<div>
Transaction hash:
<TxHashLink chain={ chain } txHash={ hash } className={ styles.txHash } />
<TxHashLink
isTest={ isTest }
txHash={ hash }
className={ styles.txHash } />
</div>
</div>
);

View File

@ -47,13 +47,12 @@ export default class TransactionFinished extends Component {
txHash: PropTypes.string, // undefined if transacation is rejected
className: PropTypes.string,
data: PropTypes.string,
chain: nullable(PropTypes.object),
isTest: PropTypes.bool.isRequired,
fromBalance: nullable(PropTypes.object),
toBalance: nullable(PropTypes.object)
};
state = {
chain: null,
fromBalance: null,
toBalance: null
};
@ -64,14 +63,6 @@ export default class TransactionFinished extends Component {
const totalValue = tUtil.getTotalValue(fee, value);
this.setState({ totalValue });
this.context.api.parity.netChain()
.then((chain) => {
this.setState({ chain });
})
.catch((err) => {
console.error('could not fetch chain', err);
});
this.fetchBalance(from, 'fromBalance');
if (to) {
this.fetchBalance(to, 'toBalance');
@ -79,8 +70,9 @@ export default class TransactionFinished extends Component {
}
render () {
const { chain, fromBalance, toBalance } = this.state;
if (!chain || !fromBalance || !toBalance) {
const { fromBalance, toBalance } = this.state;
if (!fromBalance || !toBalance) {
return (
<div className={ `${styles.container} ${className}` }>
<CircularProgress size={ 60 } />
@ -130,16 +122,19 @@ export default class TransactionFinished extends Component {
}
renderTxHash () {
const { txHash } = this.props;
const { chain } = this.state;
if (!txHash || !chain) {
const { txHash, isTest } = this.props;
if (!txHash) {
return;
}
return (
<div>
Transaction hash:
<TxHashLink chain={ chain } txHash={ txHash } className={ styles.txHash } />
<TxHashLink
isTest={ isTest }
txHash={ txHash }
className={ styles.txHash } />
</div>
);
}

View File

@ -30,7 +30,7 @@ export default class TransactionMainDetails extends Component {
fromBalance: PropTypes.object, // eth BigNumber, not required since it might take time to fetch
value: PropTypes.object.isRequired, // wei hex
totalValue: PropTypes.object.isRequired, // wei BigNumber
chain: PropTypes.string.isRequired,
isTest: PropTypes.isTest.isRequired,
to: PropTypes.string, // undefined if it's a contract
toBalance: PropTypes.object, // eth BigNumber - undefined if it's a contract or until it's fetched
className: PropTypes.string,
@ -39,11 +39,13 @@ export default class TransactionMainDetails extends Component {
componentWillMount () {
const { value, totalValue } = this.props;
this.updateDisplayValues(value, totalValue);
}
componentWillReceiveProps (nextProps) {
const { value, totalValue } = nextProps;
this.updateDisplayValues(value, totalValue);
}
@ -59,6 +61,7 @@ export default class TransactionMainDetails extends Component {
render () {
const { className, children } = this.props;
return (
<div className={ className }>
{ this.renderTransfer() }
@ -69,7 +72,8 @@ export default class TransactionMainDetails extends Component {
}
renderTransfer () {
const { from, fromBalance, to, toBalance, chain } = this.props;
const { from, fromBalance, to, toBalance, isTest } = this.props;
if (!to) {
return;
}
@ -78,7 +82,10 @@ export default class TransactionMainDetails extends Component {
<div className={ styles.transaction }>
<div className={ styles.from }>
<div className={ styles.account }>
<Account address={ from } balance={ fromBalance } chain={ chain } />
<Account
address={ from }
balance={ fromBalance }
isTest={ isTest } />
</div>
</div>
<div className={ styles.tx }>
@ -88,7 +95,10 @@ export default class TransactionMainDetails extends Component {
</div>
<div className={ styles.to }>
<div className={ styles.account }>
<Account address={ to } balance={ toBalance } chain={ chain } />
<Account
address={ to }
balance={ toBalance }
isTest={ isTest } />
</div>
</div>
</div>
@ -96,15 +106,20 @@ export default class TransactionMainDetails extends Component {
}
renderContract () {
const { from, fromBalance, to, chain } = this.props;
const { from, fromBalance, to, isTest } = this.props;
if (to) {
return;
}
return (
<div className={ styles.transaction }>
<div className={ styles.from }>
<div className={ styles.account }>
<Account address={ from } balance={ fromBalance } chain={ chain } />
<Account
address={ from }
balance={ fromBalance }
isTest={ isTest } />
</div>
</div>
<div className={ styles.tx }>
@ -126,6 +141,7 @@ export default class TransactionMainDetails extends Component {
renderValue () {
const { id } = this.props;
const { valueDisplay, valueDisplayWei } = this.state;
return (
<div>
<div
@ -147,6 +163,7 @@ export default class TransactionMainDetails extends Component {
renderTotalValue () {
const { id } = this.props;
const { totalValueDisplay, totalValueDisplayWei, feeEth } = this.state;
return (
<div>
<div
@ -164,5 +181,4 @@ export default class TransactionMainDetails extends Component {
</div>
);
}
}

View File

@ -16,7 +16,6 @@
import React, { Component, PropTypes } from 'react';
import CircularProgress from 'material-ui/CircularProgress';
import TransactionMainDetails from '../TransactionMainDetails';
import TransactionPendingForm from '../TransactionPendingForm';
import TransactionSecondaryDetails from '../TransactionSecondaryDetails';
@ -43,7 +42,8 @@ export default class TransactionPending extends Component {
onConfirm: PropTypes.func.isRequired,
onReject: PropTypes.func.isRequired,
isSending: PropTypes.bool.isRequired,
className: PropTypes.string
className: PropTypes.string,
isTest: PropTypes.bool.isRequired
};
static defaultProps = {
@ -51,7 +51,6 @@ export default class TransactionPending extends Component {
};
state = {
chain: null,
fromBalance: null,
toBalance: null
};
@ -64,28 +63,12 @@ export default class TransactionPending extends Component {
const gasToDisplay = tUtil.getGasDisplay(gas);
this.setState({ gasPriceEthmDisplay, totalValue, gasToDisplay });
this.context.api.parity.netChain()
.then((chain) => {
this.setState({ chain });
})
.catch((err) => {
console.error('could not fetch chain', err);
});
const { from, to } = this.props;
this.fetchBalance(from, 'fromBalance');
if (to) this.fetchBalance(to, 'toBalance');
}
render () {
if (!this.state.chain) {
return (
<div className={ `${styles.container} ${className}` }>
<CircularProgress size={ 60 } />
</div>
);
}
const { totalValue, gasPriceEthmDisplay, gasToDisplay } = this.state;
const { className, id, date, data, from } = this.props;

View File

@ -59,10 +59,13 @@ export default class TransactionSecondaryDetails extends Component {
}
renderGasPrice () {
if (!this.props.gasPriceEthmDisplay && !this.props.gasToDisplay) return null;
if (!this.props.gasPriceEthmDisplay && !this.props.gasToDisplay) {
return null;
}
const { id } = this.props;
const { gasPriceEthmDisplay, gasToDisplay } = this.props;
return (
<div
data-tip
@ -83,11 +86,14 @@ export default class TransactionSecondaryDetails extends Component {
}
renderData () {
if (!this.props.data) return null;
if (!this.props.data) {
return null;
}
const { data, id } = this.props;
let dataToDisplay = this.noData() ? 'no data' : tUtil.getShortData(data);
const noDataClass = this.noData() ? styles.noData : '';
return (
<div
className={ `${styles.data} ${noDataClass}` }

View File

@ -22,17 +22,17 @@ export default class TxHashLink extends Component {
static propTypes = {
txHash: PropTypes.string.isRequired,
chain: PropTypes.string.isRequired,
isTest: PropTypes.bool.isRequired,
children: PropTypes.node,
className: PropTypes.string
}
render () {
const { children, txHash, className, chain } = this.props;
const { children, txHash, className, isTest } = this.props;
return (
<a
href={ txLink(txHash, chain === 'morden' || chain === 'testnet') }
href={ txLink(txHash, isTest) }
target='_blank'
className={ className }>
{ children || txHash }

View File

@ -35,7 +35,8 @@ class Embedded extends Component {
actions: PropTypes.shape({
startConfirmRequest: PropTypes.func.isRequired,
startRejectRequest: PropTypes.func.isRequired
}).isRequired
}).isRequired,
isTest: PropTypes.bool.isRequired
};
render () {
@ -70,7 +71,7 @@ class Embedded extends Component {
}
renderPending = (data) => {
const { actions } = this.props;
const { actions, isTest } = this.props;
const { payload, id, isSending, date } = data;
return (
@ -83,6 +84,7 @@ class Embedded extends Component {
id={ id }
payload={ payload }
date={ date }
isTest={ isTest }
/>
);
}
@ -93,11 +95,13 @@ class Embedded extends Component {
}
function mapStateToProps (state) {
const { isTest } = state.nodeStatus;
const { actions, signer } = state;
return {
actions,
signer
signer,
isTest
};
}

View File

@ -35,7 +35,8 @@ class RequestsPage extends Component {
actions: PropTypes.shape({
startConfirmRequest: PropTypes.func.isRequired,
startRejectRequest: PropTypes.func.isRequired
}).isRequired
}).isRequired,
isTest: PropTypes.bool.isRequired
};
render () {
@ -96,7 +97,7 @@ class RequestsPage extends Component {
}
renderPending = (data) => {
const { actions } = this.props;
const { actions, isTest } = this.props;
const { payload, id, isSending, date } = data;
return (
@ -109,11 +110,13 @@ class RequestsPage extends Component {
id={ id }
payload={ payload }
date={ date }
isTest={ isTest }
/>
);
}
renderFinished = (data) => {
const { isTest } = this.props;
const { payload, id, result, msg, status, error, date } = data;
return (
@ -127,6 +130,7 @@ class RequestsPage extends Component {
error={ error }
payload={ payload }
date={ date }
isTest={ isTest }
/>
);
}
@ -143,7 +147,14 @@ class RequestsPage extends Component {
}
function mapStateToProps (state) {
return state;
const { isTest } = state.nodeStatus;
const { actions, signer } = state;
return {
actions,
signer,
isTest
};
}
function mapDispatchToProps (dispatch) {