Bring you directly to relayers page once you finish onboarding

3 files changed, 14 insertions, 1 deletions

diff --git a/packages/website/ts/components/onboarding/onboarding_card.tsx b/packages/website/ts/components/onboarding/onboarding_card.tsx
index eff66f488..2d49a1d20 100644
--- a/packages/website/ts/components/onboarding/onboarding_card.tsx
+++ b/packages/website/ts/components/onboarding/onboarding_card.tsx
@@ -6,6 +6,7 @@ import { Container } from 'ts/components/ui/container';
 import { IconButton } from 'ts/components/ui/icon_button';
 import { Island } from 'ts/components/ui/island';
 import { Text, Title } from 'ts/components/ui/text';
+import * as _ from 'lodash';
 
 export type ContinueButtonDisplay = 'enabled' | 'disabled';
 
@@ -16,6 +17,7 @@ export interface OnboardingCardProps {
     onClose: () => void;
     onClickNext: () => void;
     onClickBack: () => void;
+    onContinueButtonClick?: () => void;
     continueButtonDisplay?: ContinueButtonDisplay;
     shouldHideBackButton?: boolean;
     shouldHideNextButton?: boolean;
@@ -28,6 +30,7 @@ export const OnboardingCard: React.StatelessComponent<OnboardingCardProps> = ({
     content,
     continueButtonDisplay,
     continueButtonText,
+    onContinueButtonClick,
     onClickNext,
     onClickBack,
     onClose,
@@ -52,7 +55,7 @@ export const OnboardingCard: React.StatelessComponent<OnboardingCardProps> = ({
                 {continueButtonDisplay && (
                     <Button
                         isDisabled={continueButtonDisplay === 'disabled'}
-                        onClick={onClickNext}
+                        onClick={!_.isUndefined(onContinueButtonClick) ? onContinueButtonClick : onClickNext}
                         fontColor={colors.white}
                         fontSize="15px"
                         backgroundColor={colors.mediumBlue}
diff --git a/packages/website/ts/components/onboarding/onboarding_flow.tsx b/packages/website/ts/components/onboarding/onboarding_flow.tsx
index e20e58eec..834634909 100644
--- a/packages/website/ts/components/onboarding/onboarding_flow.tsx
+++ b/packages/website/ts/components/onboarding/onboarding_flow.tsx
@@ -17,6 +17,7 @@ export interface Step {
     shouldHideNextButton?: boolean;
     continueButtonDisplay?: ContinueButtonDisplay;
     continueButtonText?: string;
+    onContinueButtonClick?: () => void;
 }
 
 export interface OnboardingFlowProps {
@@ -90,6 +91,7 @@ export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
                     onClickBack={this._goToPrevStep.bind(this)}
                     continueButtonDisplay={step.continueButtonDisplay}
                     continueButtonText={step.continueButtonText}
+                    onContinueButtonClick={step.onContinueButtonClick}
                 />
             </Container>
         );
@@ -112,6 +114,7 @@ export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
                     onClickBack={this._goToPrevStep.bind(this)}
                     continueButtonDisplay={step.continueButtonDisplay}
                     continueButtonText={step.continueButtonText}
+                    onContinueButtonClick={step.onContinueButtonClick}
                     borderRadius="10px 10px 0px 0px"
                 />
             </Container>
diff --git a/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx
index 40172677b..13eb444cd 100644
--- a/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx
+++ b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx
@@ -155,6 +155,7 @@ class PlainPortalOnboardingFlow extends React.Component<PortalOnboardingFlowProp
                 continueButtonDisplay: 'enabled',
                 shouldHideNextButton: true,
                 continueButtonText: 'Enter the 0x Ecosystem',
+                onContinueButtonClick: this._handleFinalStepContinueClick.bind(this),
             },
         ];
         return steps;
@@ -262,6 +263,12 @@ class PlainPortalOnboardingFlow extends React.Component<PortalOnboardingFlowProp
             />
         );
     }
+    private _handleFinalStepContinueClick(): void {
+        if (utils.isMobile(this.props.screenWidth)) {
+            this.props.history.push('/portal');
+        }
+        this._closeOnboarding();
+    }
 }
 
 export const PortalOnboardingFlow = withRouter(PlainPortalOnboardingFlow);