diff --git a/js/src/dapps/gavcoin/Application/application.js b/js/src/dapps/gavcoin/Application/application.js
index 1ae5d870a..c5eda9db8 100644
--- a/js/src/dapps/gavcoin/Application/application.js
+++ b/js/src/dapps/gavcoin/Application/application.js
@@ -53,6 +53,7 @@ export default class Application extends Component {
action: null,
address: null,
accounts: [],
+ accountsInfo: {},
blockNumber: new BigNumber(-1),
ethBalance: new BigNumber(0),
gavBalance: new BigNumber(0),
@@ -68,7 +69,7 @@ export default class Application extends Component {
}
render () {
- const { accounts, address, blockNumber, gavBalance, loading, price, remaining, totalSupply } = this.state;
+ const { accounts, accountsInfo, address, blockNumber, gavBalance, loading, price, remaining, totalSupply } = this.state;
if (loading) {
return (
@@ -93,7 +94,7 @@ export default class Application extends Component {
gavBalance={ gavBalance }
onAction={ this.onAction } />
+ accountsInfo={ accountsInfo } />
);
}
@@ -216,8 +217,8 @@ export default class Application extends Component {
api.personal.accountsInfo()
]);
})
- .then(([address, addresses, infos]) => {
- infos = infos || {};
+ .then(([address, addresses, accountsInfo]) => {
+ accountsInfo = accountsInfo || {};
console.log(`gavcoin was found at ${address}`);
const contract = api.newContract(abis.gavcoin, address);
@@ -226,9 +227,10 @@ export default class Application extends Component {
loading: false,
address,
contract,
+ accountsInfo,
instance: contract.instance,
accounts: addresses.map((address) => {
- const info = infos[address] || {};
+ const info = accountsInfo[address] || {};
return {
address,
diff --git a/js/src/dapps/gavcoin/Events/Event/event.js b/js/src/dapps/gavcoin/Events/Event/event.js
index 0b4094ac0..c068454f0 100644
--- a/js/src/dapps/gavcoin/Events/Event/event.js
+++ b/js/src/dapps/gavcoin/Events/Event/event.js
@@ -14,10 +14,11 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see .
+import moment from 'moment';
import React, { Component, PropTypes } from 'react';
import IdentityIcon from '../../IdentityIcon';
-import { formatBlockNumber, formatCoins, formatEth } from '../../format';
+import { formatCoins, formatEth, formatHash } from '../../format';
import styles from '../events.css';
@@ -27,7 +28,8 @@ const EMPTY_COLUMN = (
export default class Event extends Component {
static contextTypes = {
- accounts: PropTypes.array.isRequired
+ accountsInfo: PropTypes.object.isRequired,
+ api: PropTypes.object.isRequired
}
static propTypes = {
@@ -38,14 +40,23 @@ export default class Event extends Component {
toAddress: PropTypes.string
}
+ state = {
+ block: null
+ }
+
+ componentDidMount () {
+ this.loadBlock();
+ }
+
render () {
const { event, fromAddress, toAddress, price, value } = this.props;
- const { blockNumber, state, type } = event;
+ const { block } = this.state;
+ const { state, type } = event;
const cls = `${styles.event} ${styles[state]} ${styles[type.toLowerCase()]}`;
return (
- { this.renderBlockNumber(blockNumber) }
+ { this.renderTimestamp(block) }
{ this.renderType(type) }
{ this.renderValue(value) }
{ this.renderPrice(price) }
@@ -55,10 +66,10 @@ export default class Event extends Component {
);
}
- renderBlockNumber (blockNumber) {
+ renderTimestamp (block) {
return (
- { formatBlockNumber(blockNumber) }
+ { !block ? ' ' : moment(block.timestamp).fromNow() }
|
);
}
@@ -77,8 +88,8 @@ export default class Event extends Component {
}
renderAddressName (address) {
- const { accounts } = this.context;
- const account = accounts.find((_account) => _account.address === address);
+ const { accountsInfo } = this.context;
+ const account = accountsInfo[address];
if (account && account.name) {
return (
@@ -90,7 +101,7 @@ export default class Event extends Component {
return (
- { address }
+ { formatHash(address) }
);
}
@@ -126,4 +137,19 @@ export default class Event extends Component {
);
}
+
+ loadBlock () {
+ const { api } = this.context;
+ const { event } = this.props;
+
+ if (!event || !event.blockNumber || event.blockNumber.eq(0)) {
+ return;
+ }
+
+ api.eth
+ .getBlockByNumber(event.blockNumber)
+ .then((block) => {
+ this.setState({ block });
+ });
+ }
}
diff --git a/js/src/dapps/gavcoin/Events/events.css b/js/src/dapps/gavcoin/Events/events.css
index 9be9b37af..cf9184744 100644
--- a/js/src/dapps/gavcoin/Events/events.css
+++ b/js/src/dapps/gavcoin/Events/events.css
@@ -16,18 +16,20 @@
*/
.events {
padding: 4em 2em;
+ text-align: center;
}
.list {
- width: 100%;
+ margin: 0 auto;
border: none;
border-spacing: 0;
+ text-align: left;
}
.list td {
vertical-align: top;
- padding: 4px 0.5em;
- max-height: 32px;
+ padding: 0.25em 1em;
+ max-height: 1.5em;
}
.event {
@@ -38,7 +40,6 @@
.blocknumber,
.ethvalue,
.gavvalue {
- font-family: 'Roboto Mono', monospace;
}
.blocknumber,
diff --git a/js/src/dapps/gavcoin/Events/events.js b/js/src/dapps/gavcoin/Events/events.js
index ba71d6541..97dac30bb 100644
--- a/js/src/dapps/gavcoin/Events/events.js
+++ b/js/src/dapps/gavcoin/Events/events.js
@@ -27,7 +27,7 @@ import styles from './events.css';
export default class Events extends Component {
static childContextTypes = {
- accounts: PropTypes.array
+ accountsInfo: PropTypes.object
}
static contextTypes = {
@@ -36,7 +36,7 @@ export default class Events extends Component {
}
static propTypes = {
- accounts: PropTypes.array
+ accountsInfo: PropTypes.object.isRequired
}
state = {
@@ -84,11 +84,9 @@ export default class Events extends Component {
}
getChildContext () {
- const { accounts } = this.props;
+ const { accountsInfo } = this.props;
- return {
- accounts
- };
+ return { accountsInfo };
}
setupFilters () {
diff --git a/js/src/dapps/gavcoin/format/index.js b/js/src/dapps/gavcoin/format/index.js
index 5e32012d0..ee554bb60 100644
--- a/js/src/dapps/gavcoin/format/index.js
+++ b/js/src/dapps/gavcoin/format/index.js
@@ -50,3 +50,7 @@ export function formatCoins (amount, decimals = 6) {
export function formatEth (eth, decimals = 3) {
return api.util.fromWei(eth).toFormat(decimals);
}
+
+export function formatHash (hash) {
+ return `${hash.substr(0, 10)}...${hash.substr(-8)}`;
+}