EIP-1102 updates (#6006)

* Update privacy notice

* Respond to 1102 messages using tab ID

app/scripts/controllers/provider-approval.js

@@ -27,19 +27,19 @@ class ProviderApprovalController {
     })
 
     if (platform && platform.addMessageListener) {
-      platform.addMessageListener(({ action = '', force, origin, siteTitle, siteImage }) => {
+      platform.addMessageListener(({ action = '', force, origin, siteTitle, siteImage }, { tab }) => {
         switch (action) {
           case 'init-provider-request':
-            this._handleProviderRequest(origin, siteTitle, siteImage, force)
+            this._handleProviderRequest(origin, siteTitle, siteImage, force, tab.id)
             break
           case 'init-is-approved':
-            this._handleIsApproved(origin)
+            this._handleIsApproved(origin, tab.id)
             break
           case 'init-is-unlocked':
-            this._handleIsUnlocked()
+            this._handleIsUnlocked(tab.id)
             break
           case 'init-privacy-request':
-            this._handlePrivacyRequest()
+            this._handlePrivacyRequest(tab.id)
             break
         }
       })
@@ -53,11 +53,11 @@ class ProviderApprovalController {
    * @param {string} siteTitle - The title of the document requesting full provider access
    * @param {string} siteImage - The icon of the window requesting full provider access
    */
-  _handleProviderRequest (origin, siteTitle, siteImage, force) {
-    this.store.updateState({ providerRequests: [{ origin, siteTitle, siteImage }] })
+  _handleProviderRequest (origin, siteTitle, siteImage, force, tabID) {
+    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(origin)
+      this.approveProviderRequest(tabID)
       return
     }
     this.openPopup && this.openPopup()
@@ -68,32 +68,32 @@ class ProviderApprovalController {
    *
    * @param {string} origin - Origin of the window
    */
-  _handleIsApproved (origin) {
+  _handleIsApproved (origin, tabID) {
     this.platform && this.platform.sendMessage({
       action: 'answer-is-approved',
       isApproved: this.approvedOrigins[origin] && this.caching,
       caching: this.caching,
-    }, { active: true })
+    }, { id: tabID })
   }
 
   /**
    * Called by a tab to determine if MetaMask is currently locked or unlocked
    */
-  _handleIsUnlocked () {
+  _handleIsUnlocked (tabID) {
     const isUnlocked = this.keyringController.memStore.getState().isUnlocked
-    this.platform && this.platform.sendMessage({ action: 'answer-is-unlocked', isUnlocked }, { active: true })
+    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 () {
+  _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,
-      }, { active: true })
+      }, { id: tabID })
       this.publicConfigStore.emit('update', this.publicConfigStore.getState())
     }
   }
@@ -101,17 +101,18 @@ class ProviderApprovalController {
   /**
    * Called when a user approves access to a full Ethereum provider API
    *
-   * @param {string} origin - Origin of the target window to approve provider access
+   * @param {string} tabID - ID of the target window that approved provider access
    */
-  approveProviderRequest (origin) {
+  approveProviderRequest (tabID) {
     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,
-    }, { active: true })
+    }, { id: tabID })
     this.publicConfigStore.emit('update', this.publicConfigStore.getState())
-    const providerRequests = requests.filter(request => request.origin !== origin)
+    const providerRequests = requests.filter(request => request.tabID !== tabID)
     this.store.updateState({ providerRequests })
     this.approvedOrigins[origin] = true
   }
@@ -119,13 +120,14 @@ class ProviderApprovalController {
   /**
    * Called when a tab rejects access to a full Ethereum provider API
    *
-   * @param {string} origin - Origin of the target window to reject provider access
+   * @param {string} tabID - ID of the target window that rejected provider access
    */
-  rejectProviderRequest (origin) {
+  rejectProviderRequest (tabID) {
     this.closePopup && this.closePopup()
     const requests = this.store.getState().providerRequests
-    this.platform && this.platform.sendMessage({ action: 'reject-provider-request' }, { active: true })
-    const providerRequests = requests.filter(request => request.origin !== origin)
+    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)
     this.store.updateState({ providerRequests })
     delete this.approvedOrigins[origin]
   }

app/scripts/platforms/extension.js

@@ -65,9 +65,11 @@ class ExtensionPlatform {
   }
 
   sendMessage (message, query = {}) {
-    extension.tabs.query(query, tabs => {
+    const id = query.id
+    delete query.id
+    extension.tabs.query({ ...query }, tabs => {
       tabs.forEach(tab => {
-        extension.tabs.sendMessage(tab.id, message)
+        extension.tabs.sendMessage(id || tab.id, message)
       })
     })
   }

notices/archive/notice_2.md

@@ -1,6 +1,6 @@
 MetaMask is beta software. 
 
-When you log in to MetaMask, your current account's address is visible to every new site you visit. This can be used to look up your account balances of Ether and other tokens.
+When you log in to MetaMask and approve account access, your current account's address is visible to the site you're currently viewing. This can be used to look up your account balances of Ether and other tokens.
 
-For your privacy, for now, please sign out of MetaMask when you're done using a site.
+For your privacy, take caution when approving account access and sign out of MetaMask when you're done using a site.
 

old-ui/app/provider-approval.js

@@ -4,7 +4,7 @@ import { approveProviderRequest, rejectProviderRequest } from '../../ui/app/acti
 import { connect } from 'react-redux'
 class ProviderApproval extends Component {
   render () {
-    const { approveProviderRequest, origin, rejectProviderRequest } = this.props
+    const { approveProviderRequest, origin, tabID, rejectProviderRequest } = this.props
     return (
       <div className="flex-column flex-grow">
         <style dangerouslySetInnerHTML={{__html: `
@@ -28,7 +28,7 @@ class ProviderApproval extends Component {
         <div className="section-title flex-row flex-center">
           <i
             className="fa fa-arrow-left fa-lg cursor-pointer"
-            onClick={() => { rejectProviderRequest(origin) }} />
+            onClick={() => { rejectProviderRequest(tabID) }} />
           <h2 className="page-subtitle">Web3 API Request</h2>
         </div>
         <div className="provider_approval_content">
@@ -38,10 +38,10 @@ class ProviderApproval extends Component {
         <div className="provider_approval_actions">
           <button
             className="btn-green"
-            onClick={() => { approveProviderRequest(origin) }}>APPROVE</button>
+            onClick={() => { approveProviderRequest(tabID) }}>APPROVE</button>
           <button
             className="cancel btn-red"
-            onClick={() => { rejectProviderRequest(origin) }}>REJECT</button>
+            onClick={() => { rejectProviderRequest(tabID) }}>REJECT</button>
         </div>
       </div>
     )
@@ -51,13 +51,14 @@ class ProviderApproval extends Component {
 ProviderApproval.propTypes = {
   approveProviderRequest: PropTypes.func,
   origin: PropTypes.string,
+  tabID: PropTypes.string,
   rejectProviderRequest: PropTypes.func,
 }
 
 function mapDispatchToProps (dispatch) {
   return {
-    approveProviderRequest: origin => dispatch(approveProviderRequest(origin)),
-    rejectProviderRequest: origin => dispatch(rejectProviderRequest(origin)),
+    approveProviderRequest: tabID => dispatch(approveProviderRequest(tabID)),
+    rejectProviderRequest: tabID => dispatch(rejectProviderRequest(tabID)),
   }
 }
 

ui/app/actions.js

@@ -2625,15 +2625,15 @@ function setPendingTokens (pendingTokens) {
   }
 }
 
-function approveProviderRequest (origin) {
+function approveProviderRequest (tabID) {
   return (dispatch) => {
-    background.approveProviderRequest(origin)
+    background.approveProviderRequest(tabID)
   }
 }
 
-function rejectProviderRequest (origin) {
+function rejectProviderRequest (tabID) {
   return (dispatch) => {
-    background.rejectProviderRequest(origin)
+    background.rejectProviderRequest(tabID)
   }
 }
 

ui/app/components/pages/provider-approval/provider-approval.component.js

@@ -19,6 +19,7 @@ export default class ProviderApproval extends Component {
       <ProviderPageContainer
         approveProviderRequest={approveProviderRequest}
         origin={providerRequest.origin}
+        tabID={providerRequest.tabID}
         rejectProviderRequest={rejectProviderRequest}
         siteImage={providerRequest.siteImage}
         siteTitle={providerRequest.siteTitle}

ui/app/components/pages/provider-approval/provider-approval.container.js

@@ -4,8 +4,8 @@ import { approveProviderRequest, rejectProviderRequest } from '../../../actions'
 
 function mapDispatchToProps (dispatch) {
   return {
-    approveProviderRequest: origin => dispatch(approveProviderRequest(origin)),
-    rejectProviderRequest: origin => dispatch(rejectProviderRequest(origin)),
+    approveProviderRequest: tabID => dispatch(approveProviderRequest(tabID)),
+    rejectProviderRequest: tabID => dispatch(rejectProviderRequest(tabID)),
   }
 }
 

ui/app/components/provider-page-container/provider-page-container.component.js

@@ -10,6 +10,7 @@ export default class ProviderPageContainer extends PureComponent {
     rejectProviderRequest: PropTypes.func.isRequired,
     siteImage: PropTypes.string,
     siteTitle: PropTypes.string.isRequired,
+    tabID: PropTypes.string.isRequired,
   };
 
   static contextTypes = {
@@ -17,13 +18,13 @@ export default class ProviderPageContainer extends PureComponent {
   };
 
   onCancel = () => {
-    const { origin, rejectProviderRequest } = this.props
-    rejectProviderRequest(origin)
+    const { tabID, rejectProviderRequest } = this.props
+    rejectProviderRequest(tabID)
   }
 
   onSubmit = () => {
-    const { approveProviderRequest, origin } = this.props
-    approveProviderRequest(origin)
+    const { approveProviderRequest, tabID } = this.props
+    approveProviderRequest(tabID)
   }
 
   render () {