Auto logout after specific time (#6558)

* Add i18n strings

* Finish Auto timeout

* Fix linter

* Fix copies

* Add unit test to Advanced Tab component

* Add back actions and container

* Add basic test to ensure container completeness

* No zero, fix linters

* restrict negative in input

1 files changed, 28 insertions, 3 deletions

diff --git a/ui/app/pages/routes/index.js b/ui/app/pages/routes/index.js
index e38a6d6ce..7ff741405 100644
--- a/ui/app/pages/routes/index.js
+++ b/ui/app/pages/routes/index.js
@@ -3,9 +3,10 @@ import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
 import { Route, Switch, withRouter, matchPath } from 'react-router-dom'
 import { compose } from 'recompose'
-import actions from '../../store/actions'
+import actions, {hideSidebar, hideWarning, lockMetamask} from '../../store/actions'
 import log from 'loglevel'
-import { getMetaMaskAccounts, getNetworkIdentifier } from '../../selectors/selectors'
+import IdleTimer from 'react-idle-timer'
+import {getMetaMaskAccounts, getNetworkIdentifier, preferencesSelector} from '../../selectors/selectors'
 
 // init
 import FirstTimeFlow from '../first-time-flow'
@@ -98,7 +99,9 @@ class Routes extends Component {
   }
 
   renderRoutes () {
-    return (
+    const { autoLogoutTimeLimit, lockMetamask } = this.props
+
+    const routes = (
       <Switch>
         <Route path={LOCK_ROUTE} component={Lock} exact />
         <Route path={INITIALIZE_ROUTE} component={FirstTimeFlow} />
@@ -116,6 +119,19 @@ class Routes extends Component {
         <Authenticated path={DEFAULT_ROUTE} component={Home} exact />
       </Switch>
     )
+
+    if (autoLogoutTimeLimit > 0) {
+      return (
+        <IdleTimer
+          onIdle={lockMetamask}
+          timeout={autoLogoutTimeLimit * 1000 * 60}
+        >
+          {routes}
+        </IdleTimer>
+      )
+    }
+
+    return routes
   }
 
   onInitializationUnlockPage () {
@@ -322,6 +338,7 @@ Routes.propTypes = {
   networkDropdownOpen: PropTypes.bool,
   showNetworkDropdown: PropTypes.func,
   hideNetworkDropdown: PropTypes.func,
+  lockMetamask: PropTypes.func,
   history: PropTypes.object,
   location: PropTypes.object,
   dispatch: PropTypes.func,
@@ -344,6 +361,7 @@ Routes.propTypes = {
   t: PropTypes.func,
   providerId: PropTypes.string,
   providerRequests: PropTypes.array,
+  autoLogoutTimeLimit: PropTypes.number,
 }
 
 function mapStateToProps (state) {
@@ -358,6 +376,7 @@ function mapStateToProps (state) {
   } = appState
 
   const accounts = getMetaMaskAccounts(state)
+  const { autoLogoutTimeLimit = 0 } = preferencesSelector(state)
 
   const {
     identities,
@@ -409,6 +428,7 @@ function mapStateToProps (state) {
     Qr: state.appState.Qr,
     welcomeScreenSeen: state.metamask.welcomeScreenSeen,
     providerId: getNetworkIdentifier(state),
+    autoLogoutTimeLimit,
 
     // state needed to get account dropdown temporarily rendering from app bar
     identities,
@@ -427,6 +447,11 @@ function mapDispatchToProps (dispatch, ownProps) {
     setCurrentCurrencyToUSD: () => dispatch(actions.setCurrentCurrency('usd')),
     toggleAccountMenu: () => dispatch(actions.toggleAccountMenu()),
     setMouseUserState: (isMouseUser) => dispatch(actions.setMouseUserState(isMouseUser)),
+    lockMetamask: () => {
+      dispatch(lockMetamask())
+      dispatch(hideWarning())
+      dispatch(hideSidebar())
+    },
   }
 }