Lint

embark-ui/src/components/Account.js

@@ -4,10 +4,10 @@ import {
 } from "tabler-react";
 import PropTypes from 'prop-types';
 
-
 const Account = ({account}) => (
   <Page.Content title={`Account ${account.address}`}>
-    <p>Hello</p>
+    <p>Balance: {account.balance}</p>
+    <p>Tx count: {account.transactionCount}</p>
   </Page.Content>
 );
 

embark-ui/src/components/Blocks.js

@@ -8,7 +8,6 @@ import {
 } from "tabler-react";
 import PropTypes from 'prop-types';
 
-
 const Blocks = ({blocks}) => (
   <Page.Content title="Blocks">
     <Grid.Row>

embark-ui/src/components/Transactions.js

@@ -30,7 +30,7 @@ const Transactions = ({transactions}) => (
                   {content: transaction.blockNumber},
                   {content: transaction.from},
                   {content: transaction.to},
-                  {content: transaction.to ? "Contract Call" : "Contract Creation"},
+                  {content: transaction.to ? "Contract Call" : "Contract Creation"}
                 ]);
               })
             }

embark-ui/src/containers/AccountContainer.js

@@ -36,7 +36,7 @@ function mapStateToProps(state, props) {
 }
 
 AccountContainer.propTypes = {
-  router: PropTypes.object,
+  match: PropTypes.object,
   account: PropTypes.object,
   fetchAccount: PropTypes.func
 };

embark-ui/src/containers/BlockContainer.js

@@ -5,43 +5,38 @@ import {withRouter} from 'react-router-dom';
 
 import {fetchBlock} from '../actions';
 import Block from '../components/Block';
+import NoMatch from "../components/NoMatch";
 import Transactions from '../components/Transactions';
-import Loading from '../components/Loading';
 
 class BlockContainer extends Component {
   componentDidMount() {
-    this.props.fetchBlock(this.props.router.match.params.blockNumber);
+    this.props.fetchBlock(this.props.match.params.blockNumber);
   }
 
   render() {
     const {block} = this.props;
-    if (!block.data) {
+    if (!block) {
-      return <Loading />;
+      return <NoMatch />;
-    }
-
-    if (block.error) {
-      return (
-        <h1>
-          <i>Error API...</i>
-        </h1>
-      );
     }
 
     return (
       <React.Fragment>
-        <Block blocks={block.data} />
+        <Block blocks={block} />
-        <Transactions transactions={block.data.transactions} />
+        <Transactions transactions={block.transactions} />
       </React.Fragment>
     );
   }
 }
 
-function mapStateToProps(state) {
+function mapStateToProps(state, props) {
-  return {block: state.block};
+  if(state.blocks.data) {
+    return {block: state.blocks.data.find(block => block.number === props.match.params.blockNumber)};
+  }
+  return null;
 }
 
 BlockContainer.propTypes = {
-  router: PropTypes.object,
+  match: PropTypes.object,
   block: PropTypes.object,
   fetchBlock: PropTypes.func
 };
@@ -51,4 +46,4 @@ export default withRouter(connect(
   {
     fetchBlock
   }
-))(BlockContainer);
+)(BlockContainer));

embark-ui/src/containers/TransactionContainer.js

@@ -4,42 +4,37 @@ import PropTypes from 'prop-types';
 import {withRouter} from 'react-router-dom';
 
 import {fetchTransaction} from '../actions';
+import NoMatch from "../components/NoMatch";
 import Transaction from '../components/Transaction';
-import Loading from '../components/Loading';
 
 class TransactionContainer extends Component {
   componentDidMount() {
-    this.props.fetchTransaction(this.props.router.match.params.hash);
+    this.props.fetchTransaction(this.props.match.params.hash);
   }
 
   render() {
     const {transaction} = this.props;
-    if (!transaction.data) {
+    if (!transaction) {
-      return <Loading />;
+      return <NoMatch />;
-    }
-
-    if (transaction.error) {
-      return (
-        <h1>
-          <i>Error API...</i>
-        </h1>
-      );
     }
 
     return (
       <React.Fragment>
-        <Transaction transactions={transaction.data} />
+        <Transaction transactions={transaction} />
       </React.Fragment>
     );
   }
 }
 
-function mapStateToProps(state) {
+function mapStateToProps(state, props) {
-  return {transaction: state.transaction};
+  if(state.transactions.data) {
+    return {transaction: state.transactions.data.find(transaction => transaction.hash === props.match.params.hash)};
+  }
+  return null;
 }
 
 TransactionContainer.propTypes = {
-  router: PropTypes.object,
+  match: PropTypes.object,
   transaction: PropTypes.object,
   fetchTransaction: PropTypes.func
 };
@@ -49,4 +44,4 @@ export default withRouter(connect(
   {
     fetchTransaction
   }
-))(TransactionContainer);
+)(TransactionContainer));