From bdd299dd9ee4699ccf5a4ab648e721e03ab2a139 Mon Sep 17 00:00:00 2001 From: fragosti Date: Mon, 18 Jun 2018 17:24:31 -0700 Subject: Fix onboarding persisting when changing routes --- .../ts/components/onboarding/portal_onboarding_flow.tsx | 13 +++++++++++-- packages/website/ts/components/wallet/wallet.tsx | 2 +- 2 files changed, 12 insertions(+), 3 deletions(-) diff --git a/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx index 4283022e2..159fd27e6 100644 --- a/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx +++ b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx @@ -1,5 +1,6 @@ import * as _ from 'lodash'; import * as React from 'react'; +import { RouteComponentProps, withRouter } from 'react-router'; import { BigNumber } from '@0xproject/utils'; import { Blockchain } from 'ts/blockchain'; @@ -15,7 +16,7 @@ import { AllowanceToggle } from 'ts/containers/inputs/allowance_toggle'; import { ProviderType, Token, TokenByAddress, TokenStateByAddress } from 'ts/types'; import { utils } from 'ts/utils/utils'; -export interface PortalOnboardingFlowProps { +export interface PortalOnboardingFlowProps extends RouteComponentProps { blockchain: Blockchain; stepIndex: number; isRunning: boolean; @@ -32,9 +33,15 @@ export interface PortalOnboardingFlowProps { refetchTokenStateAsync: (tokenAddress: string) => Promise; } -export class PortalOnboardingFlow extends React.Component { +class PlainPortalOnboardingFlow extends React.Component { + private _unlisten: () => void; public componentDidMount(): void { this._overrideOnboardingStateIfShould(); + // If there is a route change, just close onboarding. + this._unlisten = this.props.history.listen(() => this.props.updateIsRunning(false)); + } + public componentWillUnmount(): void { + this._unlisten(); } public componentDidUpdate(): void { this._overrideOnboardingStateIfShould(); @@ -209,3 +216,5 @@ export class PortalOnboardingFlow extends React.Component { - {'manage your wallet'} + manage your wallet // https://github.com/palantir/tslint-react/issues/140 // tslint:disable-next-line:jsx-curly-spacing -- cgit v1.2.3