i18n redux solution doesn't require importing t() and passing state to each t() call; t is just available on props.

10 files changed, 45 insertions, 54 deletions

diff --git a/ui/app/components/modals/account-details-modal.js b/ui/app/components/modals/account-details-modal.js
index e4f2009aa..24d856b43 100644
--- a/ui/app/components/modals/account-details-modal.js
+++ b/ui/app/components/modals/account-details-modal.js
@@ -8,7 +8,6 @@ const { getSelectedIdentity } = require('../../selectors')
 const genAccountLink = require('../../../lib/account-link.js')
 const QrView = require('../qr-code')
 const EditableLabel = require('../editable-label')
-const t = require('../../../i18n-helper').getMessage
 
 function mapStateToProps (state) {
   return {
@@ -65,12 +64,12 @@ AccountDetailsModal.prototype.render = function () {
 
       h('button.btn-clear.account-modal__button', {
         onClick: () => global.platform.openWindow({ url: genAccountLink(address, network) }),
-      }, t(this.props.localeMessages, 'etherscanView')),
+      }, this.props.t('etherscanView')),
 
       // Holding on redesign for Export Private Key functionality
       h('button.btn-clear.account-modal__button', {
         onClick: () => showExportPrivateKeyModal(),
-      }, t(this.props.localeMessages, 'exportPrivateKey')),
+      }, this.props.t('exportPrivateKey')),
 
   ])
 }
diff --git a/ui/app/components/modals/account-modal-container.js b/ui/app/components/modals/account-modal-container.js
index ac6457b37..70efe16cb 100644
--- a/ui/app/components/modals/account-modal-container.js
+++ b/ui/app/components/modals/account-modal-container.js
@@ -5,7 +5,6 @@ const connect = require('../../metamask-connect')
 const actions = require('../../actions')
 const { getSelectedIdentity } = require('../../selectors')
 const Identicon = require('../identicon')
-const t = require('../../../i18n-helper').getMessage
 
 function mapStateToProps (state) {
   return {
@@ -60,7 +59,7 @@ AccountModalContainer.prototype.render = function () {
 
         h('i.fa.fa-angle-left.fa-lg'),
 
-        h('span.account-modal-back__text', ' ' + t(this.props.localeMessages, 'back')),
+        h('span.account-modal-back__text', ' ' + this.props.t('back')),
 
       ]),
 
diff --git a/ui/app/components/modals/buy-options-modal.js b/ui/app/components/modals/buy-options-modal.js
index 0e93e9a2d..c0ee3632e 100644
--- a/ui/app/components/modals/buy-options-modal.js
+++ b/ui/app/components/modals/buy-options-modal.js
@@ -4,7 +4,6 @@ const inherits = require('util').inherits
 const connect = require('../../metamask-connect')
 const actions = require('../../actions')
 const networkNames = require('../../../../app/scripts/config.js').networkNames
-const t = require('../../../i18n-helper').getMessage
 
 function mapStateToProps (state) {
   return {
@@ -57,15 +56,15 @@ BuyOptions.prototype.render = function () {
       }, [
         h('div.buy-modal-content-title', {
           style: {},
-        }, t(this.props.localeMessages, 'transfers')),
-        h('div', {}, t(this.props.localeMessages, 'howToDeposit')),
+        }, this.props.t('transfers')),
+        h('div', {}, this.props.t('howToDeposit')),
       ]),
 
       h('div.buy-modal-content-options.flex-column.flex-center', {}, [
 
         isTestNetwork
-          ? this.renderModalContentOption(networkName, t(this.props.localeMessages, 'testFaucet'), () => toFaucet(network))
-          : this.renderModalContentOption('Coinbase', t(this.props.localeMessages, 'depositFiat'), () => toCoinbase(address)),
+          ? this.renderModalContentOption(networkName, this.props.t('testFaucet'), () => toFaucet(network))
+          : this.renderModalContentOption('Coinbase', this.props.t('depositFiat'), () => toCoinbase(address)),
 
         // h('div.buy-modal-content-option', {}, [
         //   h('div.buy-modal-content-option-title', {}, 'Shapeshift'),
@@ -73,8 +72,8 @@ BuyOptions.prototype.render = function () {
         // ]),,
 
         this.renderModalContentOption(
-          t(this.props.localeMessages, 'directDeposit'),
-          t(this.props.localeMessages, 'depositFromAccount'),
+          this.props.t('directDeposit'),
+          this.props.t('depositFromAccount'),
           () => this.goToAccountDetailsModal()
         ),
 
@@ -85,7 +84,7 @@ BuyOptions.prototype.render = function () {
           background: 'white',
         },
         onClick: () => { this.props.hideModal() },
-      }, h('div.buy-modal-content-footer#buy-modal-content-footer-text', {}, t(this.props.localeMessages, 'cancel'))),
+      }, h('div.buy-modal-content-footer#buy-modal-content-footer-text', {}, this.props.t('cancel'))),
     ]),
   ])
 }
diff --git a/ui/app/components/modals/deposit-ether-modal.js b/ui/app/components/modals/deposit-ether-modal.js
index 307e89a47..0b097d546 100644
--- a/ui/app/components/modals/deposit-ether-modal.js
+++ b/ui/app/components/modals/deposit-ether-modal.js
@@ -5,7 +5,6 @@ const connect = require('../../metamask-connect')
 const actions = require('../../actions')
 const networkNames = require('../../../../app/scripts/config.js').networkNames
 const ShapeshiftForm = require('../shapeshift-form')
-const t = require('../../../i18n-helper').getMessage
 
 let DIRECT_DEPOSIT_ROW_TITLE
 let DIRECT_DEPOSIT_ROW_TEXT
@@ -16,7 +15,7 @@ let SHAPESHIFT_ROW_TEXT
 let FAUCET_ROW_TITLE
 
 const facuetRowText = (networkName) => {
-  return t(this.props.localeMessages, 'getEtherFromFaucet', [networkName])
+  return this.props.t('getEtherFromFaucet', [networkName])
 }
 
 function mapStateToProps (state) {
@@ -49,13 +48,13 @@ function DepositEtherModal () {
   Component.call(this)
 
   // need to set after i18n locale has loaded
-  DIRECT_DEPOSIT_ROW_TITLE = t(this.props.localeMessages, 'directDepositEther')
-  DIRECT_DEPOSIT_ROW_TEXT = t(this.props.localeMessages, 'directDepositEtherExplainer')
-  COINBASE_ROW_TITLE = t(this.props.localeMessages, 'buyCoinbase')
-  COINBASE_ROW_TEXT = t(this.props.localeMessages, 'buyCoinbaseExplainer')
-  SHAPESHIFT_ROW_TITLE = t(this.props.localeMessages, 'depositShapeShift')
-  SHAPESHIFT_ROW_TEXT = t(this.props.localeMessages, 'depositShapeShiftExplainer')
-  FAUCET_ROW_TITLE = t(this.props.localeMessages, 'testFaucet')
+  DIRECT_DEPOSIT_ROW_TITLE = this.props.t('directDepositEther')
+  DIRECT_DEPOSIT_ROW_TEXT = this.props.t('directDepositEtherExplainer')
+  COINBASE_ROW_TITLE = this.props.t('buyCoinbase')
+  COINBASE_ROW_TEXT = this.props.t('buyCoinbaseExplainer')
+  SHAPESHIFT_ROW_TITLE = this.props.t('depositShapeShift')
+  SHAPESHIFT_ROW_TEXT = this.props.t('depositShapeShiftExplainer')
+  FAUCET_ROW_TITLE = this.props.t('testFaucet')
 
   this.state = {
     buyingWithShapeshift: false,
@@ -123,10 +122,10 @@ DepositEtherModal.prototype.render = function () {
 
     h('div.page-container__header', [
 
-      h('div.page-container__title', [t(this.props.localeMessages, 'depositEther')]),
+      h('div.page-container__title', [this.props.t('depositEther')]),
 
       h('div.page-container__subtitle', [
-        t(this.props.localeMessages, 'needEtherInWallet'),
+        this.props.t('needEtherInWallet'),
       ]),
 
       h('div.page-container__header-close', {
@@ -149,7 +148,7 @@ DepositEtherModal.prototype.render = function () {
           }),
           title: DIRECT_DEPOSIT_ROW_TITLE,
           text: DIRECT_DEPOSIT_ROW_TEXT,
-          buttonLabel: t(this.props.localeMessages, 'viewAccount'),
+          buttonLabel: this.props.t('viewAccount'),
           onButtonClick: () => this.goToAccountDetailsModal(),
           hide: buyingWithShapeshift,
         }),
@@ -158,7 +157,7 @@ DepositEtherModal.prototype.render = function () {
           logo: h('i.fa.fa-tint.fa-2x'),
           title: FAUCET_ROW_TITLE,
           text: facuetRowText(networkName),
-          buttonLabel: t(this.props.localeMessages, 'getEther'),
+          buttonLabel: this.props.t('getEther'),
           onButtonClick: () => toFaucet(network),
           hide: !isTestNetwork || buyingWithShapeshift,
         }),
@@ -172,7 +171,7 @@ DepositEtherModal.prototype.render = function () {
           }),
           title: COINBASE_ROW_TITLE,
           text: COINBASE_ROW_TEXT,
-          buttonLabel: t(this.props.localeMessages, 'continueToCoinbase'),
+          buttonLabel: this.props.t('continueToCoinbase'),
           onButtonClick: () => toCoinbase(address),
           hide: isTestNetwork || buyingWithShapeshift,
         }),
@@ -185,7 +184,7 @@ DepositEtherModal.prototype.render = function () {
           }),
           title: SHAPESHIFT_ROW_TITLE,
           text: SHAPESHIFT_ROW_TEXT,
-          buttonLabel: t(this.props.localeMessages, 'shapeshiftBuy'),
+          buttonLabel: this.props.t('shapeshiftBuy'),
           onButtonClick: () => this.setState({ buyingWithShapeshift: true }),
           hide: isTestNetwork,
           hideButton: buyingWithShapeshift,
diff --git a/ui/app/components/modals/edit-account-name-modal.js b/ui/app/components/modals/edit-account-name-modal.js
index a64a41b27..4f5bc001a 100644
--- a/ui/app/components/modals/edit-account-name-modal.js
+++ b/ui/app/components/modals/edit-account-name-modal.js
@@ -4,7 +4,6 @@ const inherits = require('util').inherits
 const connect = require('../../metamask-connect')
 const actions = require('../../actions')
 const { getSelectedAccount } = require('../../selectors')
-const t = require('../../../i18n-helper').getMessage
 
 function mapStateToProps (state) {
   return {
@@ -51,7 +50,7 @@ EditAccountNameModal.prototype.render = function () {
       ]),
 
       h('div.edit-account-name-modal-title', {
-      }, [t(this.props.localeMessages, 'editAccountName')]),
+      }, [this.props.t('editAccountName')]),
 
       h('input.edit-account-name-modal-input', {
         placeholder: identity.name,
@@ -70,7 +69,7 @@ EditAccountNameModal.prototype.render = function () {
         },
         disabled: this.state.inputText.length === 0,
       }, [
-        t(this.props.localeMessages, 'save'),
+        this.props.t('save'),
       ]),
 
     ]),
diff --git a/ui/app/components/modals/export-private-key-modal.js b/ui/app/components/modals/export-private-key-modal.js
index fac5366a4..b92d250fa 100644
--- a/ui/app/components/modals/export-private-key-modal.js
+++ b/ui/app/components/modals/export-private-key-modal.js
@@ -7,7 +7,6 @@ const actions = require('../../actions')
 const AccountModalContainer = require('./account-modal-container')
 const { getSelectedIdentity } = require('../../selectors')
 const ReadOnlyInput = require('../readonly-input')
-const t = require('../../../i18n-helper').getMessage
 const copyToClipboard = require('copy-to-clipboard')
 
 function mapStateToProps (state) {
@@ -49,8 +48,8 @@ ExportPrivateKeyModal.prototype.exportAccountAndGetPrivateKey = function (passwo
 
 ExportPrivateKeyModal.prototype.renderPasswordLabel = function (privateKey) {
   return h('span.private-key-password-label', privateKey
-    ? t(this.props.localeMessages, 'copyPrivateKey')
-    : t(this.props.localeMessages, 'typePassword')
+    ? this.props.t('copyPrivateKey')
+    : this.props.t('typePassword')
   )
 }
 
@@ -87,8 +86,8 @@ ExportPrivateKeyModal.prototype.renderButtons = function (privateKey, password,
     ),
 
     (privateKey
-      ? this.renderButton('btn-clear export-private-key__button', () => hideModal(), t(this.props.localeMessages, 'done'))
-      : this.renderButton('btn-clear export-private-key__button', () => this.exportAccountAndGetPrivateKey(this.state.password, address), t(this.props.localeMessages, 'confirm'))
+      ? this.renderButton('btn-clear export-private-key__button', () => hideModal(), this.props.t('done'))
+      : this.renderButton('btn-clear export-private-key__button', () => this.exportAccountAndGetPrivateKey(this.state.password, address), this.props.t('confirm'))
     ),
 
   ])
@@ -121,7 +120,7 @@ ExportPrivateKeyModal.prototype.render = function () {
 
       h('div.account-modal-divider'),
 
-      h('span.modal-body-title', t(this.props.localeMessages, 'showPrivateKeys')),
+      h('span.modal-body-title', this.props.t('showPrivateKeys')),
 
       h('div.private-key-password', {}, [
         this.renderPasswordLabel(privateKey),
@@ -131,7 +130,7 @@ ExportPrivateKeyModal.prototype.render = function () {
         !warning ? null : h('span.private-key-password-error', warning),
       ]),
 
-      h('div.private-key-password-warning', t(this.props.localeMessages, 'privateKeyWarning')),
+      h('div.private-key-password-warning', this.props.t('privateKeyWarning')),
 
       this.renderButtons(privateKey, this.state.password, address, hideModal),
 
diff --git a/ui/app/components/modals/hide-token-confirmation-modal.js b/ui/app/components/modals/hide-token-confirmation-modal.js
index a6cf2889f..5207b4c95 100644
--- a/ui/app/components/modals/hide-token-confirmation-modal.js
+++ b/ui/app/components/modals/hide-token-confirmation-modal.js
@@ -4,7 +4,6 @@ const inherits = require('util').inherits
 const connect = require('../../metamask-connect')
 const actions = require('../../actions')
 const Identicon = require('../identicon')
-const t = require('../../../i18n-helper').getMessage
 
 function mapStateToProps (state) {
   return {
@@ -42,7 +41,7 @@ HideTokenConfirmationModal.prototype.render = function () {
     h('div.hide-token-confirmation__container', {
     }, [
       h('div.hide-token-confirmation__title', {}, [
-        t(this.props.localeMessages, 'hideTokenPrompt'),
+        this.props.t('hideTokenPrompt'),
       ]),
 
       h(Identicon, {
@@ -55,19 +54,19 @@ HideTokenConfirmationModal.prototype.render = function () {
       h('div.hide-token-confirmation__symbol', {}, symbol),
 
       h('div.hide-token-confirmation__copy', {}, [
-        t(this.props.localeMessages, 'readdToken'),
+        this.props.t('readdToken'),
       ]),
 
       h('div.hide-token-confirmation__buttons', {}, [
         h('button.btn-cancel.hide-token-confirmation__button.allcaps', {
           onClick: () => hideModal(),
         }, [
-          t(this.props.localeMessages, 'cancel'),
+          this.props.t('cancel'),
         ]),
         h('button.btn-clear.hide-token-confirmation__button.allcaps', {
           onClick: () => hideToken(address),
         }, [
-          t(this.props.localeMessages, 'hide'),
+          this.props.t('hide'),
         ]),
       ]),
     ]),
diff --git a/ui/app/components/modals/modal.js b/ui/app/components/modals/modal.js
index d0f4b486c..9250cc77e 100644
--- a/ui/app/components/modals/modal.js
+++ b/ui/app/components/modals/modal.js
@@ -1,7 +1,7 @@
 const Component = require('react').Component
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
-const connect = require('../../metamask-connect')
+const connect = require('react-redux').connect
 const FadeModal = require('boron').FadeModal
 const actions = require('../../actions')
 const isMobileView = require('../../../lib/is-mobile-view')
diff --git a/ui/app/components/modals/new-account-modal.js b/ui/app/components/modals/new-account-modal.js
index 23613ec9c..c46980855 100644
--- a/ui/app/components/modals/new-account-modal.js
+++ b/ui/app/components/modals/new-account-modal.js
@@ -3,7 +3,6 @@ const PropTypes = require('prop-types')
 const h = require('react-hyperscript')
 const connect = require('../../metamask-connect')
 const actions = require('../../actions')
-const t = require('../../../i18n-helper').getMessage
 
 class NewAccountModal extends Component {
   constructor (props) {
@@ -23,7 +22,7 @@ class NewAccountModal extends Component {
       h('div.new-account-modal-wrapper', {
       }, [
         h('div.new-account-modal-header', {}, [
-          t(this.props.localeMessages, 'newAccount'),
+          this.props.t('newAccount'),
         ]),
 
         h('div.modal-close-x', {
@@ -31,19 +30,19 @@ class NewAccountModal extends Component {
         }),
 
         h('div.new-account-modal-content', {}, [
-          t(this.props.localeMessages, 'accountName'),
+          this.props.t('accountName'),
         ]),
 
         h('div.new-account-input-wrapper', {}, [
           h('input.new-account-input', {
             value: this.state.newAccountName,
-            placeholder: t(this.props.localeMessages, 'sampleAccountName'),
+            placeholder: this.props.t('sampleAccountName'),
             onChange: event => this.setState({ newAccountName: event.target.value }),
           }, []),
         ]),
 
         h('div.new-account-modal-content.after-input', {}, [
-          t(this.props.localeMessages, 'or'),
+          this.props.t('or'),
         ]),
 
         h('div.new-account-modal-content.after-input.pointer', {
@@ -51,13 +50,13 @@ class NewAccountModal extends Component {
             this.props.hideModal()
             this.props.showImportPage()
           },
-        }, t(this.props.localeMessages, 'importAnAccount')),
+        }, this.props.t('importAnAccount')),
 
         h('div.new-account-modal-content.button.allcaps', {}, [
           h('button.btn-clear', {
             onClick: () => this.props.createAccount(newAccountName),
           }, [
-            t(this.props.localeMessages, 'save'),
+            this.props.t('save'),
           ]),
         ]),
       ]),
diff --git a/ui/app/components/modals/notification-modal.js b/ui/app/components/modals/notification-modal.js
index 3898f1c44..3c4ab5194 100644
--- a/ui/app/components/modals/notification-modal.js
+++ b/ui/app/components/modals/notification-modal.js
@@ -3,7 +3,6 @@ const PropTypes = require('prop-types')
 const h = require('react-hyperscript')
 const connect = require('../../metamask-connect')
 const actions = require('../../actions')
-const t = require('../../../i18n-helper').getMessage
 
 class NotificationModal extends Component {
   render () {
@@ -23,12 +22,12 @@ class NotificationModal extends Component {
       }, [
 
         h('div.notification-modal__header', {}, [
-          t(this.props.localeMessages, header),
+          this.props.t(header),
         ]),
 
         h('div.notification-modal__message-wrapper', {}, [
           h('div.notification-modal__message', {}, [
-            t(this.props.localeMessages, message),
+            this.props.t(message),
           ]),
         ]),