arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2024-11-24 09:18:09 +00:00
Code Issues Releases Wiki Activity

Use 'CoinLink' components inside a 'CoinSelection' component

Browse Source
This commit is contained in:
Vasek Mlejnsky 2018-08-14 21:59:06 +02:00
parent 7497c78a39
commit 57a9b3e114
1 changed files with 73 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

98
src/js/components/wallet/aside/CoinSelection.js
View File

@ -1,12 +1,21 @@
/* @flow */ /* @flow */
import styled from 'styled-components';
import React from 'react'; 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 { TrezorDevice } from 'flowtype';
import type { Props } from './index'; 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 CoinSelection = (props: Props): React$Element<string> => {
const { location } = props.router; const { location } = props.router;
const { config } = props.localStorage; const { config } = props.localStorage;
@ -23,38 +32,75 @@ const CoinSelection = (props: Props): React$Element<string> => {
const walletCoins = config.coins.map((item) => { const walletCoins = config.coins.map((item) => {
const url = `${baseUrl}/network/${item.network}/account/0`; const url = `${baseUrl}/network/${item.network}/account/0`;
const className = `coin ${item.network}`; const className = `coin ${item.network}`;
let coinImg = item.network;
if (item.network === 'ethereum') {
coinImg = 'eth';
} else if (item.network === 'ethereum-classic' ) {
coinImg = 'etc';
}
return ( return (
<NavLink key={item.network} to={url} className={className}> <WalletCoinLink
{ item.name } key={item.network}
</NavLink> coin={{
img: coinImg,
name: item.name,
}}
url={url}
/>
); );
}); });
return ( return (
<section> <Section>
{ walletCoins } { walletCoins }
<div className="coin-divider"> <div className="coin-divider">
Other coins <span>(You will be redirected)</span> Other coins <span>(You will be redirected)</span>
</div>
<a href="https://wallet.trezor.io/#/coin/btc" className="coin btc external"> <ExternalCoinLink
Bitcoin coin={{
</a> img: 'btc',
<a href="https://wallet.trezor.io/#/coin/ltc" className="coin ltc external"> name: 'Bitcoin',
Litecoin }}
</a> url={'https://wallet.trezor.io/#/coin/ltc'}
<a href="https://wallet.trezor.io/#/coin/bch" className="coin bch external"> />
Bitcoin Cash <ExternalCoinLink
</a> coin={{
<a href="https://wallet.trezor.io/#/coin/btg" className="coin btg external"> img: 'ltc',
Bitcoin Gold name: 'Litecoin',
</a> }}
<a href="https://wallet.trezor.io/#/coin/dash" className="coin dash external"> url={'https://wallet.trezor.io/#/coin/ltc'}
Dash />
</a> <ExternalCoinLink
<a href="https://wallet.trezor.io/#/coin/zec" className="coin zec external"> coin={{
Zcash img: 'bch',
</a> name: 'Bitcoin Cash',
</section> }}
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>
); );
}; };