aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts')
-rw-r--r--packages/website/ts/blockchain.ts2
-rw-r--r--packages/website/ts/components/eth_wrappers.tsx7
-rw-r--r--packages/website/ts/components/generate_order/asset_picker.tsx40
-rw-r--r--packages/website/ts/utils/configs.ts43
-rw-r--r--packages/website/ts/utils/utils.ts4
5 files changed, 39 insertions, 57 deletions
diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts
index cc2afa28a..9ef9bbe22 100644
--- a/packages/website/ts/blockchain.ts
+++ b/packages/website/ts/blockchain.ts
@@ -769,7 +769,7 @@ export class Blockchain {
_.each(tokenRegistryTokens, (t: ZeroExToken) => {
// HACK: For now we have a hard-coded list of iconUrls for the dummyTokens
// TODO: Refactor this out and pull the iconUrl directly from the TokenRegistry
- const iconUrl = configs.ICON_URL_BY_SYMBOL[t.symbol];
+ const iconUrl = utils.getTokenIconUrl(t.symbol);
const token: Token = {
iconUrl,
address: t.address,
diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx
index 20b446155..0b282b2a1 100644
--- a/packages/website/ts/components/eth_wrappers.tsx
+++ b/packages/website/ts/components/eth_wrappers.tsx
@@ -20,6 +20,7 @@ import {
} from 'ts/types';
import { configs } from 'ts/utils/configs';
import { constants } from 'ts/utils/constants';
+import { utils } from 'ts/utils/utils';
const DATE_FORMAT = 'D/M/YY';
const ICON_DIMENSION = 40;
@@ -95,7 +96,11 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt
this.props.networkId,
EtherscanLinkSuffixes.Address,
);
- const tokenLabel = this._renderToken('Wrapped Ether', etherToken.address, configs.ICON_URL_BY_SYMBOL.WETH);
+ const tokenLabel = this._renderToken(
+ 'Wrapped Ether',
+ etherToken.address,
+ utils.getTokenIconUrl(etherToken.symbol),
+ );
const userEtherBalanceInEth = !_.isUndefined(this.props.userEtherBalanceInWei)
? Web3Wrapper.toUnitAmount(this.props.userEtherBalanceInWei, constants.DECIMAL_PLACES_ETH)
: undefined;
diff --git a/packages/website/ts/components/generate_order/asset_picker.tsx b/packages/website/ts/components/generate_order/asset_picker.tsx
index 3d53a9e7d..5eada37b6 100644
--- a/packages/website/ts/components/generate_order/asset_picker.tsx
+++ b/packages/website/ts/components/generate_order/asset_picker.tsx
@@ -3,6 +3,8 @@ import Dialog from 'material-ui/Dialog';
import FlatButton from 'material-ui/FlatButton';
import * as moment from 'moment';
import * as React from 'react';
+import firstBy = require('thenby');
+
import { Blockchain } from 'ts/blockchain';
import { NewTokenForm } from 'ts/components/generate_order/new_token_form';
import { TrackTokenConfirmation } from 'ts/components/track_token_confirmation';
@@ -87,10 +89,10 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
return (
<Dialog
title={dialogConfigs.title}
- titleStyle={{ fontWeight: 100 }}
modal={dialogConfigs.isModal}
open={this.props.isOpen}
actions={dialogConfigs.actions}
+ autoScrollBodyContent={true}
onRequestClose={this._onCloseDialog.bind(this)}
>
{this.state.assetView === AssetViews.ASSET_PICKER && this._renderAssetPicker()}
@@ -121,9 +123,8 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
<div
className="flex flex-wrap"
style={{
- overflowY: 'auto',
- maxWidth: 720,
- maxHeight: 356,
+ maxWidth: 1000,
+ maxHeight: 600,
marginBottom: 10,
}}
>
@@ -134,15 +135,28 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
private _renderGridTiles(): React.ReactNode {
let isHovered;
let tileStyles;
- const gridTiles = _.map(this.props.tokenByAddress, (token: Token, address: string) => {
- if (
- (this.props.tokenVisibility === TokenVisibility.TRACKED && !utils.isTokenTracked(token)) ||
- (this.props.tokenVisibility === TokenVisibility.UNTRACKED && utils.isTokenTracked(token)) ||
- token.symbol === constants.ZRX_TOKEN_SYMBOL ||
- token.symbol === constants.ETHER_TOKEN_SYMBOL
- ) {
- return null; // Skip
- }
+ const allTokens = _.values(this.props.tokenByAddress);
+ // filter tokens based on visibility specified in props, do not show ZRX or ETHER as tracked or untracked
+ const filteredTokens =
+ this.props.tokenVisibility === TokenVisibility.ALL
+ ? allTokens
+ : _.filter(allTokens, token => {
+ return (
+ token.symbol !== constants.ZRX_TOKEN_SYMBOL &&
+ token.symbol !== constants.ETHER_TOKEN_SYMBOL &&
+ ((this.props.tokenVisibility === TokenVisibility.TRACKED && utils.isTokenTracked(token)) ||
+ (this.props.tokenVisibility === TokenVisibility.UNTRACKED &&
+ !utils.isTokenTracked(token)))
+ );
+ });
+ // if we are showing tracked tokens, sort by date added, otherwise sort by symbol
+ const sortKey = this.props.tokenVisibility === TokenVisibility.TRACKED ? 'trackedTimestamp' : 'symbol';
+ const sortedTokens = filteredTokens.sort(firstBy(sortKey));
+ if (_.isEmpty(sortedTokens)) {
+ return <div className="mx-auto p4 h2">No tokens to remove.</div>;
+ }
+ const gridTiles = _.map(sortedTokens, token => {
+ const address = token.address;
isHovered = this.state.hoveredAddress === address;
tileStyles = {
cursor: 'pointer',
diff --git a/packages/website/ts/utils/configs.ts b/packages/website/ts/utils/configs.ts
index e8a486c35..97aabd13d 100644
--- a/packages/website/ts/utils/configs.ts
+++ b/packages/website/ts/utils/configs.ts
@@ -22,50 +22,9 @@ export const configs = {
DOMAIN_DEVELOPMENT: '0xproject.localhost:3572',
DOMAIN_PRODUCTION: '0xproject.com',
ENVIRONMENT: isDevelopment ? Environments.DEVELOPMENT : Environments.PRODUCTION,
- ICON_URL_BY_SYMBOL: {
- REP: '/images/token_icons/augur.png',
- DGD: '/images/token_icons/digixdao.png',
- WETH: '/images/token_icons/ether_erc20.png',
- MLN: '/images/token_icons/melon.png',
- GNT: '/images/token_icons/golem.png',
- MKR: '/images/token_icons/makerdao.png',
- ZRX: '/images/token_icons/zero_ex.png',
- ANT: '/images/token_icons/aragon.png',
- BNT: '/images/token_icons/bancor.png',
- BAT: '/images/token_icons/basicattentiontoken.png',
- CVC: '/images/token_icons/civic.png',
- EOS: '/images/token_icons/eos.png',
- FUN: '/images/token_icons/funfair.png',
- GNO: '/images/token_icons/gnosis.png',
- ICN: '/images/token_icons/iconomi.png',
- OMG: '/images/token_icons/omisego.png',
- SNT: '/images/token_icons/status.png',
- STORJ: '/images/token_icons/storjcoinx.png',
- PAY: '/images/token_icons/tenx.png',
- QTUM: '/images/token_icons/qtum.png',
- DNT: '/images/token_icons/district0x.png',
- SNGLS: '/images/token_icons/singularity.png',
- EDG: '/images/token_icons/edgeless.png',
- '1ST': '/images/token_icons/firstblood.jpg',
- WINGS: '/images/token_icons/wings.png',
- BQX: '/images/token_icons/bitquence.png',
- LUN: '/images/token_icons/lunyr.png',
- RLC: '/images/token_icons/iexec.png',
- MCO: '/images/token_icons/monaco.png',
- ADT: '/images/token_icons/adtoken.png',
- CFI: '/images/token_icons/cofound-it.png',
- ROL: '/images/token_icons/etheroll.png',
- WGNT: '/images/token_icons/golem.png',
- MTL: '/images/token_icons/metal.png',
- NMR: '/images/token_icons/numeraire.png',
- SAN: '/images/token_icons/santiment.png',
- TAAS: '/images/token_icons/taas.png',
- TKN: '/images/token_icons/tokencard.png',
- TRST: '/images/token_icons/trust.png',
- } as { [symbol: string]: string },
GOOGLE_ANALYTICS_ID: 'UA-98720122-1',
LAST_LOCAL_STORAGE_FILL_CLEARANCE_DATE: '2017-11-22',
- LAST_LOCAL_STORAGE_TRACKED_TOKEN_CLEARANCE_DATE: '2018-6-25',
+ LAST_LOCAL_STORAGE_TRACKED_TOKEN_CLEARANCE_DATE: '2018-7-5',
OUTDATED_WRAPPED_ETHERS: [
{
42: {
diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts
index 623819fc9..d50e9c619 100644
--- a/packages/website/ts/utils/utils.ts
+++ b/packages/website/ts/utils/utils.ts
@@ -474,4 +474,8 @@ export const utils = {
}
return [downloadLink, isOnMobile];
},
+ getTokenIconUrl(symbol: string): string {
+ const result = `/images/token_icons/${symbol}.png`;
+ return result;
+ },
};
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-11 12:37:15 +0800