Extend tests for TxList
This commit is contained in:
parent
a133e41e16
commit
296301e284
17
js/src/ui/TxList/TxRow/index.js
Normal file
17
js/src/ui/TxList/TxRow/index.js
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
// Copyright 2015, 2016 Ethcore (UK) Ltd.
|
||||||
|
// This file is part of Parity.
|
||||||
|
|
||||||
|
// Parity is free software: you can redistribute it and/or modify
|
||||||
|
// it under the terms of the GNU General Public License as published by
|
||||||
|
// the Free Software Foundation, either version 3 of the License, or
|
||||||
|
// (at your option) any later version.
|
||||||
|
|
||||||
|
// Parity is distributed in the hope that it will be useful,
|
||||||
|
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
// GNU General Public License for more details.
|
||||||
|
|
||||||
|
// You should have received a copy of the GNU General Public License
|
||||||
|
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||||
|
|
||||||
|
export default from './txRow';
|
133
js/src/ui/TxList/TxRow/txRow.js
Normal file
133
js/src/ui/TxList/TxRow/txRow.js
Normal file
@ -0,0 +1,133 @@
|
|||||||
|
// Copyright 2015, 2016 Ethcore (UK) Ltd.
|
||||||
|
// This file is part of Parity.
|
||||||
|
|
||||||
|
// Parity is free software: you can redistribute it and/or modify
|
||||||
|
// it under the terms of the GNU General Public License as published by
|
||||||
|
// the Free Software Foundation, either version 3 of the License, or
|
||||||
|
// (at your option) any later version.
|
||||||
|
|
||||||
|
// Parity is distributed in the hope that it will be useful,
|
||||||
|
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
// GNU General Public License for more details.
|
||||||
|
|
||||||
|
// You should have received a copy of the GNU General Public License
|
||||||
|
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||||
|
|
||||||
|
import moment from 'moment';
|
||||||
|
import React, { Component, PropTypes } from 'react';
|
||||||
|
|
||||||
|
import { txLink, addressLink } from '~/3rdparty/etherscan/links';
|
||||||
|
|
||||||
|
import IdentityIcon from '../../IdentityIcon';
|
||||||
|
import IdentityName from '../../IdentityName';
|
||||||
|
import MethodDecoding from '../../MethodDecoding';
|
||||||
|
|
||||||
|
import styles from '../txList.css';
|
||||||
|
|
||||||
|
export default class TxRow extends Component {
|
||||||
|
static contextTypes = {
|
||||||
|
api: PropTypes.object.isRequired
|
||||||
|
};
|
||||||
|
|
||||||
|
static propTypes = {
|
||||||
|
tx: PropTypes.object.isRequired,
|
||||||
|
address: PropTypes.string.isRequired,
|
||||||
|
isTest: PropTypes.bool.isRequired,
|
||||||
|
|
||||||
|
block: PropTypes.object,
|
||||||
|
historic: PropTypes.bool,
|
||||||
|
className: PropTypes.string
|
||||||
|
};
|
||||||
|
|
||||||
|
static defaultProps = {
|
||||||
|
historic: true
|
||||||
|
};
|
||||||
|
|
||||||
|
render () {
|
||||||
|
const { tx, address, isTest, historic, className } = this.props;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<tr className={ className || '' }>
|
||||||
|
{ this.renderBlockNumber(tx.blockNumber) }
|
||||||
|
{ this.renderAddress(tx.from) }
|
||||||
|
<td className={ styles.transaction }>
|
||||||
|
{ this.renderEtherValue(tx.value) }
|
||||||
|
<div>⇒</div>
|
||||||
|
<div>
|
||||||
|
<a
|
||||||
|
className={ styles.link }
|
||||||
|
href={ txLink(tx.hash, isTest) }
|
||||||
|
target='_blank'>
|
||||||
|
{ `${tx.hash.substr(2, 6)}...${tx.hash.slice(-6)}` }
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
{ this.renderAddress(tx.to) }
|
||||||
|
<td className={ styles.method }>
|
||||||
|
<MethodDecoding
|
||||||
|
historic={ historic }
|
||||||
|
address={ address }
|
||||||
|
transaction={ tx } />
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
renderAddress (address) {
|
||||||
|
const { isTest } = this.props;
|
||||||
|
|
||||||
|
let esLink = null;
|
||||||
|
if (address) {
|
||||||
|
esLink = (
|
||||||
|
<a
|
||||||
|
href={ addressLink(address, isTest) }
|
||||||
|
target='_blank'
|
||||||
|
className={ styles.link }>
|
||||||
|
<IdentityName address={ address } shorten />
|
||||||
|
</a>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<td className={ styles.address }>
|
||||||
|
<div className={ styles.center }>
|
||||||
|
<IdentityIcon
|
||||||
|
center
|
||||||
|
className={ styles.icon }
|
||||||
|
address={ address } />
|
||||||
|
</div>
|
||||||
|
<div className={ styles.center }>
|
||||||
|
{ esLink || 'DEPLOY' }
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
renderEtherValue (_value) {
|
||||||
|
const { api } = this.context;
|
||||||
|
const value = api.util.fromWei(_value);
|
||||||
|
|
||||||
|
if (value.eq(0)) {
|
||||||
|
return <div className={ styles.value }>{ ' ' }</div>;
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className={ styles.value }>
|
||||||
|
{ value.toFormat(5) }<small>ETH</small>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
renderBlockNumber (_blockNumber) {
|
||||||
|
const { block } = this.props;
|
||||||
|
const blockNumber = _blockNumber.toNumber();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<td className={ styles.timestamp }>
|
||||||
|
<div>{ blockNumber && block ? moment(block.timestamp).fromNow() : null }</div>
|
||||||
|
<div>{ blockNumber ? _blockNumber.toFormat() : 'Pending' }</div>
|
||||||
|
</td>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
51
js/src/ui/TxList/TxRow/txRow.spec.js
Normal file
51
js/src/ui/TxList/TxRow/txRow.spec.js
Normal file
@ -0,0 +1,51 @@
|
|||||||
|
// Copyright 2015, 2016 Ethcore (UK) Ltd.
|
||||||
|
// This file is part of Parity.
|
||||||
|
|
||||||
|
// Parity is free software: you can redistribute it and/or modify
|
||||||
|
// it under the terms of the GNU General Public License as published by
|
||||||
|
// the Free Software Foundation, either version 3 of the License, or
|
||||||
|
// (at your option) any later version.
|
||||||
|
|
||||||
|
// Parity is distributed in the hope that it will be useful,
|
||||||
|
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
// GNU General Public License for more details.
|
||||||
|
|
||||||
|
// You should have received a copy of the GNU General Public License
|
||||||
|
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||||
|
|
||||||
|
import BigNumber from 'bignumber.js';
|
||||||
|
import React from 'react';
|
||||||
|
import { shallow } from 'enzyme';
|
||||||
|
import sinon from 'sinon';
|
||||||
|
|
||||||
|
import Api from '~/api';
|
||||||
|
|
||||||
|
import TxRow from './txRow';
|
||||||
|
|
||||||
|
const api = new Api({ execute: sinon.stub() });
|
||||||
|
|
||||||
|
function renderShallow (props) {
|
||||||
|
return shallow(
|
||||||
|
<TxRow
|
||||||
|
{ ...props } />,
|
||||||
|
{ context: { api } }
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
describe('ui/TxRow', () => {
|
||||||
|
describe('rendering', () => {
|
||||||
|
it('renders defaults', () => {
|
||||||
|
const block = {
|
||||||
|
timestamp: new Date()
|
||||||
|
};
|
||||||
|
const tx = {
|
||||||
|
blockNumber: new BigNumber(123),
|
||||||
|
hash: '0x123456789abcdef0123456789abcdef0123456789abcdef',
|
||||||
|
value: new BigNumber(1)
|
||||||
|
};
|
||||||
|
|
||||||
|
expect(renderShallow({ block, tx })).to.be.ok;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
@ -14,128 +14,16 @@
|
|||||||
// You should have received a copy of the GNU General Public License
|
// You should have received a copy of the GNU General Public License
|
||||||
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||||
|
|
||||||
import moment from 'moment';
|
|
||||||
import React, { Component, PropTypes } from 'react';
|
import React, { Component, PropTypes } from 'react';
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import { bindActionCreators } from 'redux';
|
import { bindActionCreators } from 'redux';
|
||||||
import { observer } from 'mobx-react';
|
import { observer } from 'mobx-react';
|
||||||
|
|
||||||
import { txLink, addressLink } from '../../3rdparty/etherscan/links';
|
|
||||||
|
|
||||||
import IdentityIcon from '../IdentityIcon';
|
|
||||||
import IdentityName from '../IdentityName';
|
|
||||||
import MethodDecoding from '../MethodDecoding';
|
|
||||||
import Store from './store';
|
import Store from './store';
|
||||||
|
import TxRow from './TxRow';
|
||||||
|
|
||||||
import styles from './txList.css';
|
import styles from './txList.css';
|
||||||
|
|
||||||
export class TxRow extends Component {
|
|
||||||
static contextTypes = {
|
|
||||||
api: PropTypes.object.isRequired
|
|
||||||
};
|
|
||||||
|
|
||||||
static propTypes = {
|
|
||||||
tx: PropTypes.object.isRequired,
|
|
||||||
address: PropTypes.string.isRequired,
|
|
||||||
isTest: PropTypes.bool.isRequired,
|
|
||||||
|
|
||||||
block: PropTypes.object,
|
|
||||||
historic: PropTypes.bool,
|
|
||||||
className: PropTypes.string
|
|
||||||
};
|
|
||||||
|
|
||||||
static defaultProps = {
|
|
||||||
historic: true
|
|
||||||
};
|
|
||||||
|
|
||||||
render () {
|
|
||||||
const { tx, address, isTest, historic, className } = this.props;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<tr className={ className || '' }>
|
|
||||||
{ this.renderBlockNumber(tx.blockNumber) }
|
|
||||||
{ this.renderAddress(tx.from) }
|
|
||||||
<td className={ styles.transaction }>
|
|
||||||
{ this.renderEtherValue(tx.value) }
|
|
||||||
<div>⇒</div>
|
|
||||||
<div>
|
|
||||||
<a
|
|
||||||
className={ styles.link }
|
|
||||||
href={ txLink(tx.hash, isTest) }
|
|
||||||
target='_blank'>
|
|
||||||
{ `${tx.hash.substr(2, 6)}...${tx.hash.slice(-6)}` }
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
{ this.renderAddress(tx.to) }
|
|
||||||
<td className={ styles.method }>
|
|
||||||
<MethodDecoding
|
|
||||||
historic={ historic }
|
|
||||||
address={ address }
|
|
||||||
transaction={ tx } />
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
renderAddress (address) {
|
|
||||||
const { isTest } = this.props;
|
|
||||||
|
|
||||||
let esLink = null;
|
|
||||||
if (address) {
|
|
||||||
esLink = (
|
|
||||||
<a
|
|
||||||
href={ addressLink(address, isTest) }
|
|
||||||
target='_blank'
|
|
||||||
className={ styles.link }>
|
|
||||||
<IdentityName address={ address } shorten />
|
|
||||||
</a>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<td className={ styles.address }>
|
|
||||||
<div className={ styles.center }>
|
|
||||||
<IdentityIcon
|
|
||||||
center
|
|
||||||
className={ styles.icon }
|
|
||||||
address={ address } />
|
|
||||||
</div>
|
|
||||||
<div className={ styles.center }>
|
|
||||||
{ esLink || 'DEPLOY' }
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
renderEtherValue (_value) {
|
|
||||||
const { api } = this.context;
|
|
||||||
const value = api.util.fromWei(_value);
|
|
||||||
|
|
||||||
if (value.eq(0)) {
|
|
||||||
return <div className={ styles.value }>{ ' ' }</div>;
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className={ styles.value }>
|
|
||||||
{ value.toFormat(5) }<small>ETH</small>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
renderBlockNumber (_blockNumber) {
|
|
||||||
const { block } = this.props;
|
|
||||||
const blockNumber = _blockNumber.toNumber();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<td className={ styles.timestamp }>
|
|
||||||
<div>{ blockNumber && block ? moment(block.timestamp).fromNow() : null }</div>
|
|
||||||
<div>{ blockNumber ? _blockNumber.toFormat() : 'Pending' }</div>
|
|
||||||
</td>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@observer
|
@observer
|
||||||
class TxList extends Component {
|
class TxList extends Component {
|
||||||
static contextTypes = {
|
static contextTypes = {
|
||||||
|
52
js/src/ui/TxList/txList.spec.js
Normal file
52
js/src/ui/TxList/txList.spec.js
Normal file
@ -0,0 +1,52 @@
|
|||||||
|
// Copyright 2015, 2016 Ethcore (UK) Ltd.
|
||||||
|
// This file is part of Parity.
|
||||||
|
|
||||||
|
// Parity is free software: you can redistribute it and/or modify
|
||||||
|
// it under the terms of the GNU General Public License as published by
|
||||||
|
// the Free Software Foundation, either version 3 of the License, or
|
||||||
|
// (at your option) any later version.
|
||||||
|
|
||||||
|
// Parity is distributed in the hope that it will be useful,
|
||||||
|
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
// GNU General Public License for more details.
|
||||||
|
|
||||||
|
// You should have received a copy of the GNU General Public License
|
||||||
|
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||||
|
|
||||||
|
import React from 'react';
|
||||||
|
import { shallow } from 'enzyme';
|
||||||
|
import sinon from 'sinon';
|
||||||
|
|
||||||
|
import Api from '~/api';
|
||||||
|
|
||||||
|
import TxList from './txList';
|
||||||
|
|
||||||
|
const api = new Api({ execute: sinon.stub() });
|
||||||
|
|
||||||
|
const STORE = {
|
||||||
|
getState: () => {
|
||||||
|
return {
|
||||||
|
nodeStatus: {
|
||||||
|
isTest: true
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function renderShallow (props) {
|
||||||
|
return shallow(
|
||||||
|
<TxList
|
||||||
|
store={ STORE }
|
||||||
|
{ ...props } />,
|
||||||
|
{ context: { api } }
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
describe('ui/TxList', () => {
|
||||||
|
describe('rendering', () => {
|
||||||
|
it('renders defaults', () => {
|
||||||
|
expect(renderShallow()).to.be.ok;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
Loading…
Reference in New Issue
Block a user