1
0
mirror of https://github.com/trezor/trezor-wallet synced 2024-12-25 08:28:08 +00:00

Delete 'AsideRowCoinExternal' and 'AsideRowCoinWallet' and move its logic into 'AsideRowCoin'

This commit is contained in:
Vasek Mlejnsky 2018-08-16 11:29:14 +02:00
parent 82c215dc81
commit 0410735c2a
5 changed files with 82 additions and 120 deletions

View File

@ -1,24 +0,0 @@
import styled from 'styled-components';
import React from 'react';
import colors from 'config/colors';
import { FONT_SIZE } from 'config/variables';
const Wrapper = styled.div`
display: block;
height: 50px;
font-size: ${FONT_SIZE.BASE};
color: ${colors.TEXT_PRIMARY};
&:hover {
background-color: ${colors.GRAY_LIGHT};
}
`;
const AsideRowCoin = ({ children }) => (
<Wrapper>
{children}
</Wrapper>
);
export default AsideRowCoin;

View File

@ -1,37 +0,0 @@
import styled from 'styled-components';
import React from 'react';
import PropTypes from 'prop-types';
import ICONS from 'config/icons';
import colors from 'config/colors';
import Icon from 'components/common/Icon';
import AsideRow from './AsideRow';
import AsideRowCoin from './AsideRowCoin';
import CoinName from './CoinName';
import { coinProp } from './common';
const AsideRowCoinExternal = ({ coin, url }) => (
<a href={url}>
<AsideRowCoin>
<AsideRow>
<CoinName
coinImg={coin.img}
text={coin.name}
/>
<Icon
icon={ICONS.REDIRECT}
color={colors.TEXT_SECONDARY}
/>
</AsideRow>
</AsideRowCoin>
</a>
);
AsideRowCoinExternal.propTypes = {
...coinProp,
url: PropTypes.string,
};
export default AsideRowCoinExternal;

View File

@ -1,29 +0,0 @@
import React from 'react';
import PropTypes from 'prop-types';
import { NavLink } from 'react-router-dom';
import AsideRow from './AsideRow';
import AsideRowCoin from './AsideRowCoin';
import CoinName from './CoinName';
import { coinProp } from './common';
const AsideRowCoinWallet = ({ coin, url }) => (
<NavLink to={url}>
<AsideRowCoin>
<AsideRow>
<CoinName
coinImg={coin.img}
text={coin.name}
/>
</AsideRow>
</AsideRowCoin>
</NavLink>
);
AsideRowCoinWallet.propTypes = {
...coinProp,
url: PropTypes.string.isRequired,
};
export default AsideRowCoinWallet;

View File

@ -1,21 +1,18 @@
/* @flow */
import React from 'react';
import { NavLink } from 'react-router-dom';
import coins from 'constants/coins';
import colors from 'config/colors';
import ICONS from 'config/icons';
import { NavLink } from 'react-router-dom';
import React from 'react';
import AsideDivider from './AsideDivider';
import AsideRowCoinWallet from './AsideRowCoinWallet';
import AsideRowCoinExternal from './AsideRowCoinExternal';
import AsideSection from './AsideSection';
import AsideRowCoin from './row/coin/AsideRowCoin';
import type { TrezorDevice } from 'flowtype';
import type { Props } from './index';
const CoinSelection = (props: Props): React$Element<string> => {
const { location } = props.router;
const CoinSelection = (props: Props) => {
const { config } = props.localStorage;
const { selectedDevice } = props.wallet;
@ -29,37 +26,43 @@ 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;
let imgName = item.network;
if (item.network === 'ethereum') {
coinImg = 'eth';
} else if (item.network === 'ethereum-classic' ) {
coinImg = 'etc';
imgName = 'eth';
} else if (item.network === 'ethereum-classic') {
imgName = 'etc';
}
const imgUrl = `../images/${imgName}-logo.png`;
return (
<AsideRowCoinWallet
key={item.network}
coin={{
img: coinImg,
name: item.name,
}}
url={url}
/>
<NavLink to={url}>
<AsideRowCoin
coin={{
img: imgUrl,
name: item.name,
}}
/>
</NavLink>
);
});
const externalCoins = coins.map(coin => (
<AsideDivider
coin={{
img: coin.image,
name: coin.coinName,
}}
url={coin.url}
/>
<a href={coin.url}>
<AsideRowCoin
coin={{
img: coin.image,
name: coin.coinName,
}}
icon={{
type: ICONS.REDIRECT,
color: colors.TEXT_SECONDARY,
}}
/>
</a>
));
return (
<AsideSection>
{ walletCoins }

View File

@ -0,0 +1,49 @@
import colors from 'config/colors';
import { FONT_SIZE } from 'config/variables';
import Icon from 'components/common/Icon';
import PropTypes from 'prop-types';
import React from 'react';
import styled from 'styled-components';
import AsideRow from '../AsideRow';
import CoinName from './CoinName';
import { coinProp } from '../../common';
const Wrapper = styled.div`
display: block;
height: 50px;
font-size: ${FONT_SIZE.BASE};
color: ${colors.TEXT_PRIMARY};
&:hover {
background-color: ${colors.GRAY_LIGHT};
}
`;
const AsideRowCoin = ({ coin, icon }) => (
<Wrapper>
<AsideRow>
<CoinName
coinImg={coin.img}
text={coin.name}
/>
{icon && (
<Icon
icon={icon.type}
color={icon.color}
/>
)}
</AsideRow>
</Wrapper>
);
AsideRowCoin.propTypes = {
...coinProp,
icon: PropTypes.shape({
type: PropTypes.string.isRequired,
color: PropTypes.string.isRequired,
}),
};
export default AsideRowCoin;