improve handling of last selected provider (#10093)

app/scripts/controllers/network/network.js

@@ -51,9 +51,13 @@ export default class NetworkController extends EventEmitter {
     this.providerStore = new ObservableStore(
       opts.provider || { ...defaultProviderConfig },
     )
+    this.previousProviderStore = new ObservableStore(
+      this.providerStore.getState(),
+    )
     this.networkStore = new ObservableStore('loading')
     this.store = new ComposedStore({
       provider: this.providerStore,
+      previousProviderStore: this.previousProviderStore,
       network: this.networkStore,
     })
 
@@ -188,6 +192,13 @@ export default class NetworkController extends EventEmitter {
    * Sets the provider config and switches the network.
    */
   setProviderConfig(config) {
+    this.previousProviderStore.updateState(this.getProviderConfig())
+    this.providerStore.updateState(config)
+    this._switchNetwork(config)
+  }
+
+  rollbackToPreviousProvider() {
+    const config = this.previousProviderStore.getState()
     this.providerStore.updateState(config)
     this._switchNetwork(config)
   }

app/scripts/metamask-controller.js

@@ -579,6 +579,10 @@ export default class MetamaskController extends EventEmitter {
         networkController.setProviderType,
         networkController,
       ),
+      rollbackToPreviousProvider: nodeify(
+        networkController.rollbackToPreviousProvider,
+        networkController,
+      ),
       setCustomRpc: nodeify(this.setCustomRpc, this),
       updateAndSetCustomRpc: nodeify(this.updateAndSetCustomRpc, this),
       delCustomRpc: nodeify(this.delCustomRpc, this),

ui/app/components/app/dropdowns/network-dropdown.js

@@ -40,9 +40,6 @@ function mapDispatchToProps(dispatch) {
     setProviderType: (type) => {
       dispatch(actions.setProviderType(type))
     },
-    setPreviousProvider: (type) => {
-      dispatch(actions.setPreviousProvider(type))
-    },
     setRpcTarget: (target, chainId, ticker, nickname) => {
       dispatch(actions.setRpcTarget(target, chainId, ticker, nickname))
     },
@@ -85,7 +82,6 @@ class NetworkDropdown extends Component {
     setRpcTarget: PropTypes.func.isRequired,
     hideNetworkDropdown: PropTypes.func.isRequired,
     setNetworksTabAddMode: PropTypes.func.isRequired,
-    setPreviousProvider: PropTypes.func.isRequired,
     setSelectedSettingsRpcUrl: PropTypes.func.isRequired,
     frequentRpcListDetail: PropTypes.array.isRequired,
     networkDropdownOpen: PropTypes.bool.isRequired,
@@ -116,10 +112,6 @@ class NetworkDropdown extends Component {
   }
 
   renderCustomRpcList(rpcListDetail, provider) {
-    const {
-      provider: { type: providerType },
-      setPreviousProvider,
-    } = this.props
     const reversedRpcListDetail = rpcListDetail.slice().reverse()
 
     return reversedRpcListDetail.map((entry) => {
@@ -133,7 +125,6 @@ class NetworkDropdown extends Component {
           closeMenu={() => this.props.hideNetworkDropdown()}
           onClick={() => {
             if (isPrefixedFormattedHexString(chainId)) {
-              setPreviousProvider(providerType)
               this.props.setRpcTarget(rpcUrl, chainId, ticker, nickname)
             } else {
               this.props.displayInvalidCustomNetworkAlert(nickname || rpcUrl)

ui/app/components/app/loading-network-screen/loading-network-screen.component.js

@@ -19,11 +19,8 @@ export default class LoadingNetworkScreen extends PureComponent {
     providerId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     showNetworkDropdown: PropTypes.func,
     setProviderArgs: PropTypes.array,
-    lastSelectedProvider: PropTypes.oneOfType([
-      PropTypes.string,
-      PropTypes.object,
-    ]),
     setProviderType: PropTypes.func,
+    rollbackToPreviousProvider: PropTypes.func,
     isLoadingNetwork: PropTypes.bool,
   }
 
@@ -123,14 +120,14 @@ export default class LoadingNetworkScreen extends PureComponent {
   }
 
   render() {
-    const { lastSelectedProvider, setProviderType } = this.props
+    const { rollbackToPreviousProvider } = this.props
 
     return (
       <LoadingScreen
         header={
           <div
             className="page-container__header-close"
-            onClick={() => setProviderType(lastSelectedProvider || 'ropsten')}
+            onClick={rollbackToPreviousProvider}
           />
         }
         showLoadingSpinner={!this.state.showErrorScreen}

ui/app/components/app/loading-network-screen/loading-network-screen.container.js

@@ -4,7 +4,7 @@ import { getNetworkIdentifier } from '../../../selectors'
 import LoadingNetworkScreen from './loading-network-screen.component'
 
 const mapStateToProps = (state) => {
-  const { loadingMessage, lastSelectedProvider } = state.appState
+  const { loadingMessage } = state.appState
   const { provider, network } = state.metamask
   const { rpcUrl, chainId, ticker, nickname, type } = provider
 
@@ -14,7 +14,6 @@ const mapStateToProps = (state) => {
   return {
     isLoadingNetwork: network === 'loading',
     loadingMessage,
-    lastSelectedProvider,
     setProviderArgs,
     provider,
     providerId: getNetworkIdentifier(state),
@@ -26,6 +25,8 @@ const mapDispatchToProps = (dispatch) => {
     setProviderType: (type) => {
       dispatch(actions.setProviderType(type))
     },
+    rollbackToPreviousProvider: () =>
+      dispatch(actions.rollbackToPreviousProvider()),
     showNetworkDropdown: () => dispatch(actions.showNetworkDropdown()),
   }
 }

ui/app/ducks/app/app.js

@@ -42,7 +42,6 @@ export default function reduceApp(state = {}, action) {
       trezor: `m/44'/60'/0'/0`,
       ledger: `m/44'/60'/0'/0/0`,
     },
-    lastSelectedProvider: null,
     networksTabSelectedRpcUrl: '',
     networksTabIsInAddMode: false,
     loadingMethodData: false,
@@ -305,15 +304,6 @@ export default function reduceApp(state = {}, action) {
         gasIsLoading: false,
       }
 
-    case actionConstants.SET_PREVIOUS_PROVIDER:
-      if (action.value === 'loading') {
-        return appState
-      }
-      return {
-        ...appState,
-        lastSelectedProvider: action.value,
-      }
-
     case actionConstants.SET_SELECTED_SETTINGS_RPC_URL:
       return {
         ...appState,

ui/app/store/actionConstants.js

@@ -63,7 +63,6 @@ export const UPDATE_SEND_ENS_RESOLUTION_ERROR =
 // config screen
 export const SET_RPC_TARGET = 'SET_RPC_TARGET'
 export const SET_PROVIDER_TYPE = 'SET_PROVIDER_TYPE'
-export const SET_PREVIOUS_PROVIDER = 'SET_PREVIOUS_PROVIDER'
 export const UPDATE_TOKENS = 'UPDATE_TOKENS'
 export const SET_HARDWARE_WALLET_DEFAULT_HD_PATH =
   'SET_HARDWARE_WALLET_DEFAULT_HD_PATH'

ui/app/store/actions.js

@@ -1553,8 +1553,7 @@ export function createRetryTransaction(txId, customGasPrice, customGasLimit) {
 //
 
 export function setProviderType(type) {
-  return async (dispatch, getState) => {
-    const { type: currentProviderType } = getState().metamask.provider
+  return async (dispatch) => {
     log.debug(`background.setProviderType`, type)
 
     try {
@@ -1564,7 +1563,6 @@ export function setProviderType(type) {
       dispatch(displayWarning('Had a problem changing networks!'))
       return
     }
-    dispatch(setPreviousProvider(currentProviderType))
     dispatch(updateProviderType(type))
   }
 }
@@ -1576,13 +1574,6 @@ export function updateProviderType(type) {
   }
 }
 
-export function setPreviousProvider(type) {
-  return {
-    type: actionConstants.SET_PREVIOUS_PROVIDER,
-    value: type,
-  }
-}
-
 export function updateAndSetCustomRpc(
   newRpc,
   chainId,
@@ -1675,6 +1666,17 @@ export function setRpcTarget(newRpc, chainId, ticker = 'ETH', nickname) {
   }
 }
 
+export function rollbackToPreviousProvider() {
+  return async (dispatch) => {
+    try {
+      await promisifiedBackground.rollbackToPreviousProvider()
+    } catch (error) {
+      log.error(error)
+      dispatch(displayWarning('Had a problem changing networks!'))
+    }
+  }
+}
+
 export function delRpcTarget(oldRpc) {
   return (dispatch) => {
     log.debug(`background.delRpcTarget: ${oldRpc}`)