Refactor ProviderApprovalController to use rpc and publicConfigStore (#6410)

* Ensure home screen does not render if there are unapproved txs (#6501)

* Ensure that the confirm screen renders before the home screen if there are unapproved txs.

* Only render confirm screen before home screen on mount.

* inpage - revert _metamask api to isEnabled isApproved isUnlocked

6 files changed, 54 insertions, 115 deletions

diff --git a/app/scripts/controllers/network/createBlockTracker.js b/app/scripts/controllers/network/createBlockTracker.js
deleted file mode 100644
index 6573b18a1..000000000
--- a/app/scripts/controllers/network/createBlockTracker.js
+++ /dev/null
@@ -1,19 +0,0 @@
-const BlockTracker = require('eth-block-tracker')
-
-/**
- * Creates a block tracker that sends platform events on success and failure
- */
-module.exports = function createBlockTracker (args, platform) {
-  const blockTracker = new BlockTracker(args)
-  blockTracker.on('latest', () => {
-    if (platform && platform.sendMessage) {
-      platform.sendMessage({ action: 'ethereum-ping-success' })
-    }
-  })
-  blockTracker.on('error', () => {
-    if (platform && platform.sendMessage) {
-      platform.sendMessage({ action: 'ethereum-ping-error' })
-    }
-  })
-  return blockTracker
-}
diff --git a/app/scripts/controllers/network/createInfuraClient.js b/app/scripts/controllers/network/createInfuraClient.js
index 70b332867..0a6e9ecb0 100644
--- a/app/scripts/controllers/network/createInfuraClient.js
+++ b/app/scripts/controllers/network/createInfuraClient.js
@@ -7,14 +7,14 @@ const createInflightMiddleware = require('eth-json-rpc-middleware/inflight-cache
 const createBlockTrackerInspectorMiddleware = require('eth-json-rpc-middleware/block-tracker-inspector')
 const providerFromMiddleware = require('eth-json-rpc-middleware/providerFromMiddleware')
 const createInfuraMiddleware = require('eth-json-rpc-infura')
-const createBlockTracker = require('./createBlockTracker')
+const BlockTracker = require('eth-block-tracker')
 
 module.exports = createInfuraClient
 
-function createInfuraClient ({ network, platform }) {
+function createInfuraClient ({ network }) {
   const infuraMiddleware = createInfuraMiddleware({ network, maxAttempts: 5, source: 'metamask' })
   const infuraProvider = providerFromMiddleware(infuraMiddleware)
-  const blockTracker = createBlockTracker({ provider: infuraProvider }, platform)
+  const blockTracker = new BlockTracker({ provider: infuraProvider })
 
   const networkMiddleware = mergeMiddleware([
     createNetworkAndChainIdMiddleware({ network }),
diff --git a/app/scripts/controllers/network/createJsonRpcClient.js b/app/scripts/controllers/network/createJsonRpcClient.js
index 369dcd299..a8cbf2aaf 100644
--- a/app/scripts/controllers/network/createJsonRpcClient.js
+++ b/app/scripts/controllers/network/createJsonRpcClient.js
@@ -5,14 +5,14 @@ const createBlockCacheMiddleware = require('eth-json-rpc-middleware/block-cache'
 const createInflightMiddleware = require('eth-json-rpc-middleware/inflight-cache')
 const createBlockTrackerInspectorMiddleware = require('eth-json-rpc-middleware/block-tracker-inspector')
 const providerFromMiddleware = require('eth-json-rpc-middleware/providerFromMiddleware')
-const createBlockTracker = require('./createBlockTracker')
+const BlockTracker = require('eth-block-tracker')
 
 module.exports = createJsonRpcClient
 
-function createJsonRpcClient ({ rpcUrl, platform }) {
+function createJsonRpcClient ({ rpcUrl }) {
   const fetchMiddleware = createFetchMiddleware({ rpcUrl })
   const blockProvider = providerFromMiddleware(fetchMiddleware)
-  const blockTracker = createBlockTracker({ provider: blockProvider }, platform)
+  const blockTracker = new BlockTracker({ provider: blockProvider })
 
   const networkMiddleware = mergeMiddleware([
     createBlockRefRewriteMiddleware({ blockTracker }),
diff --git a/app/scripts/controllers/network/createLocalhostClient.js b/app/scripts/controllers/network/createLocalhostClient.js
index 36593dc70..09b1d3c1c 100644
--- a/app/scripts/controllers/network/createLocalhostClient.js
+++ b/app/scripts/controllers/network/createLocalhostClient.js
@@ -3,14 +3,14 @@ const createFetchMiddleware = require('eth-json-rpc-middleware/fetch')
 const createBlockRefRewriteMiddleware = require('eth-json-rpc-middleware/block-ref-rewrite')
 const createBlockTrackerInspectorMiddleware = require('eth-json-rpc-middleware/block-tracker-inspector')
 const providerFromMiddleware = require('eth-json-rpc-middleware/providerFromMiddleware')
-const createBlockTracker = require('./createBlockTracker')
+const BlockTracker = require('eth-block-tracker')
 
 module.exports = createLocalhostClient
 
-function createLocalhostClient ({ platform }) {
+function createLocalhostClient () {
   const fetchMiddleware = createFetchMiddleware({ rpcUrl: 'http://localhost:8545/' })
   const blockProvider = providerFromMiddleware(fetchMiddleware)
-  const blockTracker = createBlockTracker({ provider: blockProvider, pollingInterval: 1000 }, platform)
+  const blockTracker = new BlockTracker({ provider: blockProvider, pollingInterval: 1000 })
 
   const networkMiddleware = mergeMiddleware([
     createBlockRefRewriteMiddleware({ blockTracker }),
diff --git a/app/scripts/controllers/network/network.js b/app/scripts/controllers/network/network.js
index c00ac7e6a..fc8e0df5d 100644
--- a/app/scripts/controllers/network/network.js
+++ b/app/scripts/controllers/network/network.js
@@ -46,9 +46,8 @@ const defaultNetworkConfig = {
 
 module.exports = class NetworkController extends EventEmitter {
 
-  constructor (opts = {}, platform) {
+  constructor (opts = {}) {
     super()
-    this.platform = platform
 
     // parse options
     const providerConfig = opts.provider || defaultProviderConfig
@@ -190,7 +189,7 @@ module.exports = class NetworkController extends EventEmitter {
 
   _configureInfuraProvider ({ type }) {
     log.info('NetworkController - configureInfuraProvider', type)
-    const networkClient = createInfuraClient({ network: type, platform: this.platform })
+    const networkClient = createInfuraClient({ network: type })
     this._setNetworkClient(networkClient)
     // setup networkConfig
     var settings = {
@@ -201,13 +200,13 @@ module.exports = class NetworkController extends EventEmitter {
 
   _configureLocalhostProvider () {
     log.info('NetworkController - configureLocalhostProvider')
-    const networkClient = createLocalhostClient({ platform: this.platform })
+    const networkClient = createLocalhostClient()
     this._setNetworkClient(networkClient)
   }
 
   _configureStandardProvider ({ rpcUrl, chainId, ticker, nickname }) {
     log.info('NetworkController - configureStandardProvider', rpcUrl)
-    const networkClient = createJsonRpcClient({ rpcUrl, platform: this.platform })
+    const networkClient = createJsonRpcClient({ rpcUrl })
     // hack to add a 'rpc' network with chainId
     networks.networkList['rpc'] = {
       chainId: chainId,
diff --git a/app/scripts/controllers/provider-approval.js b/app/scripts/controllers/provider-approval.js
index 2c9182b52..8206b2f8a 100644
--- a/app/scripts/controllers/provider-approval.js
+++ b/app/scripts/controllers/provider-approval.js
@@ -1,9 +1,11 @@
 const ObservableStore = require('obs-store')
+const SafeEventEmitter = require('safe-event-emitter')
+const createAsyncMiddleware = require('json-rpc-engine/src/createAsyncMiddleware')
 
 /**
  * A controller that services user-approved requests for a full Ethereum provider API
  */
-class ProviderApprovalController {
+class ProviderApprovalController extends SafeEventEmitter {
   /**
    * Determines if caching is enabled
    */
@@ -14,38 +16,43 @@ class ProviderApprovalController {
    *
    * @param {Object} [config] - Options to configure controller
    */
-  constructor ({ closePopup, keyringController, openPopup, platform, preferencesController, publicConfigStore } = {}) {
+  constructor ({ closePopup, keyringController, openPopup, preferencesController } = {}) {
+    super()
     this.approvedOrigins = {}
     this.closePopup = closePopup
     this.keyringController = keyringController
     this.openPopup = openPopup
-    this.platform = platform
     this.preferencesController = preferencesController
-    this.publicConfigStore = publicConfigStore
     this.store = new ObservableStore({
       providerRequests: [],
     })
+  }
 
-    if (platform && platform.addMessageListener) {
-      platform.addMessageListener(({ action = '', force, origin, siteTitle, siteImage }, { tab }) => {
-        if (tab && tab.id) {
-          switch (action) {
-            case 'init-provider-request':
-              this._handleProviderRequest(origin, siteTitle, siteImage, force, tab.id)
-              break
-            case 'init-is-approved':
-              this._handleIsApproved(origin, tab.id)
-              break
-            case 'init-is-unlocked':
-              this._handleIsUnlocked(tab.id)
-              break
-            case 'init-privacy-request':
-              this._handlePrivacyRequest(tab.id)
-              break
-          }
-        }
-      })
-    }
+  /**
+   * Called when a user approves access to a full Ethereum provider API
+   *
+   * @param {object} opts - opts for the middleware contains the origin for the middleware
+   */
+  createMiddleware ({ origin, getSiteMetadata }) {
+    return createAsyncMiddleware(async (req, res, next) => {
+      // only handle requestAccounts
+      if (req.method !== 'eth_requestAccounts') return next()
+      // if already approved or privacy mode disabled, return early
+      if (this.shouldExposeAccounts(origin)) {
+        res.result = [this.preferencesController.getSelectedAddress()]
+        return
+      }
+      // register the provider request
+      const metadata = await getSiteMetadata(origin)
+      this._handleProviderRequest(origin, metadata.name, metadata.icon, false, null)
+      // wait for resolution of request
+      const approved = await new Promise(resolve => this.once(`resolvedRequest:${origin}`, ({ approved }) => resolve(approved)))
+      if (approved) {
+        res.result = [this.preferencesController.getSelectedAddress()]
+      } else {
+        throw new Error('User denied account authorization')
+      }
+    })
   }
 
   /**
@@ -59,79 +66,37 @@ class ProviderApprovalController {
     this.store.updateState({ providerRequests: [{ origin, siteTitle, siteImage, tabID }] })
     const isUnlocked = this.keyringController.memStore.getState().isUnlocked
     if (!force && this.approvedOrigins[origin] && this.caching && isUnlocked) {
-      this.approveProviderRequest(tabID)
       return
     }
     this.openPopup && this.openPopup()
   }
 
   /**
-   * Called by a tab to determine if an origin has been approved in the past
-   *
-   * @param {string} origin - Origin of the window
-   */
-  _handleIsApproved (origin, tabID) {
-    this.platform && this.platform.sendMessage({
-      action: 'answer-is-approved',
-      isApproved: this.approvedOrigins[origin] && this.caching,
-      caching: this.caching,
-    }, { id: tabID })
-  }
-
-  /**
-   * Called by a tab to determine if MetaMask is currently locked or unlocked
-   */
-  _handleIsUnlocked (tabID) {
-    const isUnlocked = this.keyringController.memStore.getState().isUnlocked
-    this.platform && this.platform.sendMessage({ action: 'answer-is-unlocked', isUnlocked }, { id: tabID })
-  }
-
-  /**
-   * Called to check privacy mode; if privacy mode is off, this will automatically enable the provider (legacy behavior)
-   */
-  _handlePrivacyRequest (tabID) {
-    const privacyMode = this.preferencesController.getFeatureFlags().privacyMode
-    if (!privacyMode) {
-      this.platform && this.platform.sendMessage({
-        action: 'approve-legacy-provider-request',
-        selectedAddress: this.publicConfigStore.getState().selectedAddress,
-      }, { id: tabID })
-      this.publicConfigStore.emit('update', this.publicConfigStore.getState())
-    }
-  }
-
-  /**
    * Called when a user approves access to a full Ethereum provider API
    *
-   * @param {string} tabID - ID of the target window that approved provider access
+   * @param {string} origin - origin of the domain that had provider access approved
    */
-  approveProviderRequest (tabID) {
+  approveProviderRequestByOrigin (origin) {
     this.closePopup && this.closePopup()
     const requests = this.store.getState().providerRequests
-    const origin = requests.find(request => request.tabID === tabID).origin
-    this.platform && this.platform.sendMessage({
-      action: 'approve-provider-request',
-      selectedAddress: this.publicConfigStore.getState().selectedAddress,
-    }, { id: tabID })
-    this.publicConfigStore.emit('update', this.publicConfigStore.getState())
-    const providerRequests = requests.filter(request => request.tabID !== tabID)
+    const providerRequests = requests.filter(request => request.origin !== origin)
     this.store.updateState({ providerRequests })
     this.approvedOrigins[origin] = true
+    this.emit(`resolvedRequest:${origin}`, { approved: true })
   }
 
   /**
    * Called when a tab rejects access to a full Ethereum provider API
    *
-   * @param {string} tabID - ID of the target window that rejected provider access
+   * @param {string} origin - origin of the domain that had provider access approved
    */
-  rejectProviderRequest (tabID) {
+  rejectProviderRequestByOrigin (origin) {
     this.closePopup && this.closePopup()
     const requests = this.store.getState().providerRequests
-    const origin = requests.find(request => request.tabID === tabID).origin
-    this.platform && this.platform.sendMessage({ action: 'reject-provider-request' }, { id: tabID })
-    const providerRequests = requests.filter(request => request.tabID !== tabID)
+    const providerRequests = requests.filter(request => request.origin !== origin)
     this.store.updateState({ providerRequests })
     delete this.approvedOrigins[origin]
+    this.emit(`resolvedRequest:${origin}`, { approved: false })
   }
 
   /**
@@ -149,16 +114,10 @@ class ProviderApprovalController {
    */
   shouldExposeAccounts (origin) {
     const privacyMode = this.preferencesController.getFeatureFlags().privacyMode
-    return !privacyMode || this.approvedOrigins[origin]
+    const result = !privacyMode || Boolean(this.approvedOrigins[origin])
+    return result
   }
 
-  /**
-   * Tells all tabs that MetaMask is now locked. This is primarily used to set
-   * internal flags in the contentscript and inpage script.
-   */
-  setLocked () {
-    this.platform.sendMessage({ action: 'metamask-set-locked' })
-  }
 }
 
 module.exports = ProviderApprovalController