From 7af77d3eb0a73a0bd27898f5d3842c7dc7afef77 Mon Sep 17 00:00:00 2001 From: fragosti Date: Tue, 22 May 2018 10:15:58 -0700 Subject: Basic onboarding flow infrastructure set up --- .../onboarding/portal_onboarding_flow.tsx | 29 ++++++++++++++++++++++ 1 file changed, 29 insertions(+) create mode 100644 packages/website/ts/components/onboarding/portal_onboarding_flow.tsx (limited to 'packages/website/ts/components/onboarding/portal_onboarding_flow.tsx') diff --git a/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx new file mode 100644 index 000000000..57b209fac --- /dev/null +++ b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx @@ -0,0 +1,29 @@ +import * as React from 'react'; + +import { OnboardingFlow } from 'ts/components/onboarding/onboarding_flow'; + +export interface PortalOnboardingFlowProps { + stepIndex: number; + isRunning: boolean; +} + +const steps = [ + { + target: '.wallet', + content: 'Hey!', + placement: 'right', + disableBeacon: true, + }, +]; + +export class PortalOnboardingFlow extends React.Component { + public render(): React.ReactNode { + return ( + + ) + } +}; -- cgit v1.2.3 From b4e1ce59f9d5500667228f4ab1a2c9c4ca087ca7 Mon Sep 17 00:00:00 2001 From: fragosti 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/portal_onboarding_flow.tsx | 17 ++++++++++++----- 1 file changed, 12 insertions(+), 5 deletions(-) (limited to 'packages/website/ts/components/onboarding/portal_onboarding_flow.tsx') 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 { +export class PortalOnboardingFlow extends React.Component { public render(): React.ReactNode { return ( - ) + ); } -}; + + private _handleClose(): void { + this.props.setOnboardingShowing(false); + } +} -- cgit v1.2.3 From f8f8bd95ca8ef94b583766d3d8c9d9ac71f04938 Mon Sep 17 00:00:00 2001 From: fragosti Date: Thu, 24 May 2018 11:24:10 -0700 Subject: Improve OnboardingFlow API and typescript types --- .../website/ts/components/onboarding/portal_onboarding_flow.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) (limited to 'packages/website/ts/components/onboarding/portal_onboarding_flow.tsx') diff --git a/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx index 9bccd0a9c..11684aaee 100644 --- a/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx +++ b/packages/website/ts/components/onboarding/portal_onboarding_flow.tsx @@ -6,7 +6,7 @@ import { OnboardingFlow } from 'ts/components/onboarding/onboarding_flow'; export interface PortalOnboardingFlowProps { stepIndex: number; isRunning: boolean; - setOnboardingShowing: (isShowing: boolean) => void; + onClose: () => void; } const steps: Step[] = [ @@ -25,12 +25,8 @@ export class PortalOnboardingFlow extends React.Component ); } - - private _handleClose(): void { - this.props.setOnboardingShowing(false); - } } -- cgit v1.2.3