content: import React, { Component } from 'react';
  import { connect } from 'react-redux';
  import _ from 'lodash';
  import ExecutionContext from './ExecutionContext';
  import FeeSelector from './FeeSelector';
  import Footer from './Footer';
  import TxParties from './TxParties';
  import {
    confirmTx,
    determineIfContract,
    estimateGasUsage,
    getGasPrice,
    getPriceConversion,
    lookupSignature,
    setWindowSize,
    togglePriority
  } from '../../actions.js';
  
  class SendTx extends Component {
    constructor(props) {
      super(props);
  
      this.state = {
        hasSignature: false
      };
    }
  
    componentDidMount() {
      this.getGasPrice();
      this.determineIfContract();
      this.lookupSignature();
      this.estimateGasUsage();
      this.getPriceConversion();
      setTimeout(this.adjustWindowHeight, 500);
    }
  
    componentDidUpdate() {
      this.adjustWindowHeight();
    }
  
    componentWillUnmount() {
      clearInterval(this.interval);
    }
  
    getGasPrice = () => {
      this.props.dispatch(getGasPrice());
    };
  
    determineIfContract = () => {
      this.props.dispatch(determineIfContract(this.props.newTx.to));
    };
  
    lookupSignature = () => {
      const { data } = this.props.newTx;
      this.props.dispatch(lookupSignature(data));
    };
  
    estimateGasUsage = () => {
      this.props.dispatch(estimateGasUsage());
    };
  
    getPriceConversion = () => {
      this.props.dispatch(getPriceConversion());
    };
  
    adjustWindowHeight = () => {
      const height = this.divElement.clientHeight;
      this.props.dispatch(setWindowSize(height));
    };
  
    togglePriority = () => {
      this.props.dispatch(togglePriority());
    };
  
    handleSubmit = formData => {
      const {
        data,
        to,
        from,
        gas,
        gasPriceGweiStandard,
        gasPriceGweiPriority,
        estimatedGas,
        priority,
        value
      } = this.props.newTx;
  
      const chosenPriceGwei = priority
        ? gasPriceGweiPriority
        : gasPriceGweiStandard;
      const chosenPriceWei = web3.utils.toWei(chosenPriceGwei.toString(), 'gwei');
  
      let txData = {
        data,
        from,
        gas: gas || estimatedGas,
        gasPrice: chosenPriceWei,
        pw: formData.pw,
        value
      };
  
      if (to) {
        txData.to = to;
      }
  
      this.props.dispatch(confirmTx(txData));
    };
  
    render() {
      return (
        <div className="popup-windows tx-info">
          <div ref={divElement => (this.divElement = divElement)}>
            <ExecutionContext
              adjustWindowHeight={this.adjustWindowHeight}
              estimatedGas={this.props.newTx.estimatedGas}
              executionFunction={this.props.newTx.executionFunction}
              gasPriceGweiStandard={this.props.newTx.gasPriceGweiStandard}
              gasPriceGweiPriority={this.props.newTx.gasPriceGweiPriority}
              gasError={this.props.newTx.gasError}
              isNewContract={this.props.newTx.isNewContract}
              params={this.props.newTx.params}
              toIsContract={this.props.newTx.toIsContract}
              value={this.props.newTx.value}
              token={this.props.newTx.token}
            />
  
            <TxParties
              fromIsContract={this.state.fromIsContract}
              from={this.props.newTx.from}
              isNewContract={this.props.newTx.isNewContract}
              to={this.props.newTx.to}
              toIsContract={this.props.newTx.toIsContract}
              executionFunction={this.props.newTx.executionFunction}
              params={this.props.newTx.params}
              hasSignature={this.state.hasSignature}
              value={this.props.newTx.value}
            />
  
            <FeeSelector
              estimatedGas={this.props.newTx.estimatedGas}
              gasLoading={this.props.newTx.gasLoading}
              gasPriceGweiStandard={this.props.newTx.gasPriceGweiStandard}
              gasPriceGweiPriority={this.props.newTx.gasPriceGweiPriority}
              getGasPrice={this.getGasPrice}
              getGasUsage={this.estimateGasUsage}
              etherPriceUSD={this.props.etherPriceUSD}
              network={this.props.network}
              priority={this.props.newTx.priority}
              togglePriority={this.togglePriority}
            />
  
            <Footer
              unlocking={this.props.newTx.unlocking}
              estimatedGas={this.props.newTx.estimatedGas}
              gasPrice={this.props.newTx.gasPriceGweiStandard}
              gasError={this.props.newTx.gasError}
              handleSubmit={this.handleSubmit}
            />
          </div>
        </div>
      );
    }
  }
  
  function mapStateToProps(state) {
    return {
      etherPriceUSD: state.settings.etherPriceUSD,
      network: state.nodes.network,
      newTx: state.newTx
    };
  }
  
  export default connect(mapStateToProps)(SendTx);
  