diff options
author | Leonid <logvinov.leon@gmail.com> | 2017-11-28 05:53:21 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2017-11-28 05:53:21 +0800 |
commit | cf0a8b2d0503f9d08ac789024d44b196613ecdc3 (patch) | |
tree | 75653154b85dd6df06da46af9411baf57c23367b /packages/website/ts/components/ui/etherscan_icon.tsx | |
parent | 37f0051d8380279a1a882cdc724e54fc09117901 (diff) | |
parent | 4a17f5e82074b01e74ae6982e82419a037eebdb4 (diff) | |
download | dexon-sol-tools-cf0a8b2d0503f9d08ac789024d44b196613ecdc3.tar dexon-sol-tools-cf0a8b2d0503f9d08ac789024d44b196613ecdc3.tar.gz dexon-sol-tools-cf0a8b2d0503f9d08ac789024d44b196613ecdc3.tar.bz2 dexon-sol-tools-cf0a8b2d0503f9d08ac789024d44b196613ecdc3.tar.lz dexon-sol-tools-cf0a8b2d0503f9d08ac789024d44b196613ecdc3.tar.xz dexon-sol-tools-cf0a8b2d0503f9d08ac789024d44b196613ecdc3.tar.zst dexon-sol-tools-cf0a8b2d0503f9d08ac789024d44b196613ecdc3.zip |
Merge branch 'development' into feature/passNetworkId
Diffstat (limited to 'packages/website/ts/components/ui/etherscan_icon.tsx')
-rw-r--r-- | packages/website/ts/components/ui/etherscan_icon.tsx | 50 |
1 files changed, 50 insertions, 0 deletions
diff --git a/packages/website/ts/components/ui/etherscan_icon.tsx b/packages/website/ts/components/ui/etherscan_icon.tsx new file mode 100644 index 000000000..12044f44b --- /dev/null +++ b/packages/website/ts/components/ui/etherscan_icon.tsx @@ -0,0 +1,50 @@ +import * as _ from 'lodash'; +import * as React from 'react'; +import ReactTooltip = require('react-tooltip'); +import {colors} from 'material-ui/styles'; +import {EtherscanLinkSuffixes} from 'ts/types'; +import {utils} from 'ts/utils/utils'; + +interface EtherScanIconProps { + addressOrTxHash: string; + etherscanLinkSuffixes: EtherscanLinkSuffixes; + networkId: number; +} + +export const EtherScanIcon = (props: EtherScanIconProps) => { + const etherscanLinkIfExists = utils.getEtherScanLinkIfExists( + props.addressOrTxHash, props.networkId, EtherscanLinkSuffixes.address, + ); + const transactionTooltipId = `${props.addressOrTxHash}-etherscan-icon-tooltip`; + return ( + <div className="inline"> + {!_.isUndefined(etherscanLinkIfExists) ? + <a + href={etherscanLinkIfExists} + target="_blank" + > + {renderIcon()} + </a> : + <div + className="inline" + data-tip={true} + data-for={transactionTooltipId} + > + {renderIcon()} + <ReactTooltip id={transactionTooltipId}> + Your network (id: {props.networkId}) is not supported by Etherscan + </ReactTooltip> + </div> + } + </div> + ); +}; + +function renderIcon() { + return ( + <i + style={{color: colors.amber600}} + className="zmdi zmdi-open-in-new" + /> + ); +} |