mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
refactor watchToken related functions
This commit is contained in:
parent
68c1b4c170
commit
6fa889abcb
@ -15,7 +15,7 @@ class PreferencesController {
|
|||||||
* @property {string} store.currentAccountTab Indicates the selected tab in the ui
|
* @property {string} store.currentAccountTab Indicates the selected tab in the ui
|
||||||
* @property {array} store.tokens The tokens the user wants display in their token lists
|
* @property {array} store.tokens The tokens the user wants display in their token lists
|
||||||
* @property {object} store.accountTokens The tokens stored per account and then per network type
|
* @property {object} store.accountTokens The tokens stored per account and then per network type
|
||||||
* @property {object} store.imageObjects Contains assets objects related to assets added
|
* @property {object} store.assetImages Contains assets objects related to assets added
|
||||||
* @property {boolean} store.useBlockie The users preference for blockie identicons within the UI
|
* @property {boolean} store.useBlockie The users preference for blockie identicons within the UI
|
||||||
* @property {object} store.featureFlags A key-boolean map, where keys refer to features and booleans to whether the
|
* @property {object} store.featureFlags A key-boolean map, where keys refer to features and booleans to whether the
|
||||||
* user wishes to see that feature
|
* user wishes to see that feature
|
||||||
@ -28,7 +28,7 @@ class PreferencesController {
|
|||||||
frequentRpcList: [],
|
frequentRpcList: [],
|
||||||
currentAccountTab: 'history',
|
currentAccountTab: 'history',
|
||||||
accountTokens: {},
|
accountTokens: {},
|
||||||
imageObjects: {},
|
assetImages: {},
|
||||||
tokens: [],
|
tokens: [],
|
||||||
suggestedTokens: {},
|
suggestedTokens: {},
|
||||||
useBlockie: false,
|
useBlockie: false,
|
||||||
@ -60,12 +60,12 @@ class PreferencesController {
|
|||||||
return this.store.getState().suggestedTokens
|
return this.store.getState().suggestedTokens
|
||||||
}
|
}
|
||||||
|
|
||||||
getImageObjects () {
|
getAssetImages () {
|
||||||
return this.store.getState().imageObjects
|
return this.store.getState().assetImages
|
||||||
}
|
}
|
||||||
|
|
||||||
addSuggestedToken (tokenOpts) {
|
addSuggestedERC20Asset (tokenOpts) {
|
||||||
this._validateSuggestedTokenParams(tokenOpts)
|
this._validateERC20AssetParams(tokenOpts)
|
||||||
const suggested = this.getSuggestedTokens()
|
const suggested = this.getSuggestedTokens()
|
||||||
const { rawAddress, symbol, decimals, imageUrl } = tokenOpts
|
const { rawAddress, symbol, decimals, imageUrl } = tokenOpts
|
||||||
const address = normalizeAddress(rawAddress)
|
const address = normalizeAddress(rawAddress)
|
||||||
@ -291,7 +291,7 @@ class PreferencesController {
|
|||||||
const address = normalizeAddress(rawAddress)
|
const address = normalizeAddress(rawAddress)
|
||||||
const newEntry = { address, symbol, decimals }
|
const newEntry = { address, symbol, decimals }
|
||||||
const tokens = this.store.getState().tokens
|
const tokens = this.store.getState().tokens
|
||||||
const imageObjects = this.getImageObjects()
|
const assetImages = this.getAssetImages()
|
||||||
const previousEntry = tokens.find((token, index) => {
|
const previousEntry = tokens.find((token, index) => {
|
||||||
return token.address === address
|
return token.address === address
|
||||||
})
|
})
|
||||||
@ -302,8 +302,8 @@ class PreferencesController {
|
|||||||
} else {
|
} else {
|
||||||
tokens.push(newEntry)
|
tokens.push(newEntry)
|
||||||
}
|
}
|
||||||
imageObjects[address] = imageUrl
|
assetImages[address] = imageUrl
|
||||||
this._updateAccountTokens(tokens, imageObjects)
|
this._updateAccountTokens(tokens, assetImages)
|
||||||
return Promise.resolve(tokens)
|
return Promise.resolve(tokens)
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -316,10 +316,10 @@ class PreferencesController {
|
|||||||
*/
|
*/
|
||||||
removeToken (rawAddress) {
|
removeToken (rawAddress) {
|
||||||
const tokens = this.store.getState().tokens
|
const tokens = this.store.getState().tokens
|
||||||
const imageObjects = this.getImageObjects()
|
const assetImages = this.getAssetImages()
|
||||||
const updatedTokens = tokens.filter(token => token.address !== rawAddress)
|
const updatedTokens = tokens.filter(token => token.address !== rawAddress)
|
||||||
delete imageObjects[rawAddress]
|
delete assetImages[rawAddress]
|
||||||
this._updateAccountTokens(updatedTokens, imageObjects)
|
this._updateAccountTokens(updatedTokens, assetImages)
|
||||||
return Promise.resolve(updatedTokens)
|
return Promise.resolve(updatedTokens)
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -446,25 +446,6 @@ class PreferencesController {
|
|||||||
// PRIVATE METHODS
|
// PRIVATE METHODS
|
||||||
//
|
//
|
||||||
|
|
||||||
/**
|
|
||||||
* Validates that the passed options for suggested token have all required properties.
|
|
||||||
*
|
|
||||||
* @param {Object} opts The options object to validate
|
|
||||||
* @throws {string} Throw a custom error indicating that address, symbol and/or decimals
|
|
||||||
* doesn't fulfill requirements
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
_validateSuggestedTokenParams (opts) {
|
|
||||||
const { rawAddress, symbol, decimals } = opts
|
|
||||||
if (!rawAddress || !symbol || !decimals) throw new Error(`Cannot suggest token without address, symbol, and decimals`)
|
|
||||||
if (!(symbol.length < 5)) throw new Error(`Invalid symbol ${symbol} more than four characters`)
|
|
||||||
const numDecimals = parseInt(decimals, 10)
|
|
||||||
if (isNaN(numDecimals) || numDecimals > 36 || numDecimals < 0) {
|
|
||||||
throw new Error(`Invalid decimals ${decimals} must be at least 0, and not over 36`)
|
|
||||||
}
|
|
||||||
if (!isValidAddress(rawAddress)) throw new Error(`Invalid address ${rawAddress}`)
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Subscription to network provider type.
|
* Subscription to network provider type.
|
||||||
*
|
*
|
||||||
@ -483,10 +464,10 @@ class PreferencesController {
|
|||||||
* @param {array} tokens Array of tokens to be updated.
|
* @param {array} tokens Array of tokens to be updated.
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
_updateAccountTokens (tokens, imageObjects) {
|
_updateAccountTokens (tokens, assetImages) {
|
||||||
const { accountTokens, providerType, selectedAddress } = this._getTokenRelatedStates()
|
const { accountTokens, providerType, selectedAddress } = this._getTokenRelatedStates()
|
||||||
accountTokens[selectedAddress][providerType] = tokens
|
accountTokens[selectedAddress][providerType] = tokens
|
||||||
this.store.updateState({ accountTokens, tokens, imageObjects })
|
this.store.updateState({ accountTokens, tokens, assetImages })
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -520,21 +501,39 @@ class PreferencesController {
|
|||||||
/**
|
/**
|
||||||
* Handle the suggestion of an ERC20 asset through `watchAsset`
|
* Handle the suggestion of an ERC20 asset through `watchAsset`
|
||||||
* *
|
* *
|
||||||
* @param {Boolean} assetAdded Boolean according to addition of ERC20 token
|
* @param {Promise} promise Promise according to addition of ERC20 token
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
async _handleWatchAssetERC20 (options) {
|
async _handleWatchAssetERC20 (options) {
|
||||||
// TODO handle bad parameters
|
|
||||||
const { address, symbol, decimals, imageUrl } = options
|
const { address, symbol, decimals, imageUrl } = options
|
||||||
const rawAddress = address
|
const rawAddress = address
|
||||||
this._validateSuggestedTokenParams({ rawAddress, symbol, decimals })
|
this._validateERC20AssetParams({ rawAddress, symbol, decimals })
|
||||||
const tokenOpts = { rawAddress, decimals, symbol, imageUrl }
|
const tokenOpts = { rawAddress, decimals, symbol, imageUrl }
|
||||||
this.addSuggestedToken(tokenOpts)
|
this.addSuggestedERC20Asset(tokenOpts)
|
||||||
return this.showWatchAssetUi().then(() => {
|
return this.showWatchAssetUi().then(() => {
|
||||||
const tokenAddresses = this.getTokens().filter(token => token.address === normalizeAddress(rawAddress))
|
const tokenAddresses = this.getTokens().filter(token => token.address === normalizeAddress(rawAddress))
|
||||||
return tokenAddresses.length > 0
|
return tokenAddresses.length > 0
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Validates that the passed options for suggested token have all required properties.
|
||||||
|
*
|
||||||
|
* @param {Object} opts The options object to validate
|
||||||
|
* @throws {string} Throw a custom error indicating that address, symbol and/or decimals
|
||||||
|
* doesn't fulfill requirements
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
_validateERC20AssetParams (opts) {
|
||||||
|
const { rawAddress, symbol, decimals } = opts
|
||||||
|
if (!rawAddress || !symbol || !decimals) throw new Error(`Cannot suggest token without address, symbol, and decimals`)
|
||||||
|
if (!(symbol.length < 6)) throw new Error(`Invalid symbol ${symbol} more than five characters`)
|
||||||
|
const numDecimals = parseInt(decimals, 10)
|
||||||
|
if (isNaN(numDecimals) || numDecimals > 36 || numDecimals < 0) {
|
||||||
|
throw new Error(`Invalid decimals ${decimals} must be at least 0, and not over 36`)
|
||||||
|
}
|
||||||
|
if (!isValidAddress(rawAddress)) throw new Error(`Invalid address ${rawAddress}`)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = PreferencesController
|
module.exports = PreferencesController
|
||||||
|
@ -22,7 +22,7 @@ function mapStateToProps (state) {
|
|||||||
network,
|
network,
|
||||||
conversionRate: state.metamask.conversionRate,
|
conversionRate: state.metamask.conversionRate,
|
||||||
currentCurrency: state.metamask.currentCurrency,
|
currentCurrency: state.metamask.currentCurrency,
|
||||||
imageObjects: state.metamask.imageObjects,
|
assetImages: state.metamask.assetImages,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -33,9 +33,9 @@ function BalanceComponent () {
|
|||||||
|
|
||||||
BalanceComponent.prototype.render = function () {
|
BalanceComponent.prototype.render = function () {
|
||||||
const props = this.props
|
const props = this.props
|
||||||
const { token, network, imageObjects } = props
|
const { token, network, assetImages } = props
|
||||||
let imageUrl
|
let imageUrl
|
||||||
if (token) imageUrl = imageObjects[token.address]
|
if (token) imageUrl = assetImages[token.address]
|
||||||
|
|
||||||
return h('div.balance-container', {}, [
|
return h('div.balance-container', {}, [
|
||||||
|
|
||||||
|
@ -10,7 +10,7 @@ function mapStateToProps (state) {
|
|||||||
return {
|
return {
|
||||||
network: state.metamask.network,
|
network: state.metamask.network,
|
||||||
token: state.appState.modal.modalState.props.token,
|
token: state.appState.modal.modalState.props.token,
|
||||||
imageObjects: state.metamask.imageObjects,
|
assetImages: state.metamask.assetImages,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -41,9 +41,9 @@ module.exports = connect(mapStateToProps, mapDispatchToProps)(HideTokenConfirmat
|
|||||||
|
|
||||||
|
|
||||||
HideTokenConfirmationModal.prototype.render = function () {
|
HideTokenConfirmationModal.prototype.render = function () {
|
||||||
const { token, network, hideToken, hideModal, imageObjects } = this.props
|
const { token, network, hideToken, hideModal, assetImages } = this.props
|
||||||
const { symbol, address } = token
|
const { symbol, address } = token
|
||||||
const imageUrl = imageObjects[address]
|
const imageUrl = assetImages[address]
|
||||||
|
|
||||||
return h('div.hide-token-confirmation', {}, [
|
return h('div.hide-token-confirmation', {}, [
|
||||||
h('div.hide-token-confirmation__container', {
|
h('div.hide-token-confirmation__container', {
|
||||||
|
@ -15,7 +15,7 @@ function mapStateToProps (state) {
|
|||||||
network: state.metamask.network,
|
network: state.metamask.network,
|
||||||
tokens: state.metamask.tokens,
|
tokens: state.metamask.tokens,
|
||||||
userAddress: selectors.getSelectedAddress(state),
|
userAddress: selectors.getSelectedAddress(state),
|
||||||
imageObjects: state.metamask.imageObjects,
|
assetImages: state.metamask.assetImages,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -47,7 +47,7 @@ function TokenList () {
|
|||||||
}
|
}
|
||||||
|
|
||||||
TokenList.prototype.render = function () {
|
TokenList.prototype.render = function () {
|
||||||
const { userAddress, imageObjects } = this.props
|
const { userAddress, assetImages } = this.props
|
||||||
const state = this.state
|
const state = this.state
|
||||||
const { tokens, isLoading, error } = state
|
const { tokens, isLoading, error } = state
|
||||||
if (isLoading) {
|
if (isLoading) {
|
||||||
@ -77,7 +77,7 @@ TokenList.prototype.render = function () {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return h('div', tokens.map((tokenData) => {
|
return h('div', tokens.map((tokenData) => {
|
||||||
tokenData.imageUrl = imageObjects[tokenData.address]
|
tokenData.imageUrl = assetImages[tokenData.address]
|
||||||
return h(TokenCell, tokenData)
|
return h(TokenCell, tokenData)
|
||||||
}))
|
}))
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user