Uses more reliable api on main send screen; caches basic api results in modal

4 files changed, 62 insertions, 3 deletions

diff --git a/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.component.js b/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.component.js
index a804f7b64..b5b13c849 100644
--- a/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.component.js
+++ b/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.component.js
@@ -12,10 +12,13 @@ export default class GasModalPageContainer extends Component {
 
   static propTypes = {
     hideModal: PropTypes.func,
+    hideBasic: PropTypes.bool,
     updateCustomGasPrice: PropTypes.func,
     updateCustomGasLimit: PropTypes.func,
     customGasPrice: PropTypes.number,
     customGasLimit: PropTypes.number,
+    fetchBasicGasAndTimeEstimates: PropTypes.func,
+    fetchGasEstimates: PropTypes.func,
     gasPriceButtonGroupProps: PropTypes.object,
     infoRowProps: PropTypes.shape({
       originalTotalFiat: PropTypes.string,
@@ -28,10 +31,26 @@ export default class GasModalPageContainer extends Component {
     customModalGasLimitInHex: PropTypes.string,
     cancelAndClose: PropTypes.func,
     transactionFee: PropTypes.string,
+    blockTime: PropTypes.oneOfType([
+      PropTypes.string,
+      PropTypes.number,
+    ]),
   }
 
   state = {}
 
+  componentDidMount () {
+    const promise = this.props.hideBasic
+      ? Promise.resolve(this.props.blockTime)
+      : this.props.fetchBasicGasAndTimeEstimates()
+          .then(basicEstimates => basicEstimates.blockTime)
+
+    promise
+      .then(blockTime => {
+        this.props.fetchGasEstimates(blockTime)
+      })
+  }
+
   renderBasicTabContent (gasPriceButtonGroupProps) {
     return (
       <BasicTabContent
diff --git a/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js b/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js
index c3b7a5960..770493be0 100644
--- a/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js
+++ b/ui/app/components/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js
@@ -13,6 +13,8 @@ import {
   setCustomGasLimit,
   resetCustomData,
   setCustomTimeEstimate,
+  fetchGasEstimates,
+  fetchBasicGasAndTimeEstimates,
 } from '../../../ducks/gas.duck'
 import {
   hideGasButtonGroup,
@@ -28,7 +30,7 @@ import {
 } from '../../../selectors.js'
 import {
   formatTimeEstimate,
-  getAveragePriceEstimateInHexWEI,
+  getFastPriceEstimateInHexWEI,
   getBasicGasEstimateLoadingStatus,
   getCustomGasLimit,
   getCustomGasPrice,
@@ -36,6 +38,7 @@ import {
   getEstimatedGasPrices,
   getEstimatedGasTimes,
   getRenderableBasicEstimateData,
+  getBasicGasEstimateBlockTime,
 } from '../../../selectors/custom-gas'
 import {
   submittedPendingTransactionsSelector,
@@ -100,6 +103,7 @@ const mapStateToProps = (state, ownProps) => {
     customGasLimit: calcCustomGasLimit(customModalGasLimitInHex),
     newTotalFiat,
     currentTimeEstimate: getRenderableTimeEstimate(customGasPrice, gasPrices, estimatedTimes),
+    blockTime: getBasicGasEstimateBlockTime(state),
     gasPriceButtonGroupProps: {
       buttonDataLoading,
       defaultActiveButtonIndex: getDefaultActiveButtonIndex(gasButtonInfo, customModalGasPriceInHex),
@@ -150,6 +154,8 @@ const mapDispatchToProps = dispatch => {
     hideGasButtonGroup: () => dispatch(hideGasButtonGroup()),
     setCustomTimeEstimate: (timeEstimateInSeconds) => dispatch(setCustomTimeEstimate(timeEstimateInSeconds)),
     hideSidebar: () => dispatch(hideSidebar()),
+    fetchGasEstimates: (blockTime) => dispatch(fetchGasEstimates(blockTime)),
+    fetchBasicGasAndTimeEstimates: () => dispatch(fetchBasicGasAndTimeEstimates()),
   }
 }
 
@@ -209,7 +215,7 @@ function getTxParams (state, transactionId) {
   return txData.txParams || pendingTxParams || {
     from: send.from,
     gas: send.gasLimit,
-    gasPrice: send.gasPrice || getAveragePriceEstimateInHexWEI(state),
+    gasPrice: send.gasPrice || getFastPriceEstimateInHexWEI(state, true),
     to: send.to,
     value: getSelectedToken(state) ? '0x0' : send.amount,
   }
diff --git a/ui/app/components/gas-customization/gas-modal-page-container/tests/gas-modal-page-container-component.test.js b/ui/app/components/gas-customization/gas-modal-page-container/tests/gas-modal-page-container-component.test.js
index 16f4b8cd7..22f2f02dd 100644
--- a/ui/app/components/gas-customization/gas-modal-page-container/tests/gas-modal-page-container-component.test.js
+++ b/ui/app/components/gas-customization/gas-modal-page-container/tests/gas-modal-page-container-component.test.js
@@ -3,14 +3,21 @@ import assert from 'assert'
 import shallow from '../../../../../lib/shallow-with-context'
 import sinon from 'sinon'
 import GasModalPageContainer from '../gas-modal-page-container.component.js'
+import timeout from '../../../../../lib/test-timeout'
 
 import PageContainer from '../../../page-container'
 
 import { Tab } from '../../../tabs'
 
+const mockBasicGasEstimates = {
+  blockTime: 'mockBlockTime',
+}
+
 const propsMethodSpies = {
   cancelAndClose: sinon.spy(),
   onSubmit: sinon.spy(),
+  fetchBasicGasAndTimeEstimates: sinon.stub().returns(Promise.resolve(mockBasicGasEstimates)),
+  fetchGasEstimates: sinon.spy(),
 }
 
 const mockGasPriceButtonGroupProps = {
@@ -59,6 +66,8 @@ describe('GasModalPageContainer Component', function () {
     wrapper = shallow(<GasModalPageContainer
       cancelAndClose={propsMethodSpies.cancelAndClose}
       onSubmit={propsMethodSpies.onSubmit}
+      fetchBasicGasAndTimeEstimates={propsMethodSpies.fetchBasicGasAndTimeEstimates}
+      fetchGasEstimates={propsMethodSpies.fetchGasEstimates}
       updateCustomGasPrice={() => 'mockupdateCustomGasPrice'}
       updateCustomGasLimit={() => 'mockupdateCustomGasLimit'}
       customGasPrice={21}
@@ -76,6 +85,24 @@ describe('GasModalPageContainer Component', function () {
     propsMethodSpies.cancelAndClose.resetHistory()
   })
 
+  describe('componentDidMount', () => {
+    it('should call props.fetchBasicGasAndTimeEstimates', () => {
+      propsMethodSpies.fetchBasicGasAndTimeEstimates.resetHistory()
+      assert.equal(propsMethodSpies.fetchBasicGasAndTimeEstimates.callCount, 0)
+      wrapper.instance().componentDidMount()
+      assert.equal(propsMethodSpies.fetchBasicGasAndTimeEstimates.callCount, 1)
+    })
+
+    it('should call props.fetchGasEstimates with the block time returned by fetchBasicGasAndTimeEstimates', async () => {
+      propsMethodSpies.fetchGasEstimates.resetHistory()
+      assert.equal(propsMethodSpies.fetchGasEstimates.callCount, 0)
+      wrapper.instance().componentDidMount()
+      await timeout(250)
+      assert.equal(propsMethodSpies.fetchGasEstimates.callCount, 1)
+      assert.equal(propsMethodSpies.fetchGasEstimates.getCall(0).args[0], 'mockBlockTime')
+    })
+  })
+
   describe('render', () => {
     it('should render a PageContainer compenent', () => {
       assert.equal(wrapper.find(PageContainer).length, 1)
@@ -106,7 +133,10 @@ describe('GasModalPageContainer Component', function () {
 
     it('should pass the correct renderTabs property to PageContainer', () => {
       sinon.stub(GP, 'renderTabs').returns('mockTabs')
-      const renderTabsWrapperTester = shallow(<GasModalPageContainer />, { context: { t: (str1, str2) => str2 ? str1 + str2 : str1 } })
+      const renderTabsWrapperTester = shallow(<GasModalPageContainer
+        fetchBasicGasAndTimeEstimates={propsMethodSpies.fetchBasicGasAndTimeEstimates}
+        fetchGasEstimates={propsMethodSpies.fetchGasEstimates}
+      />, { context: { t: (str1, str2) => str2 ? str1 + str2 : str1 } })
       const { tabsComponent } = renderTabsWrapperTester.find(PageContainer).props()
       assert.equal(tabsComponent, 'mockTabs')
       GasModalPageContainer.prototype.renderTabs.restore()
diff --git a/ui/app/components/gas-customization/gas-modal-page-container/tests/gas-modal-page-container-container.test.js b/ui/app/components/gas-customization/gas-modal-page-container/tests/gas-modal-page-container-container.test.js
index 1ed28f33e..ba2cfe282 100644
--- a/ui/app/components/gas-customization/gas-modal-page-container/tests/gas-modal-page-container-container.test.js
+++ b/ui/app/components/gas-customization/gas-modal-page-container/tests/gas-modal-page-container-container.test.js
@@ -73,6 +73,9 @@ describe('gas-modal-page-container container', () => {
           conversionRate: 50,
         },
         gas: {
+          basicEstimates: {
+            blockTime: 12,
+          },
           customData: {
             limit: 'aaaaaaaa',
             price: 'ffffffff',
@@ -100,6 +103,7 @@ describe('gas-modal-page-container container', () => {
         customGasLimit: 2863311530,
         currentTimeEstimate: '~1 min 11 sec',
         newTotalFiat: '637.41',
+        blockTime: 12,
         customModalGasLimitInHex: 'aaaaaaaa',
         customModalGasPriceInHex: 'ffffffff',
         gasChartProps: {