Improve ux for low gas price set (#5862)

* Show user warning if they set gas price below safelow minimum, error if 0.

* Properly cache basic price estimate data.

* Default retry price to recommended price if original price was 0x0

* Use mock fetch in send-new-ui integration tests.

1 files changed, 39 insertions, 4 deletions

diff --git a/ui/app/ducks/gas.duck.js b/ui/app/ducks/gas.duck.js
index 83c236d81..ee235a757 100644
--- a/ui/app/ducks/gas.duck.js
+++ b/ui/app/ducks/gas.duck.js
@@ -23,6 +23,7 @@ const SET_CUSTOM_GAS_TOTAL = 'metamask/gas/SET_CUSTOM_GAS_TOTAL'
 const SET_PRICE_AND_TIME_ESTIMATES = 'metamask/gas/SET_PRICE_AND_TIME_ESTIMATES'
 const SET_API_ESTIMATES_LAST_RETRIEVED = 'metamask/gas/SET_API_ESTIMATES_LAST_RETRIEVED'
 const SET_BASIC_API_ESTIMATES_LAST_RETRIEVED = 'metamask/gas/SET_BASIC_API_ESTIMATES_LAST_RETRIEVED'
+const SET_BASIC_PRICE_ESTIMATES_LAST_RETRIEVED = 'metamask/gas/SET_BASIC_PRICE_ESTIMATES_LAST_RETRIEVED'
 
 // TODO: determine if this approach to initState is consistent with conventional ducks pattern
 const initState = {
@@ -49,6 +50,7 @@ const initState = {
   basicPriceAndTimeEstimates: [],
   priceAndTimeEstimatesLastRetrieved: 0,
   basicPriceAndTimeEstimatesLastRetrieved: 0,
+  basicPriceEstimatesLastRetrieved: 0,
   errors: {},
 }
 
@@ -129,6 +131,11 @@ export default function reducer ({ gas: gasState = initState }, action = {}) {
         ...newState,
         basicPriceAndTimeEstimatesLastRetrieved: action.value,
       }
+    case SET_BASIC_PRICE_ESTIMATES_LAST_RETRIEVED:
+      return {
+        ...newState,
+        basicPriceEstimatesLastRetrieved: action.value,
+      }
     case RESET_CUSTOM_DATA:
       return {
         ...newState,
@@ -167,10 +174,17 @@ export function gasEstimatesLoadingFinished () {
 }
 
 export function fetchBasicGasEstimates () {
-  return (dispatch) => {
+  return (dispatch, getState) => {
+    const {
+      basicPriceEstimatesLastRetrieved,
+      basicPriceAndTimeEstimates,
+    } = getState().gas
+    const timeLastRetrieved = basicPriceEstimatesLastRetrieved || loadLocalStorageData('BASIC_PRICE_ESTIMATES_LAST_RETRIEVED') || 0
+
     dispatch(basicGasEstimatesLoadingStarted())
 
-    return fetch('https://dev.blockscale.net/api/gasexpress.json', {
+    const promiseToFetch = Date.now() - timeLastRetrieved > 75000
+    ? fetch('https://dev.blockscale.net/api/gasexpress.json', {
       'headers': {},
       'referrer': 'https://dev.blockscale.net/api/',
       'referrerPolicy': 'no-referrer-when-downgrade',
@@ -195,10 +209,24 @@ export function fetchBasicGasEstimates () {
           blockTime,
           blockNum,
         }
-        dispatch(setBasicGasEstimateData(basicEstimates))
-        dispatch(basicGasEstimatesLoadingFinished())
+
+        const timeRetrieved = Date.now()
+        dispatch(setBasicPriceEstimatesLastRetrieved(timeRetrieved))
+        saveLocalStorageData(timeRetrieved, 'BASIC_PRICE_ESTIMATES_LAST_RETRIEVED')
+        saveLocalStorageData(basicEstimates, 'BASIC_PRICE_ESTIMATES')
+
         return basicEstimates
       })
+    : Promise.resolve(basicPriceAndTimeEstimates.length
+        ? basicPriceAndTimeEstimates
+        : loadLocalStorageData('BASIC_PRICE_ESTIMATES')
+      )
+
+    return promiseToFetch.then(basicEstimates => {
+      dispatch(setBasicGasEstimateData(basicEstimates))
+      dispatch(basicGasEstimatesLoadingFinished())
+      return basicEstimates
+    })
   }
 }
 
@@ -473,6 +501,13 @@ export function setBasicApiEstimatesLastRetrieved (retrievalTime) {
   }
 }
 
+export function setBasicPriceEstimatesLastRetrieved (retrievalTime) {
+  return {
+    type: SET_BASIC_PRICE_ESTIMATES_LAST_RETRIEVED,
+    value: retrievalTime,
+  }
+}
+
 export function resetCustomGasState () {
   return { type: RESET_CUSTOM_GAS_STATE }
 }