1  import React, {Component} from 'react';
 2  import {connect} from 'react-redux';
 3  import PropTypes from 'prop-types';
 4  import {Card, CardBody} from 'reactstrap';
 5  
 6  import Preview from '../components/Preview';
 7  import {contracts as contractsAction} from '../actions';
 8  import {getContractsByPath} from "../reducers/selectors";
 9  import ContractDetail from '../components/ContractDetail';
10  import ContractTransactionsContainer from './ContractTransactionsContainer';
11  import ContractOverviewContainer from '../containers/ContractOverviewContainer';
12  import ContractDebuggerContainer from '../containers/ContractDebuggerContainer';
13  
14  class TextEditorAsideContainer extends Component {
15    componentDidMount() {
16      this.props.fetchContracts();
17    }
18  
19    renderContent(contract, index) {
20      switch (this.props.currentAsideTab) {
21        case 'debugger':
22          return (
23            <React.Fragment>
24              <h2>{contract.className} - Details</h2>
25              <ContractDebuggerContainer key={index} contract={contract}/>
26            </React.Fragment>
27          );
28        case 'detail':
29          return (
30            <React.Fragment>
31              <h2>{contract.className} - Details</h2>
32              <ContractDetail key={index} contract={contract}/>
33            </React.Fragment>
34          );
35        case 'transactions':
36          return (
37            <React.Fragment>
38              <h2>{contract.className} - Transactions</h2>
39              <ContractTransactionsContainer key={index} contract={contract}/>
40            </React.Fragment>
41          );
42        case 'overview':
43          return (
44            <React.Fragment>
45              <h2>{contract.className} - Overview</h2>
46              <ContractOverviewContainer key={index} contract={contract}/>
47            </React.Fragment>
48          );
49        default:
50          return '';
51      }
52    }
53  
54    render() {
55      if (this.props.currentAsideTab === 'browser') {
56        return <Preview/>;
57      }
58      return this.props.contracts.map((contract, index) => {
59        return (
60          <Card key={'contract-' + index} className="editor-aside-card rounded-0 border-top-0">
61            <CardBody>
62              {this.renderContent(contract, index)}
63            </CardBody>
64          </Card>
65        );
66      });
67    }
68  }
69  
70  function mapStateToProps(state, props) {
71    return {
72      contracts: getContractsByPath(state, props.currentFile.path)
73    };
74  }
75  
76  TextEditorAsideContainer.propTypes = {
77    currentFile: PropTypes.object,
78    currentAsideTab: PropTypes.string,
79    contract: PropTypes.array,
80    fetchContracts: PropTypes.func,
81    contracts: PropTypes.array
82  };
83  
84  export default connect(
85    mapStateToProps,
86    {
87      fetchContracts: contractsAction.request
88    }
89  )(TextEditorAsideContainer);