minor function refactor

src/App.js

@@ -59,7 +59,7 @@ import {
 } from './actions/exchange-actions';
 
 // enter d3
-import Candlesticks from './components/Candlesticks'
+// import Candlesticks from './components/Candlesticks'
 
 var localweb3; // this isn't even in state
 
@@ -94,8 +94,6 @@ class App extends Component {
         transactions: cookie.load('transactions') || [],
       })
       this.getInfoFirstTime();
-      // this.getContracts();
-      this.getUserAddress(); 
       this.checkNetwork();
       this.getBlock();
     }
@@ -117,9 +115,18 @@ class App extends Component {
   }
 
   componentWillReceiveProps(nextProps) {
-    console.log('nextProps', nextProps)
+    // console.log('nextProps', nextProps)
   }
 
+  // getInfoFirstTime = async () => {
+  //     await this.getUserAddress();
+  //     if(this.props.web3.currentMaskAddress !== '') {
+  //       await this.getContracts();
+  //       this.getMarketInfo();
+  //       this.getAccountInfo();
+  //     }
+  // }
+
   getInfoFirstTime = () => {
     localweb3.eth.getAccounts((error, result) => {
       console.log('getInfoFirstTime result', result)
@@ -134,15 +141,16 @@ class App extends Component {
         this.props.metamaskLocked();
         this.props.web3ConnectionUnsuccessful();
         this.props.setInteractionState('locked');
+
       }
     })
   }
 
-  getUserAddress = () => {
+  getUserAddress = async () => {
     // kind of redundant
     // only difference is getInfoFirstTime fires getContracts too
     // THIS FIRES EVERY TEN SECONDS, NEEDS A REFACTOR
-    localweb3.eth.getAccounts((error, result) => {
+    await localweb3.eth.getAccounts(async (error, result) => {
       if(result.length > 0) {
         this.props.setCurrentMaskAddress(result[0]);
         this.props.metamaskUnlocked();
@@ -156,7 +164,7 @@ class App extends Component {
     })
   }
 
-  getContracts() {
+  getContracts = async () => {
     const uniExchangeAddress = this.props.web3.exchangeAddresses.UNI;
     const uniExchangeContract = new localweb3.eth.Contract(exchangeABI, uniExchangeAddress);
     this.props.uniExchangeContractReady(uniExchangeContract);
@@ -177,8 +185,8 @@ class App extends Component {
     const factoryContract = new localweb3.eth.Contract(factoryABI, factoryAddress);
     this.props.factoryContractReady(factoryContract);
 
-    this.getInfo();
-    
+    this.getAccountInfo();
+    this.getMarketInfo();
   }
 
   checkNetwork() {
@@ -256,11 +264,6 @@ class App extends Component {
     }
   }
 
-  getInfo = () => {
-    this.getMarketInfo();
-    this.getAccountInfo();
-  }
-  
   getMarketInfo = () => {
     switch (this.props.web3.exchangeType) {
       case 'ETH to Token':
@@ -295,6 +298,7 @@ class App extends Component {
         break;
       default:
     }
+    console.log("Getting account info");
   }
 
   getExchangeState = (type) => {
@@ -400,13 +404,14 @@ class App extends Component {
     }
   }
 
+  // TODO: stuff
   tokenToExchangeFactoryLookup = (tokenAddress) => {
     this.props.web3.factoryContract.methods.tokenToExchangeLookup(tokenAddress).call((error, exchangeAddress) => {
         console.log(exchangeAddress)
     });
   }
 
-  onSelectToken = (selected, type) => {
+  onSelectToken = async (selected, type) => {
     this.props.setExchangeInputValue(0);
     this.props.setExchangeOutputValue(0);
     this.props.setExchangeRate(0);
@@ -414,52 +419,51 @@ class App extends Component {
     this.props.setInteractionState('connected');
     this.setState({ firstRun: true })
 
-    var marketType = '';
     if (type === 'input') {
-      this.props.setInputToken(selected);
-      if (selected.value === this.props.exchange.outputToken.value) {
+      await this.props.setInputToken(selected);
+    } else if (type === 'output'){
+      await this.props.setOutputToken(selected);
+    }
+
+    await this.getMarketType();
+    this.getAccountInfo();
+    this.getMarketInfo();
+  }
+
+  getMarketType = () => {
+    var marketType = '';
+
+    if (this.props.exchange.inputToken.value === this.props.exchange.outputToken.value) {
       marketType = 'Invalid';
       this.props.setInteractionState('error1');
-      } else if (selected.value === 'ETH'){
+    } else if (this.props.exchange.inputToken.value === 'ETH'){
         marketType = 'ETH to Token';
     } else if (this.props.exchange.outputToken.value === 'ETH'){
         marketType = 'Token to ETH';
     } else{
         marketType = 'Token to Token';
     }
-    } else if (type === 'output'){
-      this.props.setOutputToken(selected);
-      if (selected.value === this.props.exchange.inputToken.value) {
-        marketType = 'Invalid';
-        this.props.setInteractionState('error1');
-      } else if (selected.value === 'ETH'){
-          marketType = 'Token to ETH';
-      } else if (this.props.exchange.inputToken.value === 'ETH'){
-          marketType = 'ETH to Token';
-      } else {
-          marketType = 'Token to Token';
-      }
-    }
-    console.log(type + ': ' + selected.value);
     this.props.setExchangeType(marketType);
-    this.getInfo();
+    console.log('type: ', marketType);
+    console.log('input: ', this.props.exchange.inputToken.value);
+    console.log('output: ', this.props.exchange.outputToken.value);
   }
 
-  onInputChange = (event) => {
+  onInputChange = async (event) => {
     var inputValue = event.target.value;
-    var marketType = this.props.web3.exchangeType;
+    await this.props.setExchangeInputValue(inputValue);
+    this.setExchangeOutput();
+  }
 
-    if (marketType === 'Invalid'){
-      this.props.setExchangeInputValue(inputValue);
+  setExchangeOutput = () => {
+    var inputValue = this.props.exchange.inputValue;
+    if (this.props.web3.exchangeType === 'Invalid'){
       this.props.setExchangeOutputValue(0);
       this.props.setInteractionState('error1');
     } else if(inputValue && inputValue !== 0 && inputValue !== '0'){
-        this.props.setExchangeInputValue(inputValue);
         this.props.setInteractionState('input');
-        console.log('input something');
         this.getExchangeRate(inputValue);
     } else {
-        this.props.setExchangeInputValue(inputValue);
         this.props.setExchangeOutputValue(0);
         this.props.setInteractionState('connected');
     }
@@ -548,6 +552,7 @@ class App extends Component {
     this.props.setExchangeFee(exchangeFee1);
     this.props.setExchangeOutputValue(adjustedTokensOut);
   }
+
   // YOU ARE HERE NOW
   ethToTokenPurchase = () => {
     var exchange = this.symbolToExchangeContract(this.props.exchange.outputToken.value);
@@ -576,9 +581,13 @@ class App extends Component {
       })  //Transaction Submitted to blockchain
       .on('confirmation', (confirmationNumber, receipt) => {
         console.log("Block Confirmations: " + confirmationNumber)
+        if(confirmationNumber === 1) {
+          this.getAccountInfo();
+        }
       })  //Transaction Mined
       .on('error', console.error);
   }
+
   // tokenToEth and EthToToken purchase functions are very similar structurally
   // maybe we can make this more DRY in refactor
   tokenToEthPurchase = () => {
@@ -692,9 +701,6 @@ class App extends Component {
           outputToken={this.props.exchange.outputToken}
           about={this.state.about}
         />
-        <section className="candlestick">
-          <Candlesticks />
-        </section>
         <section className="order">
           <div className="value border pa2">
             <input type="number" value={this.props.exchange.inputValue} placeholder="0" onChange={this.onInputChange} />
@@ -725,7 +731,6 @@ class App extends Component {
           <a className="swap border pa2" role="button" onClick={() => {this.purchaseTokens()}}>
 
               <b>{"I want to swap " + this.props.exchange.inputValue + " " + this.props.exchange.inputToken.value + " for " + this.props.exchange.outputValue/10**18 + " " + this.props.exchange.outputToken.value}</b>
-            {/* <button> Approve </button> */}
           </a>
           : <a className="swap grey-bg hidden border pa2"></a>}