aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/components
diff options
context:
space:
mode:
authorFabio Berger <me@fabioberger.com>2018-06-07 18:21:44 +0800
committerFabio Berger <me@fabioberger.com>2018-06-07 18:21:44 +0800
commit10478a6b2fd1f2a01597a88afde9cf582640a849 (patch)
tree3ebbb29656cf59b2547ec3c5a3c5b90ee6264483 /packages/website/ts/components
parentcf8fdd3a701f21bfc3b2ec8397fa65948f5cdc78 (diff)
parente0bc01eea1c20e0afda296f331c6a475e062b59c (diff)
downloaddexon-sol-tools-10478a6b2fd1f2a01597a88afde9cf582640a849.tar
dexon-sol-tools-10478a6b2fd1f2a01597a88afde9cf582640a849.tar.gz
dexon-sol-tools-10478a6b2fd1f2a01597a88afde9cf582640a849.tar.bz2
dexon-sol-tools-10478a6b2fd1f2a01597a88afde9cf582640a849.tar.lz
dexon-sol-tools-10478a6b2fd1f2a01597a88afde9cf582640a849.tar.xz
dexon-sol-tools-10478a6b2fd1f2a01597a88afde9cf582640a849.tar.zst
dexon-sol-tools-10478a6b2fd1f2a01597a88afde9cf582640a849.zip
Merge branch 'v2-prototype' into refactor/move-spawn-switch-to-utils
* v2-prototype: (66 commits) Run prettier Remove unused variable Fix linting issues Change shouldRenderHeader prop to shouldHideHeader Get build and tests to pass typo Apply prettier Update contracts tests after rebase Apply various fixes based on PR feedback Document debug_increaseTime method and fix typo in devnet README Use an enum for ProviderType in contracts/src/utils/web3_wrapper Update contracts package README Update relevant changelogs Remove global gas estimate buffer Add Async suffix to relevant assertions Fix linter errors Update package.json and yarn.lock Update more things to work with both Geth and Ganache Small fixes and cleanup Add additional gas to calls to fillOrderNoThrow ... # Conflicts: # packages/order-watcher/src/order_watcher/order_watcher.ts # packages/react-docs/src/components/type.tsx # packages/website/ts/components/ui/lifecycle_raised_button.tsx # packages/website/ts/components/wallet/wallet.tsx
Diffstat (limited to 'packages/website/ts/components')
-rw-r--r--packages/website/ts/components/dialogs/blockchain_err_dialog.tsx1
-rw-r--r--packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx6
-rw-r--r--packages/website/ts/components/dialogs/track_token_confirmation_dialog.tsx1
-rw-r--r--packages/website/ts/components/eth_weth_conversion_button.tsx2
-rw-r--r--packages/website/ts/components/eth_wrappers.tsx26
-rw-r--r--packages/website/ts/components/fill_order.tsx17
-rw-r--r--packages/website/ts/components/forms/subscribe_form.tsx1
-rw-r--r--packages/website/ts/components/generate_order/generate_order_form.tsx17
-rw-r--r--packages/website/ts/components/inputs/allowance_toggle.tsx2
-rw-r--r--packages/website/ts/components/inputs/identicon_address_input.tsx1
-rw-r--r--packages/website/ts/components/inputs/token_input.tsx1
-rw-r--r--packages/website/ts/components/legacy_portal/legacy_portal.tsx17
-rw-r--r--packages/website/ts/components/legacy_portal/legacy_portal_menu.tsx3
-rw-r--r--packages/website/ts/components/onboarding/onboarding_flow.tsx2
-rw-r--r--packages/website/ts/components/onboarding/onboarding_tooltip.tsx1
-rw-r--r--packages/website/ts/components/portal/menu.tsx3
-rw-r--r--packages/website/ts/components/portal/portal.tsx11
-rw-r--r--packages/website/ts/components/portal/section.tsx1
-rw-r--r--packages/website/ts/components/redirecter.tsx1
-rw-r--r--packages/website/ts/components/relayer_index/relayer_grid_tile.tsx3
-rw-r--r--packages/website/ts/components/relayer_index/relayer_top_tokens.tsx1
-rw-r--r--packages/website/ts/components/sidebar_header.tsx3
-rw-r--r--packages/website/ts/components/token_balances.tsx37
-rw-r--r--packages/website/ts/components/top_bar/provider_display.tsx1
-rw-r--r--packages/website/ts/components/top_bar/provider_picker.tsx2
-rw-r--r--packages/website/ts/components/top_bar/top_bar.tsx22
-rw-r--r--packages/website/ts/components/trade_history/trade_history.tsx29
-rw-r--r--packages/website/ts/components/ui/copy_icon.tsx1
-rw-r--r--packages/website/ts/components/ui/drop_down.tsx1
-rw-r--r--packages/website/ts/components/ui/etherscan_icon.tsx1
-rw-r--r--packages/website/ts/components/ui/island.tsx1
-rw-r--r--packages/website/ts/components/ui/lifecycle_raised_button.tsx1
-rw-r--r--packages/website/ts/components/ui/overlay.tsx1
-rw-r--r--packages/website/ts/components/ui/party.tsx1
-rw-r--r--packages/website/ts/components/ui/swap_icon.tsx1
-rw-r--r--packages/website/ts/components/ui/text.tsx2
-rw-r--r--packages/website/ts/components/wallet/wallet.tsx50
-rw-r--r--packages/website/ts/components/wallet/wallet_disconnected_item.tsx1
-rw-r--r--packages/website/ts/components/wallet/wrap_ether_item.tsx1
39 files changed, 138 insertions, 136 deletions
diff --git a/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx b/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx
index 7156e700b..b968a3147 100644
--- a/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx
+++ b/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx
@@ -1,5 +1,4 @@
import { colors, Networks } from '@0xproject/react-shared';
-import * as _ from 'lodash';
import Dialog from 'material-ui/Dialog';
import FlatButton from 'material-ui/FlatButton';
import * as React from 'react';
diff --git a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx
index d647bba80..9ac78e80e 100644
--- a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx
+++ b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx
@@ -20,7 +20,7 @@ interface EthWethConversionDialogProps {
onCancelled: () => void;
isOpen: boolean;
token: Token;
- etherBalanceInWei: BigNumber;
+ etherBalanceInWei?: BigNumber;
lastForceTokenStateRefetch: number;
}
@@ -60,7 +60,7 @@ export class EthWethConversionDialog extends React.Component<
<FlatButton key="convert" label="Convert" primary={true} onTouchTap={this._onConvertClick.bind(this)} />,
];
const title = this.props.direction === Side.Deposit ? 'Wrap ETH' : 'Unwrap WETH';
- return (
+ return !_.isUndefined(this.props.etherBalanceInWei) ? (
<Dialog
title={title}
titleStyle={{ fontWeight: 100 }}
@@ -70,7 +70,7 @@ export class EthWethConversionDialog extends React.Component<
>
{this._renderConversionDialogBody()}
</Dialog>
- );
+ ) : null;
}
private _renderConversionDialogBody(): React.ReactNode {
const explanation =
diff --git a/packages/website/ts/components/dialogs/track_token_confirmation_dialog.tsx b/packages/website/ts/components/dialogs/track_token_confirmation_dialog.tsx
index ac0b27cdc..f6594b9d5 100644
--- a/packages/website/ts/components/dialogs/track_token_confirmation_dialog.tsx
+++ b/packages/website/ts/components/dialogs/track_token_confirmation_dialog.tsx
@@ -1,4 +1,3 @@
-import * as _ from 'lodash';
import Dialog from 'material-ui/Dialog';
import FlatButton from 'material-ui/FlatButton';
import * as React from 'react';
diff --git a/packages/website/ts/components/eth_weth_conversion_button.tsx b/packages/website/ts/components/eth_weth_conversion_button.tsx
index 2fb35cc1c..4b91a2ebd 100644
--- a/packages/website/ts/components/eth_weth_conversion_button.tsx
+++ b/packages/website/ts/components/eth_weth_conversion_button.tsx
@@ -18,7 +18,7 @@ interface EthWethConversionButtonProps {
ethToken: Token;
dispatcher: Dispatcher;
blockchain: Blockchain;
- userEtherBalanceInWei?: BigNumber;
+ userEtherBalanceInWei: BigNumber;
isOutdatedWrappedEther: boolean;
onConversionSuccessful?: () => void;
isDisabled?: boolean;
diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx
index 1db5ff77f..ca8634693 100644
--- a/packages/website/ts/components/eth_wrappers.tsx
+++ b/packages/website/ts/components/eth_wrappers.tsx
@@ -20,7 +20,6 @@ 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;
@@ -35,6 +34,7 @@ interface EthWrappersProps {
userAddress: string;
userEtherBalanceInWei?: BigNumber;
lastForceTokenStateRefetch: number;
+ isFullWidth?: boolean;
}
interface EthWrappersState {
@@ -43,6 +43,9 @@ interface EthWrappersState {
}
export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersState> {
+ public static defaultProps: Partial<EthWrappersProps> = {
+ isFullWidth: false,
+ };
private _isUnmounted: boolean;
constructor(props: EthWrappersProps) {
super(props);
@@ -93,12 +96,12 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt
EtherscanLinkSuffixes.Address,
);
const tokenLabel = this._renderToken('Wrapped Ether', etherToken.address, configs.ICON_URL_BY_SYMBOL.WETH);
- const userEtherBalanceInEth = Web3Wrapper.toUnitAmount(
- this.props.userEtherBalanceInWei,
- constants.DECIMAL_PLACES_ETH,
- );
+ const userEtherBalanceInEth = !_.isUndefined(this.props.userEtherBalanceInWei)
+ ? Web3Wrapper.toUnitAmount(this.props.userEtherBalanceInWei, constants.DECIMAL_PLACES_ETH)
+ : undefined;
+ const rootClassName = this.props.isFullWidth ? 'clearfix' : 'clearfix lg-px4 md-px4 sm-px2';
return (
- <div className="clearfix lg-px4 md-px4 sm-px2" style={{ minHeight: 600 }}>
+ <div className={rootClassName} style={{ minHeight: 600 }}>
<div className="relative">
<h3>ETH Wrapper</h3>
<div className="absolute" style={{ top: 0, right: 0 }}>
@@ -116,7 +119,7 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt
<div>
<div className="py2">Wrap ETH into an ERC20-compliant Ether token. 1 ETH = 1 WETH.</div>
<div>
- <Table selectable={false} style={{ backgroundColor: colors.grey50 }}>
+ <Table selectable={false} style={{ backgroundColor: 'transparent' }}>
<TableHeader displaySelectAll={false} adjustForCheckbox={false}>
<TableRow>
<TableHeaderColumn>ETH Token</TableHeaderColumn>
@@ -143,7 +146,11 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt
</div>
</TableRowColumn>
<TableRowColumn>
- {userEtherBalanceInEth.toFixed(configs.AMOUNT_DISPLAY_PRECSION)} ETH
+ {!_.isUndefined(userEtherBalanceInEth) ? (
+ `${userEtherBalanceInEth.toFixed(configs.AMOUNT_DISPLAY_PRECSION)} ETH`
+ ) : (
+ <i className="zmdi zmdi-spinner zmdi-hc-spin" />
+ )}
</TableRowColumn>
<TableRowColumn>
<EthWethConversionButton
@@ -157,6 +164,7 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt
dispatcher={this.props.dispatcher}
blockchain={this.props.blockchain}
userEtherBalanceInWei={this.props.userEtherBalanceInWei}
+ isDisabled={_.isUndefined(userEtherBalanceInEth)}
/>
</TableRowColumn>
</TableRow>
@@ -203,7 +211,7 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt
it to the updated WETH token.
</div>
<div>
- <Table selectable={false} style={{ backgroundColor: colors.grey50 }}>
+ <Table selectable={false} style={{ backgroundColor: 'transparent' }}>
<TableHeader displaySelectAll={false} adjustForCheckbox={false}>
<TableRow>
<TableHeaderColumn>WETH Version</TableHeaderColumn>
diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx
index 0168ec8f6..b6b52993e 100644
--- a/packages/website/ts/components/fill_order.tsx
+++ b/packages/website/ts/components/fill_order.tsx
@@ -39,6 +39,8 @@ interface FillOrderProps {
initialOrder: Order;
dispatcher: Dispatcher;
lastForceTokenStateRefetch: number;
+ isFullWidth?: boolean;
+ shouldHideHeader?: boolean;
}
interface FillOrderState {
@@ -61,6 +63,10 @@ interface FillOrderState {
}
export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
+ public static defaultProps: Partial<FillOrderProps> = {
+ isFullWidth: false,
+ shouldHideHeader: false,
+ };
private _isUnmounted: boolean;
constructor(props: FillOrderProps) {
super(props);
@@ -97,10 +103,15 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
this._isUnmounted = true;
}
public render(): React.ReactNode {
+ const rootClassName = this.props.isFullWidth ? 'clearfix' : 'lg-px4 md-px4 sm-px2';
return (
- <div className="clearfix lg-px4 md-px4 sm-px2" style={{ minHeight: 600 }}>
- <h3>Fill an order</h3>
- <Divider />
+ <div className={rootClassName} style={{ minHeight: 600 }}>
+ {!this.props.shouldHideHeader && (
+ <div>
+ <h3>Fill an order</h3>
+ <Divider />
+ </div>
+ )}
<div>
{!this.props.isOrderInUrl && (
<div>
diff --git a/packages/website/ts/components/forms/subscribe_form.tsx b/packages/website/ts/components/forms/subscribe_form.tsx
index 04ef28e70..8ef58328e 100644
--- a/packages/website/ts/components/forms/subscribe_form.tsx
+++ b/packages/website/ts/components/forms/subscribe_form.tsx
@@ -6,7 +6,6 @@ import { Button } from 'ts/components/ui/button';
import { Container } from 'ts/components/ui/container';
import { Input } from 'ts/components/ui/input';
import { Text } from 'ts/components/ui/text';
-import { styled } from 'ts/style/theme';
import { backendClient } from 'ts/utils/backend_client';
export interface SubscribeFormProps {}
diff --git a/packages/website/ts/components/generate_order/generate_order_form.tsx b/packages/website/ts/components/generate_order/generate_order_form.tsx
index 5f968a5e4..52e3b73cd 100644
--- a/packages/website/ts/components/generate_order/generate_order_form.tsx
+++ b/packages/website/ts/components/generate_order/generate_order_form.tsx
@@ -47,6 +47,8 @@ interface GenerateOrderFormProps {
sideToAssetToken: SideToAssetToken;
tokenByAddress: TokenByAddress;
lastForceTokenStateRefetch: number;
+ isFullWidth?: boolean;
+ shouldHideHeader?: boolean;
}
interface GenerateOrderFormState {
@@ -56,6 +58,10 @@ interface GenerateOrderFormState {
}
export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, GenerateOrderFormState> {
+ public static defaultProps: Partial<GenerateOrderFormProps> = {
+ isFullWidth: false,
+ shouldHideHeader: false,
+ };
constructor(props: GenerateOrderFormProps) {
super(props);
this.state = {
@@ -80,10 +86,15 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
const exchangeContractIfExists = this.props.blockchain.getExchangeContractAddressIfExists();
const initialTakerAddress =
this.props.orderTakerAddress === constants.NULL_ADDRESS ? '' : this.props.orderTakerAddress;
+ const rootClassName = this.props.isFullWidth ? 'clearfix mb2' : 'clearfix mb2 lg-px4 md-px4 sm-px2';
return (
- <div className="clearfix mb2 lg-px4 md-px4 sm-px2">
- <h3>Generate an order</h3>
- <Divider />
+ <div className={rootClassName}>
+ {!this.props.shouldHideHeader && (
+ <div>
+ <h3>Generate an order</h3>
+ <Divider />
+ </div>
+ )}
<div className="mx-auto" style={{ maxWidth: 580 }}>
<div className="pt3">
<div className="mx-auto clearfix">
diff --git a/packages/website/ts/components/inputs/allowance_toggle.tsx b/packages/website/ts/components/inputs/allowance_toggle.tsx
index a8df4935a..09791f125 100644
--- a/packages/website/ts/components/inputs/allowance_toggle.tsx
+++ b/packages/website/ts/components/inputs/allowance_toggle.tsx
@@ -1,6 +1,5 @@
import { constants as sharedConstants, Styles } from '@0xproject/react-shared';
import { BigNumber, logUtils } from '@0xproject/utils';
-import * as _ from 'lodash';
import Toggle from 'material-ui/Toggle';
import * as React from 'react';
import { Blockchain } from 'ts/blockchain';
@@ -8,7 +7,6 @@ import { Dispatcher } from 'ts/redux/dispatcher';
import { colors } from 'ts/style/colors';
import { BalanceErrs, Token, TokenState } from 'ts/types';
import { analytics } from 'ts/utils/analytics';
-import { constants } from 'ts/utils/constants';
import { errorReporter } from 'ts/utils/error_reporter';
import { utils } from 'ts/utils/utils';
diff --git a/packages/website/ts/components/inputs/identicon_address_input.tsx b/packages/website/ts/components/inputs/identicon_address_input.tsx
index a4dc01ba8..6ba7584a7 100644
--- a/packages/website/ts/components/inputs/identicon_address_input.tsx
+++ b/packages/website/ts/components/inputs/identicon_address_input.tsx
@@ -1,4 +1,3 @@
-import * as _ from 'lodash';
import * as React from 'react';
import { AddressInput } from 'ts/components/inputs/address_input';
import { Identicon } from 'ts/components/ui/identicon';
diff --git a/packages/website/ts/components/inputs/token_input.tsx b/packages/website/ts/components/inputs/token_input.tsx
index c2c4dd63b..0bd36781e 100644
--- a/packages/website/ts/components/inputs/token_input.tsx
+++ b/packages/website/ts/components/inputs/token_input.tsx
@@ -1,5 +1,4 @@
import { colors } from '@0xproject/react-shared';
-import * as _ from 'lodash';
import Paper from 'material-ui/Paper';
import * as React from 'react';
import { Blockchain } from 'ts/blockchain';
diff --git a/packages/website/ts/components/legacy_portal/legacy_portal.tsx b/packages/website/ts/components/legacy_portal/legacy_portal.tsx
index e5d152e3e..35e917eec 100644
--- a/packages/website/ts/components/legacy_portal/legacy_portal.tsx
+++ b/packages/website/ts/components/legacy_portal/legacy_portal.tsx
@@ -1,5 +1,5 @@
import { colors } from '@0xproject/react-shared';
-import { BigNumber, logUtils } from '@0xproject/utils';
+import { BigNumber } from '@0xproject/utils';
import * as _ from 'lodash';
import CircularProgress from 'material-ui/CircularProgress';
import Paper from 'material-ui/Paper';
@@ -15,27 +15,14 @@ import { EthWrappers } from 'ts/components/eth_wrappers';
import { FillOrder } from 'ts/components/fill_order';
import { Footer } from 'ts/components/footer';
import { LegacyPortalMenu } from 'ts/components/legacy_portal/legacy_portal_menu';
-import { RelayerIndex } from 'ts/components/relayer_index/relayer_index';
import { TokenBalances } from 'ts/components/token_balances';
import { TopBar } from 'ts/components/top_bar/top_bar';
import { TradeHistory } from 'ts/components/trade_history/trade_history';
import { FlashMessage } from 'ts/components/ui/flash_message';
-import { Wallet } from 'ts/components/wallet/wallet';
import { GenerateOrderForm } from 'ts/containers/generate_order_form';
import { localStorage } from 'ts/local_storage/local_storage';
import { Dispatcher } from 'ts/redux/dispatcher';
-import { portalOrderSchema } from 'ts/schemas/portal_order_schema';
-import { validator } from 'ts/schemas/validator';
-import {
- BlockchainErrs,
- Environments,
- HashData,
- Order,
- ProviderType,
- ScreenWidths,
- TokenByAddress,
- WebsitePaths,
-} from 'ts/types';
+import { BlockchainErrs, HashData, Order, ProviderType, ScreenWidths, TokenByAddress, WebsitePaths } from 'ts/types';
import { configs } from 'ts/utils/configs';
import { constants } from 'ts/utils/constants';
import { orderParser } from 'ts/utils/order_parser';
diff --git a/packages/website/ts/components/legacy_portal/legacy_portal_menu.tsx b/packages/website/ts/components/legacy_portal/legacy_portal_menu.tsx
index 7469ca14e..1dd164f8b 100644
--- a/packages/website/ts/components/legacy_portal/legacy_portal_menu.tsx
+++ b/packages/website/ts/components/legacy_portal/legacy_portal_menu.tsx
@@ -1,8 +1,7 @@
import * as _ from 'lodash';
import * as React from 'react';
import { MenuItem } from 'ts/components/ui/menu_item';
-import { Environments, WebsitePaths } from 'ts/types';
-import { configs } from 'ts/utils/configs';
+import { WebsitePaths } from 'ts/types';
export interface LegacyPortalMenuProps {
menuItemStyle: React.CSSProperties;
diff --git a/packages/website/ts/components/onboarding/onboarding_flow.tsx b/packages/website/ts/components/onboarding/onboarding_flow.tsx
index 158ac23ec..9879cd387 100644
--- a/packages/website/ts/components/onboarding/onboarding_flow.tsx
+++ b/packages/website/ts/components/onboarding/onboarding_flow.tsx
@@ -1,11 +1,9 @@
-import * as _ from 'lodash';
import * as React from 'react';
import { Placement, Popper, PopperChildrenProps } from 'react-popper';
import { ContinueButtonDisplay, OnboardingTooltip } from 'ts/components/onboarding/onboarding_tooltip';
import { Container } from 'ts/components/ui/container';
import { Overlay } from 'ts/components/ui/overlay';
-import { zIndex } from 'ts/style/z_index';
export interface Step {
target: string;
diff --git a/packages/website/ts/components/onboarding/onboarding_tooltip.tsx b/packages/website/ts/components/onboarding/onboarding_tooltip.tsx
index eb34a87f2..155c70c5f 100644
--- a/packages/website/ts/components/onboarding/onboarding_tooltip.tsx
+++ b/packages/website/ts/components/onboarding/onboarding_tooltip.tsx
@@ -1,6 +1,5 @@
import * as React from 'react';
-import { colors } from '@0xproject/react-shared';
import { Container } from 'ts/components/ui/container';
import { Island } from 'ts/components/ui/island';
diff --git a/packages/website/ts/components/portal/menu.tsx b/packages/website/ts/components/portal/menu.tsx
index f98346101..39dab77f5 100644
--- a/packages/website/ts/components/portal/menu.tsx
+++ b/packages/website/ts/components/portal/menu.tsx
@@ -3,8 +3,7 @@ import * as _ from 'lodash';
import * as React from 'react';
import { MenuItem } from 'ts/components/ui/menu_item';
import { colors } from 'ts/style/colors';
-import { Environments, WebsitePaths } from 'ts/types';
-import { configs } from 'ts/utils/configs';
+import { WebsitePaths } from 'ts/types';
export interface MenuTheme {
paddingLeft: number;
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index 9420395cf..fb40a9580 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -3,7 +3,7 @@ import { BigNumber } from '@0xproject/utils';
import * as _ from 'lodash';
import * as React from 'react';
import * as DocumentTitle from 'react-document-title';
-import { Link, Route, RouteComponentProps, Switch } from 'react-router-dom';
+import { Route, RouteComponentProps, Switch } from 'react-router-dom';
import { Blockchain } from 'ts/blockchain';
import { BlockchainErrDialog } from 'ts/components/dialogs/blockchain_err_dialog';
@@ -430,6 +430,7 @@ export class Portal extends React.Component<PortalProps, PortalState> {
userAddress={this.props.userAddress}
userEtherBalanceInWei={this.props.userEtherBalanceInWei}
lastForceTokenStateRefetch={this.props.lastForceTokenStateRefetch}
+ isFullWidth={true}
/>
);
}
@@ -439,6 +440,9 @@ export class Portal extends React.Component<PortalProps, PortalState> {
tokenByAddress={this.props.tokenByAddress}
userAddress={this.props.userAddress}
networkId={this.props.networkId}
+ isFullWidth={true}
+ shouldHideHeader={true}
+ isScrollable={false}
/>
);
}
@@ -448,6 +452,8 @@ export class Portal extends React.Component<PortalProps, PortalState> {
blockchain={this._blockchain}
hashData={this.props.hashData}
dispatcher={this.props.dispatcher}
+ isFullWidth={true}
+ shouldHideHeader={true}
/>
);
}
@@ -467,6 +473,8 @@ export class Portal extends React.Component<PortalProps, PortalState> {
tokenByAddress={this.props.tokenByAddress}
dispatcher={this.props.dispatcher}
lastForceTokenStateRefetch={this.props.lastForceTokenStateRefetch}
+ isFullWidth={true}
+ shouldHideHeader={true}
/>
);
}
@@ -484,6 +492,7 @@ export class Portal extends React.Component<PortalProps, PortalState> {
userEtherBalanceInWei={this.props.userEtherBalanceInWei}
networkId={this.props.networkId}
lastForceTokenStateRefetch={this.props.lastForceTokenStateRefetch}
+ isFullWidth={true}
/>
);
}
diff --git a/packages/website/ts/components/portal/section.tsx b/packages/website/ts/components/portal/section.tsx
index 9b172aae0..455ed07c9 100644
--- a/packages/website/ts/components/portal/section.tsx
+++ b/packages/website/ts/components/portal/section.tsx
@@ -1,4 +1,3 @@
-import { Styles } from '@0xproject/react-shared';
import * as React from 'react';
export interface SectionProps {
diff --git a/packages/website/ts/components/redirecter.tsx b/packages/website/ts/components/redirecter.tsx
index 629522bbb..07432a926 100644
--- a/packages/website/ts/components/redirecter.tsx
+++ b/packages/website/ts/components/redirecter.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
import { constants } from 'ts/utils/constants';
interface RedirecterProps {
diff --git a/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx b/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx
index 41febebe9..fbb634164 100644
--- a/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx
+++ b/packages/website/ts/components/relayer_index/relayer_grid_tile.tsx
@@ -6,9 +6,8 @@ import * as React from 'react';
import { TopTokens } from 'ts/components/relayer_index/relayer_top_tokens';
import { Container } from 'ts/components/ui/container';
import { Island } from 'ts/components/ui/island';
-import { TokenIcon } from 'ts/components/ui/token_icon';
import { colors } from 'ts/style/colors';
-import { Token, WebsiteBackendRelayerInfo } from 'ts/types';
+import { WebsiteBackendRelayerInfo } from 'ts/types';
export interface RelayerGridTileProps {
relayerInfo: WebsiteBackendRelayerInfo;
diff --git a/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx b/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx
index e42f8a81a..a5754180b 100644
--- a/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx
+++ b/packages/website/ts/components/relayer_index/relayer_top_tokens.tsx
@@ -2,7 +2,6 @@ import { colors, EtherscanLinkSuffixes, Styles, utils as sharedUtils } from '@0x
import * as _ from 'lodash';
import * as React from 'react';
-import { TokenIcon } from 'ts/components/ui/token_icon';
import { WebsiteBackendTokenInfo } from 'ts/types';
export interface TopTokensProps {
diff --git a/packages/website/ts/components/sidebar_header.tsx b/packages/website/ts/components/sidebar_header.tsx
index bf46caad9..a14ab54f5 100644
--- a/packages/website/ts/components/sidebar_header.tsx
+++ b/packages/website/ts/components/sidebar_header.tsx
@@ -1,9 +1,6 @@
import { colors } from '@0xproject/react-shared';
-import * as _ from 'lodash';
import * as React from 'react';
-const SHOW_DURATION_MS = 4000;
-
interface SidebarHeaderProps {
title: string;
iconUrl: string;
diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx
index ed12cd85a..555a59830 100644
--- a/packages/website/ts/components/token_balances.tsx
+++ b/packages/website/ts/components/token_balances.tsx
@@ -1,5 +1,4 @@
import {
- colors,
constants as sharedConstants,
EtherscanLinkSuffixes,
Networks,
@@ -13,7 +12,6 @@ import Dialog from 'material-ui/Dialog';
import Divider from 'material-ui/Divider';
import FlatButton from 'material-ui/FlatButton';
import FloatingActionButton from 'material-ui/FloatingActionButton';
-import RaisedButton from 'material-ui/RaisedButton';
import ContentAdd from 'material-ui/svg-icons/content/add';
import ContentRemove from 'material-ui/svg-icons/content/remove';
import { Table, TableBody, TableHeader, TableHeaderColumn, TableRow, TableRowColumn } from 'material-ui/Table';
@@ -57,7 +55,7 @@ const TOKEN_COL_SPAN_SM = 1;
const styles: Styles = {
bgColor: {
- backgroundColor: colors.grey50,
+ backgroundColor: 'transparent',
},
};
@@ -73,6 +71,7 @@ interface TokenBalancesProps {
userEtherBalanceInWei: BigNumber;
networkId: number;
lastForceTokenStateRefetch: number;
+ isFullWidth?: boolean;
}
interface TokenBalancesState {
@@ -87,6 +86,7 @@ interface TokenBalancesState {
export class TokenBalances extends React.Component<TokenBalancesProps, TokenBalancesState> {
public static defaultProps: Partial<TokenBalancesProps> = {
userEtherBalanceInWei: new BigNumber(0),
+ isFullWidth: false,
};
private _isUnmounted: boolean;
public constructor(props: TokenBalancesProps) {
@@ -169,7 +169,6 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
/>,
];
const isTestNetwork = utils.isTestNetwork(this.props.networkId);
- const isKovanTestNetwork = this.props.networkId === constants.NETWORK_ID_KOVAN;
const stubColumnStyle = {
display: isTestNetwork ? 'none' : 'table-cell',
};
@@ -187,8 +186,9 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
this.props.userEtherBalanceInWei,
constants.DECIMAL_PLACES_ETH,
);
+ const rootClassName = this.props.isFullWidth ? 'pb2' : 'lg-px4 md-px4 sm-px1 pb2';
return (
- <div className="lg-px4 md-px4 sm-px1 pb2">
+ <div className={rootClassName}>
<h3>{isTestNetwork ? 'Test ether' : 'Ether'}</h3>
<Divider />
<div className="pt2 pb2">
@@ -268,7 +268,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
<div className="inline-block">Allowance</div>
<HelpTooltip style={{ paddingLeft: 4 }} explanation={allowanceExplanation} />
</TableHeaderColumn>
- <TableHeaderColumn>Action</TableHeaderColumn>
+ {isTestNetwork && <TableHeaderColumn>Action</TableHeaderColumn>}
{this.props.screenWidth !== ScreenWidths.Sm && <TableHeaderColumn>Send</TableHeaderColumn>}
</TableRow>
</TableHeader>
@@ -373,17 +373,17 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
refetchTokenStateAsync={this._refetchTokenStateAsync.bind(this, token.address)}
/>
</TableRowColumn>
- <TableRowColumn style={{ paddingLeft: actionPaddingX, paddingRight: actionPaddingX }}>
- {isMintable && (
- <LifeCycleRaisedButton
- labelReady="Mint"
- labelLoading={<span style={{ fontSize: 12 }}>Minting...</span>}
- labelComplete="Minted!"
- onClickAsyncFn={this._onMintTestTokensAsync.bind(this, token)}
- />
- )}
- {token.symbol === ZRX_TOKEN_SYMBOL &&
- utils.isTestNetwork(this.props.networkId) && (
+ {utils.isTestNetwork(this.props.networkId) && (
+ <TableRowColumn style={{ paddingLeft: actionPaddingX, paddingRight: actionPaddingX }}>
+ {isMintable && (
+ <LifeCycleRaisedButton
+ labelReady="Mint"
+ labelLoading={<span style={{ fontSize: 12 }}>Minting...</span>}
+ labelComplete="Minted!"
+ onClickAsyncFn={this._onMintTestTokensAsync.bind(this, token)}
+ />
+ )}
+ {token.symbol === ZRX_TOKEN_SYMBOL && (
<LifeCycleRaisedButton
labelReady="Request"
labelLoading="Sending..."
@@ -391,7 +391,8 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
onClickAsyncFn={this._faucetRequestAsync.bind(this, false)}
/>
)}
- </TableRowColumn>
+ </TableRowColumn>
+ )}
{this.props.screenWidth !== ScreenWidths.Sm && (
<TableRowColumn
style={{
diff --git a/packages/website/ts/components/top_bar/provider_display.tsx b/packages/website/ts/components/top_bar/provider_display.tsx
index dba08f85c..cb7c9b483 100644
--- a/packages/website/ts/components/top_bar/provider_display.tsx
+++ b/packages/website/ts/components/top_bar/provider_display.tsx
@@ -10,7 +10,6 @@ import { DropDown } from 'ts/components/ui/drop_down';
import { Identicon } from 'ts/components/ui/identicon';
import { Dispatcher } from 'ts/redux/dispatcher';
import { colors } from 'ts/style/colors';
-import { zIndex } from 'ts/style/z_index';
import { ProviderType } from 'ts/types';
import { constants } from 'ts/utils/constants';
import { utils } from 'ts/utils/utils';
diff --git a/packages/website/ts/components/top_bar/provider_picker.tsx b/packages/website/ts/components/top_bar/provider_picker.tsx
index 1ecb8389c..7937f2e9d 100644
--- a/packages/website/ts/components/top_bar/provider_picker.tsx
+++ b/packages/website/ts/components/top_bar/provider_picker.tsx
@@ -1,11 +1,9 @@
import { colors, constants as sharedConstants } from '@0xproject/react-shared';
-import * as _ from 'lodash';
import { RadioButton, RadioButtonGroup } from 'material-ui/RadioButton';
import * as React from 'react';
import { Blockchain } from 'ts/blockchain';
import { Dispatcher } from 'ts/redux/dispatcher';
import { ProviderType } from 'ts/types';
-import { constants } from 'ts/utils/constants';
interface ProviderPickerProps {
networkId: number;
diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx
index 606fd845a..05cc6e3ad 100644
--- a/packages/website/ts/components/top_bar/top_bar.tsx
+++ b/packages/website/ts/components/top_bar/top_bar.tsx
@@ -6,15 +6,12 @@ import Menu from 'material-ui/Menu';
import MenuItem from 'material-ui/MenuItem';
import * as React from 'react';
import { Link } from 'react-router-dom';
-import ReactTooltip = require('react-tooltip');
import { Blockchain } from 'ts/blockchain';
import { LegacyPortalMenu } from 'ts/components/legacy_portal/legacy_portal_menu';
import { DrawerMenu } from 'ts/components/portal/drawer_menu';
-import { SidebarHeader } from 'ts/components/sidebar_header';
import { ProviderDisplay } from 'ts/components/top_bar/provider_display';
import { TopBarMenuItem } from 'ts/components/top_bar/top_bar_menu_item';
import { DropDown } from 'ts/components/ui/drop_down';
-import { Identicon } from 'ts/components/ui/identicon';
import { Dispatcher } from 'ts/redux/dispatcher';
import { zIndex } from 'ts/style/z_index';
import { Deco, Key, ProviderType, WebsiteLegacyPaths, WebsitePaths } from 'ts/types';
@@ -165,6 +162,12 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
primaryText={this.props.translate.get(Key.SolCov, Deco.CapWords)}
/>
</Link>,
+ <Link key="subMenuItem-ethereum-types" to={WebsitePaths.EthereumTypes} className="text-decoration-none">
+ <MenuItem
+ style={{ fontSize: styles.menuItem.fontSize }}
+ primaryText={this.props.translate.get(Key.EthereumTypes, Deco.CapWords)}
+ />
+ </Link>,
<a
key="subMenuItem-whitePaper"
target="_blank"
@@ -379,6 +382,14 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
</MenuItem>
</Link>
)}
+ {!this._isViewingEthereumTypesDocs() && (
+ <Link to={WebsitePaths.EthereumTypes} className="text-decoration-none">
+ <MenuItem className="py2">
+ {this.props.translate.get(Key.EthereumTypes, Deco.Cap)}{' '}
+ {this.props.translate.get(Key.Docs, Deco.Cap)}
+ </MenuItem>
+ </Link>
+ )}
{!this._isViewingPortal() && (
<Link to={`${WebsitePaths.Portal}`} className="text-decoration-none">
<MenuItem className="py2">
@@ -418,8 +429,6 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
) {
return undefined;
}
-
- const sectionTitle = `${this.props.docsInfo.displayName} Docs`;
return (
<div className="lg-hide md-hide">
<NestedSidebarMenu
@@ -507,6 +516,9 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
private _isViewingSubprovidersDocs(): boolean {
return _.includes(this.props.location.pathname, WebsitePaths.Subproviders);
}
+ private _isViewingEthereumTypesDocs(): boolean {
+ return _.includes(this.props.location.pathname, WebsitePaths.EthereumTypes);
+ }
private _isViewingWiki(): boolean {
return _.includes(this.props.location.pathname, WebsitePaths.Wiki);
}
diff --git a/packages/website/ts/components/trade_history/trade_history.tsx b/packages/website/ts/components/trade_history/trade_history.tsx
index 1ca9d866f..84c0f70a8 100644
--- a/packages/website/ts/components/trade_history/trade_history.tsx
+++ b/packages/website/ts/components/trade_history/trade_history.tsx
@@ -13,6 +13,9 @@ interface TradeHistoryProps {
tokenByAddress: TokenByAddress;
userAddress: string;
networkId: number;
+ isFullWidth?: boolean;
+ shouldHideHeader?: boolean;
+ isScrollable?: boolean;
}
interface TradeHistoryState {
@@ -20,6 +23,11 @@ interface TradeHistoryState {
}
export class TradeHistory extends React.Component<TradeHistoryProps, TradeHistoryState> {
+ public static defaultProps: Partial<TradeHistoryProps> = {
+ isFullWidth: false,
+ shouldHideHeader: false,
+ isScrollable: true,
+ };
private _fillPollingIntervalId: number;
public constructor(props: TradeHistoryProps) {
super(props);
@@ -38,13 +46,22 @@ export class TradeHistory extends React.Component<TradeHistoryProps, TradeHistor
window.scrollTo(0, 0);
}
public render(): React.ReactNode {
+ const rootClassName = !this.props.isFullWidth ? 'lg-px4 md-px4 sm-px2' : undefined;
return (
- <div className="lg-px4 md-px4 sm-px2">
- <h3>Trade history</h3>
- <Divider />
- <div className="pt2" style={{ height: 608, overflow: 'scroll' }}>
- {this._renderTrades()}
- </div>
+ <div className={rootClassName}>
+ {!this.props.shouldHideHeader && (
+ <div>
+ <h3>Trade history</h3>
+ <Divider />
+ </div>
+ )}
+ {this.props.isScrollable ? (
+ <div className="pt2" style={{ height: 608, overflow: 'scroll' }}>
+ {this._renderTrades()}
+ </div>
+ ) : (
+ this._renderTrades()
+ )}
</div>
);
}
diff --git a/packages/website/ts/components/ui/copy_icon.tsx b/packages/website/ts/components/ui/copy_icon.tsx
index 2c2941067..0330d1843 100644
--- a/packages/website/ts/components/ui/copy_icon.tsx
+++ b/packages/website/ts/components/ui/copy_icon.tsx
@@ -1,5 +1,4 @@
import { colors } from '@0xproject/react-shared';
-import * as _ from 'lodash';
import * as React from 'react';
import * as CopyToClipboard from 'react-copy-to-clipboard';
import * as ReactDOM from 'react-dom';
diff --git a/packages/website/ts/components/ui/drop_down.tsx b/packages/website/ts/components/ui/drop_down.tsx
index 98a495581..db79ca1df 100644
--- a/packages/website/ts/components/ui/drop_down.tsx
+++ b/packages/website/ts/components/ui/drop_down.tsx
@@ -1,4 +1,3 @@
-import * as _ from 'lodash';
import Popover, { PopoverAnimationVertical } from 'material-ui/Popover';
import * as React from 'react';
import { MaterialUIPosition } from 'ts/types';
diff --git a/packages/website/ts/components/ui/etherscan_icon.tsx b/packages/website/ts/components/ui/etherscan_icon.tsx
index 1b032c112..0beb69123 100644
--- a/packages/website/ts/components/ui/etherscan_icon.tsx
+++ b/packages/website/ts/components/ui/etherscan_icon.tsx
@@ -2,7 +2,6 @@ import { colors, EtherscanLinkSuffixes, utils as sharedUtils } from '@0xproject/
import * as _ from 'lodash';
import * as React from 'react';
import ReactTooltip = require('react-tooltip');
-import { utils } from 'ts/utils/utils';
interface EtherScanIconProps {
addressOrTxHash: string;
diff --git a/packages/website/ts/components/ui/island.tsx b/packages/website/ts/components/ui/island.tsx
index 802a7830a..de90b664f 100644
--- a/packages/website/ts/components/ui/island.tsx
+++ b/packages/website/ts/components/ui/island.tsx
@@ -1,6 +1,5 @@
import * as React from 'react';
import { colors } from 'ts/style/colors';
-import { Styleable } from 'ts/types';
export interface IslandProps {
style?: React.CSSProperties;
diff --git a/packages/website/ts/components/ui/lifecycle_raised_button.tsx b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
index afb09a4bb..a24de56b7 100644
--- a/packages/website/ts/components/ui/lifecycle_raised_button.tsx
+++ b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
@@ -1,6 +1,5 @@
import { colors } from '@0xproject/react-shared';
import { errorUtils } from '@0xproject/utils';
-import * as _ from 'lodash';
import RaisedButton from 'material-ui/RaisedButton';
import * as React from 'react';
import { utils } from 'ts/utils/utils';
diff --git a/packages/website/ts/components/ui/overlay.tsx b/packages/website/ts/components/ui/overlay.tsx
index acca8194f..8b126a6d5 100644
--- a/packages/website/ts/components/ui/overlay.tsx
+++ b/packages/website/ts/components/ui/overlay.tsx
@@ -1,4 +1,3 @@
-import { colors } from '@0xproject/react-shared';
import * as _ from 'lodash';
import * as React from 'react';
diff --git a/packages/website/ts/components/ui/party.tsx b/packages/website/ts/components/ui/party.tsx
index 0d86a6db5..a25550475 100644
--- a/packages/website/ts/components/ui/party.tsx
+++ b/packages/website/ts/components/ui/party.tsx
@@ -4,7 +4,6 @@ import * as React from 'react';
import ReactTooltip = require('react-tooltip');
import { EthereumAddress } from 'ts/components/ui/ethereum_address';
import { Identicon } from 'ts/components/ui/identicon';
-import { utils } from 'ts/utils/utils';
const IMAGE_DIMENSION = 100;
const IDENTICON_DIAMETER = 95;
diff --git a/packages/website/ts/components/ui/swap_icon.tsx b/packages/website/ts/components/ui/swap_icon.tsx
index 4a6000d1b..f1d1ae7d4 100644
--- a/packages/website/ts/components/ui/swap_icon.tsx
+++ b/packages/website/ts/components/ui/swap_icon.tsx
@@ -1,5 +1,4 @@
import { colors } from '@0xproject/react-shared';
-import * as _ from 'lodash';
import * as React from 'react';
interface SwapIconProps {
diff --git a/packages/website/ts/components/ui/text.tsx b/packages/website/ts/components/ui/text.tsx
index 99bf89966..e90c1707d 100644
--- a/packages/website/ts/components/ui/text.tsx
+++ b/packages/website/ts/components/ui/text.tsx
@@ -1,8 +1,6 @@
import { colors } from '@0xproject/react-shared';
import * as React from 'react';
import { styled } from 'ts/style/theme';
-import { Deco, Key } from 'ts/types';
-import { Translate } from 'ts/utils/translate';
export type TextTag = 'p' | 'div' | 'span' | 'label';
diff --git a/packages/website/ts/components/wallet/wallet.tsx b/packages/website/ts/components/wallet/wallet.tsx
index 5ad7602a6..bc2ee227d 100644
--- a/packages/website/ts/components/wallet/wallet.tsx
+++ b/packages/website/ts/components/wallet/wallet.tsx
@@ -1,25 +1,15 @@
-import {
- constants as sharedConstants,
- EtherscanLinkSuffixes,
- Styles,
- utils as sharedUtils,
-} from '@0xproject/react-shared';
+import { EtherscanLinkSuffixes, Styles, utils as sharedUtils } from '@0xproject/react-shared';
import { BigNumber, errorUtils } from '@0xproject/utils';
import { Web3Wrapper } from '@0xproject/web3-wrapper';
import * as _ from 'lodash';
import CircularProgress from 'material-ui/CircularProgress';
-import FlatButton from 'material-ui/FlatButton';
import FloatingActionButton from 'material-ui/FloatingActionButton';
import { ListItem } from 'material-ui/List';
import ActionAccountBalanceWallet from 'material-ui/svg-icons/action/account-balance-wallet';
import ContentAdd from 'material-ui/svg-icons/content/add';
import ContentRemove from 'material-ui/svg-icons/content/remove';
-import NavigationArrowDownward from 'material-ui/svg-icons/navigation/arrow-downward';
-import NavigationArrowUpward from 'material-ui/svg-icons/navigation/arrow-upward';
-import Close from 'material-ui/svg-icons/navigation/close';
import * as React from 'react';
import { Link } from 'react-router-dom';
-import ReactTooltip = require('react-tooltip');
import firstBy = require('thenby');
import { Blockchain } from 'ts/blockchain';
@@ -35,7 +25,6 @@ import { Dispatcher } from 'ts/redux/dispatcher';
import { colors } from 'ts/style/colors';
import { zIndex } from 'ts/style/z_index';
import {
- BalanceErrs,
BlockchainErrs,
ProviderType,
ScreenWidths,
@@ -135,7 +124,7 @@ const styles: Styles = {
const ETHER_ICON_PATH = '/images/ether.png';
const ICON_DIMENSION = 28;
-const TOKEN_AMOUNT_DISPLAY_PRECISION = 3;
+const TOKEN_AMOUNT_DISPLAY_PRECISION = 5;
const BODY_ITEM_KEY = 'BODY';
const HEADER_ITEM_KEY = 'HEADER';
const FOOTER_ITEM_KEY = 'FOOTER';
@@ -146,10 +135,8 @@ const NO_ALLOWANCE_TOGGLE_SPACE_WIDTH = 56;
const ACCOUNT_PATH = `${WebsitePaths.Portal}/account`;
export class Wallet extends React.Component<WalletProps, WalletState> {
- private _isUnmounted: boolean;
constructor(props: WalletProps) {
super(props);
- this._isUnmounted = false;
this.state = {
wrappedEtherDirection: undefined,
isHoveringSidebar: false,
@@ -183,7 +170,6 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
);
}
private _renderDisconnectedHeaderRows(): React.ReactElement<{}> {
- const userAddress = this.props.userAddress;
const primaryText = 'wallet';
return (
<StandardIconRow
@@ -448,14 +434,19 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
symbol: string,
isLoading: boolean = false,
): React.ReactNode {
- const unitAmount = Web3Wrapper.toUnitAmount(amount, decimals);
- const formattedAmount = unitAmount.toPrecision(TOKEN_AMOUNT_DISPLAY_PRECISION);
- const result = `${formattedAmount} ${symbol}`;
- return (
- <PlaceHolder hideChildren={isLoading}>
- <div style={styles.amountLabel}>{result}</div>
- </PlaceHolder>
- );
+ if (isLoading) {
+ return (
+ <PlaceHolder hideChildren={isLoading}>
+ <div style={styles.amountLabel}>0.00 XXX</div>
+ </PlaceHolder>
+ );
+ } else {
+ const unitAmount = Web3Wrapper.toUnitAmount(amount, decimals);
+ const precision = Math.min(TOKEN_AMOUNT_DISPLAY_PRECISION, unitAmount.decimalPlaces());
+ const formattedAmount = unitAmount.toFixed(precision);
+ const result = `${formattedAmount} ${symbol}`;
+ return <div style={styles.amountLabel}>{result}</div>;
+ }
}
private _renderValue(
amount: BigNumber,
@@ -510,17 +501,6 @@ export class Wallet extends React.Component<WalletProps, WalletState> {
<IconButton iconName={buttonIconName} labelText={buttonLabel} onClick={onClick} color={colors.mediumBlue} />
);
}
- private _getInitialTrackedTokenStateByAddress(tokenAddresses: string[]): TokenStateByAddress {
- const trackedTokenStateByAddress: TokenStateByAddress = {};
- _.each(tokenAddresses, tokenAddress => {
- trackedTokenStateByAddress[tokenAddress] = {
- balance: new BigNumber(0),
- allowance: new BigNumber(0),
- isLoaded: false,
- };
- });
- return trackedTokenStateByAddress;
- }
private _openWrappedEtherActionRow(wrappedEtherDirection: Side): void {
this.setState({
wrappedEtherDirection,
diff --git a/packages/website/ts/components/wallet/wallet_disconnected_item.tsx b/packages/website/ts/components/wallet/wallet_disconnected_item.tsx
index e3b88dc54..1015dce29 100644
--- a/packages/website/ts/components/wallet/wallet_disconnected_item.tsx
+++ b/packages/website/ts/components/wallet/wallet_disconnected_item.tsx
@@ -1,6 +1,5 @@
import { Styles } from '@0xproject/react-shared';
import FlatButton from 'material-ui/FlatButton';
-import ActionAccountBalanceWallet from 'material-ui/svg-icons/action/account-balance-wallet';
import * as React from 'react';
import { colors } from 'ts/style/colors';
diff --git a/packages/website/ts/components/wallet/wrap_ether_item.tsx b/packages/website/ts/components/wallet/wrap_ether_item.tsx
index 50b64d05c..a5052735b 100644
--- a/packages/website/ts/components/wallet/wrap_ether_item.tsx
+++ b/packages/website/ts/components/wallet/wrap_ether_item.tsx
@@ -3,7 +3,6 @@ import { BigNumber, logUtils } from '@0xproject/utils';
import { Web3Wrapper } from '@0xproject/web3-wrapper';
import * as _ from 'lodash';
import FlatButton from 'material-ui/FlatButton';
-import { ListItem } from 'material-ui/List';
import * as React from 'react';
import { Blockchain } from 'ts/blockchain';