From 588641222b9f871ff7e0cbff48f863e73dc57d6f Mon Sep 17 00:00:00 2001
From: Pascal Precht <pascal.precht@gmail.com>
Date: Mon, 8 Oct 2018 11:34:51 +0200
Subject: [PATCH] feat(contrainers/HomeContainer): introduce contracts list in
 dashboard

---
 embark-ui/src/containers/HomeContainer.js | 22 +++++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/embark-ui/src/containers/HomeContainer.js b/embark-ui/src/containers/HomeContainer.js
index 082be4db..aed6c83e 100644
--- a/embark-ui/src/containers/HomeContainer.js
+++ b/embark-ui/src/containers/HomeContainer.js
@@ -3,12 +3,23 @@ import React, {Component} from 'react';
 import {connect} from 'react-redux';
 import {Page} from "tabler-react";
 
-import {commands as commandsAction, listenToProcessLogs, processLogs as processLogsAction, stopProcessLogs} from "../actions";
+import {
+  contracts as contractsAction,
+  commands as commandsAction,
+  listenToProcessLogs,
+  processLogs as processLogsAction,
+  stopProcessLogs
+} from "../actions";
+
 import DataWrapper from "../components/DataWrapper";
 import Processes from '../components/Processes';
 import Console from '../components/Console';
 import {getProcesses, getProcessLogs} from "../reducers/selectors";
 import {EMBARK_PROCESS_NAME} from '../constants';
+import ContractsList from '../components/ContractsList';
+import {getContracts, getProcesses, getCommands, getProcessLogs} from "../reducers/selectors";
+
+const EMBARK_PROCESS_NAME = 'Embark';
 
 class HomeContainer extends Component {
   constructor(props) {
@@ -38,6 +49,7 @@ class HomeContainer extends Component {
       this.props.listenToProcessLogs(processName);
     }
 
+    this.props.fetchContracts();
     this.setState({activeProcess: processName});
   }
 
@@ -48,6 +60,11 @@ class HomeContainer extends Component {
         <DataWrapper shouldRender={this.props.processes.length > 0 } {...this.props} render={({processes}) => (
           <Processes processes={processes} />
         )} />
+        <DataWrapper shouldRender={this.props.contracts.length > 0} {...this.props} render={({contracts}) => (
+            <div style={{maxHeight: '227px', marginBottom: '1.5rem', overflow: 'auto'}}>
+                <ContractsList contracts={contracts} />
+            </div>
+        )} />
 
         <DataWrapper shouldRender={this.props.processes.length > 0 } {...this.props} render={({processes, postCommand, processLogs}) => (
           <Console activeProcess={this.state.activeProcess}
@@ -72,6 +89,8 @@ HomeContainer.propTypes = {
 function mapStateToProps(state) {
   return {
     processes: getProcesses(state),
+    contracts: getContracts(state),
+    commands: getCommands(state),
     error: state.errorMessage,
     processLogs: getProcessLogs(state),
     loading: state.loading
@@ -83,6 +102,7 @@ export default connect(
   {
     postCommand: commandsAction.post,
     fetchProcessLogs: processLogsAction.request,
+    fetchContracts: contractsAction.request,
     listenToProcessLogs,
     stopProcessLogs
   }