aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/components/portal.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts/components/portal.tsx')
-rw-r--r--packages/website/ts/components/portal.tsx115
1 files changed, 51 insertions, 64 deletions
diff --git a/packages/website/ts/components/portal.tsx b/packages/website/ts/components/portal.tsx
index 574862dfc..cfd70b0b2 100644
--- a/packages/website/ts/components/portal.tsx
+++ b/packages/website/ts/components/portal.tsx
@@ -3,25 +3,25 @@ import * as _ from 'lodash';
import Paper from 'material-ui/Paper';
import * as React from 'react';
import * as DocumentTitle from 'react-document-title';
-import {Route, Switch} from 'react-router-dom';
-import {Blockchain} from 'ts/blockchain';
-import {BlockchainErrDialog} from 'ts/components/dialogs/blockchain_err_dialog';
-import {PortalDisclaimerDialog} from 'ts/components/dialogs/portal_disclaimer_dialog';
-import {WrappedEthSectionNoticeDialog} from 'ts/components/dialogs/wrapped_eth_section_notice_dialog';
-import {EthWrappers} from 'ts/components/eth_wrappers';
-import {FillOrder} from 'ts/components/fill_order';
-import {Footer} from 'ts/components/footer';
-import {PortalMenu} from 'ts/components/portal_menu';
-import {TokenBalances} from 'ts/components/token_balances';
-import {TopBar} from 'ts/components/top_bar';
-import {TradeHistory} from 'ts/components/trade_history/trade_history';
-import {FlashMessage} from 'ts/components/ui/flash_message';
-import {Loading} from 'ts/components/ui/loading';
-import {GenerateOrderForm} from 'ts/containers/generate_order_form';
-import {localStorage} from 'ts/local_storage/local_storage';
-import {Dispatcher} from 'ts/redux/dispatcher';
-import {orderSchema} from 'ts/schemas/order_schema';
-import {SchemaValidator} from 'ts/schemas/validator';
+import { Route, Switch } from 'react-router-dom';
+import { Blockchain } from 'ts/blockchain';
+import { BlockchainErrDialog } from 'ts/components/dialogs/blockchain_err_dialog';
+import { PortalDisclaimerDialog } from 'ts/components/dialogs/portal_disclaimer_dialog';
+import { WrappedEthSectionNoticeDialog } from 'ts/components/dialogs/wrapped_eth_section_notice_dialog';
+import { EthWrappers } from 'ts/components/eth_wrappers';
+import { FillOrder } from 'ts/components/fill_order';
+import { Footer } from 'ts/components/footer';
+import { PortalMenu } from 'ts/components/portal_menu';
+import { TokenBalances } from 'ts/components/token_balances';
+import { TopBar } from 'ts/components/top_bar';
+import { TradeHistory } from 'ts/components/trade_history/trade_history';
+import { FlashMessage } from 'ts/components/ui/flash_message';
+import { Loading } from 'ts/components/ui/loading';
+import { GenerateOrderForm } from 'ts/containers/generate_order_form';
+import { localStorage } from 'ts/local_storage/local_storage';
+import { Dispatcher } from 'ts/redux/dispatcher';
+import { orderSchema } from 'ts/schemas/order_schema';
+import { SchemaValidator } from 'ts/schemas/validator';
import {
BlockchainErrs,
HashData,
@@ -32,10 +32,10 @@ import {
TokenStateByAddress,
WebsitePaths,
} from 'ts/types';
-import {colors} from 'ts/utils/colors';
-import {configs} from 'ts/utils/configs';
-import {constants} from 'ts/utils/constants';
-import {utils} from 'ts/utils/utils';
+import { colors } from 'ts/utils/colors';
+import { configs } from 'ts/utils/configs';
+import { constants } from 'ts/utils/constants';
+import { utils } from 'ts/utils/utils';
const THROTTLE_TIMEOUT = 100;
@@ -57,7 +57,7 @@ export interface PortalAllProps {
shouldBlockchainErrDialogBeOpen: boolean;
userSuppliedOrderCache: Order;
location: Location;
- flashMessage?: string|React.ReactNode;
+ flashMessage?: string | React.ReactNode;
}
interface PortalAllState {
@@ -75,8 +75,7 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
private _throttledScreenWidthUpdate: () => void;
public static hasAlreadyDismissedWethNotice() {
const didDismissWethNotice = localStorage.getItemIfExists(constants.LOCAL_STORAGE_KEY_DISMISS_WETH_NOTICE);
- const hasAlreadyDismissedWethNotice = !_.isUndefined(didDismissWethNotice) &&
- !_.isEmpty(didDismissWethNotice);
+ const hasAlreadyDismissedWethNotice = !_.isUndefined(didDismissWethNotice) && !_.isEmpty(didDismissWethNotice);
return hasAlreadyDismissedWethNotice;
}
constructor(props: PortalAllProps) {
@@ -88,8 +87,8 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
const hasAlreadyDismissedWethNotice = Portal.hasAlreadyDismissedWethNotice();
const didAcceptPortalDisclaimer = localStorage.getItemIfExists(constants.LOCAL_STORAGE_KEY_ACCEPT_DISCLAIMER);
- const hasAcceptedDisclaimer = !_.isUndefined(didAcceptPortalDisclaimer) &&
- !_.isEmpty(didAcceptPortalDisclaimer);
+ const hasAcceptedDisclaimer =
+ !_.isUndefined(didAcceptPortalDisclaimer) && !_.isEmpty(didAcceptPortalDisclaimer);
this.state = {
prevNetworkId: this.props.networkId,
prevNodeVersion: this.props.nodeVersion,
@@ -126,8 +125,7 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
if (nextProps.userAddress !== this.state.prevUserAddress) {
// tslint:disable-next-line:no-floating-promises
this._blockchain.userAddressUpdatedFireAndForgetAsync(nextProps.userAddress);
- if (!_.isEmpty(nextProps.userAddress) &&
- nextProps.blockchainIsLoaded) {
+ if (!_.isEmpty(nextProps.userAddress) && nextProps.blockchainIsLoaded) {
const tokens = _.values(nextProps.tokenByAddress);
// tslint:disable-next-line:no-floating-promises
this._updateBalanceAndAllowanceWithLoadingScreenAsync(tokens);
@@ -150,8 +148,9 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
}
}
public render() {
- const updateShouldBlockchainErrDialogBeOpen = this.props.dispatcher
- .updateShouldBlockchainErrDialogBeOpen.bind(this.props.dispatcher);
+ const updateShouldBlockchainErrDialogBeOpen = this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen.bind(
+ this.props.dispatcher,
+ );
const portalStyle: React.CSSProperties = {
minHeight: '100vh',
display: 'flex',
@@ -165,44 +164,34 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
};
return (
<div style={portalStyle}>
- <DocumentTitle title="0x Portal DApp"/>
+ <DocumentTitle title="0x Portal DApp" />
<TopBar
userAddress={this.props.userAddress}
blockchainIsLoaded={this.props.blockchainIsLoaded}
location={this.props.location}
/>
- <div id="portal" className="mx-auto max-width-4" style={{width: '100%'}}>
+ <div id="portal" className="mx-auto max-width-4" style={{ width: '100%' }}>
<Paper className="mb3 mt2">
- {!configs.IS_MAINNET_ENABLED && this.props.networkId === constants.NETWORK_ID_MAINNET ?
+ {!configs.IS_MAINNET_ENABLED && this.props.networkId === constants.NETWORK_ID_MAINNET ? (
<div className="p3 center">
<div className="h2 py2">Mainnet unavailable</div>
<div className="mx-auto pb2 pt2">
- <img
- src="/images/zrx_token.png"
- style={{width: 150}}
- />
+ <img src="/images/zrx_token.png" style={{ width: 150 }} />
</div>
<div>
0x portal is currently unavailable on the Ethereum mainnet.
- <div>
- To try it out, switch to the Kovan test network
- (networkId: 42).
- </div>
- <div className="py2">
- Check back soon!
- </div>
+ <div>To try it out, switch to the Kovan test network (networkId: 42).</div>
+ <div className="py2">Check back soon!</div>
</div>
- </div> :
+ </div>
+ ) : (
<div className="mx-auto flex">
- <div
- className="col col-2 pr2 pt1 sm-hide xs-hide"
- style={portalMenuContainerStyle}
- >
- <PortalMenu menuItemStyle={{color: colors.white}} />
+ <div className="col col-2 pr2 pt1 sm-hide xs-hide" style={portalMenuContainerStyle}>
+ <PortalMenu menuItemStyle={{ color: colors.white }} />
</div>
<div className="col col-12 lg-col-10 md-col-10 sm-col sm-col-12">
- <div className="py2" style={{backgroundColor: colors.grey50}}>
- {this.props.blockchainIsLoaded ?
+ <div className="py2" style={{ backgroundColor: colors.grey50 }}>
+ {this.props.blockchainIsLoaded ? (
<Switch>
<Route
path={`${WebsitePaths.Portal}/weth`}
@@ -224,13 +213,14 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
path={`${WebsitePaths.Home}`}
render={this._renderGenerateOrderForm.bind(this)}
/>
- </Switch> :
+ </Switch>
+ ) : (
<Loading />
- }
+ )}
</div>
</div>
</div>
- }
+ )}
</Paper>
<BlockchainErrDialog
blockchain={this._blockchain}
@@ -248,10 +238,7 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
isOpen={this.state.isDisclaimerDialogOpen}
onToggleDialog={this._onPortalDisclaimerAccepted.bind(this)}
/>
- <FlashMessage
- dispatcher={this.props.dispatcher}
- flashMessage={this.props.flashMessage}
- />
+ <FlashMessage dispatcher={this.props.dispatcher} flashMessage={this.props.flashMessage} />
</div>
<Footer />
</div>
@@ -296,9 +283,9 @@ export class Portal extends React.Component<PortalAllProps, PortalAllState> {
);
}
private _renderFillOrder(match: any, location: Location, history: History) {
- const initialFillOrder = !_.isUndefined(this.props.userSuppliedOrderCache) ?
- this.props.userSuppliedOrderCache :
- this._sharedOrderIfExists;
+ const initialFillOrder = !_.isUndefined(this.props.userSuppliedOrderCache)
+ ? this.props.userSuppliedOrderCache
+ : this._sharedOrderIfExists;
return (
<FillOrder
blockchain={this._blockchain}
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-09 12:29:49 +0800