Add "import account" menu item + template view

4 files changed, 63 insertions, 0 deletions

diff --git a/ui/app/actions.js b/ui/app/actions.js
index 5a3968f82..1f1a707b5 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -32,11 +32,13 @@ var actions = {
   SHOW_INIT_MENU: 'SHOW_INIT_MENU',
   SHOW_NEW_VAULT_SEED: 'SHOW_NEW_VAULT_SEED',
   SHOW_INFO_PAGE: 'SHOW_INFO_PAGE',
+  SHOW_IMPORT_PAGE: 'SHOW_IMPORT_PAGE',
   unlockMetamask: unlockMetamask,
   unlockFailed: unlockFailed,
   showCreateVault: showCreateVault,
   showRestoreVault: showRestoreVault,
   showInitializeMenu: showInitializeMenu,
+  showImportPage,
   createNewVaultAndKeychain: createNewVaultAndKeychain,
   createNewVaultAndRestore: createNewVaultAndRestore,
   createNewVaultInProgress: createNewVaultInProgress,
@@ -376,6 +378,12 @@ function showInitializeMenu () {
   }
 }
 
+function showImportPage () {
+  return {
+    type: actions.SHOW_IMPORT_PAGE,
+  }
+}
+
 function agreeToDisclaimer () {
   return (dispatch) => {
     dispatch(this.showLoadingIndication())
diff --git a/ui/app/app.js b/ui/app/app.js
index 9efe95874..c6377a2cf 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -20,6 +20,7 @@ const NoticeScreen = require('./components/notice')
 const generateLostAccountsNotice = require('../lib/lost-accounts-notice')
 // other views
 const ConfigScreen = require('./config')
+const Import = require('./import')
 const InfoScreen = require('./info')
 const LoadingIndicator = require('./components/loading')
 const SandwichExpando = require('sandwich-expando')
@@ -305,6 +306,13 @@ App.prototype.renderDropdown = function () {
     }),
 
     h(DropMenuItem, {
+      label: 'Import Account',
+      closeMenu: () => this.setState({ isMainMenuOpen: !isOpen }),
+      action: () => this.props.dispatch(actions.showImportPage()),
+      icon: h('i.fa.fa-arrow-circle-o-up.fa-lg'),
+    }),
+
+    h(DropMenuItem, {
       label: 'Lock',
       closeMenu: () => this.setState({ isMainMenuOpen: !isOpen }),
       action: () => this.props.dispatch(actions.lockMetamask()),
@@ -411,6 +419,9 @@ App.prototype.renderPrimary = function () {
     case 'config':
       return h(ConfigScreen, {key: 'config'})
 
+    case 'import-menu':
+      return h(Import, {key: 'import-menu'})
+
     case 'reveal-seed-conf':
       return h(RevealSeedConfirmation, {key: 'reveal-seed-conf'})
 
diff --git a/ui/app/import/index.js b/ui/app/import/index.js
new file mode 100644
index 000000000..89c79bedc
--- /dev/null
+++ b/ui/app/import/index.js
@@ -0,0 +1,36 @@
+const inherits = require('util').inherits
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const connect = require('react-redux').connect
+
+module.exports = connect(mapStateToProps)(ImportIndex)
+
+function mapStateToProps (state) {
+  return {}
+}
+
+inherits(ImportIndex, Component)
+function ImportIndex () {
+  Component.call(this)
+}
+
+ImportIndex.prototype.render = function () {
+  const props = this.props
+
+
+  return (
+
+    h('.accounts-section.flex-grow', [
+
+      // subtitle and nav
+      h('.section-title.flex-center', [
+        h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
+          onClick: this.goHome.bind(this),
+        }),
+        h('h2.page-subtitle', 'Select Account'),
+      ]),
+
+    ])
+  )
+}
+
diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js
index dc7344b3e..cfa98442a 100644
--- a/ui/app/reducers/app.js
+++ b/ui/app/reducers/app.js
@@ -99,6 +99,14 @@ function reduceApp (state, action) {
         transForward: action.value,
       })
 
+    case actions.SHOW_IMPORT_PAGE:
+      return extend(appState, {
+        currentView: {
+          name: 'import-menu',
+        },
+        transForward: true,
+      })
+
     case actions.SHOW_INFO_PAGE:
       return extend(appState, {
         currentView: {