diff --git a/embark-ui/src/components/Blocks.js b/embark-ui/src/components/Blocks.js index 3ae9bb9e..f57c1387 100644 --- a/embark-ui/src/components/Blocks.js +++ b/embark-ui/src/components/Blocks.js @@ -4,48 +4,50 @@ import {Row, Col, Card, CardHeader, CardBody} from 'reactstrap'; import PropTypes from 'prop-types'; import CardTitleIdenticon from './CardTitleIdenticon'; +import LoadMore from "./LoadMore"; -const Blocks = ({blocks}) => ( +const Blocks = ({blocks, showLoadMore, loadMore}) => ( -

Blocks

- {blocks.map(block => ( - - - Block  - - {block.number} - - - - - - - Number -
{block.number}
- - - Mined On -
{new Date(block.timestamp * 1000).toLocaleString()}
- - - Gas Used -
{block.gasUsed}
- - - TX Count -
{block.transactions.length}
- -
-
-
- ))} + + +

Blocks

+
+ + {blocks.map(block => ( +
+ Block  + + {block.number} + + + + + Mined On +
{new Date(block.timestamp * 1000).toLocaleString()}
+ + + Gas Used +
{block.gasUsed}
+ + + TX Count +
{block.transactions.length}
+ +
+
+ ))} + {showLoadMore && loadMore()} />} +
+
); Blocks.propTypes = { - blocks: PropTypes.arrayOf(PropTypes.object) + blocks: PropTypes.arrayOf(PropTypes.object), + showLoadMore: PropTypes.bool, + loadMore: PropTypes.func }; export default Blocks; diff --git a/embark-ui/src/components/Explorer.css b/embark-ui/src/components/Explorer.css new file mode 100644 index 00000000..29e9480d --- /dev/null +++ b/embark-ui/src/components/Explorer.css @@ -0,0 +1,9 @@ +.explorer-row { + margin-bottom: 20px; + padding-bottom: 5px; + border-bottom: 1px solid #c8ced3; +} + +.dark-theme .explorer-row { + border-bottom-color: #23282c; +} diff --git a/embark-ui/src/components/ExplorerDashboardLayout.js b/embark-ui/src/components/ExplorerDashboardLayout.js index 64a5e479..4dcb3cf3 100644 --- a/embark-ui/src/components/ExplorerDashboardLayout.js +++ b/embark-ui/src/components/ExplorerDashboardLayout.js @@ -8,6 +8,8 @@ import AccountsContainer from '../containers/AccountsContainer'; import BlocksContainer from '../containers/BlocksContainer'; import TransactionsContainer from '../containers/TransactionsContainer'; +import './Explorer.css'; + const ExplorerDashboardLayout = () => ( diff --git a/embark-ui/src/containers/BlocksContainer.js b/embark-ui/src/containers/BlocksContainer.js index 7420a01e..1163214f 100644 --- a/embark-ui/src/containers/BlocksContainer.js +++ b/embark-ui/src/containers/BlocksContainer.js @@ -5,7 +5,6 @@ import PropTypes from 'prop-types'; import {blocks as blocksAction, initBlockHeader, stopBlockHeader} from '../actions'; import Blocks from '../components/Blocks'; import DataWrapper from "../components/DataWrapper"; -import LoadMore from "../components/LoadMore"; import {getBlocks} from "../reducers/selectors"; class BlocksContainer extends Component { @@ -34,9 +33,8 @@ class BlocksContainer extends Component { return ( 0} {...this.props} render={({blocks}) => ( - + = 0)} loadMore={() => this.loadMore()} /> )} /> - {(this.loadMoreFrom() >= 0) ? this.loadMore()} /> : } ); }