aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/add-token.js
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app/add-token.js')
-rw-r--r--ui/app/add-token.js56
1 files changed, 31 insertions, 25 deletions
diff --git a/ui/app/add-token.js b/ui/app/add-token.js
index 472f3b736..ebdd220aa 100644
--- a/ui/app/add-token.js
+++ b/ui/app/add-token.js
@@ -2,7 +2,8 @@ const inherits = require('util').inherits
const Component = require('react').Component
const classnames = require('classnames')
const h = require('react-hyperscript')
-const connect = require('./metamask-connect')
+const PropTypes = require('prop-types')
+const connect = require('react-redux').connect
const R = require('ramda')
const Fuse = require('fuse.js')
const contractMap = require('eth-contract-metadata')
@@ -29,8 +30,13 @@ const { tokenInfoGetter } = require('./token-util')
const emptyAddr = '0x0000000000000000000000000000000000000000'
+AddTokenScreen.contextTypes = {
+ t: PropTypes.func,
+}
+
module.exports = connect(mapStateToProps, mapDispatchToProps)(AddTokenScreen)
+
function mapStateToProps (state) {
const { identities, tokens } = state.metamask
return {
@@ -139,7 +145,7 @@ AddTokenScreen.prototype.validate = function () {
if (customAddress) {
const validAddress = ethUtil.isValidAddress(customAddress)
if (!validAddress) {
- errors.customAddress = this.props.t('invalidAddress')
+ errors.customAddress = this.context.t('invalidAddress')
}
const validDecimals = customDecimals !== null
@@ -147,23 +153,23 @@ AddTokenScreen.prototype.validate = function () {
&& customDecimals >= 0
&& customDecimals < 36
if (!validDecimals) {
- errors.customDecimals = this.props.t('decimalsMustZerotoTen')
+ errors.customDecimals = this.context.t('decimalsMustZerotoTen')
}
const symbolLen = customSymbol.trim().length
const validSymbol = symbolLen > 0 && symbolLen < 10
if (!validSymbol) {
- errors.customSymbol = this.props.t('symbolBetweenZeroTen')
+ errors.customSymbol = this.context.t('symbolBetweenZeroTen')
}
const ownAddress = identitiesList.includes(standardAddress)
if (ownAddress) {
- errors.customAddress = this.props.t('personalAddressDetected')
+ errors.customAddress = this.context.t('personalAddressDetected')
}
const tokenAlreadyAdded = this.checkExistingAddresses(customAddress)
if (tokenAlreadyAdded) {
- errors.customAddress = this.props.t('tokenAlreadyAdded')
+ errors.customAddress = this.context.t('tokenAlreadyAdded')
}
} else if (
Object.entries(selectedTokens)
@@ -171,7 +177,7 @@ AddTokenScreen.prototype.validate = function () {
isEmpty && !isSelected
), true)
) {
- errors.tokenSelector = this.props.t('mustSelectOne')
+ errors.tokenSelector = this.context.t('mustSelectOne')
}
return {
@@ -201,7 +207,7 @@ AddTokenScreen.prototype.renderCustomForm = function () {
'add-token__add-custom-field--error': errors.customAddress,
}),
}, [
- h('div.add-token__add-custom-label', this.props.t('tokenAddress')),
+ h('div.add-token__add-custom-label', this.context.t('tokenAddress')),
h('input.add-token__add-custom-input', {
type: 'text',
onChange: this.tokenAddressDidChange,
@@ -214,7 +220,7 @@ AddTokenScreen.prototype.renderCustomForm = function () {
'add-token__add-custom-field--error': errors.customSymbol,
}),
}, [
- h('div.add-token__add-custom-label', this.props.t('tokenSymbol')),
+ h('div.add-token__add-custom-label', this.context.t('tokenSymbol')),
h('input.add-token__add-custom-input', {
type: 'text',
onChange: this.tokenSymbolDidChange,
@@ -228,7 +234,7 @@ AddTokenScreen.prototype.renderCustomForm = function () {
'add-token__add-custom-field--error': errors.customDecimals,
}),
}, [
- h('div.add-token__add-custom-label', this.props.t('decimal')),
+ h('div.add-token__add-custom-label', this.context.t('decimal')),
h('input.add-token__add-custom-input', {
type: 'number',
onChange: this.tokenDecimalsDidChange,
@@ -250,7 +256,7 @@ AddTokenScreen.prototype.renderTokenList = function () {
const results = [...addressSearchResult, ...fuseSearchResult]
return h('div', [
- results.length > 0 && h('div.add-token__token-icons-title', this.props.t('popularTokens')),
+ results.length > 0 && h('div.add-token__token-icons-title', this.context.t('popularTokens')),
h('div.add-token__token-icons-container', Array(6).fill(undefined)
.map((_, i) => {
const { logo, symbol, name, address } = results[i] || {}
@@ -305,10 +311,10 @@ 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__description', this.props.t('likeToAddTokens')),
+ h('div.add-token__description', this.context.t('likeToAddTokens')),
]),
h('div.add-token__content-container.add-token__confirmation-content', [
- h('div.add-token__description.add-token__confirmation-description', this.props.t('balances')),
+ h('div.add-token__description.add-token__confirmation-description', this.context.t('balances')),
h('div.add-token__confirmation-token-list',
Object.entries(tokens)
.map(([ address, token ]) => (
@@ -327,10 +333,10 @@ AddTokenScreen.prototype.renderConfirmation = function () {
h('div.add-token__buttons', [
h('button.btn-secondary--lg.add-token__cancel-button', {
onClick: () => this.setState({ isShowingConfirmation: false }),
- }, this.props.t('back')),
+ }, this.context.t('back')),
h('button.btn-primary--lg', {
onClick: () => addTokens(tokens).then(goHome),
- }, this.props.t('addTokens')),
+ }, this.context.t('addTokens')),
]),
])
)
@@ -350,14 +356,14 @@ AddTokenScreen.prototype.renderTabs = function () {
h('div.add-token__content-container', [
h('div.add-token__info-box', [
h('div.add-token__info-box__close'),
- h('div.add-token__info-box__title', this.props.t('whatsThis')),
- h('div.add-token__info-box__copy', this.props.t('keepTrackTokens')),
- h('div.add-token__info-box__copy--blue', this.props.t('learnMore')),
+ h('div.add-token__info-box__title', this.context.t('whatsThis')),
+ h('div.add-token__info-box__copy', this.context.t('keepTrackTokens')),
+ h('div.add-token__info-box__copy--blue', this.context.t('learnMore')),
]),
h('div.add-token__input-container', [
h('input.add-token__input', {
type: 'text',
- placeholder: this.props.t('searchTokens'),
+ placeholder: this.context.t('searchTokens'),
onChange: e => this.setState({ searchQuery: e.target.value }),
}),
h('div.add-token__search-input-error-message', errors.tokenSelector),
@@ -381,9 +387,9 @@ AddTokenScreen.prototype.render = function () {
onClick: () => goHome(),
}, [
h('i.fa.fa-angle-left.fa-lg'),
- h('span', this.props.t('cancel')),
+ h('span', this.context.t('cancel')),
]),
- h('div.add-token__header__title', this.props.t('addTokens')),
+ h('div.add-token__header__title', this.context.t('addTokens')),
!isShowingConfirmation && h('div.add-token__header__tabs', [
h('div.add-token__header__tabs__tab', {
@@ -392,7 +398,7 @@ AddTokenScreen.prototype.render = function () {
'add-token__header__tabs__unselected cursor-pointer': displayedTab !== 'SEARCH',
}),
onClick: () => this.displayTab('SEARCH'),
- }, this.props.t('search')),
+ }, this.context.t('search')),
h('div.add-token__header__tabs__tab', {
className: classnames('add-token__header__tabs__tab', {
@@ -400,7 +406,7 @@ AddTokenScreen.prototype.render = function () {
'add-token__header__tabs__unselected cursor-pointer': displayedTab !== 'CUSTOM_TOKEN',
}),
onClick: () => this.displayTab('CUSTOM_TOKEN'),
- }, this.props.t('customToken')),
+ }, this.context.t('customToken')),
]),
]),
@@ -412,10 +418,10 @@ AddTokenScreen.prototype.render = function () {
!isShowingConfirmation && h('div.add-token__buttons', [
h('button.btn-secondary--lg.add-token__cancel-button', {
onClick: goHome,
- }, this.props.t('cancel')),
+ }, this.context.t('cancel')),
h('button.btn-primary--lg.add-token__confirm-button', {
onClick: this.onNext,
- }, this.props.t('next')),
+ }, this.context.t('next')),
]),
])
}