Merge branch 'development' into feature/portal-ledger-support

* development: (437 commits)
  Publish
  Update yarn.lock
  Update the CHANGELOG
  Fix the bug making it impossible to specify the custom ZRX address
  Fix fill/cancel order by looking for NoError instead of empty blockchainErr given the BlockchainErrs type refactor
  Add a comment about a yarn bug
  Add our mainnet and kovan nodes as backups for Portal requests
  Fix bug hiding the user info from topBar
  Add dev-utils package to top level README
  Prettier newline
  Prettier
  Allow Token symbols to be alphanumeric
  Update CHANGELOG, rebase on development
  Should not -> cannot
  Reject negative amounts in isValidBaseUnitAmount
  Re-add changelog for 0x.js
  Fix prettier
  Update yarn.lock
  Move tests to a separate folder
  Change file layout
  ...

# Conflicts:
#	packages/website/README.md

1 files changed, 35 insertions, 46 deletions

diff --git a/packages/website/ts/components/trade_history/trade_history_item.tsx b/packages/website/ts/components/trade_history/trade_history_item.tsx
index 4dcceadb7..7e42e64e6 100644
--- a/packages/website/ts/components/trade_history/trade_history_item.tsx
+++ b/packages/website/ts/components/trade_history/trade_history_item.tsx
@@ -1,14 +1,14 @@
-import {ZeroEx} from '0x.js';
-import BigNumber from 'bignumber.js';
+import { ZeroEx } from '0x.js';
+import { BigNumber } from '@0xproject/utils';
 import * as _ from 'lodash';
 import Paper from 'material-ui/Paper';
-import {colors} from 'material-ui/styles';
 import * as moment from 'moment';
 import * as React from 'react';
 import * as ReactTooltip from 'react-tooltip';
-import {EtherScanIcon} from 'ts/components/ui/etherscan_icon';
-import {Party} from 'ts/components/ui/party';
-import {EtherscanLinkSuffixes, Fill, Token, TokenByAddress} from 'ts/types';
+import { EtherScanIcon } from 'ts/components/ui/etherscan_icon';
+import { Party } from 'ts/components/ui/party';
+import { EtherscanLinkSuffixes, Fill, Token, TokenByAddress } from 'ts/types';
+import { colors } from 'ts/utils/colors';
 
 const PRECISION = 5;
 const IDENTICON_DIAMETER = 40;
@@ -44,30 +44,26 @@ export class TradeHistoryItem extends React.Component<TradeHistoryItemProps, Tra
             fontWeight: 100,
             display: 'inline-block',
         };
-        const amountColClassNames = 'col col-12 lg-col-4 md-col-4 lg-py2 md-py2 sm-py1 lg-pr2 md-pr2 \
+        const amountColClassNames =
+            'col col-12 lg-col-4 md-col-4 lg-py2 md-py2 sm-py1 lg-pr2 md-pr2 \
                                      lg-right-align md-right-align sm-center';
 
         return (
-            <Paper
-                className="py1"
-                style={{margin: '3px 3px 15px 3px'}}
-            >
+            <Paper className="py1" style={{ margin: '3px 3px 15px 3px' }}>
                 <div className="clearfix">
-                    <div className="col col-12 lg-col-1 md-col-1 pt2 lg-pl3 md-pl3">
-                        {this.renderDate()}
-                    </div>
+                    <div className="col col-12 lg-col-1 md-col-1 pt2 lg-pl3 md-pl3">{this._renderDate()}</div>
                     <div
                         className="col col-12 lg-col-6 md-col-6 lg-pl3 md-pl3"
-                        style={{fontSize: 12, fontWeight: 100}}
+                        style={{ fontSize: 12, fontWeight: 100 }}
                     >
-                        <div className="flex sm-mx-auto xs-mx-auto" style={{paddingTop: 4, width: 224}}>
+                        <div className="flex sm-mx-auto xs-mx-auto" style={{ paddingTop: 4, width: 224 }}>
                             <Party
                                 label="Maker"
                                 address={fill.maker}
                                 identiconDiameter={IDENTICON_DIAMETER}
                                 networkId={this.props.networkId}
                             />
-                            <i style={{fontSize: 30}} className="zmdi zmdi-swap py3" />
+                            <i style={{ fontSize: 30 }} className="zmdi zmdi-swap py3" />
                             <Party
                                 label="Taker"
                                 address={fill.taker}
@@ -76,18 +72,15 @@ export class TradeHistoryItem extends React.Component<TradeHistoryItemProps, Tra
                             />
                         </div>
                     </div>
-                    <div
-                        className={amountColClassNames}
-                        style={amountColStyle}
-                    >
-                        {this.renderAmounts(makerToken, takerToken)}
+                    <div className={amountColClassNames} style={amountColStyle}>
+                        {this._renderAmounts(makerToken, takerToken)}
                     </div>
                     <div className="col col-12 lg-col-1 md-col-1 lg-pr3 md-pr3 lg-py3 md-py3 sm-pb1 sm-center">
-                        <div className="pt1 lg-right md-right sm-mx-auto" style={{width: 13}}>
+                        <div className="pt1 lg-right md-right sm-mx-auto" style={{ width: 13 }}>
                             <EtherScanIcon
                                 addressOrTxHash={fill.transactionHash}
                                 networkId={this.props.networkId}
-                                etherscanLinkSuffixes={EtherscanLinkSuffixes.tx}
+                                etherscanLinkSuffixes={EtherscanLinkSuffixes.Tx}
                             />
                         </div>
                     </div>
@@ -95,7 +88,7 @@ export class TradeHistoryItem extends React.Component<TradeHistoryItemProps, Tra
             </Paper>
         );
     }
-    private renderAmounts(makerToken: Token, takerToken: Token) {
+    private _renderAmounts(makerToken: Token, takerToken: Token) {
         const fill = this.props.fill;
         const filledTakerTokenAmountInUnits = ZeroEx.toUnitAmount(fill.filledTakerTokenAmount, takerToken.decimals);
         const filledMakerTokenAmountInUnits = ZeroEx.toUnitAmount(fill.filledMakerTokenAmount, takerToken.decimals);
@@ -124,31 +117,26 @@ export class TradeHistoryItem extends React.Component<TradeHistoryItemProps, Tra
             givenToken = takerToken;
         } else {
             // This condition should never be hit
-            throw new Error('Found Fill that wasn\'t performed by this user');
+            throw new Error("Found Fill that wasn't performed by this user");
         }
 
         return (
             <div>
-                <div
-                    style={{color: colors.green400, fontSize: 16}}
-                >
-                    <span>+{' '}</span>
-                    {this.renderAmount(receiveAmount, receiveToken.symbol, receiveToken.decimals)}
+                <div style={{ color: colors.green400, fontSize: 16 }}>
+                    <span>+ </span>
+                    {this._renderAmount(receiveAmount, receiveToken.symbol, receiveToken.decimals)}
                 </div>
-                <div
-                    className="pb1 inline-block"
-                    style={{color: colors.red200, fontSize: 16}}
-                >
-                    <span>-{' '}</span>
-                    {this.renderAmount(givenAmount, givenToken.symbol, givenToken.decimals)}
+                <div className="pb1 inline-block" style={{ color: colors.red200, fontSize: 16 }}>
+                    <span>- </span>
+                    {this._renderAmount(givenAmount, givenToken.symbol, givenToken.decimals)}
                 </div>
-                <div style={{color: colors.grey400, fontSize: 14}}>
+                <div style={{ color: colors.grey400, fontSize: 14 }}>
                     {exchangeRate.toFixed(PRECISION)} {givenToken.symbol}/{receiveToken.symbol}
                 </div>
             </div>
         );
     }
-    private renderDate() {
+    private _renderDate() {
         const blockMoment = moment.unix(this.props.fill.blockTimestamp);
         if (!blockMoment.isValid()) {
             return null;
@@ -160,17 +148,18 @@ export class TradeHistoryItem extends React.Component<TradeHistoryItemProps, Tra
         const dateTooltipId = `${this.props.fill.transactionHash}-date`;
 
         return (
-            <div
-                data-tip={true}
-                data-for={dateTooltipId}
-            >
-                <div className="center pt1" style={{fontSize: 13}}>{monthAbreviation}</div>
-                <div className="center" style={{fontSize: 24, fontWeight: 100}}>{dayOfMonth}</div>
+            <div data-tip={true} data-for={dateTooltipId}>
+                <div className="center pt1" style={{ fontSize: 13 }}>
+                    {monthAbreviation}
+                </div>
+                <div className="center" style={{ fontSize: 24, fontWeight: 100 }}>
+                    {dayOfMonth}
+                </div>
                 <ReactTooltip id={dateTooltipId}>{formattedBlockDate}</ReactTooltip>
             </div>
         );
     }
-    private renderAmount(amount: BigNumber, symbol: string, decimals: number) {
+    private _renderAmount(amount: BigNumber, symbol: string, decimals: number) {
         const unitAmount = ZeroEx.toUnitAmount(amount, decimals);
         return (
             <span>