Split AccountDetailsDropdown into container and component files (#8273)

ui/app/components/app/dropdowns/account-details-dropdown/account-details-dropdown.component.js

@@ -1,38 +1,9 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
-import { compose } from 'redux'
-import { withRouter } from 'react-router-dom'
-import { connect } from 'react-redux'
-import * as actions from '../../../store/actions'
-import { getSelectedIdentity, getRpcPrefsForCurrentProvider } from '../../../selectors/selectors'
-import { CONNECTED_ROUTE } from '../../../helpers/constants/routes'
-import genAccountLink from '../../../../lib/account-link.js'
-import { Menu, Item, CloseArea } from './components/menu'
+import { CONNECTED_ROUTE } from '../../../../helpers/constants/routes'
+import { Menu, Item, CloseArea } from '../components/menu'
 
-function mapStateToProps (state) {
-  return {
-    selectedIdentity: getSelectedIdentity(state),
-    network: state.metamask.network,
-    keyrings: state.metamask.keyrings,
-    rpcPrefs: getRpcPrefsForCurrentProvider(state),
-  }
-}
-
-function mapDispatchToProps (dispatch) {
-  return {
-    showAccountDetailModal: () => {
-      dispatch(actions.showModal({ name: 'ACCOUNT_DETAILS' }))
-    },
-    viewOnEtherscan: (address, network, rpcPrefs) => {
-      global.platform.openWindow({ url: genAccountLink(address, network, rpcPrefs) })
-    },
-    showRemoveAccountConfirmationModal: (identity) => {
-      return dispatch(actions.showModal({ name: 'CONFIRM_REMOVE_ACCOUNT', identity }))
-    },
-  }
-}
-
-class AccountDetailsDropdown extends Component {
+export default class AccountDetailsDropdown extends Component {
   static contextTypes = {
     t: PropTypes.func,
     metricsEvent: PropTypes.func,
@@ -177,5 +148,3 @@ class AccountDetailsDropdown extends Component {
     )
   }
 }
-
-export default compose(withRouter, connect(mapStateToProps, mapDispatchToProps))(AccountDetailsDropdown)

ui/app/components/app/dropdowns/account-details-dropdown/account-details-dropdown.container.js

@@ -0,0 +1,32 @@
+import { compose } from 'redux'
+import { withRouter } from 'react-router-dom'
+import { connect } from 'react-redux'
+import AccountDetailsDropdown from './account-details-dropdown.component'
+import * as actions from '../../../../store/actions'
+import { getSelectedIdentity, getRpcPrefsForCurrentProvider } from '../../../../selectors/selectors'
+import genAccountLink from '../../../../../lib/account-link.js'
+
+function mapStateToProps (state) {
+  return {
+    selectedIdentity: getSelectedIdentity(state),
+    network: state.metamask.network,
+    keyrings: state.metamask.keyrings,
+    rpcPrefs: getRpcPrefsForCurrentProvider(state),
+  }
+}
+
+function mapDispatchToProps (dispatch) {
+  return {
+    showAccountDetailModal: () => {
+      dispatch(actions.showModal({ name: 'ACCOUNT_DETAILS' }))
+    },
+    viewOnEtherscan: (address, network, rpcPrefs) => {
+      global.platform.openWindow({ url: genAccountLink(address, network, rpcPrefs) })
+    },
+    showRemoveAccountConfirmationModal: (identity) => {
+      return dispatch(actions.showModal({ name: 'CONFIRM_REMOVE_ACCOUNT', identity }))
+    },
+  }
+}
+
+export default compose(withRouter, connect(mapStateToProps, mapDispatchToProps))(AccountDetailsDropdown)

ui/app/components/app/dropdowns/account-details-dropdown/index.js

@@ -0,0 +1 @@
+export { default } from './account-details-dropdown.container'

ui/app/components/app/menu-bar/menu-bar.component.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types'
 import Tooltip from '../../ui/tooltip'
 import SelectedAccount from '../selected-account'
 import ConnectedStatusIndicator from '../connected-status-indicator'
-import AccountDetailsDropdown from '../dropdowns/account-details-dropdown.js'
+import AccountDetailsDropdown from '../dropdowns/account-details-dropdown'
 
 export default class MenuBar extends PureComponent {
   static contextTypes = {