kopia lustrzana https://gitlab.com/soapbox-pub/soapbox
CryptoDonate: add block explorer links
rodzic
51ac3e3d4e
commit
acbfd7bcc3
|
@ -2,9 +2,17 @@ import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||||
import { FormattedMessage } from 'react-intl';
|
import { FormattedMessage } from 'react-intl';
|
||||||
|
import Icon from 'soapbox/components/icon';
|
||||||
|
import blockExplorers from '../utils/block_explorers.json';
|
||||||
import CoinDB from '../utils/coin_db';
|
import CoinDB from '../utils/coin_db';
|
||||||
import { getCoinIcon } from '../utils/coin_icons';
|
import { getCoinIcon } from '../utils/coin_icons';
|
||||||
|
|
||||||
|
const getExplorerUrl = (ticker, address) => {
|
||||||
|
const template = blockExplorers[ticker];
|
||||||
|
if (!template) return false;
|
||||||
|
return template.replace('{address}', address);
|
||||||
|
};
|
||||||
|
|
||||||
export default class CryptoAddress extends ImmutablePureComponent {
|
export default class CryptoAddress extends ImmutablePureComponent {
|
||||||
|
|
||||||
static propTypes = {
|
static propTypes = {
|
||||||
|
@ -29,6 +37,7 @@ export default class CryptoAddress extends ImmutablePureComponent {
|
||||||
render() {
|
render() {
|
||||||
const { address, ticker, note } = this.props;
|
const { address, ticker, note } = this.props;
|
||||||
const title = CoinDB.getIn([ticker, 'name']);
|
const title = CoinDB.getIn([ticker, 'name']);
|
||||||
|
const explorerUrl = getExplorerUrl(ticker, address);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className='crypto-address'>
|
<div className='crypto-address'>
|
||||||
|
@ -37,6 +46,11 @@ export default class CryptoAddress extends ImmutablePureComponent {
|
||||||
<img src={getCoinIcon(ticker)} alt={title} />
|
<img src={getCoinIcon(ticker)} alt={title} />
|
||||||
</div>
|
</div>
|
||||||
<div className='crypto-address__title'>{title}</div>
|
<div className='crypto-address__title'>{title}</div>
|
||||||
|
<div className='crypto-address__actions'>
|
||||||
|
<a href={explorerUrl} target='_blank'>
|
||||||
|
<Icon id='external-link' />
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{note && <div className='crypto-address__note'>{note}</div>}
|
{note && <div className='crypto-address__note'>{note}</div>}
|
||||||
<div className='crypto-address__address'>
|
<div className='crypto-address__address'>
|
||||||
|
|
|
@ -0,0 +1,8 @@
|
||||||
|
{
|
||||||
|
"bch": "https://explorer.bitcoin.com/bch/address/{address}",
|
||||||
|
"btc": "https://explorer.bitcoin.com/btc/address/{address}",
|
||||||
|
"doge": "https://dogechain.info/address/{address}",
|
||||||
|
"eth": "https://etherscan.io/address/{address}",
|
||||||
|
"ubq": "https://ubiqscan.io/address/{address}",
|
||||||
|
"xmr": "https://monerohash.com/explorer/search?value={address}"
|
||||||
|
}
|
|
@ -25,12 +25,26 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&__actions {
|
||||||
|
margin-left: auto;
|
||||||
|
padding-left: 10px;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: var(--primary-text-color--faint);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&__note {
|
&__note {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__address {
|
&__address {
|
||||||
margin-top: auto;
|
margin-top: auto;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
input {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Ładowanie…
Reference in New Issue