From b4e1ce59f9d5500667228f4ab1a2c9c4ca087ca7 Mon Sep 17 00:00:00 2001
From: fragosti <francesco.agosti93@gmail.com>
Date: Tue, 22 May 2018 15:18:22 -0700
Subject: Fix issue where modal can be out of sync with app state

---
 .../ts/components/onboarding/onboarding_flow.tsx   | 24 +++++++++++++++++-----
 1 file changed, 19 insertions(+), 5 deletions(-)

(limited to 'packages/website/ts/components/onboarding/onboarding_flow.tsx')

diff --git a/packages/website/ts/components/onboarding/onboarding_flow.tsx b/packages/website/ts/components/onboarding/onboarding_flow.tsx
index 5bbf84e1b..1d98d5901 100644
--- a/packages/website/ts/components/onboarding/onboarding_flow.tsx
+++ b/packages/website/ts/components/onboarding/onboarding_flow.tsx
@@ -8,6 +8,8 @@ interface OnboardingFlowProps {
     steps: Step[];
     stepIndex?: number;
     isRunning: boolean;
+    onClose: () => void;
+    onChange?: (options: any) => void;
 }
 
 const style: StyleOptions = {
@@ -16,16 +18,28 @@ const style: StyleOptions = {
 
 // Wrapper around Joyride with defaults and styles set
 export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
+    public static defaultProps: Partial<OnboardingFlowProps> = {
+        onChange: _.noop,
+    };
+
     public render(): React.ReactNode {
-        const { steps, stepIndex, isRunning } = this.props;
         return (
             <Joyride
-                run={isRunning}
+                run={this.props.isRunning}
                 debug={true}
-                steps={steps}
-                stepIndex={stepIndex}
+                steps={this.props.steps}
+                stepIndex={this.props.stepIndex}
                 styles={{ options: style }}
+                callback={this._handleChange.bind(this)}
             />
         );
     }
-};
+
+    private _handleChange(options: any): void {
+        switch (options.action) {
+            case 'close':
+                this.props.onClose();
+        }
+        this.props.onChange(options);
+    }
+}
-- 
cgit v1.2.3

