Emit updates to all listeners on pending tx updates

Previously the metamask controller only supported a single UI event listener, which wasn't useful for having a separate notification UI open at the same time.

Also reduced the notification's complexity down to a single method, which is heavily re-used.

Still has an outstanding bug where if the plugin ui dismisses the last tx, it does not close the notification popup.

3 files changed, 23 insertions, 53 deletions

diff --git a/app/scripts/background.js b/app/scripts/background.js
index 79f8f9fd9..9a324047b 100644
--- a/app/scripts/background.js
+++ b/app/scripts/background.js
@@ -3,9 +3,7 @@ const extend = require('xtend')
 const Dnode = require('dnode')
 const eos = require('end-of-stream')
 const PortStream = require('./lib/port-stream.js')
-const createUnlockRequestNotification = require('./lib/notifications.js').createUnlockRequestNotification
-const createTxNotification = require('./lib/notifications.js').createTxNotification
-const createMsgNotification = require('./lib/notifications.js').createMsgNotification
+const notification = require('./lib/notifications.js')
 const messageManager = require('./lib/message-manager')
 const setupMultiplex = require('./lib/stream-utils.js').setupMultiplex
 const MetamaskController = require('./metamask-controller')
@@ -26,41 +24,15 @@ const controller = new MetamaskController({
 const idStore = controller.idStore
 
 function unlockAccountMessage () {
-  createUnlockRequestNotification({
-    title: 'Account Unlock Request',
-  })
+  notification.show()
 }
 
 function showUnconfirmedMessage (msgParams, msgId) {
-  var controllerState = controller.getState()
-
-  createMsgNotification({
-    imageifyIdenticons: false,
-    txData: {
-      msgParams: msgParams,
-      time: (new Date()).getTime(),
-    },
-    identities: controllerState.identities,
-    accounts: controllerState.accounts,
-    onConfirm: idStore.approveMessage.bind(idStore, msgId, noop),
-    onCancel: idStore.cancelMessage.bind(idStore, msgId),
-  })
+  notification.show()
 }
 
 function showUnconfirmedTx (txParams, txData, onTxDoneCb) {
-  var controllerState = controller.getState()
-
-  createTxNotification({
-    imageifyIdenticons: false,
-    txData: {
-      txParams: txParams,
-      time: (new Date()).getTime(),
-    },
-    identities: controllerState.identities,
-    accounts: controllerState.accounts,
-    onConfirm: idStore.approveTransaction.bind(idStore, txData.id, noop),
-    onCancel: idStore.cancelTransaction.bind(idStore, txData.id),
-  })
+  notification.show()
 }
 
 //
@@ -109,7 +81,7 @@ function setupControllerConnection (stream) {
   dnode.on('remote', (remote) => {
     // push updates to popup
     controller.ethStore.on('update', controller.sendUpdate.bind(controller))
-    controller.remote = remote
+    controller.listeners.push(remote)
     idStore.on('update', controller.sendUpdate.bind(controller))
 
     // teardown on disconnect
diff --git a/app/scripts/lib/notifications.js b/app/scripts/lib/notifications.js
index 278c7674e..4c2aa91de 100644
--- a/app/scripts/lib/notifications.js
+++ b/app/scripts/lib/notifications.js
@@ -1,25 +1,11 @@
 const extension = require('./extension')
 
 const notifications = {
-  createUnlockRequestNotification: createUnlockRequestNotification,
-  createTxNotification: createTxNotification,
-  createMsgNotification: createMsgNotification,
+  show: showNotification,
 }
 module.exports = notifications
 window.METAMASK_NOTIFIER = notifications
 
-function createUnlockRequestNotification (opts) {
-  showNotification()
-}
-
-function createTxNotification (state) {
-  showNotification()
-}
-
-function createMsgNotification (state) {
-  showNotification()
-}
-
 function showNotification() {
   extension.windows.getAll({}, (windows) => {
 
diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js
index 218f1f72a..81b232730 100644
--- a/app/scripts/metamask-controller.js
+++ b/app/scripts/metamask-controller.js
@@ -12,6 +12,7 @@ module.exports = class MetamaskController {
 
   constructor (opts) {
     this.opts = opts
+    this.listeners = []
     this.configManager = new ConfigManager(opts)
     this.idStore = new IdentityStore({
       configManager: this.configManager,
@@ -112,9 +113,9 @@ module.exports = class MetamaskController {
   }
 
   sendUpdate () {
-    if (this.remote) {
-      this.remote.sendUpdate(this.getState())
-    }
+    this.listeners.forEach((remote) => {
+      remote.sendUpdate(this.getState())
+    })
   }
 
   initializeProvider (opts) {
@@ -130,10 +131,17 @@ module.exports = class MetamaskController {
       },
       // tx signing
       approveTransaction: this.newUnsignedTransaction.bind(this),
-      signTransaction: idStore.signTransaction.bind(idStore),
+      signTransaction: (...args) => {
+        idStore.signTransaction(...args)
+        this.sendUpdate()
+      },
+
       // msg signing
       approveMessage: this.newUnsignedMessage.bind(this),
-      signMessage: idStore.signMessage.bind(idStore),
+      signMessage: (...args) => {
+        idStore.signMessage(...args)
+        this.sendUpdate()
+      },
     }
 
     var provider = MetaMaskProvider(providerOpts)
@@ -193,6 +201,8 @@ module.exports = class MetamaskController {
 
     // It's locked
     if (!state.isUnlocked) {
+
+      // Allow the environment to define an unlock message.
       this.opts.unlockAccountMessage()
       idStore.addUnconfirmedTransaction(txParams, onTxDoneCb, noop)
 
@@ -200,6 +210,7 @@ module.exports = class MetamaskController {
     } else {
       idStore.addUnconfirmedTransaction(txParams, onTxDoneCb, (err, txData) => {
         if (err) return onTxDoneCb(err)
+        this.sendUpdate()
         this.opts.showUnconfirmedTx(txParams, txData, onTxDoneCb)
       })
     }
@@ -211,6 +222,7 @@ module.exports = class MetamaskController {
       this.opts.unlockAccountMessage()
     } else {
       this.addUnconfirmedMessage(msgParams, cb)
+      this.sendUpdate()
     }
   }