Fix issue where modal can be out of sync with app state

1 files changed, 12 insertions, 5 deletions

diff --git a/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx
index 57b209fac..9bccd0a9c 100644
--- a/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx
+++ b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx
@@ -1,29 +1,36 @@
 import * as React from 'react';
+import { Step } from 'react-joyride';
 
 import { OnboardingFlow } from 'ts/components/onboarding/onboarding_flow';
 
 export interface PortalOnboardingFlowProps {
     stepIndex: number;
     isRunning: boolean;
+    setOnboardingShowing: (isShowing: boolean) => void;
 }
 
-const steps = [
+const steps: Step[] = [
     {
         target: '.wallet',
-        content: 'Hey!',
+        content: 'You are onboarding right now!',
         placement: 'right',
         disableBeacon: true,
     },
 ];
 
-export class PortalOnboardingFlow extends React.Component<PortalOnboardingFlow> {
+export class PortalOnboardingFlow extends React.Component<PortalOnboardingFlowProps> {
     public render(): React.ReactNode {
         return (
             <OnboardingFlow
                 steps={steps}
                 stepIndex={this.props.stepIndex}
                 isRunning={this.props.isRunning}
+                onClose={this._handleClose.bind(this)}
             />
-        )
+        );
     }
-};
+
+    private _handleClose(): void {
+        this.props.setOnboardingShowing(false);
+    }
+}