From 3f19ab1a87b3015923688669d1068f5619485da2 Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Tue, 5 Jun 2018 22:48:13 -0700
Subject: Add isFullWidth prop to TokenBalances component

---
 packages/website/ts/components/portal/portal.tsx  | 1 +
 packages/website/ts/components/token_balances.tsx | 5 ++++-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index 9420395cf..28fcf10df 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -484,6 +484,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/token_balances.tsx b/packages/website/ts/components/token_balances.tsx
index 2bc065b0f..f313cd27e 100644
--- a/packages/website/ts/components/token_balances.tsx
+++ b/packages/website/ts/components/token_balances.tsx
@@ -73,6 +73,7 @@ interface TokenBalancesProps {
     userEtherBalanceInWei: BigNumber;
     networkId: number;
     lastForceTokenStateRefetch: number;
+    isFullWidth?: boolean;
 }
 
 interface TokenBalancesState {
@@ -87,6 +88,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) {
@@ -187,8 +189,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">
-- 
cgit v1.2.3


From 2865f63c5d5a669011228f7e9050c3d8e456ae68 Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Tue, 5 Jun 2018 22:52:22 -0700
Subject: Fix TokenBalances background color

---
 packages/website/ts/components/token_balances.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx
index f313cd27e..40cb4daa2 100644
--- a/packages/website/ts/components/token_balances.tsx
+++ b/packages/website/ts/components/token_balances.tsx
@@ -57,7 +57,7 @@ const TOKEN_COL_SPAN_SM = 1;
 
 const styles: Styles = {
     bgColor: {
-        backgroundColor: colors.grey50,
+        backgroundColor: 'transparent',
     },
 };
 
-- 
cgit v1.2.3


From a0e8f410d196cff4c5e25c05f085c1818496168b Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Tue, 5 Jun 2018 23:02:48 -0700
Subject: Hide action column on mainnet

---
 packages/website/ts/components/token_balances.tsx | 27 ++++++++++++-----------
 1 file changed, 14 insertions(+), 13 deletions(-)

diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx
index 40cb4daa2..06da7f79a 100644
--- a/packages/website/ts/components/token_balances.tsx
+++ b/packages/website/ts/components/token_balances.tsx
@@ -271,7 +271,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>
@@ -376,17 +376,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..."
@@ -394,7 +394,8 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
                                 onClickAsyncFn={this._faucetRequestAsync.bind(this, false)}
                             />
                         )}
-                </TableRowColumn>
+                    </TableRowColumn>
+                )}
                 {this.props.screenWidth !== ScreenWidths.Sm && (
                     <TableRowColumn
                         style={{
-- 
cgit v1.2.3


From 61dc253de1b4da6606bc0ddea463e78447598798 Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Tue, 5 Jun 2018 23:10:26 -0700
Subject: Update TradeHistory component

---
 packages/website/ts/components/portal/portal.tsx        |  2 ++
 .../ts/components/trade_history/trade_history.tsx       | 17 ++++++++++++++---
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index 28fcf10df..fb818056d 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -439,6 +439,8 @@ export class Portal extends React.Component<PortalProps, PortalState> {
                 tokenByAddress={this.props.tokenByAddress}
                 userAddress={this.props.userAddress}
                 networkId={this.props.networkId}
+                isFullWidth={true}
+                shouldRenderHeader={false}
             />
         );
     }
diff --git a/packages/website/ts/components/trade_history/trade_history.tsx b/packages/website/ts/components/trade_history/trade_history.tsx
index 1ca9d866f..1c47d4ecd 100644
--- a/packages/website/ts/components/trade_history/trade_history.tsx
+++ b/packages/website/ts/components/trade_history/trade_history.tsx
@@ -13,6 +13,8 @@ interface TradeHistoryProps {
     tokenByAddress: TokenByAddress;
     userAddress: string;
     networkId: number;
+    isFullWidth?: boolean;
+    shouldRenderHeader?: boolean;
 }
 
 interface TradeHistoryState {
@@ -20,6 +22,10 @@ interface TradeHistoryState {
 }
 
 export class TradeHistory extends React.Component<TradeHistoryProps, TradeHistoryState> {
+    public static defaultProps: Partial<TradeHistoryProps> = {
+        isFullWidth: false,
+        shouldRenderHeader: true,
+    };
     private _fillPollingIntervalId: number;
     public constructor(props: TradeHistoryProps) {
         super(props);
@@ -38,10 +44,15 @@ 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={rootClassName}>
+                {this.props.shouldRenderHeader && (
+                    <div>
+                        <h3>Trade history</h3>
+                        <Divider />
+                    </div>
+                )}
                 <div className="pt2" style={{ height: 608, overflow: 'scroll' }}>
                     {this._renderTrades()}
                 </div>
-- 
cgit v1.2.3


From 03854baf53c5767db7130b8f6d7e91aae015e867 Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Tue, 5 Jun 2018 23:18:26 -0700
Subject: Update EthWrappers component

---
 packages/website/ts/components/eth_wrappers.tsx  | 7 ++++++-
 packages/website/ts/components/portal/portal.tsx | 1 +
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx
index 1db5ff77f..984c2a1d2 100644
--- a/packages/website/ts/components/eth_wrappers.tsx
+++ b/packages/website/ts/components/eth_wrappers.tsx
@@ -35,6 +35,7 @@ interface EthWrappersProps {
     userAddress: string;
     userEtherBalanceInWei?: BigNumber;
     lastForceTokenStateRefetch: number;
+    isFullWidth?: boolean;
 }
 
 interface EthWrappersState {
@@ -43,6 +44,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);
@@ -97,8 +101,9 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt
             this.props.userEtherBalanceInWei,
             constants.DECIMAL_PLACES_ETH,
         );
+        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 }}>
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index fb818056d..33f39a468 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -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}
             />
         );
     }
-- 
cgit v1.2.3


From 1677817d9fb31d47080705fc4336555f74cbe687 Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Tue, 5 Jun 2018 23:34:20 -0700
Subject: Update GenerateOrderForm and FillOrder components

---
 packages/website/ts/components/fill_order.tsx           | 17 ++++++++++++++---
 .../components/generate_order/generate_order_form.tsx   | 17 ++++++++++++++---
 packages/website/ts/components/portal/portal.tsx        |  4 ++++
 packages/website/ts/containers/generate_order_form.ts   |  2 ++
 4 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx
index 0168ec8f6..e313a43fe 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;
+    shouldRenderHeader?: boolean;
 }
 
 interface FillOrderState {
@@ -61,6 +63,10 @@ interface FillOrderState {
 }
 
 export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
+    public static defaultProps: Partial<FillOrderProps> = {
+        isFullWidth: false,
+        shouldRenderHeader: true,
+    };
     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.shouldRenderHeader && (
+                    <div>
+                        <h3>Fill an order</h3>
+                        <Divider />
+                    </div>
+                )}
                 <div>
                     {!this.props.isOrderInUrl && (
                         <div>
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..e786719b0 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;
+    shouldRenderHeader?: boolean;
 }
 
 interface GenerateOrderFormState {
@@ -56,6 +58,10 @@ interface GenerateOrderFormState {
 }
 
 export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, GenerateOrderFormState> {
+    public static defaultProps: Partial<GenerateOrderFormProps> = {
+        isFullWidth: false,
+        shouldRenderHeader: true,
+    };
     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.shouldRenderHeader && (
+                    <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/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index 33f39a468..f0d26aeb0 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -451,6 +451,8 @@ export class Portal extends React.Component<PortalProps, PortalState> {
                 blockchain={this._blockchain}
                 hashData={this.props.hashData}
                 dispatcher={this.props.dispatcher}
+                isFullWidth={true}
+                shouldRenderHeader={false}
             />
         );
     }
@@ -470,6 +472,8 @@ export class Portal extends React.Component<PortalProps, PortalState> {
                 tokenByAddress={this.props.tokenByAddress}
                 dispatcher={this.props.dispatcher}
                 lastForceTokenStateRefetch={this.props.lastForceTokenStateRefetch}
+                isFullWidth={true}
+                shouldRenderHeader={false}
             />
         );
     }
diff --git a/packages/website/ts/containers/generate_order_form.ts b/packages/website/ts/containers/generate_order_form.ts
index 98c9b8cd6..23c869a1e 100644
--- a/packages/website/ts/containers/generate_order_form.ts
+++ b/packages/website/ts/containers/generate_order_form.ts
@@ -13,6 +13,8 @@ interface GenerateOrderFormProps {
     blockchain: Blockchain;
     hashData: HashData;
     dispatcher: Dispatcher;
+    isFullWidth?: boolean;
+    shouldRenderHeader?: boolean;
 }
 
 interface ConnectedState {
-- 
cgit v1.2.3


From ab4d2faea3aadfcf75c31f5c02b6f772a07280fb Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Wed, 6 Jun 2018 00:09:28 -0700
Subject: Fix EthWrappers background color

---
 packages/website/ts/components/eth_wrappers.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx
index 984c2a1d2..80929113b 100644
--- a/packages/website/ts/components/eth_wrappers.tsx
+++ b/packages/website/ts/components/eth_wrappers.tsx
@@ -121,7 +121,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>
@@ -208,7 +208,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>
-- 
cgit v1.2.3


From b5dc72b126bc9b9572e5837ff10ee1e3d6b8916f Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Wed, 6 Jun 2018 00:19:41 -0700
Subject: Make scrollability a prop on TradeHistory

---
 packages/website/ts/components/portal/portal.tsx             |  1 +
 .../website/ts/components/trade_history/trade_history.tsx    | 12 +++++++++---
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index f0d26aeb0..009ef06f3 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -442,6 +442,7 @@ export class Portal extends React.Component<PortalProps, PortalState> {
                 networkId={this.props.networkId}
                 isFullWidth={true}
                 shouldRenderHeader={false}
+                isScrollable={false}
             />
         );
     }
diff --git a/packages/website/ts/components/trade_history/trade_history.tsx b/packages/website/ts/components/trade_history/trade_history.tsx
index 1c47d4ecd..1e92cdb90 100644
--- a/packages/website/ts/components/trade_history/trade_history.tsx
+++ b/packages/website/ts/components/trade_history/trade_history.tsx
@@ -15,6 +15,7 @@ interface TradeHistoryProps {
     networkId: number;
     isFullWidth?: boolean;
     shouldRenderHeader?: boolean;
+    isScrollable?: boolean;
 }
 
 interface TradeHistoryState {
@@ -25,6 +26,7 @@ export class TradeHistory extends React.Component<TradeHistoryProps, TradeHistor
     public static defaultProps: Partial<TradeHistoryProps> = {
         isFullWidth: false,
         shouldRenderHeader: true,
+        isScrollable: true,
     };
     private _fillPollingIntervalId: number;
     public constructor(props: TradeHistoryProps) {
@@ -53,9 +55,13 @@ export class TradeHistory extends React.Component<TradeHistoryProps, TradeHistor
                         <Divider />
                     </div>
                 )}
-                <div className="pt2" style={{ height: 608, overflow: 'scroll' }}>
-                    {this._renderTrades()}
-                </div>
+                {this.props.isScrollable ? (
+                    <div className="pt2" style={{ height: 608, overflow: 'scroll' }}>
+                        {this._renderTrades()}
+                    </div>
+                ) : (
+                    this._renderTrades()
+                )}
             </div>
         );
     }
-- 
cgit v1.2.3


From 2b4cd8b2ec5801786cd317870717260b503784dc Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Wed, 6 Jun 2018 01:33:21 -0700
Subject: Fix undefined ether balance

---
 .../ts/components/dialogs/eth_weth_conversion_dialog.tsx   |  6 +++---
 .../website/ts/components/eth_weth_conversion_button.tsx   |  2 +-
 packages/website/ts/components/eth_wrappers.tsx            | 14 +++++++++-----
 3 files changed, 13 insertions(+), 9 deletions(-)

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/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 80929113b..b84e15857 100644
--- a/packages/website/ts/components/eth_wrappers.tsx
+++ b/packages/website/ts/components/eth_wrappers.tsx
@@ -97,10 +97,9 @@ 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={rootClassName} style={{ minHeight: 600 }}>
@@ -148,7 +147,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
@@ -162,6 +165,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>
-- 
cgit v1.2.3


From 14e3f413a23f9ee41d880539f98e2957708b035f Mon Sep 17 00:00:00 2001
From: Brandon Millman <brandon.millman@gmail.com>
Date: Wed, 6 Jun 2018 16:11:23 -0700
Subject: Change shouldRenderHeader prop to shouldHideHeader

---
 packages/website/ts/components/fill_order.tsx                       | 6 +++---
 .../website/ts/components/generate_order/generate_order_form.tsx    | 6 +++---
 packages/website/ts/components/portal/portal.tsx                    | 6 +++---
 packages/website/ts/components/trade_history/trade_history.tsx      | 6 +++---
 packages/website/ts/containers/generate_order_form.ts               | 2 +-
 5 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx
index e313a43fe..b6b52993e 100644
--- a/packages/website/ts/components/fill_order.tsx
+++ b/packages/website/ts/components/fill_order.tsx
@@ -40,7 +40,7 @@ interface FillOrderProps {
     dispatcher: Dispatcher;
     lastForceTokenStateRefetch: number;
     isFullWidth?: boolean;
-    shouldRenderHeader?: boolean;
+    shouldHideHeader?: boolean;
 }
 
 interface FillOrderState {
@@ -65,7 +65,7 @@ interface FillOrderState {
 export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
     public static defaultProps: Partial<FillOrderProps> = {
         isFullWidth: false,
-        shouldRenderHeader: true,
+        shouldHideHeader: false,
     };
     private _isUnmounted: boolean;
     constructor(props: FillOrderProps) {
@@ -106,7 +106,7 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
         const rootClassName = this.props.isFullWidth ? 'clearfix' : 'lg-px4 md-px4 sm-px2';
         return (
             <div className={rootClassName} style={{ minHeight: 600 }}>
-                {this.props.shouldRenderHeader && (
+                {!this.props.shouldHideHeader && (
                     <div>
                         <h3>Fill an order</h3>
                         <Divider />
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 e786719b0..52e3b73cd 100644
--- a/packages/website/ts/components/generate_order/generate_order_form.tsx
+++ b/packages/website/ts/components/generate_order/generate_order_form.tsx
@@ -48,7 +48,7 @@ interface GenerateOrderFormProps {
     tokenByAddress: TokenByAddress;
     lastForceTokenStateRefetch: number;
     isFullWidth?: boolean;
-    shouldRenderHeader?: boolean;
+    shouldHideHeader?: boolean;
 }
 
 interface GenerateOrderFormState {
@@ -60,7 +60,7 @@ interface GenerateOrderFormState {
 export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, GenerateOrderFormState> {
     public static defaultProps: Partial<GenerateOrderFormProps> = {
         isFullWidth: false,
-        shouldRenderHeader: true,
+        shouldHideHeader: false,
     };
     constructor(props: GenerateOrderFormProps) {
         super(props);
@@ -89,7 +89,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
         const rootClassName = this.props.isFullWidth ? 'clearfix mb2' : 'clearfix mb2 lg-px4 md-px4 sm-px2';
         return (
             <div className={rootClassName}>
-                {this.props.shouldRenderHeader && (
+                {!this.props.shouldHideHeader && (
                     <div>
                         <h3>Generate an order</h3>
                         <Divider />
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index 009ef06f3..8affcfb26 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -441,7 +441,7 @@ export class Portal extends React.Component<PortalProps, PortalState> {
                 userAddress={this.props.userAddress}
                 networkId={this.props.networkId}
                 isFullWidth={true}
-                shouldRenderHeader={false}
+                shouldHideHeader={true}
                 isScrollable={false}
             />
         );
@@ -453,7 +453,7 @@ export class Portal extends React.Component<PortalProps, PortalState> {
                 hashData={this.props.hashData}
                 dispatcher={this.props.dispatcher}
                 isFullWidth={true}
-                shouldRenderHeader={false}
+                shouldHideHeader={true}
             />
         );
     }
@@ -474,7 +474,7 @@ export class Portal extends React.Component<PortalProps, PortalState> {
                 dispatcher={this.props.dispatcher}
                 lastForceTokenStateRefetch={this.props.lastForceTokenStateRefetch}
                 isFullWidth={true}
-                shouldRenderHeader={false}
+                shouldHideHeader={true}
             />
         );
     }
diff --git a/packages/website/ts/components/trade_history/trade_history.tsx b/packages/website/ts/components/trade_history/trade_history.tsx
index 1e92cdb90..84c0f70a8 100644
--- a/packages/website/ts/components/trade_history/trade_history.tsx
+++ b/packages/website/ts/components/trade_history/trade_history.tsx
@@ -14,7 +14,7 @@ interface TradeHistoryProps {
     userAddress: string;
     networkId: number;
     isFullWidth?: boolean;
-    shouldRenderHeader?: boolean;
+    shouldHideHeader?: boolean;
     isScrollable?: boolean;
 }
 
@@ -25,7 +25,7 @@ interface TradeHistoryState {
 export class TradeHistory extends React.Component<TradeHistoryProps, TradeHistoryState> {
     public static defaultProps: Partial<TradeHistoryProps> = {
         isFullWidth: false,
-        shouldRenderHeader: true,
+        shouldHideHeader: false,
         isScrollable: true,
     };
     private _fillPollingIntervalId: number;
@@ -49,7 +49,7 @@ export class TradeHistory extends React.Component<TradeHistoryProps, TradeHistor
         const rootClassName = !this.props.isFullWidth ? 'lg-px4 md-px4 sm-px2' : undefined;
         return (
             <div className={rootClassName}>
-                {this.props.shouldRenderHeader && (
+                {!this.props.shouldHideHeader && (
                     <div>
                         <h3>Trade history</h3>
                         <Divider />
diff --git a/packages/website/ts/containers/generate_order_form.ts b/packages/website/ts/containers/generate_order_form.ts
index 23c869a1e..afbac58e2 100644
--- a/packages/website/ts/containers/generate_order_form.ts
+++ b/packages/website/ts/containers/generate_order_form.ts
@@ -14,7 +14,7 @@ interface GenerateOrderFormProps {
     hashData: HashData;
     dispatcher: Dispatcher;
     isFullWidth?: boolean;
-    shouldRenderHeader?: boolean;
+    shouldHideHeader?: boolean;
 }
 
 interface ConnectedState {
-- 
cgit v1.2.3