diff options
Diffstat (limited to 'ui/app/components/modals')
12 files changed, 80 insertions, 70 deletions
diff --git a/ui/app/components/modals/account-details-modal.js b/ui/app/components/modals/account-details-modal.js index 75f989e86..e4f2009aa 100644 --- a/ui/app/components/modals/account-details-modal.js +++ b/ui/app/components/modals/account-details-modal.js @@ -1,14 +1,14 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const connect = require('react-redux').connect +const connect = require('../../metamask-connect') const actions = require('../../actions') const AccountModalContainer = require('./account-modal-container') 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') +const t = require('../../../i18n-helper').getMessage function mapStateToProps (state) { return { @@ -65,12 +65,12 @@ AccountDetailsModal.prototype.render = function () { h('button.btn-clear.account-modal__button', { onClick: () => global.platform.openWindow({ url: genAccountLink(address, network) }), - }, t('etherscanView')), + }, t(this.props.localeMessages, 'etherscanView')), // Holding on redesign for Export Private Key functionality h('button.btn-clear.account-modal__button', { onClick: () => showExportPrivateKeyModal(), - }, t('exportPrivateKey')), + }, t(this.props.localeMessages, 'exportPrivateKey')), ]) } diff --git a/ui/app/components/modals/account-modal-container.js b/ui/app/components/modals/account-modal-container.js index 08540aa76..ac6457b37 100644 --- a/ui/app/components/modals/account-modal-container.js +++ b/ui/app/components/modals/account-modal-container.js @@ -1,11 +1,11 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const connect = require('react-redux').connect +const connect = require('../../metamask-connect') const actions = require('../../actions') const { getSelectedIdentity } = require('../../selectors') const Identicon = require('../identicon') -const t = require('../../../i18n') +const t = require('../../../i18n-helper').getMessage function mapStateToProps (state) { return { @@ -60,7 +60,7 @@ AccountModalContainer.prototype.render = function () { h('i.fa.fa-angle-left.fa-lg'), - h('span.account-modal-back__text', ' ' + t('back')), + h('span.account-modal-back__text', ' ' + t(this.props.localeMessages, 'back')), ]), diff --git a/ui/app/components/modals/buy-options-modal.js b/ui/app/components/modals/buy-options-modal.js index 7eb73c3a6..0e93e9a2d 100644 --- a/ui/app/components/modals/buy-options-modal.js +++ b/ui/app/components/modals/buy-options-modal.js @@ -1,10 +1,10 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const connect = require('react-redux').connect +const connect = require('../../metamask-connect') const actions = require('../../actions') const networkNames = require('../../../../app/scripts/config.js').networkNames -const t = require('../../../i18n') +const t = require('../../../i18n-helper').getMessage function mapStateToProps (state) { return { @@ -57,15 +57,15 @@ BuyOptions.prototype.render = function () { }, [ h('div.buy-modal-content-title', { style: {}, - }, t('transfers')), - h('div', {}, t('howToDeposit')), + }, t(this.props.localeMessages, 'transfers')), + h('div', {}, t(this.props.localeMessages, 'howToDeposit')), ]), h('div.buy-modal-content-options.flex-column.flex-center', {}, [ isTestNetwork - ? this.renderModalContentOption(networkName, t('testFaucet'), () => toFaucet(network)) - : this.renderModalContentOption('Coinbase', t('depositFiat'), () => toCoinbase(address)), + ? this.renderModalContentOption(networkName, t(this.props.localeMessages, 'testFaucet'), () => toFaucet(network)) + : this.renderModalContentOption('Coinbase', t(this.props.localeMessages, 'depositFiat'), () => toCoinbase(address)), // h('div.buy-modal-content-option', {}, [ // h('div.buy-modal-content-option-title', {}, 'Shapeshift'), @@ -73,8 +73,8 @@ BuyOptions.prototype.render = function () { // ]),, this.renderModalContentOption( - t('directDeposit'), - t('depositFromAccount'), + t(this.props.localeMessages, 'directDeposit'), + t(this.props.localeMessages, 'depositFromAccount'), () => this.goToAccountDetailsModal() ), @@ -85,7 +85,7 @@ BuyOptions.prototype.render = function () { background: 'white', }, onClick: () => { this.props.hideModal() }, - }, h('div.buy-modal-content-footer#buy-modal-content-footer-text', {}, t('cancel'))), + }, h('div.buy-modal-content-footer#buy-modal-content-footer-text', {}, t(this.props.localeMessages, 'cancel'))), ]), ]) } diff --git a/ui/app/components/modals/deposit-ether-modal.js b/ui/app/components/modals/deposit-ether-modal.js index b642513d7..307e89a47 100644 --- a/ui/app/components/modals/deposit-ether-modal.js +++ b/ui/app/components/modals/deposit-ether-modal.js @@ -1,21 +1,22 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const connect = require('react-redux').connect +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') - -const DIRECT_DEPOSIT_ROW_TITLE = t('directDepositEther') -const DIRECT_DEPOSIT_ROW_TEXT = t('directDepositEtherExplainer') -const COINBASE_ROW_TITLE = t('buyCoinbase') -const COINBASE_ROW_TEXT = t('buyCoinbaseExplainer') -const SHAPESHIFT_ROW_TITLE = t('depositShapeShift') -const SHAPESHIFT_ROW_TEXT = t('depositShapeShiftExplainer') -const FAUCET_ROW_TITLE = t('testFaucet') +const t = require('../../../i18n-helper').getMessage + +let DIRECT_DEPOSIT_ROW_TITLE +let DIRECT_DEPOSIT_ROW_TEXT +let COINBASE_ROW_TITLE +let COINBASE_ROW_TEXT +let SHAPESHIFT_ROW_TITLE +let SHAPESHIFT_ROW_TEXT +let FAUCET_ROW_TITLE + const facuetRowText = (networkName) => { - return t('getEtherFromFaucet', [networkName]) + return t(this.props.localeMessages, 'getEtherFromFaucet', [networkName]) } function mapStateToProps (state) { @@ -47,6 +48,15 @@ inherits(DepositEtherModal, Component) 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') + this.state = { buyingWithShapeshift: false, } @@ -113,10 +123,10 @@ DepositEtherModal.prototype.render = function () { h('div.page-container__header', [ - h('div.page-container__title', [t('depositEther')]), + h('div.page-container__title', [t(this.props.localeMessages, 'depositEther')]), h('div.page-container__subtitle', [ - t('needEtherInWallet'), + t(this.props.localeMessages, 'needEtherInWallet'), ]), h('div.page-container__header-close', { @@ -139,7 +149,7 @@ DepositEtherModal.prototype.render = function () { }), title: DIRECT_DEPOSIT_ROW_TITLE, text: DIRECT_DEPOSIT_ROW_TEXT, - buttonLabel: t('viewAccount'), + buttonLabel: t(this.props.localeMessages, 'viewAccount'), onButtonClick: () => this.goToAccountDetailsModal(), hide: buyingWithShapeshift, }), @@ -148,7 +158,7 @@ DepositEtherModal.prototype.render = function () { logo: h('i.fa.fa-tint.fa-2x'), title: FAUCET_ROW_TITLE, text: facuetRowText(networkName), - buttonLabel: t('getEther'), + buttonLabel: t(this.props.localeMessages, 'getEther'), onButtonClick: () => toFaucet(network), hide: !isTestNetwork || buyingWithShapeshift, }), @@ -162,7 +172,7 @@ DepositEtherModal.prototype.render = function () { }), title: COINBASE_ROW_TITLE, text: COINBASE_ROW_TEXT, - buttonLabel: t('continueToCoinbase'), + buttonLabel: t(this.props.localeMessages, 'continueToCoinbase'), onButtonClick: () => toCoinbase(address), hide: isTestNetwork || buyingWithShapeshift, }), @@ -175,7 +185,7 @@ DepositEtherModal.prototype.render = function () { }), title: SHAPESHIFT_ROW_TITLE, text: SHAPESHIFT_ROW_TEXT, - buttonLabel: t('shapeshiftBuy'), + buttonLabel: t(this.props.localeMessages, '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 6efa8d476..a64a41b27 100644 --- a/ui/app/components/modals/edit-account-name-modal.js +++ b/ui/app/components/modals/edit-account-name-modal.js @@ -1,10 +1,10 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const connect = require('react-redux').connect +const connect = require('../../metamask-connect') const actions = require('../../actions') const { getSelectedAccount } = require('../../selectors') -const t = require('../../../i18n') +const t = require('../../../i18n-helper').getMessage function mapStateToProps (state) { return { @@ -51,7 +51,7 @@ EditAccountNameModal.prototype.render = function () { ]), h('div.edit-account-name-modal-title', { - }, [t('editAccountName')]), + }, [t(this.props.localeMessages, 'editAccountName')]), h('input.edit-account-name-modal-input', { placeholder: identity.name, @@ -70,7 +70,7 @@ EditAccountNameModal.prototype.render = function () { }, disabled: this.state.inputText.length === 0, }, [ - t('save'), + t(this.props.localeMessages, 'save'), ]), ]), diff --git a/ui/app/components/modals/export-private-key-modal.js b/ui/app/components/modals/export-private-key-modal.js index 017177cfd..fac5366a4 100644 --- a/ui/app/components/modals/export-private-key-modal.js +++ b/ui/app/components/modals/export-private-key-modal.js @@ -1,13 +1,13 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const connect = require('react-redux').connect +const connect = require('../../metamask-connect') const ethUtil = require('ethereumjs-util') const actions = require('../../actions') const AccountModalContainer = require('./account-modal-container') const { getSelectedIdentity } = require('../../selectors') const ReadOnlyInput = require('../readonly-input') -const t = require('../../../i18n') +const t = require('../../../i18n-helper').getMessage const copyToClipboard = require('copy-to-clipboard') function mapStateToProps (state) { @@ -49,8 +49,8 @@ ExportPrivateKeyModal.prototype.exportAccountAndGetPrivateKey = function (passwo ExportPrivateKeyModal.prototype.renderPasswordLabel = function (privateKey) { return h('span.private-key-password-label', privateKey - ? t('copyPrivateKey') - : t('typePassword') + ? t(this.props.localeMessages, 'copyPrivateKey') + : t(this.props.localeMessages, 'typePassword') ) } @@ -87,8 +87,8 @@ ExportPrivateKeyModal.prototype.renderButtons = function (privateKey, password, ), (privateKey - ? this.renderButton('btn-clear export-private-key__button', () => hideModal(), t('done')) - : this.renderButton('btn-clear export-private-key__button', () => this.exportAccountAndGetPrivateKey(this.state.password, address), t('confirm')) + ? 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')) ), ]) @@ -121,7 +121,7 @@ ExportPrivateKeyModal.prototype.render = function () { h('div.account-modal-divider'), - h('span.modal-body-title', t('showPrivateKeys')), + h('span.modal-body-title', t(this.props.localeMessages, 'showPrivateKeys')), h('div.private-key-password', {}, [ this.renderPasswordLabel(privateKey), @@ -131,7 +131,7 @@ ExportPrivateKeyModal.prototype.render = function () { !warning ? null : h('span.private-key-password-error', warning), ]), - h('div.private-key-password-warning', t('privateKeyWarning')), + h('div.private-key-password-warning', t(this.props.localeMessages, '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 33d8062c6..a6cf2889f 100644 --- a/ui/app/components/modals/hide-token-confirmation-modal.js +++ b/ui/app/components/modals/hide-token-confirmation-modal.js @@ -1,10 +1,10 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const connect = require('react-redux').connect +const connect = require('../../metamask-connect') const actions = require('../../actions') const Identicon = require('../identicon') -const t = require('../../../i18n') +const t = require('../../../i18n-helper').getMessage function mapStateToProps (state) { return { @@ -42,7 +42,7 @@ HideTokenConfirmationModal.prototype.render = function () { h('div.hide-token-confirmation__container', { }, [ h('div.hide-token-confirmation__title', {}, [ - t('hideTokenPrompt'), + t(this.props.localeMessages, 'hideTokenPrompt'), ]), h(Identicon, { @@ -55,19 +55,19 @@ HideTokenConfirmationModal.prototype.render = function () { h('div.hide-token-confirmation__symbol', {}, symbol), h('div.hide-token-confirmation__copy', {}, [ - t('readdToken'), + t(this.props.localeMessages, 'readdToken'), ]), h('div.hide-token-confirmation__buttons', {}, [ h('button.btn-cancel.hide-token-confirmation__button.allcaps', { onClick: () => hideModal(), }, [ - t('cancel'), + t(this.props.localeMessages, 'cancel'), ]), h('button.btn-clear.hide-token-confirmation__button.allcaps', { onClick: () => hideToken(address), }, [ - t('hide'), + t(this.props.localeMessages, 'hide'), ]), ]), ]), diff --git a/ui/app/components/modals/modal.js b/ui/app/components/modals/modal.js index 501b83430..d0f4b486c 100644 --- a/ui/app/components/modals/modal.js +++ b/ui/app/components/modals/modal.js @@ -1,12 +1,11 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const connect = require('react-redux').connect +const connect = require('../../metamask-connect') const FadeModal = require('boron').FadeModal const actions = require('../../actions') const isMobileView = require('../../../lib/is-mobile-view') const isPopupOrNotification = require('../../../../app/scripts/lib/is-popup-or-notification') -const t = require('../../../i18n') // Modal Components const BuyOptions = require('./buy-options-modal') @@ -174,8 +173,8 @@ const MODALS = { BETA_UI_NOTIFICATION_MODAL: { contents: [ h(NotifcationModal, { - header: t('uiWelcome'), - message: t('uiWelcomeMessage'), + header: 'uiWelcome', + message: 'uiWelcomeMessage', }), ], mobileModalStyle: { @@ -191,8 +190,8 @@ const MODALS = { OLD_UI_NOTIFICATION_MODAL: { contents: [ h(NotifcationModal, { - header: t('oldUI'), - message: t('oldUIMessage'), + header: 'oldUI', + message: 'oldUIMessage', }), ], mobileModalStyle: { diff --git a/ui/app/components/modals/new-account-modal.js b/ui/app/components/modals/new-account-modal.js index 298b76af4..2744af0b3 100644 --- a/ui/app/components/modals/new-account-modal.js +++ b/ui/app/components/modals/new-account-modal.js @@ -1,9 +1,9 @@ const { Component } = require('react') const PropTypes = require('prop-types') const h = require('react-hyperscript') -const { connect } = require('react-redux') +const connect = require('../../metamask-connect') const actions = require('../../actions') -const t = require('../../../i18n') +const t = require('../../../i18n-helper').getMessage class NewAccountModal extends Component { constructor (props) { @@ -23,7 +23,7 @@ class NewAccountModal extends Component { h('div.new-account-modal-wrapper', { }, [ h('div.new-account-modal-header', {}, [ - t('newAccount'), + t(this.props.localeMessages, 'newAccount'), ]), h('div.modal-close-x', { @@ -31,19 +31,19 @@ class NewAccountModal extends Component { }), h('div.new-account-modal-content', {}, [ - t('accountName'), + t(this.props.localeMessages, 'accountName'), ]), h('div.new-account-input-wrapper', {}, [ h('input.new-account-input', { value: this.state.newAccountName, - placeholder: t('sampleAccountName'), + placeholder: t(this.props.localeMessages, 'sampleAccountName'), onChange: event => this.setState({ newAccountName: event.target.value }), }, []), ]), h('div.new-account-modal-content.after-input', {}, [ - t('or'), + t(this.props.localeMessages, 'or'), ]), h('div.new-account-modal-content.after-input.pointer', { @@ -51,13 +51,13 @@ class NewAccountModal extends Component { this.props.hideModal() this.props.showImportPage() }, - }, t('importAnAccount')), + }, t(this.props.localeMessages, 'importAnAccount')), h('div.new-account-modal-content.button.allcaps', {}, [ h('button.btn-clear', { onClick: () => this.props.createAccount(newAccountName), }, [ - t('save'), + t(this.props.localeMessages, 'save'), ]), ]), ]), diff --git a/ui/app/components/modals/notification-modal.js b/ui/app/components/modals/notification-modal.js index 621a974d0..ba2c92c92 100644 --- a/ui/app/components/modals/notification-modal.js +++ b/ui/app/components/modals/notification-modal.js @@ -1,8 +1,9 @@ const { Component } = require('react') const PropTypes = require('prop-types') const h = require('react-hyperscript') -const { connect } = require('react-redux') +const connect = require('../../metamask-connect') const actions = require('../../actions') +const t = require('../../../i18n-helper').getMessage class NotificationModal extends Component { render () { @@ -22,12 +23,12 @@ class NotificationModal extends Component { }, [ h('div.notification-modal__header', {}, [ - header, + t(this.props.localeMessages, header), ]), h('div.notification-modal__message-wrapper', {}, [ h('div.notification-modal__message', {}, [ - message, + t(this.props.localeMessages, message), ]), ]), diff --git a/ui/app/components/modals/notification-modals/confirm-reset-account.js b/ui/app/components/modals/notification-modals/confirm-reset-account.js index e1bc91b24..94ee997ab 100644 --- a/ui/app/components/modals/notification-modals/confirm-reset-account.js +++ b/ui/app/components/modals/notification-modals/confirm-reset-account.js @@ -1,7 +1,7 @@ const { Component } = require('react') const PropTypes = require('prop-types') const h = require('react-hyperscript') -const { connect } = require('react-redux') +const connect = require('../../../metamask-connect') const actions = require('../../../actions') const NotifcationModal = require('../notification-modal') diff --git a/ui/app/components/modals/shapeshift-deposit-tx-modal.js b/ui/app/components/modals/shapeshift-deposit-tx-modal.js index 24af5a0de..28dcb1902 100644 --- a/ui/app/components/modals/shapeshift-deposit-tx-modal.js +++ b/ui/app/components/modals/shapeshift-deposit-tx-modal.js @@ -1,7 +1,7 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const connect = require('react-redux').connect +const connect = require('../../metamask-connect') const actions = require('../../actions') const QrView = require('../qr-code') const AccountModalContainer = require('./account-modal-container') |