mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Convert AccountDetailsDropdown component to use JSX (#7509)
This commit is contained in:
parent
1d9787c0d8
commit
7a0e40829a
@ -1,6 +1,5 @@
|
||||
const Component = require('react').Component
|
||||
import React, { Component } from 'react'
|
||||
const PropTypes = require('prop-types')
|
||||
const h = require('react-hyperscript')
|
||||
const inherits = require('util').inherits
|
||||
const connect = require('react-redux').connect
|
||||
const actions = require('../../../store/actions')
|
||||
@ -50,7 +49,7 @@ AccountDetailsDropdown.prototype.onClose = function (e) {
|
||||
this.props.onClose()
|
||||
}
|
||||
|
||||
AccountDetailsDropdown.prototype.render = function () {
|
||||
AccountDetailsDropdown.prototype.render = function AccountDetailsDropdown () {
|
||||
const {
|
||||
selectedIdentity,
|
||||
network,
|
||||
@ -69,71 +68,87 @@ AccountDetailsDropdown.prototype.render = function () {
|
||||
|
||||
const isRemovable = keyring.type !== 'HD Key Tree'
|
||||
|
||||
return h(Menu, { className: 'account-details-dropdown', isShowing: true }, [
|
||||
h(CloseArea, {
|
||||
onClick: this.onClose,
|
||||
}),
|
||||
h(Item, {
|
||||
onClick: (e) => {
|
||||
e.stopPropagation()
|
||||
this.context.metricsEvent({
|
||||
eventOpts: {
|
||||
category: 'Navigation',
|
||||
action: 'Account Options',
|
||||
name: 'Clicked Expand View',
|
||||
},
|
||||
})
|
||||
global.platform.openExtensionInBrowser()
|
||||
this.props.onClose()
|
||||
},
|
||||
text: this.context.t('expandView'),
|
||||
icon: h(`img`, { src: 'images/expand.svg', style: { height: '15px' } }),
|
||||
}),
|
||||
h(Item, {
|
||||
onClick: (e) => {
|
||||
e.stopPropagation()
|
||||
showAccountDetailModal()
|
||||
this.context.metricsEvent({
|
||||
eventOpts: {
|
||||
category: 'Navigation',
|
||||
action: 'Account Options',
|
||||
name: 'Viewed Account Details',
|
||||
},
|
||||
})
|
||||
this.props.onClose()
|
||||
},
|
||||
text: this.context.t('accountDetails'),
|
||||
icon: h(`img`, { src: 'images/info.svg', style: { height: '15px' } }),
|
||||
}),
|
||||
h(Item, {
|
||||
onClick: (e) => {
|
||||
e.stopPropagation()
|
||||
this.context.metricsEvent({
|
||||
eventOpts: {
|
||||
category: 'Navigation',
|
||||
action: 'Account Options',
|
||||
name: 'Clicked View on Etherscan',
|
||||
},
|
||||
})
|
||||
viewOnEtherscan(address, network, rpcPrefs)
|
||||
this.props.onClose()
|
||||
},
|
||||
text: (rpcPrefs.blockExplorerUrl
|
||||
? this.context.t('viewinExplorer')
|
||||
: this.context.t('viewOnEtherscan')),
|
||||
subText: (rpcPrefs.blockExplorerUrl
|
||||
? rpcPrefs.blockExplorerUrl.match(/^https?:\/\/(.+)/)[1]
|
||||
: null),
|
||||
icon: h(`img`, { src: 'images/open-etherscan.svg', style: { height: '15px' } }),
|
||||
}),
|
||||
isRemovable ? h(Item, {
|
||||
onClick: (e) => {
|
||||
e.stopPropagation()
|
||||
showRemoveAccountConfirmationModal(selectedIdentity)
|
||||
this.props.onClose()
|
||||
},
|
||||
text: this.context.t('removeAccount'),
|
||||
icon: h(`img`, { src: 'images/hide.svg', style: { height: '15px' } }),
|
||||
}) : null,
|
||||
])
|
||||
return (
|
||||
<Menu className="account-details-dropdown" isShowing>
|
||||
<CloseArea onClick={this.onClose} />
|
||||
<Item
|
||||
onClick={(e) => {
|
||||
e.stopPropagation()
|
||||
this.context.metricsEvent({
|
||||
eventOpts: {
|
||||
category: 'Navigation',
|
||||
action: 'Account Options',
|
||||
name: 'Clicked Expand View',
|
||||
},
|
||||
})
|
||||
global.platform.openExtensionInBrowser()
|
||||
this.props.onClose()
|
||||
}}
|
||||
text={this.context.t('expandView')}
|
||||
icon={(
|
||||
<img alt="" src="images/expand.svg" style={{ height: '15px' }} />
|
||||
)}
|
||||
/>
|
||||
<Item
|
||||
onClick={(e) => {
|
||||
e.stopPropagation()
|
||||
showAccountDetailModal()
|
||||
this.context.metricsEvent({
|
||||
eventOpts: {
|
||||
category: 'Navigation',
|
||||
action: 'Account Options',
|
||||
name: 'Viewed Account Details',
|
||||
},
|
||||
})
|
||||
this.props.onClose()
|
||||
}}
|
||||
text={this.context.t('accountDetails')}
|
||||
icon={(
|
||||
<img src="images/info.svg" style={{ height: '15px' }} alt="" />
|
||||
)}
|
||||
/>
|
||||
<Item
|
||||
onClick={(e) => {
|
||||
e.stopPropagation()
|
||||
this.context.metricsEvent({
|
||||
eventOpts: {
|
||||
category: 'Navigation',
|
||||
action: 'Account Options',
|
||||
name: 'Clicked View on Etherscan',
|
||||
},
|
||||
})
|
||||
viewOnEtherscan(address, network, rpcPrefs)
|
||||
this.props.onClose()
|
||||
}}
|
||||
text={
|
||||
rpcPrefs.blockExplorerUrl
|
||||
? this.context.t('viewinExplorer')
|
||||
: this.context.t('viewOnEtherscan')
|
||||
}
|
||||
subText={
|
||||
rpcPrefs.blockExplorerUrl
|
||||
? rpcPrefs.blockExplorerUrl.match(/^https?:\/\/(.+)/)[1]
|
||||
: null
|
||||
}
|
||||
icon={(
|
||||
<img src="images/open-etherscan.svg" style={{ height: '15px' }} alt="" />
|
||||
)}
|
||||
/>
|
||||
{
|
||||
isRemovable
|
||||
? (
|
||||
<Item
|
||||
onClick={(e) => {
|
||||
e.stopPropagation()
|
||||
showRemoveAccountConfirmationModal(selectedIdentity)
|
||||
this.props.onClose()
|
||||
}}
|
||||
text={this.context.t('removeAccount')}
|
||||
icon={<img src="images/hide.svg" style={{ height: '15px' }} alt="" />}
|
||||
/>
|
||||
)
|
||||
: null
|
||||
}
|
||||
</Menu>
|
||||
)
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user