Avoid race condtion that could prevent contextual account switching (#…

…7623)

There was a race condition in the logic responsible for switching the
selected account based upon the active tab. It was asynchronously
querying the active tab, then assuming it had been retrieved later.

The active tab info itself was already in the redux store in another
spot, one that is guaranteed to be set before the UI renders. The
race condition was avoided by deleting the duplicate state, and using
the other active tab state.

ui/app/components/app/connected-sites-list/connected-sites-list.container.js

@@ -17,8 +17,8 @@ import { getOriginFromUrl } from '../../../helpers/utils/util'
 
 const mapStateToProps = state => {
   const addressConnectedToCurrentTab = getAddressConnectedToCurrentTab(state)
-  const { openMetaMaskTabs, currentActiveTab = {} } = state.appState
-  const { title, url, id } = currentActiveTab
+  const { openMetaMaskTabs } = state.appState
+  const { title, url, id } = state.activeTab
 
   let tabToConnect
 

ui/app/ducks/app/app.js

@@ -78,7 +78,6 @@ export default function reduceApp (state, action) {
     requestAccountTabs: {},
     openMetaMaskTabs: {},
     currentWindowTab: {},
-    currentActiveTab: {},
   }, state.appState)
 
   switch (action.type) {
@@ -782,11 +781,6 @@ export default function reduceApp (state, action) {
         currentWindowTab: action.value,
       })
 
-    case actions.SET_ACTIVE_TAB:
-      return extend(appState, {
-        currentActiveTab: action.value,
-      })
-
     default:
       return appState
   }

ui/app/pages/routes/index.js

@@ -86,7 +86,7 @@ import {
 
 class Routes extends Component {
   componentWillMount () {
-    const { currentCurrency, setCurrentCurrencyToUSD, getActiveTab } = this.props
+    const { currentCurrency, setCurrentCurrencyToUSD } = this.props
 
     if (!currentCurrency) {
       setCurrentCurrencyToUSD()
@@ -105,8 +105,13 @@ class Routes extends Component {
         })
       }
     })
+  }
 
-    getActiveTab()
+  componentDidMount () {
+    const { addressConnectedToCurrentTab, showAccountDetail, selectedAddress } = this.props
+    if (addressConnectedToCurrentTab && addressConnectedToCurrentTab !== selectedAddress) {
+      showAccountDetail(addressConnectedToCurrentTab)
+    }
   }
 
   componentDidUpdate (prevProps) {
@@ -357,6 +362,7 @@ Routes.propTypes = {
   textDirection: PropTypes.string,
   network: PropTypes.string,
   provider: PropTypes.object,
+  selectedAddress: PropTypes.string,
   frequentRpcListDetail: PropTypes.array,
   currentView: PropTypes.object,
   sidebar: PropTypes.object,
@@ -373,11 +379,14 @@ Routes.propTypes = {
   providerId: PropTypes.string,
   hasPermissionsRequests: PropTypes.bool,
   autoLogoutTimeLimit: PropTypes.number,
-  getActiveTab: PropTypes.func,
   addressConnectedToCurrentTab: PropTypes.string,
   showAccountDetail: PropTypes.func,
 }
 
+Routes.defaultProps = {
+  selectedAddress: undefined,
+}
+
 function mapStateToProps (state) {
   const { appState } = state
   const {
@@ -403,6 +412,7 @@ function mapStateToProps (state) {
     submittedPendingTransactions: submittedPendingTransactionsSelector(state),
     network: state.metamask.network,
     provider: state.metamask.provider,
+    selectedAddress: state.metamask.selectedAddress,
     frequentRpcListDetail: state.metamask.frequentRpcListDetail || [],
     currentCurrency: state.metamask.currentCurrency,
     isMouseUser: state.appState.isMouseUser,
@@ -420,7 +430,6 @@ function mapDispatchToProps (dispatch) {
     setCurrentCurrencyToUSD: () => dispatch(actions.setCurrentCurrency('usd')),
     setMouseUserState: (isMouseUser) => dispatch(actions.setMouseUserState(isMouseUser)),
     setLastActiveTime: () => dispatch(actions.setLastActiveTime()),
-    getActiveTab: () => dispatch(actions.getActiveTab()),
     showAccountDetail: address => dispatch(actions.showAccountDetail(address)),
   }
 }

ui/app/selectors/selectors.js

@@ -560,8 +560,8 @@ function getRenderablePermissionsDomains (state) {
 }
 
 function getOriginOfCurrentTab (state) {
-  const { appState: { currentActiveTab = {} } } = state
-  return currentActiveTab.url && getOriginFromUrl(currentActiveTab.url)
+  const { activeTab } = state
+  return activeTab && activeTab.url && getOriginFromUrl(activeTab.url)
 }
 
 function getLastConnectedInfo (state) {

ui/app/store/actions.js

@@ -402,9 +402,6 @@ var actions = {
   getCurrentWindowTab,
   SET_REQUEST_ACCOUNT_TABS: 'SET_REQUEST_ACCOUNT_TABS',
   SET_CURRENT_WINDOW_TAB: 'SET_CURRENT_WINDOW_TAB',
-  setActiveTab,
-  SET_ACTIVE_TAB: 'SET_ACTIVE_TAB',
-  getActiveTab,
   getOpenMetamaskTabsIds,
   SET_OPEN_METAMASK_TAB_IDS: 'SET_OPEN_METAMASK_TAB_IDS',
 }
@@ -3074,21 +3071,3 @@ function getCurrentWindowTab () {
     dispatch(setCurrentWindowTab(currentWindowTab))
   }
 }
-
-function setActiveTab (activeTab) {
-  return {
-    type: actions.SET_ACTIVE_TAB,
-    value: activeTab,
-  }
-}
-
-function getActiveTab () {
-  return (dispatch) => {
-    return global.platform.queryTabs()
-      .then(tabs => {
-        const activeTab = tabs.find(tab => tab.active)
-        dispatch(setActiveTab(activeTab))
-        return activeTab
-      })
-  }
-}