diff options
author | Dan <danjm.com@gmail.com> | 2018-03-22 08:41:47 +0800 |
---|---|---|
committer | Dan <danjm.com@gmail.com> | 2018-03-22 08:41:47 +0800 |
commit | d24a0590d363dbe88d383c8faec8eb28809242f0 (patch) | |
tree | 189e54ca9ea117804c96afa551cfca8158f36974 /ui | |
parent | 29cc2f8ab9628d21cc32962666879c71be4e69d1 (diff) | |
download | tangerine-wallet-browser-d24a0590d363dbe88d383c8faec8eb28809242f0.tar.gz tangerine-wallet-browser-d24a0590d363dbe88d383c8faec8eb28809242f0.tar.zst tangerine-wallet-browser-d24a0590d363dbe88d383c8faec8eb28809242f0.zip |
i18n redux solution doesn't require importing t() and passing state to each t() call; t is just available on props.
Diffstat (limited to 'ui')
63 files changed, 405 insertions, 439 deletions
diff --git a/ui/app/accounts/import/index.js b/ui/app/accounts/import/index.js index 00b1aab8e..75552924b 100644 --- a/ui/app/accounts/import/index.js +++ b/ui/app/accounts/import/index.js @@ -2,7 +2,6 @@ const inherits = require('util').inherits const Component = require('react').Component const h = require('react-hyperscript') const connect = require('../../metamask-connect') -const t = require('../../../i18n-helper').getMessage import Select from 'react-select' // Subviews @@ -15,8 +14,8 @@ module.exports = connect(mapStateToProps)(AccountImportSubview) function mapStateToProps (state) { return { menuItems: [ - t(this.props.localeMessages, 'privateKey'), - t(this.props.localeMessages, 'jsonFile'), + this.props.t('privateKey'), + this.props.t('jsonFile'), ], } } @@ -36,7 +35,7 @@ AccountImportSubview.prototype.render = function () { h('div.new-account-import-form', [ h('.new-account-import-disclaimer', [ - h('span', t('importAccountMsg')), + h('span', this.props.t('importAccountMsg')), h('span', { style: { cursor: 'pointer', @@ -47,12 +46,12 @@ AccountImportSubview.prototype.render = function () { url: 'https://metamask.helpscoutdocs.com/article/17-what-are-loose-accounts', }) }, - }, t('here')), + }, this.props.t('here')), ]), h('div.new-account-import-form__select-section', [ - h('div.new-account-import-form__select-label', t('selectType')), + h('div.new-account-import-form__select-label', this.props.t('selectType')), h(Select, { className: 'new-account-import-form__select', @@ -85,9 +84,9 @@ AccountImportSubview.prototype.renderImportView = function () { const current = type || menuItems[0] switch (current) { - case t(this.props.localeMessages, 'privateKey'): + case this.props.t('privateKey'): return h(PrivateKeyImportView) - case t(this.props.localeMessages, 'jsonFile'): + case this.props.t('jsonFile'): return h(JsonImportView) default: return h(JsonImportView) diff --git a/ui/app/accounts/import/json.js b/ui/app/accounts/import/json.js index 326e052f2..8bcc1a14e 100644 --- a/ui/app/accounts/import/json.js +++ b/ui/app/accounts/import/json.js @@ -4,7 +4,6 @@ const h = require('react-hyperscript') const connect = require('../../metamask-connect') const actions = require('../../actions') const FileInput = require('react-simple-file-input').default -const t = require('../../../i18n-helper').getMessage const HELP_LINK = 'https://support.metamask.io/kb/article/7-importing-accounts' @@ -25,11 +24,11 @@ class JsonImportSubview extends Component { return ( h('div.new-account-import-form__json', [ - h('p', t(this.props.localeMessages, 'usedByClients')), + h('p', this.props.t('usedByClients')), h('a.warning', { href: HELP_LINK, target: '_blank', - }, t(this.props.localeMessages, 'fileImportFail')), + }, this.props.t('fileImportFail')), h(FileInput, { readAs: 'text', @@ -44,7 +43,7 @@ class JsonImportSubview extends Component { h('input.new-account-import-form__input-password', { type: 'password', - placeholder: t(this.props.localeMessages, 'enterPassword'), + placeholder: this.props.t('enterPassword'), id: 'json-password-box', onKeyPress: this.createKeyringOnEnter.bind(this), }), @@ -54,13 +53,13 @@ class JsonImportSubview extends Component { h('button.new-account-create-form__button-cancel', { onClick: () => this.props.goHome(), }, [ - t(this.props.localeMessages, 'cancel'), + this.props.t('cancel'), ]), h('button.new-account-create-form__button-create', { onClick: () => this.createNewKeychain(), }, [ - t(this.props.localeMessages, 'import'), + this.props.t('import'), ]), ]), @@ -85,14 +84,14 @@ class JsonImportSubview extends Component { const state = this.state if (!state) { - const message = t('validFileImport') + const message = this.props.t('validFileImport') return this.props.displayWarning(message) } const { fileContents } = state if (!fileContents) { - const message = t(this.props.localeMessages, 'needImportFile') + const message = this.props.t('needImportFile') return this.props.displayWarning(message) } @@ -100,7 +99,7 @@ class JsonImportSubview extends Component { const password = passwordInput.value if (!password) { - const message = t(this.props.localeMessages, 'needImportPassword') + const message = this.props.t('needImportPassword') return this.props.displayWarning(message) } diff --git a/ui/app/accounts/import/private-key.js b/ui/app/accounts/import/private-key.js index 9a23b791a..40114ceca 100644 --- a/ui/app/accounts/import/private-key.js +++ b/ui/app/accounts/import/private-key.js @@ -3,7 +3,6 @@ const Component = require('react').Component const h = require('react-hyperscript') const connect = require('../../metamask-connect') const actions = require('../../actions') -const t = require('../../../i18n-helper').getMessage module.exports = connect(mapStateToProps, mapDispatchToProps)(PrivateKeyImportView) @@ -34,7 +33,7 @@ PrivateKeyImportView.prototype.render = function () { return ( h('div.new-account-import-form__private-key', [ - h('span.new-account-create-form__instruction', t(this.props.localeMessages, 'pastePrivateKey')), + h('span.new-account-create-form__instruction', this.props.t('pastePrivateKey')), h('div.new-account-import-form__private-key-password-container', [ @@ -51,13 +50,13 @@ PrivateKeyImportView.prototype.render = function () { h('button.new-account-create-form__button-cancel.allcaps', { onClick: () => goHome(), }, [ - t(this.props.localeMessages, 'cancel'), + this.props.t('cancel'), ]), h('button.new-account-create-form__button-create.allcaps', { onClick: () => this.createNewKeychain(), }, [ - t(this.props.localeMessages, 'import'), + this.props.t('import'), ]), ]), diff --git a/ui/app/accounts/import/seed.js b/ui/app/accounts/import/seed.js index d701feedc..5479a6be9 100644 --- a/ui/app/accounts/import/seed.js +++ b/ui/app/accounts/import/seed.js @@ -2,7 +2,6 @@ const inherits = require('util').inherits const Component = require('react').Component const h = require('react-hyperscript') const connect = require('../../metamask-connect') -const t = require('../../../i18n-helper').getMessage module.exports = connect(mapStateToProps)(SeedImportSubview) @@ -21,10 +20,10 @@ SeedImportSubview.prototype.render = function () { style: { }, }, [ - t(this.props.localeMessages, 'pasteSeed'), + this.props.t('pasteSeed'), h('textarea'), h('br'), - h('button', t(this.props.localeMessages, 'submit')), + h('button', this.props.t('submit')), ]) ) } diff --git a/ui/app/accounts/new-account/create-form.js b/ui/app/accounts/new-account/create-form.js index 6eed0215c..b0e109cd7 100644 --- a/ui/app/accounts/new-account/create-form.js +++ b/ui/app/accounts/new-account/create-form.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 NewAccountCreateForm extends Component { constructor (props) { @@ -14,7 +13,7 @@ class NewAccountCreateForm extends Component { this.state = { newAccountName: '', - defaultAccountName: t(this.props.localeMessages, 'newAccountNumberName', [newAccountNumber]), + defaultAccountName: this.props.t('newAccountNumberName', [newAccountNumber]), } } @@ -25,7 +24,7 @@ class NewAccountCreateForm extends Component { return h('div.new-account-create-form', [ h('div.new-account-create-form__input-label', {}, [ - t(this.props.localeMessages, 'accountName'), + this.props.t('accountName'), ]), h('div.new-account-create-form__input-wrapper', {}, [ @@ -41,13 +40,13 @@ class NewAccountCreateForm extends Component { h('button.new-account-create-form__button-cancel.allcaps', { onClick: () => this.props.goHome(), }, [ - t(this.props.localeMessages, 'cancel'), + this.props.t('cancel'), ]), h('button.new-account-create-form__button-create.allcaps', { onClick: () => this.props.createAccount(newAccountName || defaultAccountName), }, [ - t(this.props.localeMessages, 'create'), + this.props.t('create'), ]), ]), diff --git a/ui/app/accounts/new-account/index.js b/ui/app/accounts/new-account/index.js index 8c305bfae..584016974 100644 --- a/ui/app/accounts/new-account/index.js +++ b/ui/app/accounts/new-account/index.js @@ -3,7 +3,6 @@ const h = require('react-hyperscript') const inherits = require('util').inherits const connect = require('../../metamask-connect') const actions = require('../../actions') -const t = require('../../../i18n-helper').getMessage const { getCurrentViewContext } = require('../../selectors') const classnames = require('classnames') @@ -46,7 +45,7 @@ AccountDetailsModal.prototype.render = function () { h('div.new-account__header', [ - h('div.new-account__title', t(this.props.localeMessages, 'newAccount')), + h('div.new-account__title', this.props.t('newAccount')), h('div.new-account__tabs', [ @@ -56,7 +55,7 @@ AccountDetailsModal.prototype.render = function () { 'new-account__tabs__unselected cursor-pointer': displayedForm !== 'CREATE', }), onClick: () => displayForm('CREATE'), - }, t(this.props.localeMessages, 'createDen')), + }, this.props.t('createDen')), h('div.new-account__tabs__tab', { className: classnames('new-account__tabs__tab', { @@ -64,7 +63,7 @@ AccountDetailsModal.prototype.render = function () { 'new-account__tabs__unselected cursor-pointer': displayedForm !== 'IMPORT', }), onClick: () => displayForm('IMPORT'), - }, t(this.props.localeMessages, 'import')), + }, this.props.t('import')), ]), diff --git a/ui/app/add-token.js b/ui/app/add-token.js index 9576a7aef..b4846510e 100644 --- a/ui/app/add-token.js +++ b/ui/app/add-token.js @@ -26,7 +26,6 @@ const fuse = new Fuse(contractList, { const actions = require('./actions') const ethUtil = require('ethereumjs-util') const { tokenInfoGetter } = require('./token-util') -const t = require('../i18n') const emptyAddr = '0x0000000000000000000000000000000000000000' @@ -140,28 +139,28 @@ AddTokenScreen.prototype.validate = function () { if (customAddress) { const validAddress = ethUtil.isValidAddress(customAddress) if (!validAddress) { - errors.customAddress = t('invalidAddress') + errors.customAddress = this.props.t('invalidAddress') } const validDecimals = customDecimals !== null && customDecimals >= 0 && customDecimals < 36 if (!validDecimals) { - errors.customDecimals = t('decimalsMustZerotoTen') + errors.customDecimals = this.props.t('decimalsMustZerotoTen') } const symbolLen = customSymbol.trim().length const validSymbol = symbolLen > 0 && symbolLen < 10 if (!validSymbol) { - errors.customSymbol = t('symbolBetweenZeroTen') + errors.customSymbol = this.props.t('symbolBetweenZeroTen') } const ownAddress = identitiesList.includes(standardAddress) if (ownAddress) { - errors.customAddress = t('personalAddressDetected') + errors.customAddress = this.props.t('personalAddressDetected') } const tokenAlreadyAdded = this.checkExistingAddresses(customAddress) if (tokenAlreadyAdded) { - errors.customAddress = t('tokenAlreadyAdded') + errors.customAddress = this.props.t('tokenAlreadyAdded') } } else if ( Object.entries(selectedTokens) @@ -169,7 +168,7 @@ AddTokenScreen.prototype.validate = function () { isEmpty && !isSelected ), true) ) { - errors.tokenSelector = t('mustSelectOne') + errors.tokenSelector = this.props.t('mustSelectOne') } return { @@ -199,7 +198,7 @@ AddTokenScreen.prototype.renderCustomForm = function () { 'add-token__add-custom-field--error': errors.customAddress, }), }, [ - h('div.add-token__add-custom-label', t('tokenAddress')), + h('div.add-token__add-custom-label', this.props.t('tokenAddress')), h('input.add-token__add-custom-input', { type: 'text', onChange: this.tokenAddressDidChange, @@ -212,7 +211,7 @@ AddTokenScreen.prototype.renderCustomForm = function () { 'add-token__add-custom-field--error': errors.customSymbol, }), }, [ - h('div.add-token__add-custom-label', t('tokenSymbol')), + h('div.add-token__add-custom-label', this.props.t('tokenSymbol')), h('input.add-token__add-custom-input', { type: 'text', onChange: this.tokenSymbolDidChange, @@ -226,7 +225,7 @@ AddTokenScreen.prototype.renderCustomForm = function () { 'add-token__add-custom-field--error': errors.customDecimals, }), }, [ - h('div.add-token__add-custom-label', t('decimal')), + h('div.add-token__add-custom-label', this.props.t('decimal')), h('input.add-token__add-custom-input', { type: 'number', onChange: this.tokenDecimalsDidChange, @@ -300,11 +299,11 @@ AddTokenScreen.prototype.renderConfirmation = function () { h('div.add-token', [ h('div.add-token__wrapper', [ h('div.add-token__title-container.add-token__confirmation-title', [ - h('div.add-token__title', t('addToken')), - h('div.add-token__description', t('likeToAddTokens')), + h('div.add-token__title', this.props.t('addToken')), + h('div.add-token__description', this.props.t('likeToAddTokens')), ]), h('div.add-token__content-container.add-token__confirmation-content', [ - h('div.add-token__description.add-token__confirmation-description', t('balances')), + h('div.add-token__description.add-token__confirmation-description', this.props.t('balances')), h('div.add-token__confirmation-token-list', Object.entries(tokens) .map(([ address, token ]) => ( @@ -323,10 +322,10 @@ AddTokenScreen.prototype.renderConfirmation = function () { h('div.add-token__buttons', [ h('button.btn-cancel.add-token__button', { onClick: () => this.setState({ isShowingConfirmation: false }), - }, t('back')), + }, this.props.t('back')), h('button.btn-clear.add-token__button', { onClick: () => addTokens(tokens).then(goHome), - }, t('addTokens')), + }, this.props.t('addTokens')), ]), ]) ) @@ -342,15 +341,15 @@ AddTokenScreen.prototype.render = function () { h('div.add-token', [ h('div.add-token__wrapper', [ h('div.add-token__title-container', [ - h('div.add-token__title', t('addToken')), - h('div.add-token__description', t('tokenWarning1')), - h('div.add-token__description', t('tokenSelection')), + h('div.add-token__title', this.props.t('addToken')), + h('div.add-token__description', this.props.t('tokenWarning1')), + h('div.add-token__description', this.props.t('tokenSelection')), ]), h('div.add-token__content-container', [ h('div.add-token__input-container', [ h('input.add-token__input', { type: 'text', - placeholder: t('search'), + placeholder: this.props.t('search'), onChange: e => this.setState({ searchQuery: e.target.value }), }), h('div.add-token__search-input-error-message', errors.tokenSelector), @@ -364,7 +363,7 @@ AddTokenScreen.prototype.render = function () { h('div.add-token__add-custom', { onClick: () => this.setState({ isCollapsed: !isCollapsed }), }, [ - t('addCustomToken'), + this.props.t('addCustomToken'), h(`i.fa.fa-angle-${isCollapsed ? 'down' : 'up'}`), ]), this.renderCustomForm(), @@ -373,10 +372,10 @@ AddTokenScreen.prototype.render = function () { h('div.add-token__buttons', [ h('button.btn-cancel.add-token__button', { onClick: goHome, - }, t('cancel')), + }, this.props.t('cancel')), h('button.btn-clear.add-token__button', { onClick: this.onNext, - }, t('next')), + }, this.props.t('next')), ]), ]) ) diff --git a/ui/app/app.js b/ui/app/app.js index f69efd1c7..91d5af899 100644 --- a/ui/app/app.js +++ b/ui/app/app.js @@ -4,7 +4,6 @@ const connect = require('./metamask-connect') const h = require('react-hyperscript') const actions = require('./actions') const classnames = require('classnames') -const t = require('../i18n-helper').getMessage // mascara const MascaraFirstTime = require('../../mascara/src/app/first-time').default @@ -294,8 +293,8 @@ App.prototype.renderAppBar = function () { // metamask name h('.flex-row', [ - h('h1', t(this.props.localeMessages, 'appName')), - h('div.beta-label', t(this.props.localeMessages, 'beta')), + h('h1', this.props.t('appName')), + h('div.beta-label', this.props.t('beta')), ]), ]), @@ -557,15 +556,15 @@ App.prototype.getConnectingLabel = function () { let name if (providerName === 'mainnet') { - name = t('connectingToMainnet') + name = this.props.t('connectingToMainnet') } else if (providerName === 'ropsten') { - name = t('connectingToRopsten') + name = this.props.t('connectingToRopsten') } else if (providerName === 'kovan') { - name = t('connectingToRopsten') + name = this.props.t('connectingToRopsten') } else if (providerName === 'rinkeby') { - name = t('connectingToRinkeby') + name = this.props.t('connectingToRinkeby') } else { - name = t('connectingToUnknown') + name = this.props.t('connectingToUnknown') } return name @@ -578,15 +577,15 @@ App.prototype.getNetworkName = function () { let name if (providerName === 'mainnet') { - name = t('mainnet') + name = this.props.t('mainnet') } else if (providerName === 'ropsten') { - name = t('ropsten') + name = this.props.t('ropsten') } else if (providerName === 'kovan') { - name = t('kovan') + name = this.props.t('kovan') } else if (providerName === 'rinkeby') { - name = t('rinkeby') + name = this.props.t('rinkeby') } else { - name = t('unknownNetwork') + name = this.props.t('unknownNetwork') } return name diff --git a/ui/app/components/account-dropdowns.js b/ui/app/components/account-dropdowns.js index f725e7d86..88c7dbb60 100644 --- a/ui/app/components/account-dropdowns.js +++ b/ui/app/components/account-dropdowns.js @@ -9,7 +9,6 @@ const DropdownMenuItem = require('./dropdown').DropdownMenuItem const Identicon = require('./identicon') const ethUtil = require('ethereumjs-util') const copyToClipboard = require('copy-to-clipboard') -const t = require('../../i18n-helper').getMessage class AccountDropdowns extends Component { constructor (props) { @@ -80,7 +79,7 @@ class AccountDropdowns extends Component { try { // Sometimes keyrings aren't loaded yet: const type = keyring.type const isLoose = type !== 'HD Key Tree' - return isLoose ? h('.keyring-label.allcaps', t(this.props.localeMessages, 'loose')) : null + return isLoose ? h('.keyring-label.allcaps', this.props.t('loose')) : null } catch (e) { return } } @@ -130,7 +129,7 @@ class AccountDropdowns extends Component { diameter: 32, }, ), - h('span', { style: { marginLeft: '20px', fontSize: '24px' } }, t(this.props.localeMessages, 'createAccount')), + h('span', { style: { marginLeft: '20px', fontSize: '24px' } }, this.props.t('createAccount')), ], ), h( @@ -155,7 +154,7 @@ class AccountDropdowns extends Component { fontSize: '24px', marginBottom: '5px', }, - }, t(this.props.localeMessages, 'importAccount')), + }, this.props.t('importAccount')), ] ), ] @@ -193,7 +192,7 @@ class AccountDropdowns extends Component { global.platform.openWindow({ url }) }, }, - t(this.props.localeMessages, 'etherscanView'), + this.props.t('etherscanView'), ), h( DropdownMenuItem, @@ -205,7 +204,7 @@ class AccountDropdowns extends Component { actions.showQrView(selected, identity ? identity.name : '') }, }, - t(this.props.localeMessages, 'showQRCode'), + this.props.t('showQRCode'), ), h( DropdownMenuItem, @@ -217,7 +216,7 @@ class AccountDropdowns extends Component { copyToClipboard(checkSumAddress) }, }, - t(this.props.localeMessages, 'copyAddress'), + this.props.t('copyAddress'), ), h( DropdownMenuItem, @@ -227,7 +226,7 @@ class AccountDropdowns extends Component { actions.requestAccountExport() }, }, - t(this.props.localeMessages, 'exportPrivateKey'), + this.props.t('exportPrivateKey'), ), ] ) diff --git a/ui/app/components/account-export.js b/ui/app/components/account-export.js index 3bb7ec337..8889f88a7 100644 --- a/ui/app/components/account-export.js +++ b/ui/app/components/account-export.js @@ -6,7 +6,6 @@ const copyToClipboard = require('copy-to-clipboard') const actions = require('../actions') const ethUtil = require('ethereumjs-util') const connect = require('../metamask-connect') -const t = require('../../i18n-helper').getMessage module.exports = connect(mapStateToProps)(ExportAccountView) @@ -36,7 +35,7 @@ ExportAccountView.prototype.render = function () { if (notExporting) return h('div') if (exportRequested) { - const warning = t(this.props.localeMessages, 'exportPrivateKeyWarning') + const warning = this.props.t('exportPrivateKeyWarning') return ( h('div', { style: { @@ -54,7 +53,7 @@ ExportAccountView.prototype.render = function () { h('p.error', warning), h('input#exportAccount.sizing-input', { type: 'password', - placeholder: t(this.props.localeMessages, 'confirmPassword').toLowerCase(), + placeholder: this.props.t('confirmPassword').toLowerCase(), onKeyPress: this.onExportKeyPress.bind(this), style: { position: 'relative', @@ -75,10 +74,10 @@ ExportAccountView.prototype.render = function () { style: { marginRight: '10px', }, - }, t(this.props.localeMessages, 'submit')), + }, this.props.t('submit')), h('button', { onClick: () => this.props.dispatch(actions.backToAccountDetail(this.props.address)), - }, t(this.props.localeMessages, 'cancel')), + }, this.props.t('cancel')), ]), (this.props.warning) && ( h('span.error', { @@ -99,7 +98,7 @@ ExportAccountView.prototype.render = function () { margin: '0 20px', }, }, [ - h('label', t(this.props.localeMessages, 'copyPrivateKey') + ':'), + h('label', this.props.t('copyPrivateKey') + ':'), h('p.error.cursor-pointer', { style: { textOverflow: 'ellipsis', @@ -113,13 +112,13 @@ ExportAccountView.prototype.render = function () { }, plainKey), h('button', { onClick: () => this.props.dispatch(actions.backToAccountDetail(this.props.address)), - }, t(this.props.localeMessages, 'done')), + }, this.props.t('done')), h('button', { style: { marginLeft: '10px', }, onClick: () => exportAsFile(`MetaMask ${nickname} Private Key`, plainKey), - }, t(this.props.localeMessages, 'saveAsFile')), + }, this.props.t('saveAsFile')), ]) } } diff --git a/ui/app/components/account-menu/index.js b/ui/app/components/account-menu/index.js index dc9c36c40..a9120f9db 100644 --- a/ui/app/components/account-menu/index.js +++ b/ui/app/components/account-menu/index.js @@ -6,7 +6,6 @@ const actions = require('../../actions') const { Menu, Item, Divider, CloseArea } = require('../dropdowns/components/menu') const Identicon = require('../identicon') const { formatBalance } = require('../../util') -const t = require('../../../i18n-helper').getMessage module.exports = connect(mapStateToProps, mapDispatchToProps)(AccountMenu) @@ -71,10 +70,10 @@ AccountMenu.prototype.render = function () { h(Item, { className: 'account-menu__header', }, [ - t(this.props.localeMessages, 'myAccounts'), + this.props.t('myAccounts'), h('button.account-menu__logout-button', { onClick: lockMetamask, - }, t(this.props.localeMessages, 'logout')), + }, this.props.t('logout')), ]), h(Divider), h('div.account-menu__accounts', this.renderAccounts()), @@ -82,23 +81,23 @@ AccountMenu.prototype.render = function () { h(Item, { onClick: () => showNewAccountPage('CREATE'), icon: h('img.account-menu__item-icon', { src: 'images/plus-btn-white.svg' }), - text: t(this.props.localeMessages, 'createAccount'), + text: this.props.t('createAccount'), }), h(Item, { onClick: () => showNewAccountPage('IMPORT'), icon: h('img.account-menu__item-icon', { src: 'images/import-account.svg' }), - text: t(this.props.localeMessages, 'importAccount'), + text: this.props.t('importAccount'), }), h(Divider), h(Item, { onClick: showInfoPage, icon: h('img', { src: 'images/mm-info-icon.svg' }), - text: t(this.props.localeMessages, 'infoHelp'), + text: this.props.t('infoHelp'), }), h(Item, { onClick: showConfigPage, icon: h('img.account-menu__item-icon', { src: 'images/settings.svg' }), - text: t(this.props.localeMessages, 'settings'), + text: this.props.t('settings'), }), ]) } @@ -156,6 +155,6 @@ AccountMenu.prototype.indicateIfLoose = function (keyring) { try { // Sometimes keyrings aren't loaded yet: const type = keyring.type const isLoose = type !== 'HD Key Tree' - return isLoose ? h('.keyring-label.allcaps', t(this.props.localeMessages, 'imported')) : null + return isLoose ? h('.keyring-label.allcaps', this.props.t('imported')) : null } catch (e) { return } } diff --git a/ui/app/components/bn-as-decimal-input.js b/ui/app/components/bn-as-decimal-input.js index 5b83b4332..0ace2b840 100644 --- a/ui/app/components/bn-as-decimal-input.js +++ b/ui/app/components/bn-as-decimal-input.js @@ -4,9 +4,9 @@ const inherits = require('util').inherits const ethUtil = require('ethereumjs-util') const BN = ethUtil.BN const extend = require('xtend') -const t = require('../../i18n-helper').getMessage +const connect = require('../metamask-connect') -module.exports = BnAsDecimalInput +module.exports = connect()(BnAsDecimalInput) inherits(BnAsDecimalInput, Component) function BnAsDecimalInput () { @@ -137,13 +137,13 @@ BnAsDecimalInput.prototype.constructWarning = function () { let message = name ? name + ' ' : '' if (min && max) { - message += t(this.props.localeMessages, 'betweenMinAndMax', [`${newMin} ${suffix}`, `${newMax} ${suffix}`]) + message += this.props.t('betweenMinAndMax', [`${newMin} ${suffix}`, `${newMax} ${suffix}`]) } else if (min) { - message += t(this.props.localeMessages, 'greaterThanMin', [`${newMin} ${suffix}`]) + message += this.props.t('greaterThanMin', [`${newMin} ${suffix}`]) } else if (max) { - message += t(this.props.localeMessages, 'lessThanMax', [`${newMax} ${suffix}`]) + message += this.props.t('lessThanMax', [`${newMax} ${suffix}`]) } else { - message += t(this.props.localeMessages, 'invalidInput') + message += this.props.t('invalidInput') } return message diff --git a/ui/app/components/buy-button-subview.js b/ui/app/components/buy-button-subview.js index b2b8cbbd5..2243ce38b 100644 --- a/ui/app/components/buy-button-subview.js +++ b/ui/app/components/buy-button-subview.js @@ -9,7 +9,6 @@ const Loading = require('./loading') const AccountPanel = require('./account-panel') const RadioList = require('./custom-radio-list') const networkNames = require('../../../app/scripts/config.js').networkNames -const t = require('../../i18n-helper.js').getMessage module.exports = connect(mapStateToProps)(BuyButtonSubview) @@ -77,7 +76,7 @@ BuyButtonSubview.prototype.headerSubview = function () { paddingTop: '4px', paddingBottom: '4px', }, - }, t(this.props.localeMessages, 'depositEth')), + }, this.props.t('depositEth')), ]), // loading indication @@ -119,7 +118,7 @@ BuyButtonSubview.prototype.headerSubview = function () { paddingTop: '4px', paddingBottom: '4px', }, - }, t(this.props.localeMessages, 'selectService')), + }, this.props.t('selectService')), ]), ]) @@ -165,14 +164,14 @@ BuyButtonSubview.prototype.primarySubview = function () { style: { marginTop: '15px', }, - }, t(this.props.localeMessages, 'borrowDharma')) + }, this.props.t('borrowDharma')) ) : null, ]) ) default: return ( - h('h2.error', t(this.props.localeMessages, 'unknownNetworkId')) + h('h2.error', this.props.t('unknownNetworkId')) ) } @@ -205,7 +204,7 @@ BuyButtonSubview.prototype.mainnetSubview = function () { ], subtext: { 'Coinbase': `${t('crypto')}/${t('fiat')} (${t('usaOnly')})`, - 'ShapeShift': t(this.props.localeMessages, 'crypto'), + 'ShapeShift': this.props.t('crypto'), }, onClick: this.radioHandler.bind(this), }), diff --git a/ui/app/components/coinbase-form.js b/ui/app/components/coinbase-form.js index be413905e..0f980fbd5 100644 --- a/ui/app/components/coinbase-form.js +++ b/ui/app/components/coinbase-form.js @@ -3,7 +3,6 @@ const h = require('react-hyperscript') const inherits = require('util').inherits const connect = require('../metamask-connect') const actions = require('../actions') -const t = require('../../i18n-helper').getMessage module.exports = connect(mapStateToProps)(CoinbaseForm) @@ -38,11 +37,11 @@ CoinbaseForm.prototype.render = function () { }, [ h('button.btn-green', { onClick: this.toCoinbase.bind(this), - }, t(this.props.localeMessages, 'continueToCoinbase')), + }, this.props.t('continueToCoinbase')), h('button.btn-red', { onClick: () => props.dispatch(actions.goHome()), - }, t(this.props.localeMessages, 'cancel')), + }, this.props.t('cancel')), ]), ]) } diff --git a/ui/app/components/copyButton.js b/ui/app/components/copyButton.js index db43668cb..ea1c43d54 100644 --- a/ui/app/components/copyButton.js +++ b/ui/app/components/copyButton.js @@ -2,11 +2,11 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits const copyToClipboard = require('copy-to-clipboard') -const t = require('../../i18n-helper').getMessage +const connect = require('../metamask-connect') const Tooltip = require('./tooltip') -module.exports = CopyButton +module.exports = connect()(CopyButton) inherits(CopyButton, Component) function CopyButton () { @@ -23,7 +23,7 @@ CopyButton.prototype.render = function () { const value = props.value const copied = state.copied - const message = copied ? t(this.props.localeMessages, 'copiedButton') : props.title || t(this.props.localeMessages, 'copyButton') + const message = copied ? this.props.t('copiedButton') : props.title || this.props.t('copyButton') return h('.copy-button', { style: { diff --git a/ui/app/components/copyable.js b/ui/app/components/copyable.js index 92a337a37..28def9adb 100644 --- a/ui/app/components/copyable.js +++ b/ui/app/components/copyable.js @@ -4,9 +4,9 @@ const inherits = require('util').inherits const Tooltip = require('./tooltip') const copyToClipboard = require('copy-to-clipboard') -const t = require('../../i18n-helper').getMessage +const connect = require('../metamask-connect') -module.exports = Copyable +module.exports = connect()(Copyable) inherits(Copyable, Component) function Copyable () { @@ -23,7 +23,7 @@ Copyable.prototype.render = function () { const { copied } = state return h(Tooltip, { - title: copied ? t(this.props.localeMessages, 'copiedExclamation') : t(this.props.localeMessages, 'copy'), + title: copied ? this.props.t('copiedExclamation') : this.props.t('copy'), position: 'bottom', }, h('span', { style: { diff --git a/ui/app/components/customize-gas-modal/index.js b/ui/app/components/customize-gas-modal/index.js index e44675880..1ea64de27 100644 --- a/ui/app/components/customize-gas-modal/index.js +++ b/ui/app/components/customize-gas-modal/index.js @@ -4,7 +4,6 @@ const inherits = require('util').inherits const connect = require('../../metamask-connect') const actions = require('../../actions') const GasModalCard = require('./gas-modal-card') -const t = require('../../../i18n-helper').getMessage const ethUtil = require('ethereumjs-util') @@ -150,7 +149,7 @@ CustomizeGasModal.prototype.validate = function ({ gasTotal, gasLimit }) { }) if (!balanceIsSufficient) { - error = t(this.props.localeMessages, 'balanceIsInsufficientGas') + error = this.props.t('balanceIsInsufficientGas') } const gasLimitTooLow = gasLimit && conversionGreaterThan( @@ -166,7 +165,7 @@ CustomizeGasModal.prototype.validate = function ({ gasTotal, gasLimit }) { ) if (gasLimitTooLow) { - error = t(this.props.localeMessages, 'gasLimitTooLow') + error = this.props.t('gasLimitTooLow') } this.setState({ error }) @@ -259,7 +258,7 @@ CustomizeGasModal.prototype.render = function () { }, [ h('div.send-v2__customize-gas__header', {}, [ - h('div.send-v2__customize-gas__title', t(this.props.localeMessages, 'customGas')), + h('div.send-v2__customize-gas__title', this.props.t('customGas')), h('div.send-v2__customize-gas__close', { onClick: hideModal, @@ -275,8 +274,8 @@ CustomizeGasModal.prototype.render = function () { // max: 1000, step: multiplyCurrencies(MIN_GAS_PRICE_GWEI, 10), onChange: value => this.convertAndSetGasPrice(value), - title: t(this.props.localeMessages, 'gasPrice'), - copy: t(this.props.localeMessages, 'gasPriceCalculation'), + title: this.props.t('gasPrice'), + copy: this.props.t('gasPriceCalculation'), }), h(GasModalCard, { @@ -285,8 +284,8 @@ CustomizeGasModal.prototype.render = function () { // max: 100000, step: 1, onChange: value => this.convertAndSetGasLimit(value), - title: t(this.props.localeMessages, 'gasLimit'), - copy: t(this.props.localeMessages, 'gasLimitCalculation'), + title: this.props.t('gasLimit'), + copy: this.props.t('gasLimitCalculation'), }), ]), @@ -299,16 +298,16 @@ CustomizeGasModal.prototype.render = function () { h('div.send-v2__customize-gas__revert', { onClick: () => this.revert(), - }, [t(this.props.localeMessages, 'revert')]), + }, [this.props.t('revert')]), h('div.send-v2__customize-gas__buttons', [ h('div.send-v2__customize-gas__cancel.allcaps', { onClick: this.props.hideModal, - }, [t(this.props.localeMessages, 'cancel')]), + }, [this.props.t('cancel')]), h(`div.send-v2__customize-gas__save${error ? '__error' : ''}.allcaps`, { onClick: () => !error && this.save(newGasPrice, gasLimit, gasTotal), - }, [t(this.props.localeMessages, 'save')]), + }, [this.props.t('save')]), ]), ]), diff --git a/ui/app/components/dropdowns/components/account-dropdowns.js b/ui/app/components/dropdowns/components/account-dropdowns.js index 6de4d8280..d570b3d36 100644 --- a/ui/app/components/dropdowns/components/account-dropdowns.js +++ b/ui/app/components/dropdowns/components/account-dropdowns.js @@ -10,7 +10,6 @@ const Identicon = require('../../identicon') const ethUtil = require('ethereumjs-util') const copyToClipboard = require('copy-to-clipboard') const { formatBalance } = require('../../../util') -const t = require('../../../../i18n-helper').getMessage class AccountDropdowns extends Component { @@ -131,7 +130,7 @@ class AccountDropdowns extends Component { actions.showEditAccountModal(identity) }, }, [ - t(this.props.localeMessages, 'edit'), + this.props.t('edit'), ]), ]), @@ -145,7 +144,7 @@ class AccountDropdowns extends Component { try { // Sometimes keyrings aren't loaded yet: const type = keyring.type const isLoose = type !== 'HD Key Tree' - return isLoose ? h('.keyring-label.allcaps', t(this.props.localeMessages, 'loose')) : null + return isLoose ? h('.keyring-label.allcaps', this.props.t('loose')) : null } catch (e) { return } } @@ -203,7 +202,7 @@ class AccountDropdowns extends Component { fontSize: '16px', lineHeight: '23px', }, - }, t(this.props.localeMessages, 'createAccount')), + }, this.props.t('createAccount')), ], ), h( @@ -237,7 +236,7 @@ class AccountDropdowns extends Component { fontSize: '16px', lineHeight: '23px', }, - }, t(this.props.localeMessages, 'importAccount')), + }, this.props.t('importAccount')), ] ), ] @@ -288,7 +287,7 @@ class AccountDropdowns extends Component { menuItemStyles, ), }, - t(this.props.localeMessages, 'accountDetails'), + this.props.t('accountDetails'), ), h( DropdownMenuItem, @@ -304,7 +303,7 @@ class AccountDropdowns extends Component { menuItemStyles, ), }, - t(this.props.localeMessages, 'etherscanView'), + this.props.t('etherscanView'), ), h( DropdownMenuItem, @@ -320,7 +319,7 @@ class AccountDropdowns extends Component { menuItemStyles, ), }, - t(this.props.localeMessages, 'copyAddress'), + this.props.t('copyAddress'), ), h( DropdownMenuItem, @@ -332,7 +331,7 @@ class AccountDropdowns extends Component { menuItemStyles, ), }, - t(this.props.localeMessages, 'exportPrivateKey'), + this.props.t('exportPrivateKey'), ), h( DropdownMenuItem, @@ -347,7 +346,7 @@ class AccountDropdowns extends Component { menuItemStyles, ), }, - t(this.props.localeMessages, 'addToken'), + this.props.t('addToken'), ), ] diff --git a/ui/app/components/dropdowns/network-dropdown.js b/ui/app/components/dropdowns/network-dropdown.js index 61c574aed..aac7a9ee5 100644 --- a/ui/app/components/dropdowns/network-dropdown.js +++ b/ui/app/components/dropdowns/network-dropdown.js @@ -7,7 +7,6 @@ const Dropdown = require('./components/dropdown').Dropdown const DropdownMenuItem = require('./components/dropdown').DropdownMenuItem const NetworkDropdownIcon = require('./components/network-dropdown-icon') const R = require('ramda') -const t = require('../../../i18n-helper').getMessage // classes from nodes of the toggle element. @@ -95,13 +94,13 @@ NetworkDropdown.prototype.render = function () { }, [ h('div.network-dropdown-header', {}, [ - h('div.network-dropdown-title', {}, t(this.props.localeMessages, 'networks')), + h('div.network-dropdown-title', {}, this.props.t('networks')), h('div.network-dropdown-divider'), h('div.network-dropdown-content', {}, - t(this.props.localeMessages, 'defaultNetwork') + this.props.t('defaultNetwork') ), ]), @@ -123,7 +122,7 @@ NetworkDropdown.prototype.render = function () { style: { color: providerType === 'mainnet' ? '#ffffff' : '#9b9b9b', }, - }, t(this.props.localeMessages, 'mainnet')), + }, this.props.t('mainnet')), ] ), @@ -145,7 +144,7 @@ NetworkDropdown.prototype.render = function () { style: { color: providerType === 'ropsten' ? '#ffffff' : '#9b9b9b', }, - }, t(this.props.localeMessages, 'ropsten')), + }, this.props.t('ropsten')), ] ), @@ -167,7 +166,7 @@ NetworkDropdown.prototype.render = function () { style: { color: providerType === 'kovan' ? '#ffffff' : '#9b9b9b', }, - }, t(this.props.localeMessages, 'kovan')), + }, this.props.t('kovan')), ] ), @@ -189,7 +188,7 @@ NetworkDropdown.prototype.render = function () { style: { color: providerType === 'rinkeby' ? '#ffffff' : '#9b9b9b', }, - }, t(this.props.localeMessages, 'rinkeby')), + }, this.props.t('rinkeby')), ] ), @@ -211,7 +210,7 @@ NetworkDropdown.prototype.render = function () { style: { color: activeNetwork === 'http://localhost:8545' ? '#ffffff' : '#9b9b9b', }, - }, t(this.props.localeMessages, 'localhost')), + }, this.props.t('localhost')), ] ), @@ -235,7 +234,7 @@ NetworkDropdown.prototype.render = function () { style: { color: activeNetwork === 'custom' ? '#ffffff' : '#9b9b9b', }, - }, t(this.props.localeMessages, 'customRPC')), + }, this.props.t('customRPC')), ] ), @@ -250,15 +249,15 @@ NetworkDropdown.prototype.getNetworkName = function () { let name if (providerName === 'mainnet') { - name = t(this.props.localeMessages, 'mainnet') + name = this.props.t('mainnet') } else if (providerName === 'ropsten') { - name = t(this.props.localeMessages, 'ropsten') + name = this.props.t('ropsten') } else if (providerName === 'kovan') { - name = t(this.props.localeMessages, 'kovan') + name = this.props.t('kovan') } else if (providerName === 'rinkeby') { - name = t(this.props.localeMessages, 'rinkeby') + name = this.props.t('rinkeby') } else { - name = t(this.props.localeMessages, 'unknownNetwork') + name = this.props.t('unknownNetwork') } return name diff --git a/ui/app/components/dropdowns/token-menu-dropdown.js b/ui/app/components/dropdowns/token-menu-dropdown.js index 403d17591..630e1f99d 100644 --- a/ui/app/components/dropdowns/token-menu-dropdown.js +++ b/ui/app/components/dropdowns/token-menu-dropdown.js @@ -3,7 +3,6 @@ const h = require('react-hyperscript') const inherits = require('util').inherits const connect = require('../../metamask-connect') const actions = require('../../actions') -const t = require('../../../i18n-helper').getMessage module.exports = connect(null, mapDispatchToProps)(TokenMenuDropdown) @@ -45,7 +44,7 @@ TokenMenuDropdown.prototype.render = function () { showHideTokenConfirmationModal(this.props.token) this.props.onClose() }, - }, t(this.props.localeMessages, 'hideToken')), + }, this.props.t('hideToken')), ]), ]), diff --git a/ui/app/components/ens-input.js b/ui/app/components/ens-input.js index ea26acbca..e731286bb 100644 --- a/ui/app/components/ens-input.js +++ b/ui/app/components/ens-input.js @@ -8,10 +8,10 @@ const ENS = require('ethjs-ens') const networkMap = require('ethjs-ens/lib/network-map.json') const ensRE = /.+\..+$/ const ZERO_ADDRESS = '0x0000000000000000000000000000000000000000' -const t = require('../../i18n-helper').getMessage +const connect = require('../metamask-connect') -module.exports = EnsInput +module.exports = connect()(EnsInput) inherits(EnsInput, Component) function EnsInput () { @@ -90,13 +90,13 @@ EnsInput.prototype.lookupEnsName = function () { log.info(`ENS attempting to resolve name: ${recipient}`) this.ens.lookup(recipient.trim()) .then((address) => { - if (address === ZERO_ADDRESS) throw new Error(t(this.props.localeMessages, 'noAddressForName')) + if (address === ZERO_ADDRESS) throw new Error(this.props.t('noAddressForName')) if (address !== ensResolution) { this.setState({ loadingEns: false, ensResolution: address, nickname: recipient.trim(), - hoverText: address + '\n' + t(this.props.localeMessages, 'clickCopy'), + hoverText: address + '\n' + this.props.t('clickCopy'), ensFailure: false, }) } diff --git a/ui/app/components/hex-as-decimal-input.js b/ui/app/components/hex-as-decimal-input.js index 7e53ba2f0..be7ba4c9e 100644 --- a/ui/app/components/hex-as-decimal-input.js +++ b/ui/app/components/hex-as-decimal-input.js @@ -4,9 +4,9 @@ const inherits = require('util').inherits const ethUtil = require('ethereumjs-util') const BN = ethUtil.BN const extend = require('xtend') -const t = require('../../i18n-helper').getMessage +const connect = require('../metamask-connect') -module.exports = HexAsDecimalInput +module.exports = connect()(HexAsDecimalInput) inherits(HexAsDecimalInput, Component) function HexAsDecimalInput () { @@ -127,13 +127,13 @@ HexAsDecimalInput.prototype.constructWarning = function () { let message = name ? name + ' ' : '' if (min && max) { - message += t(this.props.localeMessages, 'betweenMinAndMax', [min, max]) + message += this.props.t('betweenMinAndMax', [min, max]) } else if (min) { - message += t(this.props.localeMessages, 'greaterThanMin', [min]) + message += this.props.t('greaterThanMin', [min]) } else if (max) { - message += t(this.props.localeMessages, 'lessThanMax', [max]) + message += this.props.t('lessThanMax', [max]) } else { - message += t(this.props.localeMessages, 'invalidInput') + message += this.props.t('invalidInput') } return message 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), ]), ]), diff --git a/ui/app/components/network.js b/ui/app/components/network.js index 55bc14c3c..10961390e 100644 --- a/ui/app/components/network.js +++ b/ui/app/components/network.js @@ -4,7 +4,6 @@ const connect = require('../metamask-connect') const classnames = require('classnames') const inherits = require('util').inherits const NetworkDropdownIcon = require('./dropdowns/components/network-dropdown-icon') -const t = require('../../i18n-helper').getMessage module.exports = connect()(Network) @@ -35,7 +34,7 @@ Network.prototype.render = function () { onClick: (event) => this.props.onClick(event), }, [ h('img', { - title: t(props.localeMessages, 'attemptingConnect'), + title: props.t('attemptingConnect'), style: { width: '27px', }, @@ -43,22 +42,22 @@ Network.prototype.render = function () { }), ]) } else if (providerName === 'mainnet') { - hoverText = t(props.localeMessages, 'mainnet') + hoverText = props.t('mainnet') iconName = 'ethereum-network' } else if (providerName === 'ropsten') { - hoverText = t(props.localeMessages, 'ropsten') + hoverText = props.t('ropsten') iconName = 'ropsten-test-network' } else if (parseInt(networkNumber) === 3) { - hoverText = t(props.localeMessages, 'ropsten') + hoverText = props.t('ropsten') iconName = 'ropsten-test-network' } else if (providerName === 'kovan') { - hoverText = t(props.localeMessages, 'kovan') + hoverText = props.t('kovan') iconName = 'kovan-test-network' } else if (providerName === 'rinkeby') { - hoverText = t(props.localeMessages, 'rinkeby') + hoverText = props.t('rinkeby') iconName = 'rinkeby-test-network' } else { - hoverText = t(props.localeMessages, 'unknownNetwork') + hoverText = props.t('unknownNetwork') iconName = 'unknown-private-network' } @@ -86,7 +85,7 @@ Network.prototype.render = function () { backgroundColor: '#038789', // $blue-lagoon nonSelectBackgroundColor: '#15afb2', }), - h('.network-name', t(props.localeMessages, 'mainnet')), + h('.network-name', props.t('mainnet')), h('i.fa.fa-chevron-down.fa-lg.network-caret'), ]) case 'ropsten-test-network': @@ -95,7 +94,7 @@ Network.prototype.render = function () { backgroundColor: '#e91550', // $crimson nonSelectBackgroundColor: '#ec2c50', }), - h('.network-name', t(props.localeMessages, 'ropsten')), + h('.network-name', props.t('ropsten')), h('i.fa.fa-chevron-down.fa-lg.network-caret'), ]) case 'kovan-test-network': @@ -104,7 +103,7 @@ Network.prototype.render = function () { backgroundColor: '#690496', // $purple nonSelectBackgroundColor: '#b039f3', }), - h('.network-name', t(props.localeMessages, 'kovan')), + h('.network-name', props.t('kovan')), h('i.fa.fa-chevron-down.fa-lg.network-caret'), ]) case 'rinkeby-test-network': @@ -113,7 +112,7 @@ Network.prototype.render = function () { backgroundColor: '#ebb33f', // $tulip-tree nonSelectBackgroundColor: '#ecb23e', }), - h('.network-name', t(props.localeMessages, 'rinkeby')), + h('.network-name', props.t('rinkeby')), h('i.fa.fa-chevron-down.fa-lg.network-caret'), ]) default: @@ -125,7 +124,7 @@ Network.prototype.render = function () { }, }), - h('.network-name', t(props.localeMessages, 'privateNetwork')), + h('.network-name', props.t('privateNetwork')), h('i.fa.fa-chevron-down.fa-lg.network-caret'), ]) } diff --git a/ui/app/components/notice.js b/ui/app/components/notice.js index ffc5ec6f1..a999ffd88 100644 --- a/ui/app/components/notice.js +++ b/ui/app/components/notice.js @@ -4,9 +4,9 @@ const h = require('react-hyperscript') const ReactMarkdown = require('react-markdown') const linker = require('extension-link-enabler') const findDOMNode = require('react-dom').findDOMNode -const t = require('../../i18n-helper').getMessage +const connect = require('../metamask-connect') -module.exports = Notice +module.exports = connect()(Notice) inherits(Notice, Component) function Notice () { @@ -111,7 +111,7 @@ Notice.prototype.render = function () { style: { marginTop: '18px', }, - }, t(this.props.localeMessages, 'accept')), + }, this.props.t('accept')), ]) ) } diff --git a/ui/app/components/pending-msg-details.js b/ui/app/components/pending-msg-details.js index 8edf21b48..ddec8470d 100644 --- a/ui/app/components/pending-msg-details.js +++ b/ui/app/components/pending-msg-details.js @@ -1,11 +1,11 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const t = require('../../i18n-helper').getMessage +const connect = require('../metamask-connect') const AccountPanel = require('./account-panel') -module.exports = PendingMsgDetails +module.exports = connect()(PendingMsgDetails) inherits(PendingMsgDetails, Component) function PendingMsgDetails () { @@ -40,7 +40,7 @@ PendingMsgDetails.prototype.render = function () { // message data h('.tx-data.flex-column.flex-justify-center.flex-grow.select-none', [ h('.flex-column.flex-space-between', [ - h('label.font-small.allcaps', t(this.props.localeMessages, 'message')), + h('label.font-small.allcaps', this.props.t('message')), h('span.font-small', msgParams.data), ]), ]), diff --git a/ui/app/components/pending-msg.js b/ui/app/components/pending-msg.js index 2364353be..56e646a1c 100644 --- a/ui/app/components/pending-msg.js +++ b/ui/app/components/pending-msg.js @@ -2,9 +2,9 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits const PendingTxDetails = require('./pending-msg-details') -const t = require('../../i18n-helper').getMessage +const connect = require('../metamask-connect') -module.exports = PendingMsg +module.exports = connect()(PendingMsg) inherits(PendingMsg, Component) function PendingMsg () { @@ -30,14 +30,14 @@ PendingMsg.prototype.render = function () { fontWeight: 'bold', textAlign: 'center', }, - }, t(this.props.localeMessages, 'signMessage')), + }, this.props.t('signMessage')), h('.error', { style: { margin: '10px', }, }, [ - t(this.props.localeMessages, 'signNotice'), + this.props.t('signNotice'), h('a', { href: 'https://medium.com/metamask/the-new-secure-way-to-sign-data-in-your-browser-6af9dd2a1527', style: { color: 'rgb(247, 134, 28)' }, @@ -46,7 +46,7 @@ PendingMsg.prototype.render = function () { const url = 'https://medium.com/metamask/the-new-secure-way-to-sign-data-in-your-browser-6af9dd2a1527' global.platform.openWindow({ url }) }, - }, t(this.props.localeMessages, 'readMore')), + }, this.props.t('readMore')), ]), // message details @@ -56,10 +56,10 @@ PendingMsg.prototype.render = function () { h('.flex-row.flex-space-around', [ h('button', { onClick: state.cancelMessage, - }, t(this.props.localeMessages, 'cancel')), + }, this.props.t('cancel')), h('button', { onClick: state.signMessage, - }, t(this.props.localeMessages, 'sign')), + }, this.props.t('sign')), ]), ]) diff --git a/ui/app/components/pending-tx/confirm-deploy-contract.js b/ui/app/components/pending-tx/confirm-deploy-contract.js index 8e04fb84d..6b912af7f 100644 --- a/ui/app/components/pending-tx/confirm-deploy-contract.js +++ b/ui/app/components/pending-tx/confirm-deploy-contract.js @@ -8,7 +8,6 @@ const ethUtil = require('ethereumjs-util') const BN = ethUtil.BN const hexToBn = require('../../../../app/scripts/lib/hex-to-bn') const { conversionUtil } = require('../../conversion-util') -const t = require('../../../i18n-helper').getMessage const SenderToRecipient = require('../sender-to-recipient') const { MIN_GAS_PRICE_HEX } = require('../send/send-constants') @@ -177,7 +176,7 @@ class ConfirmDeployContract extends Component { return ( h('section.flex-row.flex-center.confirm-screen-row', [ - h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'gasFee') ]), + h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('gasFee') ]), h('div.confirm-screen-section-column', [ h('div.confirm-screen-row-info', `${fiatGas} ${currentCurrency.toUpperCase()}`), @@ -216,8 +215,8 @@ class ConfirmDeployContract extends Component { return ( h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [ h('div.confirm-screen-section-column', [ - h('span.confirm-screen-label', [ t(this.props.localeMessages, 'total') + ' ' ]), - h('div.confirm-screen-total-box__subtitle', [ t(this.props.localeMessages, 'amountPlusGas') ]), + h('span.confirm-screen-label', [ this.props.t('total') + ' ' ]), + h('div.confirm-screen-total-box__subtitle', [ this.props.t('amountPlusGas') ]), ]), h('div.confirm-screen-section-column', [ @@ -246,9 +245,9 @@ class ConfirmDeployContract extends Component { h('.page-container__header', [ h('.page-container__back-button', { onClick: () => backToAccountDetail(selectedAddress), - }, t(this.props.localeMessages, 'back')), - h('.page-container__title', t(this.props.localeMessages, 'confirmContract')), - h('.page-container__subtitle', t(this.props.localeMessages, 'pleaseReviewTransaction')), + }, this.props.t('back')), + h('.page-container__title', this.props.t('confirmContract')), + h('.page-container__subtitle', this.props.t('pleaseReviewTransaction')), ]), // Main Send token Card h('.page-container__content', [ @@ -271,7 +270,7 @@ class ConfirmDeployContract extends Component { h('div.confirm-screen-rows', [ h('section.flex-row.flex-center.confirm-screen-row', [ - h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'from') ]), + h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('from') ]), h('div.confirm-screen-section-column', [ h('div.confirm-screen-row-info', fromName), h('div.confirm-screen-row-detail', `...${fromAddress.slice(fromAddress.length - 4)}`), @@ -279,9 +278,9 @@ class ConfirmDeployContract extends Component { ]), h('section.flex-row.flex-center.confirm-screen-row', [ - h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'to') ]), + h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('to') ]), h('div.confirm-screen-section-column', [ - h('div.confirm-screen-row-info', t(this.props.localeMessages, 'newContract')), + h('div.confirm-screen-row-info', this.props.t('newContract')), ]), ]), @@ -299,12 +298,12 @@ class ConfirmDeployContract extends Component { // Cancel Button h('button.btn-cancel.page-container__footer-button.allcaps', { onClick: event => this.cancel(event, txMeta), - }, t(this.props.localeMessages, 'cancel')), + }, this.props.t('cancel')), // Accept Button h('button.btn-confirm.page-container__footer-button.allcaps', { onClick: event => this.onSubmit(event), - }, t(this.props.localeMessages, 'confirm')), + }, this.props.t('confirm')), ]), ]), ]) @@ -344,7 +343,7 @@ const mapDispatchToProps = dispatch => { return { backToAccountDetail: address => dispatch(actions.backToAccountDetail(address)), cancelTransaction: ({ id }) => dispatch(actions.cancelTx({ id })), - displayWarning: warning => actions.displayWarning(t(this.props.localeMessages, warning)), + displayWarning: warning => actions.displayWarning(this.props.t(warning)), } } diff --git a/ui/app/components/pending-tx/confirm-send-ether.js b/ui/app/components/pending-tx/confirm-send-ether.js index 253b69b7a..02394b0c5 100644 --- a/ui/app/components/pending-tx/confirm-send-ether.js +++ b/ui/app/components/pending-tx/confirm-send-ether.js @@ -14,7 +14,6 @@ const { multiplyCurrencies, } = require('../../conversion-util') const GasFeeDisplay = require('../send/gas-fee-display-v2') -const t = require('../../../i18n-helper').getMessage const { MIN_GAS_PRICE_HEX } = require('../send/send-constants') @@ -196,7 +195,7 @@ ConfirmSendEther.prototype.getData = function () { }, to: { address: txParams.to, - name: identities[txParams.to] ? identities[txParams.to].name : t(this.props.localeMessages, 'newRecipient'), + name: identities[txParams.to] ? identities[txParams.to].name : this.props.t('newRecipient'), }, memo: txParams.memo || '', gasFeeInFIAT, @@ -311,7 +310,7 @@ ConfirmSendEther.prototype.render = function () { h('div.confirm-screen-rows', [ h('section.flex-row.flex-center.confirm-screen-row', [ - h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'from') ]), + h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('from') ]), h('div.confirm-screen-section-column', [ h('div.confirm-screen-row-info', fromName), h('div.confirm-screen-row-detail', `...${fromAddress.slice(fromAddress.length - 4)}`), @@ -319,7 +318,7 @@ ConfirmSendEther.prototype.render = function () { ]), h('section.flex-row.flex-center.confirm-screen-row', [ - h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'to') ]), + h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('to') ]), h('div.confirm-screen-section-column', [ h('div.confirm-screen-row-info', toName), h('div.confirm-screen-row-detail', `...${toAddress.slice(toAddress.length - 4)}`), @@ -327,7 +326,7 @@ ConfirmSendEther.prototype.render = function () { ]), h('section.flex-row.flex-center.confirm-screen-row', [ - h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'gasFee') ]), + h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('gasFee') ]), h('div.confirm-screen-section-column', [ h(GasFeeDisplay, { gasTotal: gasTotal || gasFeeInHex, @@ -340,8 +339,8 @@ ConfirmSendEther.prototype.render = function () { h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [ h('div.confirm-screen-section-column', [ - h('span.confirm-screen-label', [ t(this.props.localeMessages, 'total') + ' ' ]), - h('div.confirm-screen-total-box__subtitle', [ t(this.props.localeMessages, 'amountPlusGas') ]), + h('span.confirm-screen-label', [ this.props.t('total') + ' ' ]), + h('div.confirm-screen-total-box__subtitle', [ this.props.t('amountPlusGas') ]), ]), h('div.confirm-screen-section-column', [ @@ -442,10 +441,10 @@ ConfirmSendEther.prototype.render = function () { clearSend() this.cancel(event, txMeta) }, - }, t(this.props.localeMessages, 'cancel')), + }, this.props.t('cancel')), // Accept Button - h('button.btn-confirm.page-container__footer-button.allcaps', [t(this.props.localeMessages, 'confirm')]), + h('button.btn-confirm.page-container__footer-button.allcaps', [this.props.t('confirm')]), ]), ]), ]), @@ -462,7 +461,7 @@ ConfirmSendEther.prototype.onSubmit = function (event) { if (valid && this.verifyGasParams()) { this.props.sendTransaction(txMeta, event) } else { - this.props.dispatch(actions.displayWarning(t(this.props.localeMessages, 'invalidGasParams'))) + this.props.dispatch(actions.displayWarning(this.props.t('invalidGasParams'))) this.setState({ submitting: false }) } } diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js index 54963ae9a..d53f8b32f 100644 --- a/ui/app/components/pending-tx/confirm-send-token.js +++ b/ui/app/components/pending-tx/confirm-send-token.js @@ -6,7 +6,6 @@ const tokenAbi = require('human-standard-token-abi') const abiDecoder = require('abi-decoder') abiDecoder.addABI(tokenAbi) const actions = require('../../actions') -const t = require('../../../i18n-helper').getMessage const clone = require('clone') const Identicon = require('../identicon') const GasFeeDisplay = require('../send/gas-fee-display-v2.js') @@ -22,7 +21,7 @@ const { } = require('../../token-util') const { MIN_GAS_PRICE_HEX } = require('../send/send-constants') - +// const { getTokenExchangeRate, getSelectedAddress, @@ -168,7 +167,7 @@ ConfirmSendToken.prototype.getAmount = function () { ? +(sendTokenAmount * tokenExchangeRate * conversionRate).toFixed(2) : null, token: typeof value === 'undefined' - ? t(this.props.localeMessages, 'unknown') + ? this.props.t('unknown') : +sendTokenAmount.toFixed(decimals), } @@ -240,7 +239,7 @@ ConfirmSendToken.prototype.getData = function () { }, to: { address: value, - name: identities[value] ? identities[value].name : t(this.props.localeMessages, 'newRecipient'), + name: identities[value] ? identities[value].name : this.props.t('newRecipient'), }, memo: txParams.memo || '', } @@ -286,7 +285,7 @@ ConfirmSendToken.prototype.renderGasFee = function () { return ( h('section.flex-row.flex-center.confirm-screen-row', [ - h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'gasFee') ]), + h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('gasFee') ]), h('div.confirm-screen-section-column', [ h(GasFeeDisplay, { gasTotal: gasTotal || gasFeeInHex, @@ -308,8 +307,8 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () { ? ( h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [ h('div.confirm-screen-section-column', [ - h('span.confirm-screen-label', [ t(this.props.localeMessages, 'total') + ' ' ]), - h('div.confirm-screen-total-box__subtitle', [ t(this.props.localeMessages, 'amountPlusGas') ]), + h('span.confirm-screen-label', [ this.props.t('total') + ' ' ]), + h('div.confirm-screen-total-box__subtitle', [ this.props.t('amountPlusGas') ]), ]), h('div.confirm-screen-section-column', [ @@ -321,8 +320,8 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () { : ( h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [ h('div.confirm-screen-section-column', [ - h('span.confirm-screen-label', [ t(this.props.localeMessages, 'total') + ' ' ]), - h('div.confirm-screen-total-box__subtitle', [ t(this.props.localeMessages, 'amountPlusGas') ]), + h('span.confirm-screen-label', [ this.props.t('total') + ' ' ]), + h('div.confirm-screen-total-box__subtitle', [ this.props.t('amountPlusGas') ]), ]), h('div.confirm-screen-section-column', [ @@ -350,10 +349,10 @@ ConfirmSendToken.prototype.render = function () { this.inputs = [] const isTxReprice = Boolean(txMeta.lastGasPrice) - const title = isTxReprice ? t(this.props.localeMessages, 'reprice:title') : t(this.props.localeMessages, 'confirm') + const title = isTxReprice ? this.props.t('reprice:title') : this.props.t('confirm') const subtitle = isTxReprice - ? t(this.props.localeMessages, 'reprice:subtitle') - : t(this.props.localeMessages, 'pleaseReviewTransaction') + ? this.props.t('reprice:subtitle') + : this.props.t('pleaseReviewTransaction') return ( h('div.confirm-screen-container.confirm-send-token', [ @@ -362,7 +361,7 @@ ConfirmSendToken.prototype.render = function () { h('div.page-container__header', [ !txMeta.lastGasPrice && h('button.confirm-screen-back-button', { onClick: () => editTransaction(txMeta), - }, t(this.props.localeMessages, 'edit')), + }, this.props.t('edit')), h('div.page-container__title', title), h('div.page-container__subtitle', subtitle), ]), @@ -406,7 +405,7 @@ ConfirmSendToken.prototype.render = function () { h('div.confirm-screen-rows', [ h('section.flex-row.flex-center.confirm-screen-row', [ - h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'from') ]), + h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('from') ]), h('div.confirm-screen-section-column', [ h('div.confirm-screen-row-info', fromName), h('div.confirm-screen-row-detail', `...${fromAddress.slice(fromAddress.length - 4)}`), @@ -414,7 +413,7 @@ ConfirmSendToken.prototype.render = function () { ]), toAddress && h('section.flex-row.flex-center.confirm-screen-row', [ - h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'to') ]), + h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('to') ]), h('div.confirm-screen-section-column', [ h('div.confirm-screen-row-info', toName), h('div.confirm-screen-row-detail', `...${toAddress.slice(toAddress.length - 4)}`), @@ -436,10 +435,10 @@ ConfirmSendToken.prototype.render = function () { // Cancel Button h('button.btn-cancel.page-container__footer-button.allcaps', { onClick: (event) => this.cancel(event, txMeta), - }, t(this.props.localeMessages, 'cancel')), + }, this.props.t('cancel')), // Accept Button - h('button.btn-confirm.page-container__footer-button.allcaps', [t(this.props.localeMessages, 'confirm')]), + h('button.btn-confirm.page-container__footer-button.allcaps', [this.props.t('confirm')]), ]), ]), ]), @@ -456,7 +455,7 @@ ConfirmSendToken.prototype.onSubmit = function (event) { if (valid && this.verifyGasParams()) { this.props.sendTransaction(txMeta, event) } else { - this.props.dispatch(actions.displayWarning(t(this.props.localeMessages, 'invalidGasParams'))) + this.props.dispatch(actions.displayWarning(this.props.t('invalidGasParams'))) this.setState({ submitting: false }) } } diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js index 819fee0a0..a0aaada4d 100644 --- a/ui/app/components/send/currency-display.js +++ b/ui/app/components/send/currency-display.js @@ -10,7 +10,7 @@ inherits(CurrencyDisplay, Component) function CurrencyDisplay () { Component.call(this) } - +// function toHexWei (value) { return conversionUtil(value, { fromNumericBase: 'dec', diff --git a/ui/app/components/send/gas-fee-display-v2.js b/ui/app/components/send/gas-fee-display-v2.js index 04a43df2f..76ed1b5d4 100644 --- a/ui/app/components/send/gas-fee-display-v2.js +++ b/ui/app/components/send/gas-fee-display-v2.js @@ -2,9 +2,9 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits const CurrencyDisplay = require('./currency-display') -const t = require('../../../i18n-helper').getMessage +const connect = require('../../metamask-connect') -module.exports = GasFeeDisplay +module.exports = connect()(GasFeeDisplay) inherits(GasFeeDisplay, Component) function GasFeeDisplay () { @@ -33,8 +33,8 @@ GasFeeDisplay.prototype.render = function () { readOnly: true, }) : gasLoadingError - ? h('div.currency-display.currency-display--message', t(this.props.localeMessages, 'setGasPrice')) - : h('div.currency-display', t(this.props.localeMessages, 'loading')), + ? h('div.currency-display.currency-display--message', this.props.t('setGasPrice')) + : h('div.currency-display', this.props.t('loading')), h('button.sliders-icon-container', { onClick, diff --git a/ui/app/components/send/gas-tooltip.js b/ui/app/components/send/gas-tooltip.js index 7bdb164c7..607394c8b 100644 --- a/ui/app/components/send/gas-tooltip.js +++ b/ui/app/components/send/gas-tooltip.js @@ -2,9 +2,9 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits const InputNumber = require('../input-number.js') -const t = require('../../../i18n-helper').getMessage +const connect = require('../../metamask-connect') -module.exports = GasTooltip +module.exports = connect()(GasTooltip) inherits(GasTooltip, Component) function GasTooltip () { @@ -82,7 +82,7 @@ GasTooltip.prototype.render = function () { 'marginTop': '81px', }, }, [ - h('span.gas-tooltip-label', {}, [t(this.props.localeMessages, 'gasLimit')]), + h('span.gas-tooltip-label', {}, [this.props.t('gasLimit')]), h('i.fa.fa-info-circle'), ]), h(InputNumber, { diff --git a/ui/app/components/send/send-v2-container.js b/ui/app/components/send/send-v2-container.js index 25902cfce..d90a6bf75 100644 --- a/ui/app/components/send/send-v2-container.js +++ b/ui/app/components/send/send-v2-container.js @@ -53,6 +53,7 @@ function mapStateToProps (state) { tokenContract: getSelectedTokenContract(state), unapprovedTxs: state.metamask.unapprovedTxs, network: state.metamask.network, + t: t.bind(null, state.localeMessages), } } diff --git a/ui/app/components/send/to-autocomplete.js b/ui/app/components/send/to-autocomplete.js index ca034d855..4c54701cb 100644 --- a/ui/app/components/send/to-autocomplete.js +++ b/ui/app/components/send/to-autocomplete.js @@ -2,9 +2,9 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits const AccountListItem = require('./account-list-item') -const t = require('../../../i18n-helper').getMessage +const connect = require('../../metamask-connect') -module.exports = ToAutoComplete +module.exports = connect()(ToAutoComplete) inherits(ToAutoComplete, Component) function ToAutoComplete () { @@ -93,7 +93,7 @@ ToAutoComplete.prototype.render = function () { return h('div.send-v2__to-autocomplete', {}, [ h('input.send-v2__to-autocomplete__input', { - placeholder: t(this.props.localeMessages, 'recipientAddress'), + placeholder: this.props.t('recipientAddress'), className: inError ? `send-v2__error-border` : '', value: to, onChange: event => onChange(event.target.value), diff --git a/ui/app/components/sender-to-recipient.js b/ui/app/components/sender-to-recipient.js index 02b6d96ea..dc72dc303 100644 --- a/ui/app/components/sender-to-recipient.js +++ b/ui/app/components/sender-to-recipient.js @@ -2,7 +2,6 @@ const { Component } = require('react') const h = require('react-hyperscript') const connect = require('../metamask-connect') const PropTypes = require('prop-types') -const t = require('../../i18n-helper').getMessage const Identicon = require('./identicon') class SenderToRecipient extends Component { @@ -31,7 +30,7 @@ class SenderToRecipient extends Component { ]), h('.sender-to-recipient__recipient', [ h('i.fa.fa-file-text-o'), - h('.sender-to-recipient__name.sender-to-recipient__recipient-name', t(this.props.localeMessages, 'newContract')), + h('.sender-to-recipient__name.sender-to-recipient__recipient-name', this.props.t('newContract')), ]), ]) ) diff --git a/ui/app/components/shapeshift-form.js b/ui/app/components/shapeshift-form.js index f915135f6..31af74b36 100644 --- a/ui/app/components/shapeshift-form.js +++ b/ui/app/components/shapeshift-form.js @@ -7,7 +7,6 @@ const { qrcode } = require('qrcode-npm') const { shapeShiftSubview, pairUpdate, buyWithShapeShift } = require('../actions') const { isValidAddress } = require('../util') const SimpleDropdown = require('./dropdowns/simple-dropdown') -const t = require('../../i18n-helper').getMessage function mapStateToProps (state) { const { @@ -94,7 +93,7 @@ ShapeshiftForm.prototype.onBuyWithShapeShift = function () { })) .catch(() => this.setState({ showQrCode: false, - errorMessage: t(this.props.localeMessages, 'invalidRequest'), + errorMessage: this.props.t('invalidRequest'), isLoading: false, })) } @@ -126,10 +125,10 @@ ShapeshiftForm.prototype.renderMarketInfo = function () { return h('div.shapeshift-form__metadata', {}, [ - this.renderMetadata(t(this.props.localeMessages, 'status'), limit ? t(this.props.localeMessages, 'available') : t(this.props.localeMessages, 'unavailable')), - this.renderMetadata(t(this.props.localeMessages, 'limit'), limit), - this.renderMetadata(t(this.props.localeMessages, 'exchangeRate'), rate), - this.renderMetadata(t(this.props.localeMessages, 'min'), minimum), + this.renderMetadata(this.props.t('status'), limit ? this.props.t('available') : this.props.t('unavailable')), + this.renderMetadata(this.props.t('limit'), limit), + this.renderMetadata(this.props.t('exchangeRate'), rate), + this.renderMetadata(this.props.t('min'), minimum), ]) } @@ -143,7 +142,7 @@ ShapeshiftForm.prototype.renderQrCode = function () { return h('div.shapeshift-form', {}, [ h('div.shapeshift-form__deposit-instruction', [ - t(this.props.localeMessages, 'depositCoin', [depositCoin.toUpperCase()]), + this.props.t('depositCoin', [depositCoin.toUpperCase()]), ]), h('div', depositAddress), @@ -180,7 +179,7 @@ ShapeshiftForm.prototype.render = function () { h('div.shapeshift-form__selector', [ - h('div.shapeshift-form__selector-label', t(this.props.localeMessages, 'deposit')), + h('div.shapeshift-form__selector-label', this.props.t('deposit')), h(SimpleDropdown, { selectedOption: this.state.depositCoin, @@ -200,7 +199,7 @@ ShapeshiftForm.prototype.render = function () { h('div.shapeshift-form__selector', [ h('div.shapeshift-form__selector-label', [ - t(this.props.localeMessages, 'receive'), + this.props.t('receive'), ]), h('div.shapeshift-form__selector-input', ['ETH']), @@ -218,7 +217,7 @@ ShapeshiftForm.prototype.render = function () { }, [ h('div.shapeshift-form__address-input-label', [ - t(this.props.localeMessages, 'refundAddress'), + this.props.t('refundAddress'), ]), h('input.shapeshift-form__address-input', { @@ -240,7 +239,7 @@ ShapeshiftForm.prototype.render = function () { className: btnClass, disabled: !token, onClick: () => this.onBuyWithShapeShift(), - }, [t(this.props.localeMessages, 'buy')]), + }, [this.props.t('buy')]), ]) } diff --git a/ui/app/components/shift-list-item.js b/ui/app/components/shift-list-item.js index cc401bc34..d810eddc9 100644 --- a/ui/app/components/shift-list-item.js +++ b/ui/app/components/shift-list-item.js @@ -6,7 +6,6 @@ const vreme = new (require('vreme'))() const explorerLink = require('etherscan-link').createExplorerLink const actions = require('../actions') const addressSummary = require('../util').addressSummary -const t = require('../../i18n-helper').getMessage const CopyButton = require('./copyButton') const EthBalance = require('./eth-balance') @@ -76,7 +75,7 @@ ShiftListItem.prototype.renderUtilComponents = function () { value: this.props.depositAddress, }), h(Tooltip, { - title: t(this.props.localeMessages, 'qrCode'), + title: this.props.t('qrCode'), }, [ h('i.fa.fa-qrcode.pointer.pop-hover', { onClick: () => props.dispatch(actions.reshowQrCode(props.depositAddress, props.depositType)), @@ -136,8 +135,8 @@ ShiftListItem.prototype.renderInfo = function () { color: '#ABA9AA', width: '100%', }, - }, t(this.props.localeMessages, 'toETHviaShapeShift', [props.depositType])), - h('div', t(this.props.localeMessages, 'noDeposits')), + }, this.props.t('toETHviaShapeShift', [props.depositType])), + h('div', this.props.t('noDeposits')), h('div', { style: { fontSize: 'x-small', @@ -159,8 +158,8 @@ ShiftListItem.prototype.renderInfo = function () { color: '#ABA9AA', width: '100%', }, - }, t(this.props.localeMessages, 'toETHviaShapeShift', [props.depositType])), - h('div', t(this.props.localeMessages, 'conversionProgress')), + }, this.props.t('toETHviaShapeShift', [props.depositType])), + h('div', this.props.t('conversionProgress')), h('div', { style: { fontSize: 'x-small', @@ -185,7 +184,7 @@ ShiftListItem.prototype.renderInfo = function () { color: '#ABA9AA', width: '100%', }, - }, t(this.props.localeMessages, 'fromShapeShift')), + }, this.props.t('fromShapeShift')), h('div', formatDate(props.time)), h('div', { style: { @@ -197,7 +196,7 @@ ShiftListItem.prototype.renderInfo = function () { ]) case 'failed': - return h('span.error', '(' + t(this.props.localeMessages, 'failed') + ')') + return h('span.error', '(' + this.props.t('failed') + ')') default: return '' } diff --git a/ui/app/components/signature-request.js b/ui/app/components/signature-request.js index 7f4493b66..a1ed049f7 100644 --- a/ui/app/components/signature-request.js +++ b/ui/app/components/signature-request.js @@ -9,7 +9,6 @@ const classnames = require('classnames') const AccountDropdownMini = require('./dropdowns/account-dropdown-mini') const actions = require('../actions') -const t = require('../../i18n-helper').getMessage const { conversionUtil } = require('../conversion-util') const { @@ -55,7 +54,7 @@ SignatureRequest.prototype.renderHeader = function () { h('div.request-signature__header-background'), - h('div.request-signature__header__text', t(this.props.localeMessages, 'sigRequest')), + h('div.request-signature__header__text', this.props.t('sigRequest')), h('div.request-signature__header__tip-container', [ h('div.request-signature__header__tip'), @@ -76,7 +75,7 @@ SignatureRequest.prototype.renderAccountDropdown = function () { return h('div.request-signature__account', [ - h('div.request-signature__account-text', [t(this.props.localeMessages, 'account') + ':']), + h('div.request-signature__account-text', [this.props.t('account') + ':']), h(AccountDropdownMini, { selectedAccount, @@ -103,7 +102,7 @@ SignatureRequest.prototype.renderBalance = function () { return h('div.request-signature__balance', [ - h('div.request-signature__balance-text', [t(this.props.localeMessages, 'balance')]), + h('div.request-signature__balance-text', [this.props.t('balance')]), h('div.request-signature__balance-value', `${balanceInEther} ETH`), @@ -137,7 +136,7 @@ SignatureRequest.prototype.renderRequestInfo = function () { return h('div.request-signature__request-info', [ h('div.request-signature__headline', [ - t(this.props.localeMessages, 'yourSigRequested'), + this.props.t('yourSigRequested'), ]), ]) @@ -155,18 +154,18 @@ SignatureRequest.prototype.msgHexToText = function (hex) { SignatureRequest.prototype.renderBody = function () { let rows - let notice = t(this.props.localeMessages, 'youSign') + ':' + let notice = this.props.t('youSign') + ':' const { txData } = this.props const { type, msgParams: { data } } = txData if (type === 'personal_sign') { - rows = [{ name: t(this.props.localeMessages, 'message'), value: this.msgHexToText(data) }] + rows = [{ name: this.props.t('message'), value: this.msgHexToText(data) }] } else if (type === 'eth_signTypedData') { rows = data } else if (type === 'eth_sign') { - rows = [{ name: t(this.props.localeMessages, 'message'), value: data }] - notice = t(this.props.localeMessages, 'signNotice') + rows = [{ name: this.props.t('message'), value: data }] + notice = this.props.t('signNotice') } return h('div.request-signature__body', {}, [ @@ -225,10 +224,10 @@ SignatureRequest.prototype.renderFooter = function () { return h('div.request-signature__footer', [ h('button.request-signature__footer__cancel-button', { onClick: cancel, - }, t(this.props.localeMessages, 'cancel')), + }, this.props.t('cancel')), h('button.request-signature__footer__sign-button', { onClick: sign, - }, t(this.props.localeMessages, 'sign')), + }, this.props.t('sign')), ]) } diff --git a/ui/app/components/token-list.js b/ui/app/components/token-list.js index 439619158..ae22f3702 100644 --- a/ui/app/components/token-list.js +++ b/ui/app/components/token-list.js @@ -5,7 +5,6 @@ const TokenTracker = require('eth-token-tracker') const TokenCell = require('./token-cell.js') const connect = require('../metamask-connect') const selectors = require('../selectors') -const t = require('../../i18n-helper').getMessage function mapStateToProps (state) { return { @@ -43,7 +42,7 @@ TokenList.prototype.render = function () { const { tokens, isLoading, error } = state if (isLoading) { - return this.message(t(this.props.localeMessages, 'loadingTokens')) + return this.message(this.props.t('loadingTokens')) } if (error) { @@ -53,7 +52,7 @@ TokenList.prototype.render = function () { padding: '80px', }, }, [ - t(this.props.localeMessages, 'troubleTokenBalances'), + this.props.t('troubleTokenBalances'), h('span.hotFix', { style: { color: 'rgba(247, 134, 28, 1)', @@ -64,7 +63,7 @@ TokenList.prototype.render = function () { url: `https://ethplorer.io/address/${userAddress}`, }) }, - }, t(this.props.localeMessages, 'here')), + }, this.props.t('here')), ]) } diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index 3819de195..5e88d38d3 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -14,7 +14,6 @@ const { conversionUtil, multiplyCurrencies } = require('../conversion-util') const { calcTokenAmount } = require('../token-util') const { getCurrentCurrency } = require('../selectors') -const t = require('../../i18n-helper').getMessage module.exports = connect(mapStateToProps, mapDispatchToProps)(TxListItem) @@ -75,7 +74,7 @@ TxListItem.prototype.getAddressText = function () { default: return address ? `${address.slice(0, 10)}...${address.slice(-4)}` - : t(this.props.localeMessages, 'contractDeployment') + : this.props.t('contractDeployment') } } @@ -307,21 +306,21 @@ TxListItem.prototype.txStatusIndicator = function () { let name if (transactionStatus === 'unapproved') { - name = t('unapproved') + name = this.props.t('unapproved') } else if (transactionStatus === 'rejected') { - name = t('rejected') + name = this.props.t('rejected') } else if (transactionStatus === 'approved') { - name = t('approved') + name = this.props.t('approved') } else if (transactionStatus === 'signed') { - name = t('signed') + name = this.props.t('signed') } else if (transactionStatus === 'submitted') { - name = t('submitted') + name = this.props.t('submitted') } else if (transactionStatus === 'confirmed') { - name = t('confirmed') + name = this.props.t('confirmed') } else if (transactionStatus === 'failed') { - name = t('failed') + name = this.props.t('failed') } else if (transactionStatus === 'dropped') { - name = t('dropped') + name = this.props.t('dropped') } return name } diff --git a/ui/app/components/tx-list.js b/ui/app/components/tx-list.js index d8c882ae2..7c2da30fe 100644 --- a/ui/app/components/tx-list.js +++ b/ui/app/components/tx-list.js @@ -10,7 +10,6 @@ const { formatDate } = require('../util') const { showConfTxPage } = require('../actions') const classnames = require('classnames') const { tokenInfoGetter } = require('../token-util') -const t = require('../../i18n-helper').getMessage module.exports = connect(mapStateToProps, mapDispatchToProps)(TxList) @@ -40,7 +39,7 @@ TxList.prototype.render = function () { return h('div.flex-column', [ h('div.flex-row.tx-list-header-wrapper', [ h('div.flex-row.tx-list-header', [ - h('div', t('transactions')), + h('div', this.props.t('transactions')), ]), ]), h('div.flex-column.tx-list-container', {}, [ @@ -57,7 +56,7 @@ TxList.prototype.renderTransaction = function () { : [h( 'div.tx-list-item.tx-list-item--empty', { key: 'tx-list-none' }, - [ t(this.props.localeMessages, 'noTransactions') ], + [ this.props.t('noTransactions') ], )] } @@ -111,7 +110,7 @@ TxList.prototype.renderTransactionListItem = function (transaction, conversionRa if (isUnapproved) { opts.onClick = () => showConfTxPage({ id: transactionId }) - opts.transactionStatus = t(this.props.localeMessages, 'Not Started') + opts.transactionStatus = this.props.t('Not Started') } else if (transactionHash) { opts.onClick = () => this.view(transactionHash, transactionNetworkId) } diff --git a/ui/app/components/tx-view.js b/ui/app/components/tx-view.js index f7ca9cc97..81aee4308 100644 --- a/ui/app/components/tx-view.js +++ b/ui/app/components/tx-view.js @@ -5,7 +5,6 @@ const ethUtil = require('ethereumjs-util') const inherits = require('util').inherits const actions = require('../actions') const selectors = require('../selectors') -const t = require('../../i18n-helper').getMessage const BalanceComponent = require('./balance-component') const TxList = require('./tx-list') @@ -73,21 +72,21 @@ TxView.prototype.renderButtons = function () { onClick: () => showModal({ name: 'DEPOSIT_ETHER', }), - }, t(this.props.localeMessages, 'deposit')), + }, this.props.t('deposit')), h('button.btn-clear.hero-balance-button.allcaps', { style: { marginLeft: '0.8em', }, onClick: showSendPage, - }, t(this.props.localeMessages, 'send')), + }, this.props.t('send')), ]) ) : ( h('div.flex-row.flex-center.hero-balance-buttons', [ h('button.btn-clear.hero-balance-button', { onClick: showSendTokenPage, - }, t(this.props.localeMessages, 'send')), + }, this.props.t('send')), ]) ) } diff --git a/ui/app/components/wallet-view.js b/ui/app/components/wallet-view.js index 54770e436..c42fedf9a 100644 --- a/ui/app/components/wallet-view.js +++ b/ui/app/components/wallet-view.js @@ -11,7 +11,6 @@ const actions = require('../actions') const BalanceComponent = require('./balance-component') const TokenList = require('./token-list') const selectors = require('../selectors') -const t = require('../../i18n-helper').getMessage module.exports = connect(mapStateToProps, mapDispatchToProps)(WalletView) @@ -117,7 +116,7 @@ WalletView.prototype.render = function () { onClick: hideSidebar, }), - h('div.wallet-view__keyring-label.allcaps', isLoose ? t(this.props.localeMessages, 'imported') : ''), + h('div.wallet-view__keyring-label.allcaps', isLoose ? this.props.t('imported') : ''), h('div.flex-column.flex-center.wallet-view__name-container', { style: { margin: '0 auto' }, @@ -134,13 +133,13 @@ WalletView.prototype.render = function () { selectedIdentity.name, ]), - h('button.btn-clear.wallet-view__details-button.allcaps', t(this.props.localeMessages, 'details')), + h('button.btn-clear.wallet-view__details-button.allcaps', this.props.t('details')), ]), ]), h(Tooltip, { position: 'bottom', - title: this.state.hasCopied ? t(this.props.localeMessages, 'copiedExclamation') : t(this.props.localeMessages, 'copyToClipboard'), + title: this.state.hasCopied ? this.props.t('copiedExclamation') : this.props.t('copyToClipboard'), wrapperClassName: 'wallet-view__tooltip', }, [ h('button.wallet-view__address', { @@ -173,7 +172,7 @@ WalletView.prototype.render = function () { showAddTokenPage() hideSidebar() }, - }, t(this.props.localeMessages, 'addToken')), + }, this.props.t('addToken')), ]) } diff --git a/ui/app/first-time/init-menu.js b/ui/app/first-time/init-menu.js index 797718498..c0c2d3ed0 100644 --- a/ui/app/first-time/init-menu.js +++ b/ui/app/first-time/init-menu.js @@ -6,7 +6,6 @@ const h = require('react-hyperscript') const Mascot = require('../components/mascot') const actions = require('../actions') const Tooltip = require('../components/tooltip') -const t = require('../../i18n-helper').getMessage const getCaretCoordinates = require('textarea-caret') const environmentType = require('../../../app/scripts/lib/environment-type') const { OLD_UI_NETWORK_TYPE } = require('../../../app/scripts/config').enums @@ -60,7 +59,7 @@ InitializeMenuScreen.prototype.renderMenu = function (state) { color: '#7F8082', marginBottom: 10, }, - }, t(this.props.localeMessages, 'appName')), + }, this.props.t('appName')), h('div', [ @@ -70,10 +69,10 @@ InitializeMenuScreen.prototype.renderMenu = function (state) { color: '#7F8082', display: 'inline', }, - }, t(this.props.localeMessages, 'encryptNewDen')), + }, this.props.t('encryptNewDen')), h(Tooltip, { - title: t(this.props.localeMessages, 'denExplainer'), + title: this.props.t('denExplainer'), }, [ h('i.fa.fa-question-circle.pointer', { style: { @@ -93,7 +92,7 @@ InitializeMenuScreen.prototype.renderMenu = function (state) { h('input.large-input.letter-spacey', { type: 'password', id: 'password-box', - placeholder: t(this.props.localeMessages, 'newPassword'), + placeholder: this.props.t('newPassword'), onInput: this.inputChanged.bind(this), style: { width: 260, @@ -105,7 +104,7 @@ InitializeMenuScreen.prototype.renderMenu = function (state) { h('input.large-input.letter-spacey', { type: 'password', id: 'password-box-confirm', - placeholder: t(this.props.localeMessages, 'confirmPassword'), + placeholder: this.props.t('confirmPassword'), onKeyPress: this.createVaultOnEnter.bind(this), onInput: this.inputChanged.bind(this), style: { @@ -120,7 +119,7 @@ InitializeMenuScreen.prototype.renderMenu = function (state) { style: { margin: 12, }, - }, t(this.props.localeMessages, 'createDen')), + }, this.props.t('createDen')), h('.flex-row.flex-center.flex-grow', [ h('p.pointer', { @@ -130,7 +129,7 @@ InitializeMenuScreen.prototype.renderMenu = function (state) { color: 'rgb(247, 134, 28)', textDecoration: 'underline', }, - }, t(this.props.localeMessages, 'importDen')), + }, this.props.t('importDen')), ]), h('.flex-row.flex-center.flex-grow', [ @@ -179,12 +178,12 @@ InitializeMenuScreen.prototype.createNewVaultAndKeychain = function () { var passwordConfirm = passwordConfirmBox.value if (password.length < 8) { - this.warning = t(this.props.localeMessages, 'passwordShort') + this.warning = this.props.t('passwordShort') this.props.dispatch(actions.displayWarning(this.warning)) return } if (password !== passwordConfirm) { - this.warning = t(this.props.localeMessages, 'passwordMismatch') + this.warning = this.props.t('passwordMismatch') this.props.dispatch(actions.displayWarning(this.warning)) return } diff --git a/ui/app/keychains/hd/recover-seed/confirmation.js b/ui/app/keychains/hd/recover-seed/confirmation.js index 4a62c8803..f97ac66fe 100644 --- a/ui/app/keychains/hd/recover-seed/confirmation.js +++ b/ui/app/keychains/hd/recover-seed/confirmation.js @@ -4,7 +4,6 @@ const Component = require('react').Component const connect = require('../../../metamask-connect') const h = require('react-hyperscript') const actions = require('../../../actions') -const t = require('../../../../i18n') module.exports = connect(mapStateToProps)(RevealSeedConfirmation) @@ -50,13 +49,13 @@ RevealSeedConfirmation.prototype.render = function () { }, }, [ - h('h4', t('revealSeedWordsWarning')), + h('h4', this.props.t('revealSeedWordsWarning')), // confirmation h('input.large-input.letter-spacey', { type: 'password', id: 'password-box', - placeholder: t('enterPasswordConfirm'), + placeholder: this.props.t('enterPasswordConfirm'), onKeyPress: this.checkConfirmation.bind(this), style: { width: 260, @@ -92,7 +91,7 @@ RevealSeedConfirmation.prototype.render = function () { ), props.inProgress && ( - h('span.in-progress-notification', t('generatingSeed')) + h('span.in-progress-notification', this.props.t('generatingSeed')) ), ]), ]) diff --git a/ui/app/keychains/hd/restore-vault.js b/ui/app/keychains/hd/restore-vault.js index 164cf28dc..f47a2641a 100644 --- a/ui/app/keychains/hd/restore-vault.js +++ b/ui/app/keychains/hd/restore-vault.js @@ -2,7 +2,6 @@ const inherits = require('util').inherits const PersistentForm = require('../../../lib/persistent-form') const connect = require('../../metamask-connect') const h = require('react-hyperscript') -const t = require('../../../i18n') const actions = require('../../actions') module.exports = connect(mapStateToProps)(RestoreVaultScreen) @@ -37,23 +36,23 @@ RestoreVaultScreen.prototype.render = function () { padding: 6, }, }, [ - t('restoreVault'), + this.props.t('restoreVault'), ]), // wallet seed entry - h('h3', t('walletSeed')), + h('h3', this.props.t('walletSeed')), h('textarea.twelve-word-phrase.letter-spacey', { dataset: { persistentFormId: 'wallet-seed', }, - placeholder: t('secretPhrase'), + placeholder: this.props.t('secretPhrase'), }), // password h('input.large-input.letter-spacey', { type: 'password', id: 'password-box', - placeholder: t('newPassword8Chars'), + placeholder: this.props.t('newPassword8Chars'), dataset: { persistentFormId: 'password', }, @@ -67,7 +66,7 @@ RestoreVaultScreen.prototype.render = function () { h('input.large-input.letter-spacey', { type: 'password', id: 'password-box-confirm', - placeholder: t('confirmPassword'), + placeholder: this.props.t('confirmPassword'), onKeyPress: this.createOnEnter.bind(this), dataset: { persistentFormId: 'password-confirmation', @@ -97,7 +96,7 @@ RestoreVaultScreen.prototype.render = function () { style: { textTransform: 'uppercase', }, - }, t('cancel')), + }, this.props.t('cancel')), // submit h('button.primary', { @@ -105,7 +104,7 @@ RestoreVaultScreen.prototype.render = function () { style: { textTransform: 'uppercase', }, - }, t('ok')), + }, this.props.t('ok')), ]), ]) ) @@ -136,13 +135,13 @@ RestoreVaultScreen.prototype.createNewVaultAndRestore = function () { var passwordConfirmBox = document.getElementById('password-box-confirm') var passwordConfirm = passwordConfirmBox.value if (password.length < 8) { - this.warning = t('passwordNotLongEnough') + this.warning = this.props.t('passwordNotLongEnough') this.props.dispatch(actions.displayWarning(this.warning)) return } if (password !== passwordConfirm) { - this.warning = t('passwordsDontMatch') + this.warning = this.props.t('passwordsDontMatch') this.props.dispatch(actions.displayWarning(this.warning)) return } @@ -152,18 +151,18 @@ RestoreVaultScreen.prototype.createNewVaultAndRestore = function () { // true if the string has more than a space between words. if (seed.split(' ').length > 1) { - this.warning = t('spaceBetween') + this.warning = this.props.t('spaceBetween') this.props.dispatch(actions.displayWarning(this.warning)) return } // true if seed contains a character that is not between a-z or a space if (!seed.match(/^[a-z ]+$/)) { - this.warning = t('loweCaseWords') + this.warning = this.props.t('loweCaseWords') this.props.dispatch(actions.displayWarning(this.warning)) return } if (seed.split(' ').length !== 12) { - this.warning = t('seedPhraseReq') + this.warning = this.props.t('seedPhraseReq') this.props.dispatch(actions.displayWarning(this.warning)) return } diff --git a/ui/app/metamask-connect.js b/ui/app/metamask-connect.js index d13f8e87e..38fc05930 100644 --- a/ui/app/metamask-connect.js +++ b/ui/app/metamask-connect.js @@ -1,4 +1,5 @@ const connect = require('react-redux').connect +const t = require('../i18n-helper').getMessage const metamaskConnect = (mapStateToProps, mapDispatchToProps) => { return connect( @@ -12,7 +13,8 @@ const _higherOrderMapStateToProps = (mapStateToProps) => { const stateProps = mapStateToProps ? mapStateToProps(state, ownProps) : ownProps - stateProps.localeMessages = state.localeMessages || {} + console.log(`state.localeMessages`, state.localeMessages); + stateProps.t = t.bind(null, state.localeMessages) return stateProps } } diff --git a/ui/app/reducers/locale.js b/ui/app/reducers/locale.js index edfe9e865..bdd97acb4 100644 --- a/ui/app/reducers/locale.js +++ b/ui/app/reducers/locale.js @@ -8,7 +8,9 @@ function reduceMetamask (state, action) { switch (action.type) { case actions.SET_LOCALE_MESSAGES: - return action.value + return extend(localeMessagesState, { + current: action.value, + }) default: return localeMessagesState } diff --git a/ui/app/send-v2.js b/ui/app/send-v2.js index 31118378d..49947a11c 100644 --- a/ui/app/send-v2.js +++ b/ui/app/send-v2.js @@ -1,7 +1,6 @@ const { inherits } = require('util') const PersistentForm = require('../lib/persistent-form') const h = require('react-hyperscript') -const t = require('../i18n') const ethAbi = require('ethereumjs-abi') const ethUtil = require('ethereumjs-util') @@ -189,9 +188,9 @@ SendTransactionScreen.prototype.renderHeader = function () { return h('div.page-container__header', [ - h('div.page-container__title', selectedToken ? t('sendTokens') : t('sendETH')), + h('div.page-container__title', selectedToken ? this.props.t('sendTokens') : this.props.t('sendETH')), - h('div.page-container__subtitle', t('onlySendToEtherAddress')), + h('div.page-container__subtitle', this.props.t('onlySendToEtherAddress')), h('div.page-container__header-close', { onClick: () => { @@ -262,11 +261,11 @@ SendTransactionScreen.prototype.handleToChange = function (to) { let toError = null if (!to) { - toError = t('required') + toError = this.props.t('required') } else if (!isValidAddress(to)) { - toError = t('invalidAddressRecipient') + toError = this.props.t('invalidAddressRecipient') } else if (to === from) { - toError = t('fromToSame') + toError = this.props.t('fromToSame') } updateSendTo(to) @@ -282,9 +281,9 @@ SendTransactionScreen.prototype.renderToRow = function () { h('div.send-v2__form-label', [ - t('to'), + this.props.t('to'), - this.renderErrorMessage(t('to')), + this.renderErrorMessage(this.props.t('to')), ]), @@ -382,11 +381,11 @@ SendTransactionScreen.prototype.validateAmount = function (value) { ) if (conversionRate && !sufficientBalance) { - amountError = t('insufficientFunds') + amountError = this.props.t('insufficientFunds') } else if (verifyTokenBalance && !sufficientTokens) { - amountError = t('insufficientTokens') + amountError = this.props.t('insufficientTokens') } else if (amountLessThanZero) { - amountError = t('negativeETH') + amountError = this.props.t('negativeETH') } updateSendErrors({ amount: amountError }) @@ -416,7 +415,7 @@ SendTransactionScreen.prototype.renderAmountRow = function () { setMaxModeTo(true) this.setAmountToMax() }, - }, [ !maxModeOn ? t('max') : '' ]), + }, [ !maxModeOn ? this.props.t('max') : '' ]), ]), h('div.send-v2__form-field', [ @@ -514,11 +513,11 @@ SendTransactionScreen.prototype.renderFooter = function () { clearSend() goHome() }, - }, t('cancel')), + }, this.props.t('cancel')), h('button.btn-clear.page-container__footer-button', { disabled: !noErrors || !gasTotal || missingTokenBalance, onClick: event => this.onSubmit(event), - }, t('next')), + }, this.props.t('next')), ]) } diff --git a/ui/app/settings.js b/ui/app/settings.js index f75b1e8b4..d3525e9c0 100644 --- a/ui/app/settings.js +++ b/ui/app/settings.js @@ -10,7 +10,6 @@ const TabBar = require('./components/tab-bar') const SimpleDropdown = require('./components/dropdowns/simple-dropdown') const ToggleButton = require('react-toggle-button') const { OLD_UI_NETWORK_TYPE } = require('../../app/scripts/config').enums -const t = require('../i18n') const getInfuraCurrencyOptions = () => { const sortedCurrencies = infuraCurrencies.objects.sort((a, b) => { @@ -62,8 +61,8 @@ class Settings extends Component { return h('div.settings__tabs', [ h(TabBar, { tabs: [ - { content: t('settings'), key: 'settings' }, - { content: t('info'), key: 'info' }, + { content: this.props.t('settings'), key: 'settings' }, + { content: this.props.t('info'), key: 'info' }, ], defaultTab: activeTab, tabSelected: key => this.setState({ activeTab: key }), @@ -76,7 +75,7 @@ class Settings extends Component { return h('div.settings__content-row', [ h('div.settings__content-item', [ - h('span', t('blockiesIdenticon')), + h('span', this.props.t('blockiesIdenticon')), ]), h('div.settings__content-item', [ h('div.settings__content-item-col', [ @@ -96,13 +95,13 @@ class Settings extends Component { return h('div.settings__content-row', [ h('div.settings__content-item', [ - h('span', t('currentConversion')), + h('span', this.props.t('currentConversion')), h('span.settings__content-description', `Updated ${Date(conversionDate)}`), ]), h('div.settings__content-item', [ h('div.settings__content-item-col', [ h(SimpleDropdown, { - placeholder: t('selectCurrency'), + placeholder: this.props.t('selectCurrency'), options: getInfuraCurrencyOptions(), selectedOption: currentCurrency, onSelect: newCurrency => setCurrentCurrency(newCurrency), @@ -142,31 +141,31 @@ class Settings extends Component { switch (provider.type) { case 'mainnet': - title = t('currentNetwork') - value = t('mainnet') + title = this.props.t('currentNetwork') + value = this.props.t('mainnet') color = '#038789' break case 'ropsten': - title = t('currentNetwork') - value = t('ropsten') + title = this.props.t('currentNetwork') + value = this.props.t('ropsten') color = '#e91550' break case 'kovan': - title = t('currentNetwork') - value = t('kovan') + title = this.props.t('currentNetwork') + value = this.props.t('kovan') color = '#690496' break case 'rinkeby': - title = t('currentNetwork') - value = t('rinkeby') + title = this.props.t('currentNetwork') + value = this.props.t('rinkeby') color = '#ebb33f' break default: - title = t('currentRpc') + title = this.props.t('currentRpc') value = provider.rpcTarget } @@ -187,12 +186,12 @@ class Settings extends Component { return ( h('div.settings__content-row', [ h('div.settings__content-item', [ - h('span', t('newRPC')), + h('span', this.props.t('newRPC')), ]), h('div.settings__content-item', [ h('div.settings__content-item-col', [ h('input.settings__input', { - placeholder: t('newRPC'), + placeholder: this.props.t('newRPC'), onChange: event => this.setState({ newRpc: event.target.value }), onKeyPress: event => { if (event.key === 'Enter') { @@ -205,7 +204,7 @@ class Settings extends Component { event.preventDefault() this.validateRpc(this.state.newRpc) }, - }, t('save')), + }, this.props.t('save')), ]), ]), ]) @@ -221,9 +220,9 @@ class Settings extends Component { const appendedRpc = `http://${newRpc}` if (validUrl.isWebUri(appendedRpc)) { - displayWarning(t('uriErrorMsg')) + displayWarning(this.props.t('uriErrorMsg')) } else { - displayWarning(t('invalidRPC')) + displayWarning(this.props.t('invalidRPC')) } } } @@ -232,10 +231,10 @@ class Settings extends Component { return ( h('div.settings__content-row', [ h('div.settings__content-item', [ - h('div', t('stateLogs')), + h('div', this.props.t('stateLogs')), h( 'div.settings__content-description', - t('stateLogsDescription') + this.props.t('stateLogsDescription') ), ]), h('div.settings__content-item', [ @@ -244,13 +243,13 @@ class Settings extends Component { onClick (event) { window.logStateString((err, result) => { if (err) { - this.state.dispatch(actions.displayWarning(t('stateLogError'))) + this.state.dispatch(actions.displayWarning(this.props.t('stateLogError'))) } else { exportAsFile('MetaMask State Logs.json', result) } }) }, - }, t('downloadStateLogs')), + }, this.props.t('downloadStateLogs')), ]), ]), ]) @@ -262,7 +261,7 @@ class Settings extends Component { return ( h('div.settings__content-row', [ - h('div.settings__content-item', t('revealSeedWords')), + h('div.settings__content-item', this.props.t('revealSeedWords')), h('div.settings__content-item', [ h('div.settings__content-item-col', [ h('button.settings__clear-button.settings__clear-button--red', { @@ -270,7 +269,7 @@ class Settings extends Component { event.preventDefault() revealSeedConfirmation() }, - }, t('revealSeedWords')), + }, this.props.t('revealSeedWords')), ]), ]), ]) @@ -282,7 +281,7 @@ class Settings extends Component { return ( h('div.settings__content-row', [ - h('div.settings__content-item', t('useOldUI')), + h('div.settings__content-item', this.props.t('useOldUI')), h('div.settings__content-item', [ h('div.settings__content-item-col', [ h('button.settings__clear-button.settings__clear-button--orange', { @@ -290,7 +289,7 @@ class Settings extends Component { event.preventDefault() setFeatureFlagToBeta() }, - }, t('useOldUI')), + }, this.props.t('useOldUI')), ]), ]), ]) @@ -301,7 +300,7 @@ class Settings extends Component { const { showResetAccountConfirmationModal } = this.props return h('div.settings__content-row', [ - h('div.settings__content-item', t('resetAccount')), + h('div.settings__content-item', this.props.t('resetAccount')), h('div.settings__content-item', [ h('div.settings__content-item-col', [ h('button.settings__clear-button.settings__clear-button--orange', { @@ -309,7 +308,7 @@ class Settings extends Component { event.preventDefault() showResetAccountConfirmationModal() }, - }, t('resetAccount')), + }, this.props.t('resetAccount')), ]), ]), ]) @@ -345,13 +344,13 @@ class Settings extends Component { renderInfoLinks () { return ( h('div.settings__content-item.settings__content-item--without-height', [ - h('div.settings__info-link-header', t('links')), + h('div.settings__info-link-header', this.props.t('links')), h('div.settings__info-link-item', [ h('a', { href: 'https://metamask.io/privacy.html', target: '_blank', }, [ - h('span.settings__info-link', t('privacyMsg')), + h('span.settings__info-link', this.props.t('privacyMsg')), ]), ]), h('div.settings__info-link-item', [ @@ -359,7 +358,7 @@ class Settings extends Component { href: 'https://metamask.io/terms.html', target: '_blank', }, [ - h('span.settings__info-link', t('terms')), + h('span.settings__info-link', this.props.t('terms')), ]), ]), h('div.settings__info-link-item', [ @@ -367,7 +366,7 @@ class Settings extends Component { href: 'https://metamask.io/attributions.html', target: '_blank', }, [ - h('span.settings__info-link', t('attributions')), + h('span.settings__info-link', this.props.t('attributions')), ]), ]), h('hr.settings__info-separator'), @@ -376,7 +375,7 @@ class Settings extends Component { href: 'https://support.metamask.io', target: '_blank', }, [ - h('span.settings__info-link', t('supportCenter')), + h('span.settings__info-link', this.props.t('supportCenter')), ]), ]), h('div.settings__info-link-item', [ @@ -384,7 +383,7 @@ class Settings extends Component { href: 'https://metamask.io/', target: '_blank', }, [ - h('span.settings__info-link', t('visitWebSite')), + h('span.settings__info-link', this.props.t('visitWebSite')), ]), ]), h('div.settings__info-link-item', [ @@ -392,7 +391,7 @@ class Settings extends Component { target: '_blank', href: 'mailto:help@metamask.io?subject=Feedback', }, [ - h('span.settings__info-link', t('emailUs')), + h('span.settings__info-link', this.props.t('emailUs')), ]), ]), ]) @@ -414,7 +413,7 @@ class Settings extends Component { h('div.settings__info-item', [ h( 'div.settings__info-about', - t('builtInCalifornia') + this.props.t('builtInCalifornia') ), ]), ]), diff --git a/ui/app/unlock.js b/ui/app/unlock.js index 423e76e10..e8e1ba051 100644 --- a/ui/app/unlock.js +++ b/ui/app/unlock.js @@ -5,7 +5,6 @@ const connect = require('./metamask-connect') const actions = require('./actions') const getCaretCoordinates = require('textarea-caret') const EventEmitter = require('events').EventEmitter -const t = require('../i18n-helper').getMessage const { OLD_UI_NETWORK_TYPE } = require('../../app/scripts/config').enums const environmentType = require('../../app/scripts/lib/environment-type') @@ -41,7 +40,7 @@ UnlockScreen.prototype.render = function () { textTransform: 'uppercase', color: '#7F8082', }, - }, t(this.props.localeMessages, 'appName')), + }, this.props.t('appName')), h('input.large-input', { type: 'password', @@ -67,7 +66,7 @@ UnlockScreen.prototype.render = function () { style: { margin: 10, }, - }, t('login')), + }, this.props.t('login')), h('p.pointer', { onClick: () => { @@ -81,7 +80,7 @@ UnlockScreen.prototype.render = function () { color: 'rgb(247, 134, 28)', textDecoration: 'underline', }, - }, t('restoreFromSeed')), + }, this.props.t('restoreFromSeed')), h('p.pointer', { onClick: () => { @@ -94,7 +93,7 @@ UnlockScreen.prototype.render = function () { textDecoration: 'underline', marginTop: '32px', }, - }, t('classicInterface')), + }, this.props.t('classicInterface')), ]) ) } diff --git a/ui/i18n-helper.js b/ui/i18n-helper.js index 10147b0f6..70555f239 100644 --- a/ui/i18n-helper.js +++ b/ui/i18n-helper.js @@ -2,13 +2,15 @@ const log = require('loglevel') const getMessage = (locale, key, substitutions) => { + console.log(`locale, key, substitutions`, locale, key, substitutions); // check locale is loaded if (!locale) { // throw new Error('Translator - has not loaded a locale yet.') return '' } // check entry is present - const entry = locale[key] + const { current, en } = locale + const entry = current[key] || en[key] if (!entry) { log.error(`Translator - Unable to find value for "${key}"`) // throw new Error(`Translator - Unable to find value for "${key}"`) diff --git a/ui/index.js b/ui/index.js index 598d2876b..fe57f791a 100644 --- a/ui/index.js +++ b/ui/index.js @@ -31,6 +31,7 @@ async function startApp (metamaskState, accountManager, opts) { if (!metamaskState.featureFlags) metamaskState.featureFlags = {} const currentLocaleMessages = await fetchLocale(metamaskState.currentLocale) + const enLocaleMessages = await fetchLocale('en') const store = configureStore({ @@ -40,7 +41,10 @@ async function startApp (metamaskState, accountManager, opts) { // appState represents the current tab's popup state appState: {}, - localeMessages: currentLocaleMessages, + localeMessages: { + current: currentLocaleMessages, + en: enLocaleMessages, + }, // Which blockchain we are using: networkVersion: opts.networkVersion, |