conflict in contarct container

embark-ui/src/components/ContractLayout.js

@@ -17,6 +17,14 @@ const ContractLayout = (props) => (
       <Page.Title className="my-5">Contract</Page.Title>
       <div>
         <List.Group transparent={true}>
+          <List.GroupItem
+            className="d-flex align-items-center"
+            to={`/embark/contracts/${props.match.params.contractName}/overview`}
+            icon="corner-left-up"
+            RootComponent={withRouter(NavLink)}
+          >
+            Back to {props.match.params.contractName}
+          </List.GroupItem>
           <List.GroupItem
             className="d-flex align-items-center"
             to={`/embark/contracts/${props.match.params.contractName}/deployment`}

embark-ui/src/components/ContractLogger.js

@@ -13,8 +13,7 @@ const ContractLogger = ({contractName, contractLogs}) => (
           responsive
           className="card-table table-vcenter text-nowrap"
           headerItems={[
-            {content: "Function name"},
-            {content: "Params"},
+            {content: "call"},
             {content: "Transaction hash"},
             {content: "Gas Used"},
             {content: "Block number"},
@@ -23,8 +22,7 @@ const ContractLogger = ({contractName, contractLogs}) => (
           bodyItems={
             contractLogs.map((log) => {
               return ([
-                {content: log.functionName},
-                {content: log.paramString},
+                {content: `${log.name}.${log.functionName}(${log.paramString})`},
                 {content: log.transactionHash},
                 {content: log.gasUsed},
                 {content: log.blockNumber},

embark-ui/src/components/ContractProfile.js

@@ -8,7 +8,7 @@ import {
 } from "tabler-react";
 
 const ContractProfile = ({contractProfile}) => (
-  <Page.Content title={contractProfile.name}>
+  <Page.Content title={contractProfile.name + ' Profile'}>
     <Grid.Row>
       <Grid.Col>
         <Card>

embark-ui/src/containers/AppContainer.js

@@ -6,12 +6,13 @@ import React, {Component} from 'react';
 import history from '../history';
 import Layout from '../components/Layout';
 import routes from '../routes';
-import {initBlockHeader, processes as processesAction} from '../actions';
+import {contracts as contractsAction, initBlockHeader, processes as processesAction} from '../actions';
 
 class AppContainer extends Component {
   componentDidMount() {
     this.props.initBlockHeader();
     this.props.fetchProcesses();
+    this.props.fetchContracts();
   }
 
   render() {
@@ -27,6 +28,7 @@ class AppContainer extends Component {
 
 AppContainer.propTypes = {
   initBlockHeader: PropTypes.func,
+  fetchContracts: PropTypes.func,
   fetchProcesses: PropTypes.func
 };
 
@@ -34,6 +36,7 @@ export default connect(
   null,
   {
     initBlockHeader,
-    fetchProcesses: processesAction.request
+    fetchProcesses: processesAction.request,
+    fetchContracts: contractsAction.request
   },
 )(AppContainer);

embark-ui/src/containers/ContractLoggerContainer.js

@@ -5,7 +5,7 @@ import {withRouter} from 'react-router-dom';
 import {contractLogs as contractLogsAction} from '../actions';
 
 import ContractLogger from '../components/ContractLogger';
-// import DataWrapper from "../components/DataWrapper";
+import DataWrapper from "../components/DataWrapper";
 import {getContractLogsByContract} from "../reducers/selectors";
 
 class ContractProfileContainer extends Component {
@@ -17,7 +17,9 @@ class ContractProfileContainer extends Component {
 
   render() {
     return (
-      <ContractLogger contractLogs={this.props.contractLogs} contractName={this.props.match.params.contractName}/>
+      <DataWrapper shouldRender={this.props.contractLogs !== undefined } {...this.props} render={() => (
+        <ContractLogger contractLogs={this.props.contractLogs} contractName={this.props.match.params.contractName}/>
+      )} />
     );
   }
 }

embark-ui/src/containers/ContractsContainer.js

@@ -2,16 +2,11 @@ import React, {Component} from 'react';
 import {connect} from 'react-redux';
 import PropTypes from 'prop-types';
 
-import {contracts as contractsAction} from '../actions';
 import Contracts from '../components/Contracts';
 import DataWrapper from "../components/DataWrapper";
 import {getContracts} from "../reducers/selectors";
 
 class ContractsContainer extends Component {
-  componentDidMount() {
-    this.props.fetchContracts();
-  }
-
   render() {
     return (
       <DataWrapper shouldRender={this.props.contracts.length > 0} {...this.props} render={({contracts}) => (
@@ -26,13 +21,9 @@ function mapStateToProps(state) {
 }
 
 ContractsContainer.propTypes = {
-  contracts: PropTypes.array,
-  fetchContracts: PropTypes.func
+  contracts: PropTypes.array
 };
 
 export default connect(
-  mapStateToProps,
-  {
-    fetchContracts: contractsAction.request
-  },
+  mapStateToProps
 )(ContractsContainer);

embark-ui/src/reducers/selectors.js

@@ -47,8 +47,7 @@ export function getProcessLogsByProcess(state, processName) {
 }
 
 export function getContractLogsByContract(state, contractName) {
-  return state.entities.contractLogs;
-  // return state.entities.processLogs.filter((processLog => processLog.name === processName));
+  return state.entities.contractLogs.filter((contractLog => contractLog.name === contractName));
 }
 
 export function getContracts(state) {

lib/modules/console_listener/index.js

@@ -94,7 +94,7 @@ class ConsoleListener {
         gasUsed = utils.hexToNumber(gasUsed);
         blockNumber = utils.hexToNumber(blockNumber);
 
-        this.logs.push(Object.assign({}, request, {name, functionName, paramString}));
+        this.logs.push(Object.assign({}, request, {name, functionName, paramString, gasUsed, blockNumber}));
 
         this.logger.info(`Blockchain>`.underline + ` ${name}.${functionName}(${paramString})`.bold + ` | ${transactionHash} | gas:${gasUsed} | blk:${blockNumber} | status:${status}`);
       } else {