Merge branch 'master' into mascara

20 files changed, 218 insertions, 89 deletions

diff --git a/ui/app/accounts/import/json.js b/ui/app/accounts/import/json.js
index 1c2b331d4..5ed31ab0a 100644
--- a/ui/app/accounts/import/json.js
+++ b/ui/app/accounts/import/json.js
@@ -60,7 +60,7 @@ JsonImportSubview.prototype.render = function () {
         },
       }, 'Import'),
 
-      error ? h('span.warning', error) : null,
+      error ? h('span.error', error) : null,
     ])
   )
 }
@@ -95,4 +95,3 @@ JsonImportSubview.prototype.createNewKeychain = function () {
 
   this.props.dispatch(actions.importNewAccount('JSON File', [ fileContents, password ]))
 }
-
diff --git a/ui/app/accounts/import/private-key.js b/ui/app/accounts/import/private-key.js
index b139a0374..68ccee58e 100644
--- a/ui/app/accounts/import/private-key.js
+++ b/ui/app/accounts/import/private-key.js
@@ -48,7 +48,7 @@ PrivateKeyImportView.prototype.render = function () {
         },
       }, 'Import'),
 
-      error ? h('span.warning', error) : null,
+      error ? h('span.error', error) : null,
     ])
   )
 }
@@ -65,4 +65,3 @@ PrivateKeyImportView.prototype.createNewKeychain = function () {
   const privateKey = input.value
   this.props.dispatch(actions.importNewAccount('Private Key', [ privateKey ]))
 }
-
diff --git a/ui/app/actions.js b/ui/app/actions.js
index d4fd7553b..d02b7dcaa 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -71,10 +71,12 @@ var actions = {
   SHOW_CONF_TX_PAGE: 'SHOW_CONF_TX_PAGE',
   SHOW_CONF_MSG_PAGE: 'SHOW_CONF_MSG_PAGE',
   SET_CURRENT_FIAT: 'SET_CURRENT_FIAT',
-  setCurrentFiat: setCurrentFiat,
+  setCurrentCurrency: setCurrentCurrency,
   // account detail screen
   SHOW_SEND_PAGE: 'SHOW_SEND_PAGE',
   showSendPage: showSendPage,
+  ADD_TO_ADDRESS_BOOK: 'ADD_TO_ADDRESS_BOOK',
+  addToAddressBook: addToAddressBook,
   REQUEST_ACCOUNT_EXPORT: 'REQUEST_ACCOUNT_EXPORT',
   requestExportAccount: requestExportAccount,
   EXPORT_ACCOUNT: 'EXPORT_ACCOUNT',
@@ -267,11 +269,12 @@ function requestRevealSeed (password) {
     dispatch(actions.showLoadingIndication())
     log.debug(`background.submitPassword`)
     background.submitPassword(password, (err) => {
-      if (err) return dispatch(actions.displayWarning(err.message))
+      if (err) {
+        return dispatch(actions.displayWarning(err.message))
+      }
       log.debug(`background.placeSeedWords`)
       background.placeSeedWords((err) => {
         if (err) return dispatch(actions.displayWarning(err.message))
-        dispatch(actions.hideLoadingIndication())
       })
     })
   }
@@ -294,10 +297,10 @@ function importNewAccount (strategy, args) {
     dispatch(actions.showLoadingIndication('This may take a while, be patient.'))
     log.debug(`background.importAccountWithStrategy`)
     background.importAccountWithStrategy(strategy, args, (err) => {
-      dispatch(actions.hideLoadingIndication())
       if (err) return dispatch(actions.displayWarning(err.message))
       log.debug(`background.getState`)
       background.getState((err, newState) => {
+        dispatch(actions.hideLoadingIndication())
         if (err) {
           return dispatch(actions.displayWarning(err.message))
         }
@@ -328,10 +331,10 @@ function showInfoPage () {
   }
 }
 
-function setCurrentFiat (currencyCode) {
+function setCurrentCurrency (currencyCode) {
   return (dispatch) => {
     dispatch(this.showLoadingIndication())
-    log.debug(`background.setCurrentFiat`)
+    log.debug(`background.setCurrentCurrency`)
     background.setCurrentCurrency(currencyCode, (err, data) => {
       dispatch(this.hideLoadingIndication())
       if (err) {
@@ -341,7 +344,7 @@ function setCurrentFiat (currencyCode) {
       dispatch({
         type: this.SET_CURRENT_FIAT,
         value: {
-          currentFiat: data.currentFiat,
+          currentCurrency: data.currentCurrency,
           conversionRate: data.conversionRate,
           conversionDate: data.conversionDate,
         },
@@ -696,6 +699,19 @@ function setRpcTarget (newRpc) {
   }
 }
 
+// Calls the addressBookController to add a new address.
+function addToAddressBook (recipient, nickname) {
+  log.debug(`background.addToAddressBook`)
+  return (dispatch) => {
+    background.setAddressBook(recipient, nickname, (err, result) => {
+      if (err) {
+        log.error(err)
+        return dispatch(self.displayWarning('Address book failed to update'))
+      }
+    })
+  }
+}
+
 function setProviderType (type) {
   log.debug(`background.setProviderType`)
   background.setProviderType(type)
@@ -757,22 +773,30 @@ function requestExportAccount () {
   }
 }
 
-function exportAccount (address) {
+function exportAccount (password, address) {
   var self = this
 
   return function (dispatch) {
     dispatch(self.showLoadingIndication())
 
-    log.debug(`background.exportAccount`)
-    background.exportAccount(address, function (err, result) {
-      dispatch(self.hideLoadingIndication())
-
+    log.debug(`background.submitPassword`)
+    background.submitPassword(password, function (err) {
       if (err) {
-        log.error(err)
-        return dispatch(self.displayWarning('Had a problem exporting the account.'))
+        log.error('Error in submiting password.')
+        dispatch(self.hideLoadingIndication())
+        return dispatch(self.displayWarning('Incorrect Password.'))
       }
+      log.debug(`background.exportAccount`)
+      background.exportAccount(address, function (err, result) {
+        dispatch(self.hideLoadingIndication())
 
-      dispatch(self.showPrivateKey(result))
+        if (err) {
+          log.error(err)
+          return dispatch(self.displayWarning('Had a problem exporting the account.'))
+        }
+
+        dispatch(self.showPrivateKey(result))
+      })
     })
   }
 }
diff --git a/ui/app/app.js b/ui/app/app.js
index 2bc92b54c..5a7596aca 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -256,6 +256,15 @@ App.prototype.renderNetworkDropdown = function () {
     }),
 
     h(DropMenuItem, {
+      label: 'Kovan Test Network',
+      closeMenu: () => this.setState({ isNetworkMenuOpen: false}),
+      action: () => props.dispatch(actions.setProviderType('kovan')),
+      icon: h('.menu-icon.hollow-diamond'),
+      activeNetworkRender: props.network,
+      provider: props.provider,
+    }),
+
+    h(DropMenuItem, {
       label: 'Localhost 8545',
       closeMenu: () => this.setState({ isNetworkMenuOpen: false }),
       action: () => props.dispatch(actions.setDefaultRpcTarget(rpcList)),
@@ -266,7 +275,7 @@ App.prototype.renderNetworkDropdown = function () {
     this.renderCustomOption(props.provider),
     this.renderCommonRpc(rpcList, props.provider),
 
-    props.isUnlocked && h(DropMenuItem, {
+    h(DropMenuItem, {
       label: 'Custom RPC',
       closeMenu: () => this.setState({ isNetworkMenuOpen: false }),
       action: () => this.props.dispatch(actions.showConfigPage()),
@@ -400,6 +409,10 @@ App.prototype.renderPrimary = function () {
         log.debug('rendering restore vault screen')
         return h(HDRestoreVaultScreen, {key: 'HDRestoreVaultScreen'})
 
+      case 'config':
+        log.debug('rendering config screen from unlock screen.')
+        return h(ConfigScreen, {key: 'config'})
+
       default:
         log.debug('rendering locked screen')
         return h(UnlockScreen, {key: 'locked'})
diff --git a/ui/app/components/account-export.js b/ui/app/components/account-export.js
index 6d8b099a5..888196c5d 100644
--- a/ui/app/components/account-export.js
+++ b/ui/app/components/account-export.js
@@ -4,14 +4,21 @@ const inherits = require('util').inherits
 const copyToClipboard = require('copy-to-clipboard')
 const actions = require('../actions')
 const ethUtil = require('ethereumjs-util')
+const connect = require('react-redux').connect
 
-module.exports = ExportAccountView
+module.exports = connect(mapStateToProps)(ExportAccountView)
 
 inherits(ExportAccountView, Component)
 function ExportAccountView () {
   Component.call(this)
 }
 
+function mapStateToProps (state) {
+  return {
+    warning: state.appState.warning,
+  }
+}
+
 ExportAccountView.prototype.render = function () {
   console.log('EXPORT VIEW')
   console.dir(this.props)
@@ -28,35 +35,58 @@ ExportAccountView.prototype.render = function () {
   if (notExporting) return h('div')
 
   if (exportRequested) {
-    var warning = `Exporting your private key is very dangerous,
-      and you should only do it if you know what you're doing.`
-    var confirmation = `If you're absolutely sure, type "I understand" below and
-                        submit.`
+    var warning = `Export private keys at your own risk.`
     return (
-
       h('div', {
-        key: 'exporting',
         style: {
-          margin: '0 20px',
+          display: 'inline-block',
+          textAlign: 'center',
         },
-      }, [
-        h('p.error', warning),
-        h('p', confirmation),
-        h('input#exportAccount.sizing-input', {
-          onKeyPress: this.onExportKeyPress.bind(this),
-          style: {
-            position: 'relative',
-            top: '1.5px',
+      },
+        [
+          h('div', {
+            key: 'exporting',
+            style: {
+              margin: '0 20px',
+            },
+          }, [
+            h('p.error', warning),
+            h('input#exportAccount.sizing-input', {
+              type: 'password',
+              placeholder: 'confirm password',
+              onKeyPress: this.onExportKeyPress.bind(this),
+              style: {
+                position: 'relative',
+                top: '1.5px',
+                marginBottom: '7px',
+              },
+            }),
+          ]),
+          h('div', {
+            key: 'buttons',
+            style: {
+              margin: '0 20px',
+            },
           },
-        }),
-        h('button', {
-          onClick: () => this.onExportKeyPress({ key: 'Enter', preventDefault: () => {} }),
-        }, 'Submit'),
-        h('button', {
-          onClick: () => this.props.dispatch(actions.backToAccountDetail(this.props.address)),
-        }, 'Cancel'),
-      ])
-
+            [
+              h('button', {
+                onClick: () => this.onExportKeyPress({ key: 'Enter', preventDefault: () => {} }),
+                style: {
+                  marginRight: '10px',
+                },
+              }, 'Submit'),
+              h('button', {
+                onClick: () => this.props.dispatch(actions.backToAccountDetail(this.props.address)),
+              }, 'Cancel'),
+            ]),
+          (this.props.warning) && (
+          h('span.error', {
+            style: {
+              margin: '20px',
+            },
+          }, this.props.warning.split('-'))
+        ),
+        ])
     )
   }
 
@@ -89,15 +119,6 @@ ExportAccountView.prototype.onExportKeyPress = function (event) {
   if (event.key !== 'Enter') return
   event.preventDefault()
 
-  var input = document.getElementById('exportAccount')
-  if (input.value === 'I understand') {
-    this.props.dispatch(actions.exportAccount(this.props.address))
-  } else {
-    input.value = ''
-    input.placeholder = 'Please retype "I understand" exactly.'
-  }
-}
-
-ExportAccountView.prototype.exportAccount = function (address) {
-  this.props.dispatch(actions.exportAccount(address))
+  var input = document.getElementById('exportAccount').value
+  this.props.dispatch(actions.exportAccount(input, this.props.address))
 }
diff --git a/ui/app/components/binary-renderer.js b/ui/app/components/binary-renderer.js
index a9d49b128..0b6a1f5c2 100644
--- a/ui/app/components/binary-renderer.js
+++ b/ui/app/components/binary-renderer.js
@@ -2,6 +2,7 @@ const Component = require('react').Component
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
 const ethUtil = require('ethereumjs-util')
+const extend = require('xtend')
 
 module.exports = BinaryRenderer
 
@@ -12,20 +13,22 @@ function BinaryRenderer () {
 
 BinaryRenderer.prototype.render = function () {
   const props = this.props
-  const { value } = props
+  const { value, style } = props
   const text = this.hexToText(value)
 
+  const defaultStyle = extend({
+    width: '315px',
+    maxHeight: '210px',
+    resize: 'none',
+    border: 'none',
+    background: 'white',
+    padding: '3px',
+  }, style)
+
   return (
     h('textarea.font-small', {
       readOnly: true,
-      style: {
-        width: '315px',
-        maxHeight: '210px',
-        resize: 'none',
-        border: 'none',
-        background: 'white',
-        padding: '3px',
-      },
+      style: defaultStyle,
       defaultValue: text,
     })
   )
diff --git a/ui/app/components/drop-menu-item.js b/ui/app/components/drop-menu-item.js
index 9f002234e..3eb6ec876 100644
--- a/ui/app/components/drop-menu-item.js
+++ b/ui/app/components/drop-menu-item.js
@@ -42,7 +42,10 @@ DropMenuItem.prototype.activeNetworkRender = function () {
       if (providerType === 'mainnet') return h('.check', '✓')
       break
     case 'Ropsten Test Network':
-      if (provider.type === 'testnet') return h('.check', '✓')
+      if (providerType === 'testnet') return h('.check', '✓')
+      break
+    case 'Kovan Test Network':
+      if (providerType === 'kovan') return h('.check', '✓')
       break
     case 'Localhost 8545':
       if (activeNetwork === 'http://localhost:8545') return h('.check', '✓')
diff --git a/ui/app/components/ens-input.js b/ui/app/components/ens-input.js
index ffc4eab4a..facf29d97 100644
--- a/ui/app/components/ens-input.js
+++ b/ui/app/components/ens-input.js
@@ -21,6 +21,7 @@ function EnsInput () {
 EnsInput.prototype.render = function () {
   const props = this.props
   const opts = extend(props, {
+    list: 'addresses',
     onChange: () => {
       const network = this.props.network
       let resolverAddress = networkResolvers[network]
@@ -46,6 +47,25 @@ EnsInput.prototype.render = function () {
     style: { width: '100%' },
   }, [
     h('input.large-input', opts),
+    // The address book functionality.
+    h('datalist#addresses',
+      [
+        // Corresponds to the addresses owned.
+        Object.keys(props.identities).map((key) => {
+          let identity = props.identities[key]
+          return h('option', {
+            value: identity.address,
+            label: identity.name,
+          })
+        }),
+        // Corresponds to previously sent-to addresses.
+        props.addressBook.map((identity) => {
+          return h('option', {
+            value: identity.address,
+            label: identity.name,
+          })
+        }),
+      ]),
     this.ensIcon(),
   ])
 }
@@ -80,11 +100,13 @@ EnsInput.prototype.lookupEnsName = function () {
       this.setState({
         loadingEns: false,
         ensResolution: address,
+        nickname: recipient.trim(),
         hoverText: address + '\nClick to Copy',
       })
     }
   })
   .catch((reason) => {
+    log.error(reason)
     return this.setState({
       loadingEns: false,
       ensFailure: true,
@@ -95,10 +117,13 @@ EnsInput.prototype.lookupEnsName = function () {
 
 EnsInput.prototype.componentDidUpdate = function (prevProps, prevState) {
   const state = this.state || {}
-  const { ensResolution } = state
+  const ensResolution = state.ensResolution
+  // If an address is sent without a nickname, meaning not from ENS or from
+  // the user's own accounts, a default of a one-space string is used.
+  const nickname = state.nickname || ' '
   if (ensResolution && this.props.onChange &&
       ensResolution !== prevState.ensResolution) {
-    this.props.onChange(ensResolution)
+    this.props.onChange(ensResolution, nickname)
   }
 }
 
diff --git a/ui/app/components/fiat-value.js b/ui/app/components/fiat-value.js
index 13ee48245..298809b30 100644
--- a/ui/app/components/fiat-value.js
+++ b/ui/app/components/fiat-value.js
@@ -9,7 +9,7 @@ module.exports = connect(mapStateToProps)(FiatValue)
 function mapStateToProps (state) {
   return {
     conversionRate: state.metamask.conversionRate,
-    currentFiat: state.metamask.currentFiat,
+    currentCurrency: state.metamask.currentCurrency,
   }
 }
 
@@ -34,7 +34,7 @@ FiatValue.prototype.render = function () {
     fiatTooltipNumber = 'Unknown'
   }
 
-  var fiatSuffix = props.currentFiat
+  var fiatSuffix = props.currentCurrency
 
   return fiatDisplay(fiatDisplayNumber, fiatSuffix)
 }
diff --git a/ui/app/components/network.js b/ui/app/components/network.js
index 77805fd57..d9045167f 100644
--- a/ui/app/components/network.js
+++ b/ui/app/components/network.js
@@ -40,6 +40,9 @@ Network.prototype.render = function () {
   } else if (parseInt(networkNumber) === 3) {
     hoverText = 'Ropsten Test Network'
     iconName = 'ropsten-test-network'
+  } else if (providerName === 'kovan') {
+    hoverText = 'Kovan Test Network'
+    iconName = 'kovan-test-network'
   } else {
     hoverText = 'Unknown Private Network'
     iconName = 'unknown-private-network'
@@ -70,6 +73,15 @@ Network.prototype.render = function () {
                 }},
               'Ropsten Test Net'),
             ])
+          case 'kovan-test-network':
+            return h('.network-indicator', [
+              h('.menu-icon.hollow-diamond'),
+              h('.network-name', {
+                style: {
+                  color: '#690496',
+                }},
+              'Kovan Test Net'),
+            ])
           default:
             return h('.network-indicator', [
               h('i.fa.fa-question-circle.fa-lg', {
diff --git a/ui/app/components/pending-personal-msg-details.js b/ui/app/components/pending-personal-msg-details.js
index fa2c6416c..1050513f2 100644
--- a/ui/app/components/pending-personal-msg-details.js
+++ b/ui/app/components/pending-personal-msg-details.js
@@ -40,9 +40,18 @@ PendingMsgDetails.prototype.render = function () {
       }),
 
       // message data
-      h('div', [
+      h('div', {
+        style: {
+          height: '260px',
+        },
+      }, [
         h('label.font-small', { style: { display: 'block' } }, 'MESSAGE'),
-        h(BinaryRenderer, { value: data }),
+        h(BinaryRenderer, {
+          value: data,
+          style: {
+            height: '215px',
+          },
+        }),
       ]),
 
     ])
diff --git a/ui/app/components/transaction-list-item.js b/ui/app/components/transaction-list-item.js
index 44d2dc587..ee32be7d3 100644
--- a/ui/app/components/transaction-list-item.js
+++ b/ui/app/components/transaction-list-item.js
@@ -28,7 +28,7 @@ TransactionListItem.prototype.render = function () {
 
   let isLinkable = false
   const numericNet = parseInt(network)
-  isLinkable = numericNet === 1 || numericNet === 3
+  isLinkable = numericNet === 1 || numericNet === 3 || numericNet === 42
 
   var isMsg = ('msgParams' in transaction)
   var isTx = ('txParams' in transaction)
diff --git a/ui/app/config.js b/ui/app/config.js
index 00a4cba88..444365de2 100644
--- a/ui/app/config.js
+++ b/ui/app/config.js
@@ -125,19 +125,19 @@ function rpcValidation (newRpc, state) {
 }
 
 function currentConversionInformation (metamaskState, state) {
-  var currentFiat = metamaskState.currentFiat
+  var currentCurrency = metamaskState.currentCurrency
   var conversionDate = metamaskState.conversionDate
   return h('div', [
     h('span', {style: { fontWeight: 'bold', paddingRight: '10px'}}, 'Current Conversion'),
     h('span', {style: { fontWeight: 'bold', paddingRight: '10px', fontSize: '13px'}}, `Updated ${Date(conversionDate)}`),
-    h('select#currentFiat', {
+    h('select#currentCurrency', {
       onChange (event) {
         event.preventDefault()
-        var element = document.getElementById('currentFiat')
-        var newFiat = element.value
-        state.dispatch(actions.setCurrentFiat(newFiat))
+        var element = document.getElementById('currentCurrency')
+        var newCurrency = element.value
+        state.dispatch(actions.setCurrentCurrency(newCurrency))
       },
-      defaultValue: currentFiat,
+      defaultValue: currentCurrency,
     }, currencies.map((currency) => {
       return h('option', {key: currency.code, value: currency.code}, `${currency.code} - ${currency.name}`)
     })
@@ -161,6 +161,11 @@ function currentProviderDisplay (metamaskState) {
       value = 'Ropsten Test Network'
       break
 
+    case 'kovan':
+      title = 'Current Network'
+      value = 'Kovan Test Network'
+      break
+
     default:
       title = 'Current RPC'
       value = metamaskState.provider.rpcTarget
diff --git a/ui/app/css/index.css b/ui/app/css/index.css
index 8c6ff29d3..3ec0ac5c5 100644
--- a/ui/app/css/index.css
+++ b/ui/app/css/index.css
@@ -266,8 +266,9 @@ app sections
 }
 
 .sizing-input{
-  font-size: 1em;
+  font-size: 14px;
   height: 30px;
+  padding-left: 5px;
 }
 .editable-label{
   display: flex;
diff --git a/ui/app/css/lib.css b/ui/app/css/lib.css
index 99c6f1b9d..670dc9fd0 100644
--- a/ui/app/css/lib.css
+++ b/ui/app/css/lib.css
@@ -188,7 +188,7 @@ hr.horizontal-line {
 
 .hollow-diamond {
   transform: rotate(45deg);
-  border: 1px solid #038789;
+  border: 3px solid #690496;
 }
 
 .pending-dot {
diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js
index 7ea1e1d7c..b9e3f7b16 100644
--- a/ui/app/reducers/app.js
+++ b/ui/app/reducers/app.js
@@ -426,6 +426,7 @@ function reduceApp (state, action) {
     case actions.DISPLAY_WARNING:
       return extend(appState, {
         warning: action.value,
+        isLoading: false,
       })
 
     case actions.HIDE_WARNING:
diff --git a/ui/app/reducers/metamask.js b/ui/app/reducers/metamask.js
index a3c07d977..2b5151466 100644
--- a/ui/app/reducers/metamask.js
+++ b/ui/app/reducers/metamask.js
@@ -13,12 +13,10 @@ function reduceMetamask (state, action) {
     rpcTarget: 'https://rawtestrpc.metamask.io/',
     identities: {},
     unapprovedTxs: {},
-    currentFiat: 'USD',
-    conversionRate: 0,
-    conversionDate: 'N/A',
     noActiveNotices: true,
     lastUnreadNotice: undefined,
     frequentRpcList: [],
+    addressBook: [],
   }, state.metamask)
 
   switch (action.type) {
@@ -126,7 +124,7 @@ function reduceMetamask (state, action) {
 
     case actions.SET_CURRENT_FIAT:
       return extend(metamaskState, {
-        currentFiat: action.value.currentFiat,
+        currentCurrency: action.value.currentCurrency,
         conversionRate: action.value.conversionRate,
         conversionDate: action.value.conversionDate,
       })
diff --git a/ui/app/send.js b/ui/app/send.js
index a281a5fcf..eb32d5e06 100644
--- a/ui/app/send.js
+++ b/ui/app/send.js
@@ -20,6 +20,7 @@ function mapStateToProps (state) {
     identities: state.metamask.identities,
     warning: state.appState.warning,
     network: state.metamask.network,
+    addressBook: state.metamask.addressBook,
   }
 
   result.error = result.warning && result.warning.split('.')[0]
@@ -44,6 +45,8 @@ SendTransactionScreen.prototype.render = function () {
   var account = state.account
   var identity = state.identity
   var network = state.network
+  var identities = state.identities
+  var addressBook = state.addressBook
 
   return (
 
@@ -153,6 +156,8 @@ SendTransactionScreen.prototype.render = function () {
           placeholder: 'Recipient Address',
           onChange: this.recipientDidChange.bind(this),
           network,
+          identities,
+          addressBook,
         }),
       ]),
 
@@ -222,13 +227,17 @@ SendTransactionScreen.prototype.back = function () {
   this.props.dispatch(actions.backToAccountDetail(address))
 }
 
-SendTransactionScreen.prototype.recipientDidChange = function (recipient) {
-  this.setState({ recipient })
+SendTransactionScreen.prototype.recipientDidChange = function (recipient, nickname) {
+  this.setState({
+    recipient: recipient,
+    nickname: nickname,
+  })
 }
 
 SendTransactionScreen.prototype.onSubmit = function () {
   const state = this.state || {}
   const recipient = state.recipient || document.querySelector('input[name="address"]').value
+  const nickname = state.nickname || ' '
   const input = document.querySelector('input[name="amount"]').value
   const value = util.normalizeEthStringToWei(input)
   const txData = document.querySelector('input[name="txData"]').value
@@ -257,6 +266,8 @@ SendTransactionScreen.prototype.onSubmit = function () {
 
   this.props.dispatch(actions.hideWarning())
 
+  this.props.dispatch(actions.addToAddressBook(recipient, nickname))
+
   var txParams = {
     from: this.props.address,
     value: '0x' + value.toString(16),
diff --git a/ui/lib/account-link.js b/ui/lib/account-link.js
index 77db0851d..948f32da1 100644
--- a/ui/lib/account-link.js
+++ b/ui/lib/account-link.js
@@ -1,7 +1,6 @@
 module.exports = function (address, network) {
   const net = parseInt(network)
   let link
-
   switch (net) {
     case 1: // main net
       link = `http://etherscan.io/address/${address}`
@@ -12,6 +11,9 @@ module.exports = function (address, network) {
     case 3: // ropsten test net
       link = `http://testnet.etherscan.io/address/${address}`
       break
+    case 42: // kovan test net
+      link = `http://kovan.etherscan.io/address/${address}`
+      break
     default:
       link = ''
       break
diff --git a/ui/lib/explorer-link.js b/ui/lib/explorer-link.js
index dc6be2984..7ae19cca0 100644
--- a/ui/lib/explorer-link.js
+++ b/ui/lib/explorer-link.js
@@ -5,9 +5,12 @@ module.exports = function (hash, network) {
     case 1: // main net
       prefix = ''
       break
-    case 3: // morden test net
+    case 3: // ropsten test net
       prefix = 'testnet.'
       break
+    case 42: // kovan test net
+      prefix = 'kovan.'
+      break
     default:
       prefix = ''
   }