conflict in transactions

This commit is contained in:
Jonathan Rainville 2018-10-24 10:45:06 -04:00
parent 2ed2f9388b
commit bc0a89fd6d
4 changed files with 59 additions and 39 deletions

View File

@ -1,9 +1,17 @@
import PropTypes from "prop-types";
import React from 'react';
import {CardTitle} from 'reactstrap';
import Blockies from 'react-blockies';
const CardTitleIdenticon = ({id, children}) => (
<CardTitle><Blockies seed={id} className="rounded"/><span className="ml-2 align-top">{children}</span></CardTitle>
)
<CardTitle>
<Blockies seed={id} className="rounded"/><span className="ml-2 align-top text-truncate">{children}</span>
</CardTitle>
);
export default CardTitleIdenticon
CardTitleIdenticon.propTypes = {
id: PropTypes.string,
children: PropTypes.object
};
export default CardTitleIdenticon;

View File

@ -7,3 +7,8 @@
.dark-theme .explorer-row {
border-bottom-color: #23282c;
}
.explorer-row .text-truncate {
width: 90%;
display: inline-block;
}

View File

@ -4,48 +4,54 @@ import {Row, Col, Card, CardHeader, CardBody} from 'reactstrap';
import PropTypes from 'prop-types';
import CardTitleIdenticon from './CardTitleIdenticon';
import LoadMore from "./LoadMore";
const Transactions = ({transactions}) => (
const Transactions = ({transactions, showLoadMore, loadMore}) => (
<Row>
<Col>
<h1>Transactions</h1>
{transactions.map(transaction => (
<Card key={transaction.hash}>
<CardHeader>
<CardTitleIdenticon id={transaction.hash}>Transaction&nbsp;
<Link to={`/embark/explorer/transactions/${transaction.hash}`}>
{transaction.hash}
</Link>
</CardTitleIdenticon>
</CardHeader>
<CardBody>
<Row>
<Col>
<strong>Block number</strong>
<div>{transaction.blockNumber}</div>
</Col>
<Col>
<strong>From</strong>
<div>{transaction.from}</div>
</Col>
<Col>
<strong>To</strong>
<div>{transaction.to}</div>
</Col>
<Col>
<strong>Type</strong>
<div>{transaction.to ? "Contract Call" : "Contract Creation"}</div>
</Col>
</Row>
</CardBody>
</Card>
))}
<Card>
<CardHeader>
<h1>Transactions</h1>
</CardHeader>
<CardBody>
{transactions.map(transaction => (
<div className="explorer-row" key={transaction.hash}>
<CardTitleIdenticon id={transaction.hash}>Transaction&nbsp;
<Link to={`/embark/explorer/transactions/${transaction.hash}`}>
{transaction.hash}
</Link>
</CardTitleIdenticon>
<Row>
<Col>
<strong>Block number</strong>
<div>{transaction.blockNumber}</div>
</Col>
<Col>
<strong>From</strong>
<div>{transaction.from}</div>
</Col>
<Col>
<strong>To</strong>
<div>{transaction.to}</div>
</Col>
<Col>
<strong>Type</strong>
<div>{transaction.to ? "Contract Call" : "Contract Creation"}</div>
</Col>
</Row>
</div>
))}
{showLoadMore && <LoadMore loadMore={() => loadMore()} />}
</CardBody>
</Card>
</Col>
</Row>
);
Transactions.propTypes = {
transactions: PropTypes.arrayOf(PropTypes.object)
transactions: PropTypes.arrayOf(PropTypes.object),
showLoadMore: PropTypes.bool,
loadMore: PropTypes.func
};
export default Transactions;

View File

@ -3,6 +3,7 @@ import {connect} from 'react-redux';
import PropTypes from 'prop-types';
import {transactions as transactionsAction, initBlockHeader, stopBlockHeader} from '../actions';
import Blocks from "../components/Blocks";
import LoadMore from "../components/LoadMore";
import Transactions from '../components/Transactions';
import DataWrapper from "../components/DataWrapper";
@ -34,9 +35,9 @@ class TransactionsContainer extends Component {
return (
<React.Fragment>
<DataWrapper shouldRender={this.props.transactions.length > 0} {...this.props} render={({transactions}) => (
<Transactions transactions={transactions} />
<Transactions transactions={transactions}
showLoadMore={(this.loadMoreFrom() >= 0)} loadMore={() => this.loadMore()} />
)} />
{(this.loadMoreFrom() > 0) ? <LoadMore loadMore={() => this.loadMore()} /> : <React.Fragment />}
</React.Fragment>
);
}