Clear Account Details in AppState (#9238)

* Clear Account Details in AppState

We store sensitive information in the AppState under accountDetail for when the modal is active and present. This adds a new action/reducer and componentWillUnmount to clean up the persisted data left after leaving the modal.

* Remove reduntant clearAccountDetails call when clicking done button

test/unit/ui/app/reducers/app.spec.js

@@ -167,6 +167,23 @@ describe('App State', function () {
 
   })
 
+  it('clears account details', function () {
+    const exportPrivKeyModal = {
+      accountDetail: {
+        subview: 'export',
+        accountExport: 'completed',
+        privateKey: 'a-priv-key',
+      },
+    }
+
+    const state = { ...metamaskState, appState: { ...exportPrivKeyModal } }
+    const newState = reduceApp(state, {
+      type: actions.CLEAR_ACCOUNT_DETAILS,
+    })
+
+    assert.deepStrictEqual(newState.accountDetail, {})
+  })
+
   it('shoes account page', function () {
     const state = reduceApp(metamaskState, {
       type: actions.SHOW_ACCOUNTS_PAGE,

ui/app/components/app/modals/export-private-key-modal/export-private-key-modal.component.js

@@ -25,6 +25,7 @@ export default class ExportPrivateKeyModal extends Component {
     warning: PropTypes.node,
     showAccountDetailModal: PropTypes.func.isRequired,
     hideModal: PropTypes.func.isRequired,
+    clearAccountDetails: PropTypes.func.isRequired,
     previousModalState: PropTypes.string,
   }
 
@@ -34,6 +35,10 @@ export default class ExportPrivateKeyModal extends Component {
     showWarning: true,
   }
 
+  componentWillUnmount () {
+    this.props.clearAccountDetails()
+  }
+
   exportAccountAndGetPrivateKey = (password, address) => {
     const { exportAccount } = this.props
 

ui/app/components/app/modals/export-private-key-modal/export-private-key-modal.container.js

@@ -1,5 +1,5 @@
 import { connect } from 'react-redux'
-import { exportAccount, hideWarning, showModal, hideModal } from '../../../../store/actions'
+import { exportAccount, hideWarning, showModal, hideModal, clearAccountDetails } from '../../../../store/actions'
 import { getSelectedIdentity } from '../../../../selectors'
 import ExportPrivateKeyModal from './export-private-key-modal.component'
 
@@ -32,6 +32,7 @@ function mapDispatchToProps (dispatch) {
     },
     showAccountDetailModal: () => dispatch(showModal({ name: 'ACCOUNT_DETAILS' })),
     hideModal: () => dispatch(hideModal()),
+    clearAccountDetails: () => dispatch(clearAccountDetails()),
   }
 }
 

ui/app/ducks/app/app.js

@@ -137,6 +137,12 @@ export default function reduceApp (state = {}, action) {
         ),
       }
 
+    case actionConstants.CLEAR_ACCOUNT_DETAILS:
+      return {
+        ...appState,
+        accountDetail: {},
+      }
+
     case actionConstants.FORGOT_PASSWORD:
       return {
         ...appState,

ui/app/store/actionConstants.js

@@ -36,6 +36,7 @@ export const SET_CURRENT_FIAT = 'SET_CURRENT_FIAT'
 export const SHOW_SEND_TOKEN_PAGE = 'SHOW_SEND_TOKEN_PAGE'
 export const SHOW_PRIVATE_KEY = 'SHOW_PRIVATE_KEY'
 export const SET_ACCOUNT_LABEL = 'SET_ACCOUNT_LABEL'
+export const CLEAR_ACCOUNT_DETAILS = 'CLEAR_ACCOUNT_DETAILS'
 // tx conf screen
 export const COMPLETED_TX = 'COMPLETED_TX'
 export const TRANSACTION_ERROR = 'TRANSACTION_ERROR'

ui/app/store/actions.js

@@ -1808,6 +1808,12 @@ export function setAccountLabel (account, label) {
   }
 }
 
+export function clearAccountDetails () {
+  return {
+    type: actionConstants.CLEAR_ACCOUNT_DETAILS,
+  }
+}
+
 export function showSendTokenPage () {
   return {
     type: actionConstants.SHOW_SEND_TOKEN_PAGE,