mirror of
https://github.com/trezor/trezor-wallet
synced 2024-12-25 16:38:08 +00:00
Use 'CoinLink' components inside a 'CoinSelection' component
This commit is contained in:
parent
7497c78a39
commit
57a9b3e114
@ -1,12 +1,21 @@
|
||||
/* @flow */
|
||||
|
||||
|
||||
import styled from 'styled-components';
|
||||
import React from 'react';
|
||||
import { Link, NavLink } from 'react-router-dom';
|
||||
import { NavLink } from 'react-router-dom';
|
||||
|
||||
import { ExternalCoinLink, WalletCoinLink } from './CoinLink/';
|
||||
import AsideDivider from './AsideDivider';
|
||||
|
||||
import type { TrezorDevice } from 'flowtype';
|
||||
import type { Props } from './index';
|
||||
|
||||
const Section = styled.section`
|
||||
width: 320px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
`;
|
||||
|
||||
const CoinSelection = (props: Props): React$Element<string> => {
|
||||
const { location } = props.router;
|
||||
const { config } = props.localStorage;
|
||||
@ -23,39 +32,76 @@ const CoinSelection = (props: Props): React$Element<string> => {
|
||||
const walletCoins = config.coins.map((item) => {
|
||||
const url = `${baseUrl}/network/${item.network}/account/0`;
|
||||
const className = `coin ${item.network}`;
|
||||
|
||||
let coinImg = item.network;
|
||||
if (item.network === 'ethereum') {
|
||||
coinImg = 'eth';
|
||||
} else if (item.network === 'ethereum-classic' ) {
|
||||
coinImg = 'etc';
|
||||
}
|
||||
|
||||
return (
|
||||
<NavLink key={item.network} to={url} className={className}>
|
||||
{ item.name }
|
||||
</NavLink>
|
||||
<WalletCoinLink
|
||||
key={item.network}
|
||||
coin={{
|
||||
img: coinImg,
|
||||
name: item.name,
|
||||
}}
|
||||
url={url}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
||||
return (
|
||||
<section>
|
||||
<Section>
|
||||
{ walletCoins }
|
||||
<div className="coin-divider">
|
||||
Other coins <span>(You will be redirected)</span>
|
||||
</div>
|
||||
<a href="https://wallet.trezor.io/#/coin/btc" className="coin btc external">
|
||||
Bitcoin
|
||||
</a>
|
||||
<a href="https://wallet.trezor.io/#/coin/ltc" className="coin ltc external">
|
||||
Litecoin
|
||||
</a>
|
||||
<a href="https://wallet.trezor.io/#/coin/bch" className="coin bch external">
|
||||
Bitcoin Cash
|
||||
</a>
|
||||
<a href="https://wallet.trezor.io/#/coin/btg" className="coin btg external">
|
||||
Bitcoin Gold
|
||||
</a>
|
||||
<a href="https://wallet.trezor.io/#/coin/dash" className="coin dash external">
|
||||
Dash
|
||||
</a>
|
||||
<a href="https://wallet.trezor.io/#/coin/zec" className="coin zec external">
|
||||
Zcash
|
||||
</a>
|
||||
</section>
|
||||
|
||||
<ExternalCoinLink
|
||||
coin={{
|
||||
img: 'btc',
|
||||
name: 'Bitcoin',
|
||||
}}
|
||||
url={'https://wallet.trezor.io/#/coin/ltc'}
|
||||
/>
|
||||
<ExternalCoinLink
|
||||
coin={{
|
||||
img: 'ltc',
|
||||
name: 'Litecoin',
|
||||
}}
|
||||
url={'https://wallet.trezor.io/#/coin/ltc'}
|
||||
/>
|
||||
<ExternalCoinLink
|
||||
coin={{
|
||||
img: 'bch',
|
||||
name: 'Bitcoin Cash',
|
||||
}}
|
||||
url={'https://wallet.trezor.io/#/coin/bch'}
|
||||
/>
|
||||
<ExternalCoinLink
|
||||
coin={{
|
||||
img: 'btg',
|
||||
name: 'Bitcoin Gold',
|
||||
}}
|
||||
url={'https://wallet.trezor.io/#/coin/btg'}
|
||||
/>
|
||||
<ExternalCoinLink
|
||||
coin={{
|
||||
img: 'Dash',
|
||||
name: 'Dash',
|
||||
}}
|
||||
url={'https://wallet.trezor.io/#/coin/dash'}
|
||||
/>
|
||||
<ExternalCoinLink
|
||||
coin={{
|
||||
img: 'zec',
|
||||
name: 'Zcash',
|
||||
}}
|
||||
url={'https://wallet.trezor.io/#/coin/zec'}
|
||||
/>
|
||||
</Section>
|
||||
);
|
||||
};
|
||||
|
||||
export default CoinSelection;
|
||||
export default CoinSelection;
|
||||
|
Loading…
Reference in New Issue
Block a user