1  import React, {Component} from 'react';
 2  import {connect} from 'react-redux';
 3  import PropTypes from 'prop-types';
 4  import {withRouter} from 'react-router-dom';
 5  
 6  import {transaction as transactionAction} from '../actions';
 7  import Transaction from '../components/Transaction';
 8  import DataWrapper from "../components/DataWrapper";
 9  import {getTransaction} from "../reducers/selectors";
10  
11  class TransactionContainer extends Component {
12    componentDidMount() {
13      this.props.fetchTransaction(this.props.match.params.hash);
14    }
15  
16    render() {
17      return (
18        <DataWrapper shouldRender={this.props.transaction !== undefined } {...this.props} render={({transaction}) => (
19          <Transaction transaction={transaction} />
20        )} />
21      );
22    }
23  }
24  
25  function mapStateToProps(state, props) {
26    return {
27      transaction: getTransaction(state, props.match.params.hash),
28      error: state.errorMessage,
29      loading: state.loading
30    };
31  }
32  
33  TransactionContainer.propTypes = {
34    match: PropTypes.object,
35    transaction: PropTypes.object,
36    transactions: PropTypes.arrayOf(PropTypes.object),
37    fetchTransaction: PropTypes.func,
38    error: PropTypes.string
39  };
40  
41  export default withRouter(connect(
42    mapStateToProps,
43    {
44      fetchTransaction: transactionAction.request
45    }
46  )(TransactionContainer));