You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
103 lines
3.0 KiB
103 lines
3.0 KiB
import React, { Component } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { getAccountLink } from '@metamask/etherscan-link';
|
|
|
|
import AccountModalContainer from '../account-modal-container';
|
|
import QrView from '../../../ui/qr-code';
|
|
import EditableLabel from '../../../ui/editable-label';
|
|
import Button from '../../../ui/button';
|
|
import { getURLHostName } from '../../../../helpers/utils/util';
|
|
|
|
export default class AccountDetailsModal extends Component {
|
|
static propTypes = {
|
|
selectedIdentity: PropTypes.object,
|
|
chainId: PropTypes.string,
|
|
showExportPrivateKeyModal: PropTypes.func,
|
|
setAccountLabel: PropTypes.func,
|
|
keyrings: PropTypes.array,
|
|
rpcPrefs: PropTypes.object,
|
|
};
|
|
|
|
static contextTypes = {
|
|
t: PropTypes.func,
|
|
trackEvent: PropTypes.func,
|
|
};
|
|
|
|
render() {
|
|
const {
|
|
selectedIdentity,
|
|
chainId,
|
|
showExportPrivateKeyModal,
|
|
setAccountLabel,
|
|
keyrings,
|
|
rpcPrefs,
|
|
} = this.props;
|
|
const { name, address } = selectedIdentity;
|
|
|
|
const keyring = keyrings.find((kr) => {
|
|
return kr.accounts.includes(address);
|
|
});
|
|
|
|
let exportPrivateKeyFeatureEnabled = true;
|
|
// This feature is disabled for hardware wallets
|
|
if (keyring?.type?.search('Hardware') !== -1) {
|
|
exportPrivateKeyFeatureEnabled = false;
|
|
}
|
|
|
|
return (
|
|
<AccountModalContainer className="account-details-modal">
|
|
<EditableLabel
|
|
className="account-details-modal__name"
|
|
defaultValue={name}
|
|
onSubmit={(label) => setAccountLabel(address, label)}
|
|
/>
|
|
|
|
<QrView
|
|
Qr={{
|
|
data: address,
|
|
}}
|
|
/>
|
|
|
|
<div className="account-details-modal__divider" />
|
|
|
|
<Button
|
|
type="secondary"
|
|
className="account-details-modal__button"
|
|
onClick={() => {
|
|
const accountLink = getAccountLink(address, chainId, rpcPrefs);
|
|
this.context.trackEvent({
|
|
category: 'Navigation',
|
|
event: 'Clicked Block Explorer Link',
|
|
properties: {
|
|
link_type: 'Account Tracker',
|
|
action: 'Account Details Modal',
|
|
block_explorer_domain: getURLHostName(accountLink),
|
|
},
|
|
});
|
|
global.platform.openTab({
|
|
url: accountLink,
|
|
});
|
|
}}
|
|
>
|
|
{rpcPrefs.blockExplorerUrl
|
|
? this.context.t('blockExplorerView', [
|
|
rpcPrefs.blockExplorerUrl.match(/^https?:\/\/(.+)/u)[1],
|
|
])
|
|
: this.context.t('viewOnEtherscan', [
|
|
this.context.t('blockExplorerAccountAction'),
|
|
])}
|
|
</Button>
|
|
|
|
{exportPrivateKeyFeatureEnabled ? (
|
|
<Button
|
|
type="secondary"
|
|
className="account-details-modal__button"
|
|
onClick={() => showExportPrivateKeyModal()}
|
|
>
|
|
{this.context.t('exportPrivateKey')}
|
|
</Button>
|
|
) : null}
|
|
</AccountModalContainer>
|
|
);
|
|
}
|
|
}
|
|
|