1
0
mirror of https://github.com/trezor/trezor-wallet synced 2024-11-13 20:08:56 +00:00

Use 'CoinLink' components inside a 'CoinSelection' component

This commit is contained in:
Vasek Mlejnsky 2018-08-14 21:59:06 +02:00
parent 7497c78a39
commit 57a9b3e114

View File

@ -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;