Extend tests for TxList
This commit is contained in:
Jaco Greeff
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
|
||||
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
import moment from 'moment';
|
||||
import React, { Component, PropTypes } from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import { bindActionCreators } from 'redux';
|
||||
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 TxRow from './TxRow';
|
||||
|
||||
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
|
||||
class TxList extends Component {
|
||||
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