EIP-1102: Add option to force-enable provider

7 files changed, 110 insertions, 0 deletions

diff --git a/ui/app/actions.js b/ui/app/actions.js
index 501fef76d..2430b8217 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -328,6 +328,7 @@ var actions = {
   approveProviderRequest,
   rejectProviderRequest,
   clearApprovedOrigins,
+  forceInjection,
 }
 
 module.exports = actions
@@ -2505,3 +2506,9 @@ function clearApprovedOrigins () {
     background.clearApprovedOrigins()
   }
 }
+
+function forceInjection () {
+  return (dispatch) => {
+    background.forceInjection()
+  }
+}
diff --git a/ui/app/components/modals/force-injection/force-injection.component.js b/ui/app/components/modals/force-injection/force-injection.component.js
new file mode 100644
index 000000000..1ea08b5ee
--- /dev/null
+++ b/ui/app/components/modals/force-injection/force-injection.component.js
@@ -0,0 +1,39 @@
+import React, { PureComponent } from 'react'
+import PropTypes from 'prop-types'
+import Modal, { ModalContent } from '../../modal'
+
+export default class ForceInjection extends PureComponent {
+  static propTypes = {
+    hideModal: PropTypes.func.isRequired,
+    forceInjection: PropTypes.func.isRequired,
+  }
+
+  static contextTypes = {
+    t: PropTypes.func,
+  }
+
+  handleForce = () => {
+    const { forceInjection, hideModal } = this.props
+    forceInjection()
+    hideModal()
+  }
+
+  render () {
+    const { t } = this.context
+
+    return (
+      <Modal
+        onSubmit={this.handleForce}
+        onCancel={() => this.props.hideModal()}
+        submitText={t('ok')}
+        cancelText={t('nevermind')}
+        submitType="secondary"
+      >
+        <ModalContent
+          title={t('exposeAccounts')}
+          description={t('confirmExpose')}
+        />
+      </Modal>
+    )
+  }
+}
diff --git a/ui/app/components/modals/force-injection/force-injection.container.js b/ui/app/components/modals/force-injection/force-injection.container.js
new file mode 100644
index 000000000..fa0a325c3
--- /dev/null
+++ b/ui/app/components/modals/force-injection/force-injection.container.js
@@ -0,0 +1,16 @@
+import { connect } from 'react-redux'
+import { compose } from 'recompose'
+import withModalProps from '../../../higher-order-components/with-modal-props'
+import ForceInjectionComponent from './force-injection.component'
+import { forceInjection } from '../../../actions'
+
+const mapDispatchToProps = dispatch => {
+  return {
+    forceInjection: () => dispatch(forceInjection()),
+  }
+}
+
+export default compose(
+  withModalProps,
+  connect(null, mapDispatchToProps)
+)(ForceInjectionComponent)
diff --git a/ui/app/components/modals/force-injection/index.js b/ui/app/components/modals/force-injection/index.js
new file mode 100644
index 000000000..4ea4dc695
--- /dev/null
+++ b/ui/app/components/modals/force-injection/index.js
@@ -0,0 +1 @@
+export { default } from './force-injection.container'
diff --git a/ui/app/components/modals/modal.js b/ui/app/components/modals/modal.js
index 5aff4f5e1..bdf8e4b9e 100644
--- a/ui/app/components/modals/modal.js
+++ b/ui/app/components/modals/modal.js
@@ -29,6 +29,7 @@ import CancelTransaction from './cancel-transaction'
 import WelcomeBeta from './welcome-beta'
 import RejectTransactions from './reject-transactions'
 import ClearApprovedOrigins from './clear-approved-origins'
+import ForceInjection from './force-injection'
 
 const modalContainerBaseStyle = {
   transform: 'translate3d(-50%, 0, 0px)',
@@ -226,6 +227,19 @@ const MODALS = {
     },
   },
 
+  FORCE_INJECTION: {
+    contents: h(ForceInjection),
+    mobileModalStyle: {
+      ...modalContainerMobileStyle,
+    },
+    laptopModalStyle: {
+      ...modalContainerLaptopStyle,
+    },
+    contentStyle: {
+      borderRadius: '8px',
+    },
+  },
+
   OLD_UI_NOTIFICATION_MODAL: {
     contents: [
       h(NotifcationModal, {
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
index 21119086e..95a18d28b 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.component.js
@@ -46,6 +46,7 @@ export default class SettingsTab extends PureComponent {
     revealSeedConfirmation: PropTypes.func,
     setFeatureFlagToBeta: PropTypes.func,
     showClearApprovalModal: PropTypes.func,
+    showForceInjectionModal: PropTypes.func,
     showResetAccountConfirmationModal: PropTypes.func,
     warning: PropTypes.string,
     history: PropTypes.object,
@@ -307,6 +308,36 @@ export default class SettingsTab extends PureComponent {
     )
   }
 
+  renderForceInjection () {
+    const { t } = this.context
+    const { showForceInjectionModal } = this.props
+    return (
+      <div className="settings-page__content-row">
+        <div className="settings-page__content-item">
+          <span>{ t('exposeAccounts') }</span>
+          <span className="settings-page__content-description">
+            { t('exposeDescription') }
+          </span>
+        </div>
+        <div className="settings-page__content-item">
+          <div className="settings-page__content-item-col">
+            <Button
+              type="secondary"
+              large
+              className="settings-tab__button--orange"
+              onClick={event => {
+                event.preventDefault()
+                showForceInjectionModal()
+              }}
+            >
+              { t('exposeAccounts') }
+            </Button>
+          </div>
+        </div>
+      </div>
+    )
+  }
+
   renderSeedWords () {
     const { t } = this.context
     const { history } = this.props
@@ -505,6 +536,7 @@ export default class SettingsTab extends PureComponent {
         { this.renderStateLogs() }
         { this.renderSeedWords() }
         { this.renderClearApproval() }
+        { this.renderForceInjection() }
         { !isMascara && this.renderOldUI() }
         { this.renderResetAccount() }
         { this.renderBlockieOptIn() }
diff --git a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
index 2c0739a91..0af62e135 100644
--- a/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
+++ b/ui/app/components/pages/settings/settings-tab/settings-tab.container.js
@@ -60,6 +60,7 @@ const mapDispatchToProps = dispatch => {
       return dispatch(setUseNativeCurrencyAsPrimaryCurrencyPreference(value))
     },
     showClearApprovalModal: () => dispatch(showModal({ name: 'CLEAR_APPROVED_ORIGINS' })),
+    showForceInjectionModal: () => dispatch(showModal({ name: 'FORCE_INJECTION' })),
   }
 }