MVP Popup Notifications Working

I'm unsure which will be more performant: A notification using a trimmed down version of the UI, or using them both, letting the browser cache them both.

In any case, here I've modified the normal UI to recognize when it's a popup, and change the UX accordingly in a few ways:
 - Hide the menu bar
 - Hide the back button from the notifications view.
 - When confirming the last tx, close the window.

3 files changed, 20 insertions, 2 deletions

diff --git a/ui/app/app.js b/ui/app/app.js
index 2d8b46ce8..3b21e4477 100644
--- a/ui/app/app.js
+++ b/ui/app/app.js
@@ -95,6 +95,11 @@ App.prototype.render = function () {
 }
 
 App.prototype.renderAppBar = function () {
+
+  if (window.METAMASK_UI_TYPE === 'notification') {
+    return null
+  }
+
   const props = this.props
   const state = this.state || {}
   const isNetworkMenuOpen = state.isNetworkMenuOpen || false
diff --git a/ui/app/conf-tx.js b/ui/app/conf-tx.js
index db876dd9b..8c6a136bf 100644
--- a/ui/app/conf-tx.js
+++ b/ui/app/conf-tx.js
@@ -36,6 +36,7 @@ ConfirmTxScreen.prototype.render = function () {
   var unconfTxList = txHelper(unconfTxs, unconfMsgs)
   var index = state.index !== undefined ? state.index : 0
   var txData = unconfTxList[index] || {}
+  var isNotification = window.METAMASK_UI_TYPE === 'notification'
 
   return (
 
@@ -43,9 +44,9 @@ ConfirmTxScreen.prototype.render = function () {
 
       // subtitle and nav
       h('.section-title.flex-row.flex-center', [
-        h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
+        !isNotification ? h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
           onClick: this.goHome.bind(this),
-        }),
+        }) : null,
         h('h2.page-subtitle', 'Confirm Transaction'),
       ]),
 
diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js
index 95b60f929..cbf64bf95 100644
--- a/ui/app/reducers/app.js
+++ b/ui/app/reducers/app.js
@@ -1,6 +1,7 @@
 const extend = require('xtend')
 const actions = require('../actions')
 const txHelper = require('../../lib/tx-helper')
+const extension = require('../../../app/scripts/lib/extension')
 
 module.exports = reduceApp
 
@@ -250,6 +251,17 @@ function reduceApp (state, action) {
           warning: null,
         })
       } else {
+
+        const isNotification = window.METAMASK_UI_TYPE === 'notification'
+        if (isNotification) {
+          return extension.windows.getCurrent({}, function(win) {
+						extension.windows.remove(win.id, function(err) {
+							if (err) console.err(err)
+						})
+					})
+        } else {
+          debugger
+        }
         return extend(appState, {
           transForward: false,
           warning: null,