diff options
author | Fabio Berger <me@fabioberger.com> | 2018-04-09 13:34:36 +0800 |
---|---|---|
committer | Fabio Berger <me@fabioberger.com> | 2018-04-09 13:34:36 +0800 |
commit | e05b55d4a5698d3e936e7164ed69d9417d12cd12 (patch) | |
tree | 1f9be2d21d21cc915687f3606b2dad9e8a4add8e /packages/website/ts/components/relayer_index/relayer_top_tokens.tsx | |
parent | 6f24337a5309bc4b06d0a91eac3af7566bde5754 (diff) | |
parent | 073bf738ddb271b6b4158798baf4cac3cb0608e9 (diff) | |
download | dexon-sol-tools-e05b55d4a5698d3e936e7164ed69d9417d12cd12.tar dexon-sol-tools-e05b55d4a5698d3e936e7164ed69d9417d12cd12.tar.gz dexon-sol-tools-e05b55d4a5698d3e936e7164ed69d9417d12cd12.tar.bz2 dexon-sol-tools-e05b55d4a5698d3e936e7164ed69d9417d12cd12.tar.lz dexon-sol-tools-e05b55d4a5698d3e936e7164ed69d9417d12cd12.tar.xz dexon-sol-tools-e05b55d4a5698d3e936e7164ed69d9417d12cd12.tar.zst dexon-sol-tools-e05b55d4a5698d3e936e7164ed69d9417d12cd12.zip |
merge development
Diffstat (limited to 'packages/website/ts/components/relayer_index/relayer_top_tokens.tsx')
-rw-r--r-- | packages/website/ts/components/relayer_index/relayer_top_tokens.tsx | 46 |
1 files changed, 46 insertions, 0 deletions
diff --git a/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx b/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx new file mode 100644 index 000000000..233590b78 --- /dev/null +++ b/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx @@ -0,0 +1,46 @@ +import { colors, EtherscanLinkSuffixes, Styles, utils as sharedUtils } from '@0xproject/react-shared'; +import * as _ from 'lodash'; +import * as React from 'react'; + +import { TokenIcon } from 'ts/components/ui/token_icon'; +import { Token } from 'ts/types'; + +export interface TopTokensProps { + tokens: Token[]; + networkId: number; +} + +const styles: Styles = { + tokenLabel: { + textDecoration: 'none', + color: colors.mediumBlue, + }, + followingTokenLabel: { + paddingLeft: 16, + }, +}; + +export const TopTokens: React.StatelessComponent<TopTokensProps> = (props: TopTokensProps) => { + return ( + <div className="flex"> + {_.map(props.tokens, (token: Token, index: number) => { + const firstItemStyle = { ...styles.tokenLabel, ...styles.followingTokenLabel }; + const style = index !== 0 ? firstItemStyle : styles.tokenLabel; + return ( + <a + key={token.address} + href={tokenLinkFromToken(token, props.networkId)} + target="_blank" + style={style} + > + {token.symbol} + </a> + ); + })} + </div> + ); +}; + +function tokenLinkFromToken(token: Token, networkId: number) { + return sharedUtils.getEtherScanLinkIfExists(token.address, networkId, EtherscanLinkSuffixes.Address); +} |