aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website')
-rw-r--r--packages/website/package.json32
-rw-r--r--packages/website/public/css/basscss.min.css1
-rw-r--r--packages/website/public/index.html1
-rw-r--r--packages/website/ts/components/dialogs/ledger_config_dialog.tsx18
-rw-r--r--packages/website/ts/components/fill_order.tsx8
-rw-r--r--packages/website/ts/components/generate_order/asset_picker.tsx42
-rw-r--r--packages/website/ts/components/generate_order/generate_order_form.tsx20
-rw-r--r--packages/website/ts/components/generate_order/new_token_form.tsx2
-rw-r--r--packages/website/ts/components/inputs/allowance_state_toggle.tsx2
-rw-r--r--packages/website/ts/components/portal/portal.tsx4
-rw-r--r--packages/website/ts/components/token_balances.tsx22
-rw-r--r--packages/website/ts/components/ui/alert.tsx2
-rw-r--r--packages/website/ts/components/ui/lifecycle_raised_button.tsx24
-rw-r--r--packages/website/ts/index.tsx1
-rw-r--r--packages/website/ts/types.ts36
-rw-r--r--packages/website/ts/utils/utils.ts10
16 files changed, 114 insertions, 111 deletions
diff --git a/packages/website/package.json b/packages/website/package.json
index af43fabf9..475af4d61 100644
--- a/packages/website/package.json
+++ b/packages/website/package.json
@@ -1,6 +1,6 @@
{
"name": "@0x/website",
- "version": "0.0.64",
+ "version": "0.0.65",
"engines": {
"node": ">=6.12"
},
@@ -20,18 +20,18 @@
"author": "Fabio Berger",
"license": "Apache-2.0",
"dependencies": {
- "@0x/asset-buyer": "^3.0.5",
+ "@0x/asset-buyer": "^4.0.0",
"@0x/contract-addresses": "^2.1.0",
- "@0x/contract-wrappers": "^4.2.0",
- "@0x/json-schemas": "^2.1.5",
- "@0x/order-utils": "^3.1.0",
- "@0x/react-docs": "^1.0.23",
- "@0x/react-shared": "^1.1.0",
- "@0x/subproviders": "^2.1.9",
- "@0x/types": "^1.5.0",
- "@0x/typescript-typings": "^3.0.4",
- "@0x/utils": "^2.1.1",
- "@0x/web3-wrapper": "^3.2.2",
+ "@0x/contract-wrappers": "^4.2.1",
+ "@0x/json-schemas": "^2.1.6",
+ "@0x/order-utils": "^3.1.1",
+ "@0x/react-docs": "^1.0.24",
+ "@0x/react-shared": "^1.1.1",
+ "@0x/subproviders": "^2.1.10",
+ "@0x/types": "^1.5.1",
+ "@0x/typescript-typings": "^3.0.7",
+ "@0x/utils": "^3.0.0",
+ "@0x/web3-wrapper": "^3.2.3",
"@reach/dialog": "^0.1.2",
"@types/react-lazyload": "^2.3.1",
"@types/react-loadable": "^5.4.2",
@@ -42,7 +42,7 @@
"blockies": "^0.0.2",
"bowser": "^1.9.3",
"deep-equal": "^1.0.1",
- "ethereum-types": "^1.1.4",
+ "ethereum-types": "^1.1.5",
"ethereumjs-util": "^5.1.1",
"find-versions": "^2.0.0",
"jsonschema": "^1.2.0",
@@ -54,18 +54,20 @@
"polished": "^1.9.2",
"query-string": "^6.0.0",
"rc-slider": "^8.6.3",
- "react": "^16.4.2",
+ "react": "^16.5.2",
"react-copy-to-clipboard": "^5.0.0",
"react-document-title": "^2.0.3",
- "react-dom": "^16.4.2",
+ "react-dom": "^16.5.2",
"react-flickity-component": "^3.1.0",
"react-headroom": "2.2.2",
"react-helmet": "^5.2.0",
"react-lazyload": "^2.3.0",
"react-loadable": "^5.5.0",
+ "react-markdown": "^4.0.6",
"react-popper": "^1.0.0-beta.6",
"react-redux": "^5.0.3",
"react-responsive": "^6.0.1",
+ "react-router-dom": "^4.3.1",
"react-scroll": "0xproject/react-scroll#pr-330-and-replace-state",
"react-scrollable-anchor": "^0.6.1",
"react-syntax-highlighter": "^10.1.1",
diff --git a/packages/website/public/css/basscss.min.css b/packages/website/public/css/basscss.min.css
new file mode 100644
index 000000000..cb6f13198
--- /dev/null
+++ b/packages/website/public/css/basscss.min.css
@@ -0,0 +1 @@
+/*! Basscss | http://basscss.com | MIT License */.h1{font-size:2rem}.h2{font-size:1.5rem}.h3{font-size:1.25rem}.h4{font-size:1rem}.h5{font-size:.875rem}.h6{font-size:.75rem}.font-family-inherit{font-family:inherit}.font-size-inherit{font-size:inherit}.text-decoration-none{text-decoration:none}.bold{font-weight:700}.regular{font-weight:400}.italic{font-style:italic}.caps{text-transform:uppercase;letter-spacing:.2em}.left-align{text-align:left}.center{text-align:center}.right-align{text-align:right}.justify{text-align:justify}.nowrap{white-space:nowrap}.break-word{word-wrap:break-word}.line-height-1{line-height:1}.line-height-2{line-height:1.125}.line-height-3{line-height:1.25}.line-height-4{line-height:1.5}.list-style-none{list-style:none}.underline{text-decoration:underline}.truncate{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.list-reset{list-style:none;padding-left:0}.inline{display:inline}.block{display:block}.inline-block{display:inline-block}.table{display:table}.table-cell{display:table-cell}.overflow-hidden{overflow:hidden}.overflow-scroll{overflow:scroll}.overflow-auto{overflow:auto}.clearfix:after,.clearfix:before{content:" ";display:table}.clearfix:after{clear:both}.left{float:left}.right{float:right}.fit{max-width:100%}.max-width-1{max-width:24rem}.max-width-2{max-width:32rem}.max-width-3{max-width:48rem}.max-width-4{max-width:64rem}.border-box{box-sizing:border-box}.align-baseline{vertical-align:baseline}.align-top{vertical-align:top}.align-middle{vertical-align:middle}.align-bottom{vertical-align:bottom}.m0{margin:0}.mt0{margin-top:0}.mr0{margin-right:0}.mb0{margin-bottom:0}.ml0,.mx0{margin-left:0}.mx0{margin-right:0}.my0{margin-top:0;margin-bottom:0}.m1{margin:.5rem}.mt1{margin-top:.5rem}.mr1{margin-right:.5rem}.mb1{margin-bottom:.5rem}.ml1,.mx1{margin-left:.5rem}.mx1{margin-right:.5rem}.my1{margin-top:.5rem;margin-bottom:.5rem}.m2{margin:1rem}.mt2{margin-top:1rem}.mr2{margin-right:1rem}.mb2{margin-bottom:1rem}.ml2,.mx2{margin-left:1rem}.mx2{margin-right:1rem}.my2{margin-top:1rem;margin-bottom:1rem}.m3{margin:2rem}.mt3{margin-top:2rem}.mr3{margin-right:2rem}.mb3{margin-bottom:2rem}.ml3,.mx3{margin-left:2rem}.mx3{margin-right:2rem}.my3{margin-top:2rem;margin-bottom:2rem}.m4{margin:4rem}.mt4{margin-top:4rem}.mr4{margin-right:4rem}.mb4{margin-bottom:4rem}.ml4,.mx4{margin-left:4rem}.mx4{margin-right:4rem}.my4{margin-top:4rem;margin-bottom:4rem}.mxn1{margin-left:-.5rem;margin-right:-.5rem}.mxn2{margin-left:-1rem;margin-right:-1rem}.mxn3{margin-left:-2rem;margin-right:-2rem}.mxn4{margin-left:-4rem;margin-right:-4rem}.ml-auto{margin-left:auto}.mr-auto,.mx-auto{margin-right:auto}.mx-auto{margin-left:auto}.p0{padding:0}.pt0{padding-top:0}.pr0{padding-right:0}.pb0{padding-bottom:0}.pl0,.px0{padding-left:0}.px0{padding-right:0}.py0{padding-top:0;padding-bottom:0}.p1{padding:.5rem}.pt1{padding-top:.5rem}.pr1{padding-right:.5rem}.pb1{padding-bottom:.5rem}.pl1{padding-left:.5rem}.py1{padding-top:.5rem;padding-bottom:.5rem}.px1{padding-left:.5rem;padding-right:.5rem}.p2{padding:1rem}.pt2{padding-top:1rem}.pr2{padding-right:1rem}.pb2{padding-bottom:1rem}.pl2{padding-left:1rem}.py2{padding-top:1rem;padding-bottom:1rem}.px2{padding-left:1rem;padding-right:1rem}.p3{padding:2rem}.pt3{padding-top:2rem}.pr3{padding-right:2rem}.pb3{padding-bottom:2rem}.pl3{padding-left:2rem}.py3{padding-top:2rem;padding-bottom:2rem}.px3{padding-left:2rem;padding-right:2rem}.p4{padding:4rem}.pt4{padding-top:4rem}.pr4{padding-right:4rem}.pb4{padding-bottom:4rem}.pl4{padding-left:4rem}.py4{padding-top:4rem;padding-bottom:4rem}.px4{padding-left:4rem;padding-right:4rem}.col{float:left}.col,.col-right{box-sizing:border-box}.col-right{float:right}.col-1{width:8.33333%}.col-2{width:16.66667%}.col-3{width:25%}.col-4{width:33.33333%}.col-5{width:41.66667%}.col-6{width:50%}.col-7{width:58.33333%}.col-8{width:66.66667%}.col-9{width:75%}.col-10{width:83.33333%}.col-11{width:91.66667%}.col-12{width:100%}@media (min-width:40em){.sm-col{float:left;box-sizing:border-box}.sm-col-right{float:right;box-sizing:border-box}.sm-col-1{width:8.33333%}.sm-col-2{width:16.66667%}.sm-col-3{width:25%}.sm-col-4{width:33.33333%}.sm-col-5{width:41.66667%}.sm-col-6{width:50%}.sm-col-7{width:58.33333%}.sm-col-8{width:66.66667%}.sm-col-9{width:75%}.sm-col-10{width:83.33333%}.sm-col-11{width:91.66667%}.sm-col-12{width:100%}}@media (min-width:52em){.md-col{float:left;box-sizing:border-box}.md-col-right{float:right;box-sizing:border-box}.md-col-1{width:8.33333%}.md-col-2{width:16.66667%}.md-col-3{width:25%}.md-col-4{width:33.33333%}.md-col-5{width:41.66667%}.md-col-6{width:50%}.md-col-7{width:58.33333%}.md-col-8{width:66.66667%}.md-col-9{width:75%}.md-col-10{width:83.33333%}.md-col-11{width:91.66667%}.md-col-12{width:100%}}@media (min-width:64em){.lg-col{float:left;box-sizing:border-box}.lg-col-right{float:right;box-sizing:border-box}.lg-col-1{width:8.33333%}.lg-col-2{width:16.66667%}.lg-col-3{width:25%}.lg-col-4{width:33.33333%}.lg-col-5{width:41.66667%}.lg-col-6{width:50%}.lg-col-7{width:58.33333%}.lg-col-8{width:66.66667%}.lg-col-9{width:75%}.lg-col-10{width:83.33333%}.lg-col-11{width:91.66667%}.lg-col-12{width:100%}}.flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}@media (min-width:40em){.sm-flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}}@media (min-width:52em){.md-flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}}@media (min-width:64em){.lg-flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}}.flex-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.flex-wrap{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.items-start{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;-ms-grid-row-align:flex-start;align-items:flex-start}.items-end{-webkit-box-align:end;-webkit-align-items:flex-end;-ms-flex-align:end;-ms-grid-row-align:flex-end;align-items:flex-end}.items-center{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;-ms-grid-row-align:center;align-items:center}.items-baseline{-webkit-box-align:baseline;-webkit-align-items:baseline;-ms-flex-align:baseline;-ms-grid-row-align:baseline;align-items:baseline}.items-stretch{-webkit-box-align:stretch;-webkit-align-items:stretch;-ms-flex-align:stretch;-ms-grid-row-align:stretch;align-items:stretch}.self-start{-webkit-align-self:flex-start;-ms-flex-item-align:start;align-self:flex-start}.self-end{-webkit-align-self:flex-end;-ms-flex-item-align:end;align-self:flex-end}.self-center{-webkit-align-self:center;-ms-flex-item-align:center;align-self:center}.self-baseline{-webkit-align-self:baseline;-ms-flex-item-align:baseline;align-self:baseline}.self-stretch{-webkit-align-self:stretch;-ms-flex-item-align:stretch;align-self:stretch}.justify-start{-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start}.justify-end{-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end}.justify-center{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.justify-between{-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}.justify-around{-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}.content-start{-webkit-align-content:flex-start;-ms-flex-line-pack:start;align-content:flex-start}.content-end{-webkit-align-content:flex-end;-ms-flex-line-pack:end;align-content:flex-end}.content-center{-webkit-align-content:center;-ms-flex-line-pack:center;align-content:center}.content-between{-webkit-align-content:space-between;-ms-flex-line-pack:justify;align-content:space-between}.content-around{-webkit-align-content:space-around;-ms-flex-line-pack:distribute;align-content:space-around}.content-stretch{-webkit-align-content:stretch;-ms-flex-line-pack:stretch;align-content:stretch}.flex-auto{-webkit-box-flex:1;-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:0}.flex-none{-webkit-box-flex:0;-webkit-flex:none;-ms-flex:none;flex:none}.order-0{-webkit-box-ordinal-group:1;-webkit-order:0;-ms-flex-order:0;order:0}.order-1{-webkit-box-ordinal-group:2;-webkit-order:1;-ms-flex-order:1;order:1}.order-2{-webkit-box-ordinal-group:3;-webkit-order:2;-ms-flex-order:2;order:2}.order-3{-webkit-box-ordinal-group:4;-webkit-order:3;-ms-flex-order:3;order:3}.order-last{-webkit-box-ordinal-group:100000;-webkit-order:99999;-ms-flex-order:99999;order:99999}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.z1{z-index:1}.z2{z-index:2}.z3{z-index:3}.z4{z-index:4}.border{border-style:solid;border-width:1px}.border-top{border-top-style:solid;border-top-width:1px}.border-right{border-right-style:solid;border-right-width:1px}.border-bottom{border-bottom-style:solid;border-bottom-width:1px}.border-left{border-left-style:solid;border-left-width:1px}.border-none{border:0}.rounded{border-radius:3px}.circle{border-radius:50%}.rounded-top{border-radius:3px 3px 0 0}.rounded-right{border-radius:0 3px 3px 0}.rounded-bottom{border-radius:0 0 3px 3px}.rounded-left{border-radius:3px 0 0 3px}.not-rounded{border-radius:0}.hide{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}@media (max-width:40em){.xs-hide{display:none!important}}@media (min-width:40em) and (max-width:52em){.sm-hide{display:none!important}}@media (min-width:52em) and (max-width:64em){.md-hide{display:none!important}}@media (min-width:64em){.lg-hide{display:none!important}}.display-none{display:none!important} \ No newline at end of file
diff --git a/packages/website/public/index.html b/packages/website/public/index.html
index 26ebcdec8..738b675e7 100644
--- a/packages/website/public/index.html
+++ b/packages/website/public/index.html
@@ -18,6 +18,7 @@
<link rel="stylesheet" href="/css/roboto.css" />
<link rel="stylesheet" href="/css/roboto_mono.css" />
<link rel="stylesheet" href="/css/formular.css" />
+ <link rel="stylesheet" href="/css/basscss.min.css" />
<link rel="stylesheet" href="/css/basscss_responsive_custom.css" />
<link rel="stylesheet" href="/css/basscss_responsive_padding.css" />
<link rel="stylesheet" href="/css/basscss_responsive_margin.css" />
diff --git a/packages/website/ts/components/dialogs/ledger_config_dialog.tsx b/packages/website/ts/components/dialogs/ledger_config_dialog.tsx
index e15a2dd94..527353aa0 100644
--- a/packages/website/ts/components/dialogs/ledger_config_dialog.tsx
+++ b/packages/website/ts/components/dialogs/ledger_config_dialog.tsx
@@ -20,8 +20,8 @@ import { utils } from 'ts/utils/utils';
const VALID_ETHEREUM_DERIVATION_PATH_PREFIX = `44'/60'`;
enum LedgerSteps {
- CONNECT,
- SELECT_ADDRESS,
+ Connect,
+ SelectAddress,
}
interface LedgerConfigDialogProps {
@@ -52,7 +52,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
const derivationPathIfExists = props.blockchain.getLedgerDerivationPathIfExists();
this.state = {
connectionErrMsg: '',
- stepIndex: LedgerSteps.CONNECT,
+ stepIndex: LedgerSteps.Connect,
userAddresses: [],
addressBalances: [],
derivationPath: _.isUndefined(derivationPathIfExists)
@@ -67,7 +67,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
<FlatButton key="ledgerConnectCancel" label="Cancel" onClick={this._onClose.bind(this)} />,
];
const dialogTitle =
- this.state.stepIndex === LedgerSteps.CONNECT ? 'Connect to your Ledger' : 'Select desired address';
+ this.state.stepIndex === LedgerSteps.Connect ? 'Connect to your Ledger' : 'Select desired address';
return (
<Dialog
title={dialogTitle}
@@ -79,8 +79,8 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
bodyStyle={{ paddingBottom: 0 }}
>
<div style={{ color: colors.grey700, paddingTop: 1 }}>
- {this.state.stepIndex === LedgerSteps.CONNECT && this._renderConnectStep()}
- {this.state.stepIndex === LedgerSteps.SELECT_ADDRESS && this._renderSelectAddressStep()}
+ {this.state.stepIndex === LedgerSteps.Connect && this._renderConnectStep()}
+ {this.state.stepIndex === LedgerSteps.SelectAddress && this._renderSelectAddressStep()}
</div>
</Dialog>
);
@@ -195,7 +195,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
private _onClose(): void {
this.setState({
connectionErrMsg: '',
- stepIndex: LedgerSteps.CONNECT,
+ stepIndex: LedgerSteps.Connect,
});
const isOpen = false;
this.props.toggleDialogFn(isOpen);
@@ -210,7 +210,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
this.props.blockchain.fetchTokenInformationAsync();
this.props.dispatcher.updateUserWeiBalance(selectAddressBalance);
this.setState({
- stepIndex: LedgerSteps.CONNECT,
+ stepIndex: LedgerSteps.Connect,
});
const isOpen = false;
this.props.toggleDialogFn(isOpen);
@@ -284,7 +284,7 @@ export class LedgerConfigDialog extends React.Component<LedgerConfigDialogProps,
const didSucceed = await this._fetchAddressesAndBalancesAsync();
if (didSucceed) {
this.setState({
- stepIndex: LedgerSteps.SELECT_ADDRESS,
+ stepIndex: LedgerSteps.SelectAddress,
connectionErrMsg: '',
});
}
diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx
index 2fa2b94a0..7fee8c4df 100644
--- a/packages/website/ts/components/fill_order.tsx
+++ b/packages/website/ts/components/fill_order.tsx
@@ -182,7 +182,7 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
</div>
)}
{!_.isEmpty(this.state.orderJSONErrMsg) && (
- <Alert type={AlertTypes.ERROR} message={this.state.orderJSONErrMsg} />
+ <Alert type={AlertTypes.Error} message={this.state.orderJSONErrMsg} />
)}
</div>
);
@@ -298,7 +298,7 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
onClick={this._onCancelOrderClickFireAndForgetAsync.bind(this)}
/>
{this.state.didCancelOrderSucceed && (
- <Alert type={AlertTypes.SUCCESS} message={this._renderCancelSuccessMsg()} />
+ <Alert type={AlertTypes.Success} message={this._renderCancelSuccessMsg()} />
)}
</div>
) : (
@@ -310,10 +310,10 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
onClick={this._onFillOrderClick.bind(this)}
/>
{!_.isEmpty(this.state.globalErrMsg) && (
- <Alert type={AlertTypes.ERROR} message={this.state.globalErrMsg} />
+ <Alert type={AlertTypes.Error} message={this.state.globalErrMsg} />
)}
{this.state.didFillOrderSucceed && (
- <Alert type={AlertTypes.SUCCESS} message={this._renderFillSuccessMsg()} />
+ <Alert type={AlertTypes.Success} message={this._renderFillSuccessMsg()} />
)}
</div>
)}
diff --git a/packages/website/ts/components/generate_order/asset_picker.tsx b/packages/website/ts/components/generate_order/asset_picker.tsx
index e6ecd2ec8..d3f11f962 100644
--- a/packages/website/ts/components/generate_order/asset_picker.tsx
+++ b/packages/website/ts/components/generate_order/asset_picker.tsx
@@ -18,9 +18,9 @@ import { utils } from 'ts/utils/utils';
const TOKEN_ICON_DIMENSION = 100;
const TILE_DIMENSION = 146;
enum AssetViews {
- ASSET_PICKER = 'ASSET_PICKER',
- NEW_TOKEN_FORM = 'NEW_TOKEN_FORM',
- CONFIRM_TRACK_TOKEN = 'CONFIRM_TRACK_TOKEN',
+ AssetPicker = 'ASSET_PICKER',
+ NewTokenForm = 'NEW_TOKEN_FORM',
+ ConfirmTrackToken = 'CONFIRM_TRACK_TOKEN',
}
interface AssetPickerProps {
@@ -44,29 +44,29 @@ interface AssetPickerState {
export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerState> {
public static defaultProps: Partial<AssetPickerProps> = {
- tokenVisibility: TokenVisibility.ALL,
+ tokenVisibility: TokenVisibility.All,
};
private readonly _dialogConfigsByAssetView: { [assetView: string]: DialogConfigs };
constructor(props: AssetPickerProps) {
super(props);
this.state = {
- assetView: AssetViews.ASSET_PICKER,
+ assetView: AssetViews.AssetPicker,
hoveredAddress: undefined,
chosenTrackTokenAddress: undefined,
isAddingTokenToTracked: false,
};
this._dialogConfigsByAssetView = {
- [AssetViews.ASSET_PICKER]: {
+ [AssetViews.AssetPicker]: {
title: 'Select token',
isModal: false,
actions: [],
},
- [AssetViews.NEW_TOKEN_FORM]: {
+ [AssetViews.NewTokenForm]: {
title: 'Add an ERC20 token',
isModal: false,
actions: [],
},
- [AssetViews.CONFIRM_TRACK_TOKEN]: {
+ [AssetViews.ConfirmTrackToken]: {
title: 'Tracking confirmation',
isModal: true,
actions: [
@@ -95,15 +95,15 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
autoScrollBodyContent={true}
onRequestClose={this._onCloseDialog.bind(this)}
>
- {this.state.assetView === AssetViews.ASSET_PICKER && this._renderAssetPicker()}
- {this.state.assetView === AssetViews.NEW_TOKEN_FORM && (
+ {this.state.assetView === AssetViews.AssetPicker && this._renderAssetPicker()}
+ {this.state.assetView === AssetViews.NewTokenForm && (
<NewTokenForm
blockchain={this.props.blockchain}
onNewTokenSubmitted={this._onNewTokenSubmitted.bind(this)}
tokenByAddress={this.props.tokenByAddress}
/>
)}
- {this.state.assetView === AssetViews.CONFIRM_TRACK_TOKEN && this._renderConfirmTrackToken()}
+ {this.state.assetView === AssetViews.ConfirmTrackToken && this._renderConfirmTrackToken()}
</Dialog>
);
}
@@ -138,19 +138,19 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
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
+ 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 &&
+ ((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 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>;
@@ -188,7 +188,7 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
cursor: 'pointer',
opacity: isHovered ? 0.6 : 1,
};
- if (this.props.tokenVisibility !== TokenVisibility.TRACKED) {
+ if (this.props.tokenVisibility !== TokenVisibility.Tracked) {
gridTiles.push(
<div
key={otherTokenKey}
@@ -222,7 +222,7 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
}
private _onCloseDialog(): void {
this.setState({
- assetView: AssetViews.ASSET_PICKER,
+ assetView: AssetViews.AssetPicker,
});
this.props.onTokenChosen(this.props.currentTokenAddress);
}
@@ -232,21 +232,21 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
this.props.onTokenChosen(tokenAddress);
} else {
this.setState({
- assetView: AssetViews.CONFIRM_TRACK_TOKEN,
+ assetView: AssetViews.ConfirmTrackToken,
chosenTrackTokenAddress: tokenAddress,
});
}
}
private _onCustomAssetChosen(): void {
this.setState({
- assetView: AssetViews.NEW_TOKEN_FORM,
+ assetView: AssetViews.NewTokenForm,
});
}
private _onNewTokenSubmitted(newToken: Token): void {
trackedTokenStorage.addTrackedTokenToUser(this.props.userAddress, this.props.networkId, newToken);
this.props.dispatcher.addTokenToTokenByAddress(newToken);
this.setState({
- assetView: AssetViews.ASSET_PICKER,
+ assetView: AssetViews.AssetPicker,
});
this.props.onTokenChosen(newToken.address);
}
@@ -254,7 +254,7 @@ export class AssetPicker extends React.Component<AssetPickerProps, AssetPickerSt
const resetState: AssetPickerState = {
...this.state,
isAddingTokenToTracked: false,
- assetView: AssetViews.ASSET_PICKER,
+ assetView: AssetViews.AssetPicker,
chosenTrackTokenAddress: undefined,
};
if (!didUserAcceptTracking) {
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 8afbee977..0f70aa18f 100644
--- a/packages/website/ts/components/generate_order/generate_order_form.tsx
+++ b/packages/website/ts/components/generate_order/generate_order_form.tsx
@@ -36,9 +36,9 @@ import { errorReporter } from 'ts/utils/error_reporter';
import { utils } from 'ts/utils/utils';
enum SigningState {
- UNSIGNED,
- SIGNING,
- SIGNED,
+ Unsigned,
+ Signing,
+ Signed,
}
interface GenerateOrderFormProps {
@@ -76,7 +76,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
this.state = {
globalErrMsg: '',
shouldShowIncompleteErrs: false,
- signingState: SigningState.UNSIGNED,
+ signingState: SigningState.Unsigned,
};
}
public componentDidMount(): void {
@@ -207,7 +207,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
/>
</div>
{this.state.globalErrMsg !== '' && (
- <Alert type={AlertTypes.ERROR} message={this.state.globalErrMsg} />
+ <Alert type={AlertTypes.Error} message={this.state.globalErrMsg} />
)}
</div>
</div>
@@ -215,7 +215,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
title="Order JSON"
titleStyle={{ fontWeight: 100 }}
modal={false}
- open={this.state.signingState === SigningState.SIGNED}
+ open={this.state.signingState === SigningState.Signed}
onRequestClose={this._onCloseOrderJSONDialog.bind(this)}
>
<OrderJSON
@@ -247,7 +247,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
// orderHash will not collide with the previously generated orderHash.
this.props.dispatcher.updateOrderSalt(generatePseudoRandomSalt());
this.setState({
- signingState: SigningState.UNSIGNED,
+ signingState: SigningState.Unsigned,
});
}
private async _onSignClickedAsync(): Promise<boolean> {
@@ -305,13 +305,13 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
}
private async _signTransactionAsync(): Promise<PortalOrder | undefined> {
this.setState({
- signingState: SigningState.SIGNING,
+ signingState: SigningState.Signing,
});
const exchangeAddress = this.props.blockchain.getExchangeContractAddressIfExists();
if (_.isUndefined(exchangeAddress)) {
this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen(true);
this.setState({
- signingState: SigningState.UNSIGNED,
+ signingState: SigningState.Unsigned,
});
return undefined;
}
@@ -371,7 +371,7 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G
}
}
this.setState({
- signingState: globalErrMsg === '' ? SigningState.SIGNED : SigningState.UNSIGNED,
+ signingState: globalErrMsg === '' ? SigningState.Signed : SigningState.Unsigned,
globalErrMsg,
});
return order;
diff --git a/packages/website/ts/components/generate_order/new_token_form.tsx b/packages/website/ts/components/generate_order/new_token_form.tsx
index b8cd88b18..ce684d177 100644
--- a/packages/website/ts/components/generate_order/new_token_form.tsx
+++ b/packages/website/ts/components/generate_order/new_token_form.tsx
@@ -93,7 +93,7 @@ export class NewTokenForm extends React.Component<NewTokenFormProps, NewTokenFor
onClickAsyncFn={this._onAddNewTokenClickAsync.bind(this)}
/>
</div>
- {this.state.globalErrMsg !== '' && <Alert type={AlertTypes.ERROR} message={this.state.globalErrMsg} />}
+ {this.state.globalErrMsg !== '' && <Alert type={AlertTypes.Error} message={this.state.globalErrMsg} />}
</div>
);
}
diff --git a/packages/website/ts/components/inputs/allowance_state_toggle.tsx b/packages/website/ts/components/inputs/allowance_state_toggle.tsx
index 5396295d2..3a78d32f3 100644
--- a/packages/website/ts/components/inputs/allowance_state_toggle.tsx
+++ b/packages/website/ts/components/inputs/allowance_state_toggle.tsx
@@ -150,7 +150,7 @@ export class AllowanceStateToggle extends React.Component<AllowanceStateTogglePr
}
logUtils.log(`Unexpected error encountered: ${err}`);
logUtils.log(err.stack);
- this.props.onErrorOccurred(BalanceErrs.allowanceSettingFailed);
+ this.props.onErrorOccurred(BalanceErrs.AllowanceSettingFailed);
errorReporter.report(err);
}
}
diff --git a/packages/website/ts/components/portal/portal.tsx b/packages/website/ts/components/portal/portal.tsx
index 6d7c90573..59cf2db71 100644
--- a/packages/website/ts/components/portal/portal.tsx
+++ b/packages/website/ts/components/portal/portal.tsx
@@ -229,8 +229,8 @@ export class Portal extends React.Component<PortalProps, PortalState> {
const isAssetPickerDialogOpen = this.state.tokenManagementState !== TokenManagementState.None;
const tokenVisibility =
this.state.tokenManagementState === TokenManagementState.Add
- ? TokenVisibility.UNTRACKED
- : TokenVisibility.TRACKED;
+ ? TokenVisibility.Untracked
+ : TokenVisibility.Tracked;
return (
<Container>
<MetaTags title={DOCUMENT_TITLE} description={DOCUMENT_DESCRIPTION} />
diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx
index 2ed0229c8..e8f2a6461 100644
--- a/packages/website/ts/components/token_balances.tsx
+++ b/packages/website/ts/components/token_balances.tsx
@@ -303,7 +303,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
currentTokenAddress={''}
onTokenChosen={this._onAssetTokenPicked.bind(this)}
tokenByAddress={this.props.tokenByAddress}
- tokenVisibility={this.state.isAddingToken ? TokenVisibility.UNTRACKED : TokenVisibility.TRACKED}
+ tokenVisibility={this.state.isAddingToken ? TokenVisibility.Untracked : TokenVisibility.Tracked}
/>
</div>
);
@@ -439,7 +439,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
}
private _onSendFailed(): void {
this.setState({
- errorType: BalanceErrs.sendFailed,
+ errorType: BalanceErrs.SendFailed,
});
}
private _renderAmount(amount: BigNumber, decimals: number): React.ReactNode {
@@ -460,7 +460,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
}
private _renderErrorDialogBody(): React.ReactNode {
switch (this.state.errorType) {
- case BalanceErrs.incorrectNetworkForFaucet:
+ case BalanceErrs.IncorrectNetworkForFaucet:
return (
<div>
Our faucet can only send test Ether to addresses on testnets. Please make sure you are connected
@@ -468,7 +468,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
</div>
);
- case BalanceErrs.faucetRequestFailed:
+ case BalanceErrs.FaucetRequestFailed:
return (
<div>
An unexpected error occurred while trying to request test Ether from our faucet. Please refresh
@@ -476,13 +476,13 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
</div>
);
- case BalanceErrs.faucetQueueIsFull:
+ case BalanceErrs.FaucetQueueIsFull:
return <div>Our test Ether faucet queue is full. Please try requesting test Ether again later.</div>;
- case BalanceErrs.mintingFailed:
+ case BalanceErrs.MintingFailed:
return <div>Minting your test tokens failed unexpectedly. Please refresh the page and try again.</div>;
- case BalanceErrs.allowanceSettingFailed:
+ case BalanceErrs.AllowanceSettingFailed:
return (
<div>
An unexpected error occurred while trying to set your test token allowance. Please refresh the
@@ -521,7 +521,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
logUtils.log(`Unexpected error encountered: ${err}`);
logUtils.log(err.stack);
this.setState({
- errorType: BalanceErrs.mintingFailed,
+ errorType: BalanceErrs.MintingFailed,
});
errorReporter.report(err);
return false;
@@ -537,7 +537,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
// from, we must show user an error message
if (!utils.isTestNetwork(this.props.blockchain.networkId)) {
this.setState({
- errorType: BalanceErrs.incorrectNetworkForFaucet,
+ errorType: BalanceErrs.IncorrectNetworkForFaucet,
});
return false;
}
@@ -553,8 +553,8 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
logUtils.log(`Unexpected status code: ${response.status} -> ${responseBody}`);
const errorType =
response.status === constants.UNAVAILABLE_STATUS
- ? BalanceErrs.faucetQueueIsFull
- : BalanceErrs.faucetRequestFailed;
+ ? BalanceErrs.FaucetQueueIsFull
+ : BalanceErrs.FaucetRequestFailed;
this.setState({
errorType,
});
diff --git a/packages/website/ts/components/ui/alert.tsx b/packages/website/ts/components/ui/alert.tsx
index 32e0f1be8..c7a5b9030 100644
--- a/packages/website/ts/components/ui/alert.tsx
+++ b/packages/website/ts/components/ui/alert.tsx
@@ -8,7 +8,7 @@ interface AlertProps {
}
export const Alert = (props: AlertProps) => {
- const isAlert = props.type === AlertTypes.ERROR;
+ const isAlert = props.type === AlertTypes.Error;
const errMsgStyles = {
background: isAlert ? colors.red200 : colors.lightestGreen,
color: colors.white,
diff --git a/packages/website/ts/components/ui/lifecycle_raised_button.tsx b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
index a8daf4102..f004dd47f 100644
--- a/packages/website/ts/components/ui/lifecycle_raised_button.tsx
+++ b/packages/website/ts/components/ui/lifecycle_raised_button.tsx
@@ -6,9 +6,9 @@ import * as React from 'react';
const COMPLETE_STATE_SHOW_LENGTH_MS = 2000;
enum ButtonState {
- READY,
- LOADING,
- COMPLETE,
+ Ready,
+ Loading,
+ Complete,
}
interface LifeCycleRaisedButtonProps {
@@ -38,7 +38,7 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
constructor(props: LifeCycleRaisedButtonProps) {
super(props);
this.state = {
- buttonState: ButtonState.READY,
+ buttonState: ButtonState.Ready,
};
}
public componentWillUnmount(): void {
@@ -52,13 +52,13 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
let label;
switch (this.state.buttonState) {
- case ButtonState.READY:
+ case ButtonState.Ready:
label = this.props.labelReady;
break;
- case ButtonState.LOADING:
+ case ButtonState.Loading:
label = this.props.labelLoading;
break;
- case ButtonState.COMPLETE:
+ case ButtonState.Complete:
label = this.props.labelComplete;
break;
default:
@@ -72,13 +72,13 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
backgroundColor={this.props.backgroundColor}
labelColor={this.props.labelColor}
onClick={this.onClickAsync.bind(this)}
- disabled={this.props.isDisabled || this.state.buttonState !== ButtonState.READY}
+ disabled={this.props.isDisabled || this.state.buttonState !== ButtonState.Ready}
/>
);
}
public async onClickAsync(): Promise<void> {
this.setState({
- buttonState: ButtonState.LOADING,
+ buttonState: ButtonState.Loading,
});
const didSucceed = await this.props.onClickAsyncFn();
if (this._didUnmount) {
@@ -86,16 +86,16 @@ export class LifeCycleRaisedButton extends React.Component<LifeCycleRaisedButton
}
if (didSucceed) {
this.setState({
- buttonState: ButtonState.COMPLETE,
+ buttonState: ButtonState.Complete,
});
this._buttonTimeoutId = window.setTimeout(() => {
this.setState({
- buttonState: ButtonState.READY,
+ buttonState: ButtonState.Ready,
});
}, COMPLETE_STATE_SHOW_LENGTH_MS);
} else {
this.setState({
- buttonState: ButtonState.READY,
+ buttonState: ButtonState.Ready,
});
}
}
diff --git a/packages/website/ts/index.tsx b/packages/website/ts/index.tsx
index 4ed66c572..7bb018d17 100644
--- a/packages/website/ts/index.tsx
+++ b/packages/website/ts/index.tsx
@@ -31,7 +31,6 @@ import { NextWhy } from 'ts/pages/why';
tradeHistoryStorage.clearIfRequired();
trackedTokenStorage.clearIfRequired();
-import 'basscss/css/basscss.css';
import 'less/all.less';
// We pass modulePromise returning lambda instead of module promise,
diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts
index 50114e2d6..9492da5a5 100644
--- a/packages/website/ts/types.ts
+++ b/packages/website/ts/types.ts
@@ -83,12 +83,12 @@ export interface Fill {
}
export enum BalanceErrs {
- incorrectNetworkForFaucet,
- faucetRequestFailed,
- faucetQueueIsFull,
- mintingFailed,
- sendFailed,
- allowanceSettingFailed,
+ IncorrectNetworkForFaucet,
+ FaucetRequestFailed,
+ FaucetQueueIsFull,
+ MintingFailed,
+ SendFailed,
+ AllowanceSettingFailed,
}
export enum ActionTypes {
@@ -209,8 +209,8 @@ export enum ScreenWidths {
}
export enum AlertTypes {
- ERROR,
- SUCCESS,
+ Error,
+ Success,
}
export enum BlockchainErrs {
@@ -228,11 +228,11 @@ export enum BlockchainCallErrs {
}
export enum Environments {
- DEVELOPMENT = 'DEVELOPMENT',
- DOGFOOD = 'DOGFOOD',
- STAGING = 'STAGING',
- PRODUCTION = 'PRODUCTION',
- UNKNOWN = 'UNKNOWN',
+ Development = 'DEVELOPMENT',
+ Dogfood = 'DOGFOOD',
+ Staging = 'STAGING',
+ Production = 'PRODUCTION',
+ Unknown = 'UNKNOWN',
}
export type ContractInstance = any; // TODO: add type definition for Contract
@@ -323,9 +323,9 @@ export interface DialogConfigs {
}
export enum TokenVisibility {
- ALL = 'ALL',
- UNTRACKED = 'UNTRACKED',
- TRACKED = 'TRACKED',
+ All = 'ALL',
+ Untracked = 'UNTRACKED',
+ Tracked = 'TRACKED',
}
export interface VersionToFilePath {
@@ -350,7 +350,7 @@ export enum WebsitePaths {
Docs = '/docs',
ZeroExJs = '/docs/0x.js',
Home = '/',
- FAQ = '/faq',
+ FAQ = '/faq', // tslint:disable-line:enum-naming
About = '/about',
AboutMission = '/about/mission',
AboutTeam = '/about/team',
@@ -629,7 +629,7 @@ export enum BrowserType {
export enum OperatingSystemType {
Android = 'Android',
- iOS = 'iOS',
+ iOS = 'iOS', // tslint:disable-line:enum-naming
Mac = 'Mac',
Windows = 'Windows',
WindowsPhone = 'WindowsPhone',
diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts
index 8cc0061de..890f1553a 100644
--- a/packages/website/ts/utils/utils.ts
+++ b/packages/website/ts/utils/utils.ts
@@ -342,18 +342,18 @@ export const utils = {
},
getEnvironment(): Environments {
if (utils.isDogfood()) {
- return Environments.DOGFOOD;
+ return Environments.Dogfood;
}
if (utils.isDevelopment()) {
- return Environments.DEVELOPMENT;
+ return Environments.Development;
}
if (utils.isStaging()) {
- return Environments.STAGING;
+ return Environments.Staging;
}
if (utils.isProduction()) {
- return Environments.PRODUCTION;
+ return Environments.Production;
}
- return Environments.UNKNOWN;
+ return Environments.Unknown;
},
getEthToken(tokenByAddress: TokenByAddress): Token {
return utils.getTokenBySymbol(constants.ETHER_TOKEN_SYMBOL, tokenByAddress);
generated by cgit v1.2.3 (git 2.25.1) at 2025-02-15 01:16:03 +0800