aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/components
diff options
context:
space:
mode:
authorFabio Berger <me@fabioberger.com>2018-01-31 03:12:32 +0800
committerFabio Berger <me@fabioberger.com>2018-01-31 03:12:32 +0800
commite219772b2a25712f41fb819be36917d3b889201f (patch)
treec9720d042e65d896c33d68eed918e69c3ad3771c /packages/website/ts/components
parent144a507a2e0e341e8c8b97f67a25e1283ebc3687 (diff)
downloaddexon-sol-tools-e219772b2a25712f41fb819be36917d3b889201f.tar
dexon-sol-tools-e219772b2a25712f41fb819be36917d3b889201f.tar.gz
dexon-sol-tools-e219772b2a25712f41fb819be36917d3b889201f.tar.bz2
dexon-sol-tools-e219772b2a25712f41fb819be36917d3b889201f.tar.lz
dexon-sol-tools-e219772b2a25712f41fb819be36917d3b889201f.tar.xz
dexon-sol-tools-e219772b2a25712f41fb819be36917d3b889201f.tar.zst
dexon-sol-tools-e219772b2a25712f41fb819be36917d3b889201f.zip
Fix all setState calls after unmounted errors. Decided to create our own flag rather then using a cancellablePromise since there was little to be gained from this alternative
Diffstat (limited to 'packages/website/ts/components')
-rw-r--r--packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx15
-rw-r--r--packages/website/ts/components/eth_wrappers.tsx25
-rw-r--r--packages/website/ts/components/fill_order.tsx19
-rw-r--r--packages/website/ts/components/inputs/token_amount_input.tsx17
-rw-r--r--packages/website/ts/components/token_balances.tsx13
5 files changed, 62 insertions, 27 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 a3a39a1b9..acd4a7110 100644
--- a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx
+++ b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx
@@ -33,8 +33,10 @@ export class EthWethConversionDialog extends React.Component<
EthWethConversionDialogProps,
EthWethConversionDialogState
> {
+ private _isUnmounted: boolean;
constructor() {
super();
+ this._isUnmounted = false;
this.state = {
shouldShowIncompleteErrs: false,
hasErrors: false,
@@ -46,6 +48,9 @@ export class EthWethConversionDialog extends React.Component<
// tslint:disable-next-line:no-floating-promises
this._fetchEthTokenBalanceAsync();
}
+ public componentWillUnmount() {
+ this._isUnmounted = true;
+ }
public render() {
const convertDialogActions = [
<FlatButton key="cancel" label="Cancel" onTouchTap={this._onCancel.bind(this)} />,
@@ -181,9 +186,11 @@ export class EthWethConversionDialog extends React.Component<
this.props.userAddress,
this.props.token.address,
);
- this.setState({
- isEthTokenBalanceLoaded: true,
- ethTokenBalance: balance,
- });
+ if (!this._isUnmounted) {
+ this.setState({
+ isEthTokenBalanceLoaded: true,
+ ethTokenBalance: balance,
+ });
+ }
}
}
diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx
index 460a6cae3..90d2c0514 100644
--- a/packages/website/ts/components/eth_wrappers.tsx
+++ b/packages/website/ts/components/eth_wrappers.tsx
@@ -54,8 +54,10 @@ interface EthWrappersState {
}
export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersState> {
+ private _isUnmounted: boolean;
constructor(props: EthWrappersProps) {
super(props);
+ this._isUnmounted = false;
const outdatedWETHAddresses = this._getOutdatedWETHAddresses();
const outdatedWETHAddressToIsStateLoaded: OutdatedWETHAddressToIsStateLoaded = {};
const outdatedWETHStateByAddress: OutdatedWETHStateByAddress = {};
@@ -91,6 +93,9 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt
// tslint:disable-next-line:no-floating-promises
this._fetchWETHStateAsync();
}
+ public componentWillUnmount() {
+ this._isUnmounted = true;
+ }
public render() {
const etherToken = this._getEthToken();
const wethBalance = ZeroEx.toUnitAmount(this.state.ethTokenState.balance, constants.DECIMAL_PLACES_ETH);
@@ -394,15 +399,17 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt
};
outdatedWETHAddressToIsStateLoaded[address] = true;
}
- this.setState({
- outdatedWETHStateByAddress,
- outdatedWETHAddressToIsStateLoaded,
- ethTokenState: {
- balance: wethBalance,
- allowance: wethAllowance,
- },
- isWethStateLoaded: true,
- });
+ if (!this._isUnmounted) {
+ this.setState({
+ outdatedWETHStateByAddress,
+ outdatedWETHAddressToIsStateLoaded,
+ ethTokenState: {
+ balance: wethBalance,
+ allowance: wethAllowance,
+ },
+ isWethStateLoaded: true,
+ });
+ }
}
private _getOutdatedWETHAddresses(): string[] {
const outdatedWETHAddresses = _.compact(
diff --git a/packages/website/ts/components/fill_order.tsx b/packages/website/ts/components/fill_order.tsx
index 1e9927c1a..d0cfd2cf5 100644
--- a/packages/website/ts/components/fill_order.tsx
+++ b/packages/website/ts/components/fill_order.tsx
@@ -59,8 +59,10 @@ interface FillOrderState {
export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
private _validator: SchemaValidator;
+ private _isUnmounted: boolean;
constructor(props: FillOrderProps) {
super(props);
+ this._isUnmounted = false;
this.state = {
globalErrMsg: '',
didOrderValidationRun: false,
@@ -90,6 +92,9 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
public componentDidMount() {
window.scrollTo(0, 0);
}
+ public componentWillUnmount() {
+ this._isUnmounted = true;
+ }
public render() {
return (
<div className="clearfix lg-px4 md-px4 sm-px2" style={{ minHeight: 600 }}>
@@ -456,12 +461,14 @@ export class FillOrder extends React.Component<FillOrderProps, FillOrderState> {
if (!_.isEmpty(orderJSON)) {
orderJSONErrMsg = 'Submitted order JSON is not valid JSON';
}
- this.setState({
- didOrderValidationRun: true,
- orderJSON,
- orderJSONErrMsg,
- parsedOrder,
- });
+ if (!this._isUnmounted) {
+ this.setState({
+ didOrderValidationRun: true,
+ orderJSON,
+ orderJSONErrMsg,
+ parsedOrder,
+ });
+ }
return;
}
diff --git a/packages/website/ts/components/inputs/token_amount_input.tsx b/packages/website/ts/components/inputs/token_amount_input.tsx
index 44f3fc4a8..9078f7fe1 100644
--- a/packages/website/ts/components/inputs/token_amount_input.tsx
+++ b/packages/website/ts/components/inputs/token_amount_input.tsx
@@ -30,8 +30,10 @@ interface TokenAmountInputState {
}
export class TokenAmountInput extends React.Component<TokenAmountInputProps, TokenAmountInputState> {
+ private _isUnmounted: boolean;
constructor(props: TokenAmountInputProps) {
super(props);
+ this._isUnmounted = false;
const defaultAmount = new BigNumber(0);
this.state = {
balance: defaultAmount,
@@ -43,6 +45,9 @@ export class TokenAmountInput extends React.Component<TokenAmountInputProps, Tok
// tslint:disable-next-line:no-floating-promises
this._fetchBalanceAndAllowanceAsync(this.props.token.address, this.props.userAddress);
}
+ public componentWillUnmount() {
+ this._isUnmounted = true;
+ }
public componentWillReceiveProps(nextProps: TokenAmountInputProps) {
if (
nextProps.userAddress !== this.props.userAddress ||
@@ -107,10 +112,12 @@ export class TokenAmountInput extends React.Component<TokenAmountInputProps, Tok
userAddress,
tokenAddress,
);
- this.setState({
- balance,
- allowance,
- isBalanceAndAllowanceLoaded: true,
- });
+ if (!this._isUnmounted) {
+ this.setState({
+ balance,
+ allowance,
+ isBalanceAndAllowanceLoaded: true,
+ });
+ }
}
}
diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx
index 776ccb16e..c0df285cf 100644
--- a/packages/website/ts/components/token_balances.tsx
+++ b/packages/website/ts/components/token_balances.tsx
@@ -91,8 +91,10 @@ interface TokenBalancesState {
}
export class TokenBalances extends React.Component<TokenBalancesProps, TokenBalancesState> {
+ private _isUnmounted: boolean;
public constructor(props: TokenBalancesProps) {
super(props);
+ this._isUnmounted = false;
const initialTrackedTokenStateByAddress = this._getInitialTrackedTokenStateByAddress(props.trackedTokens);
this.state = {
errorType: undefined,
@@ -109,6 +111,9 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
const trackedTokenAddresses = _.keys(this.state.trackedTokenStateByAddress);
this._fetchBalancesAndAllowancesAsync(trackedTokenAddresses);
}
+ public componentWillUnmount() {
+ this._isUnmounted = true;
+ }
public componentWillReceiveProps(nextProps: TokenBalancesProps) {
if (nextProps.userEtherBalance !== this.props.userEtherBalance) {
if (this.state.isBalanceSpinnerVisible) {
@@ -671,9 +676,11 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala
isLoaded: true,
};
}
- this.setState({
- trackedTokenStateByAddress,
- });
+ if (!this._isUnmounted) {
+ this.setState({
+ trackedTokenStateByAddress,
+ });
+ }
}
private _getInitialTrackedTokenStateByAddress(trackedTokens: Token[]) {
const trackedTokenStateByAddress: TokenStateByAddress = {};