fix(onboarding): Don’t display “Welcome Back” screen

This commit is contained in:
Ben Gotow 2016-10-20 16:34:59 -07:00
parent f655ce9821
commit 6adace5c8d
3 changed files with 13 additions and 34 deletions

View file

@ -31,7 +31,9 @@ class OnboardingStore extends NylasStore {
const {existingAccount, addingAccount} = NylasEnv.getWindowProps();
const hasAccounts = (AccountStore.accounts().length > 0)
const identity = IdentityStore.identity();
if (identity) {
this._accountInfo = {
name: `${identity.firstname || ""} ${identity.lastname || ""}`,
@ -57,11 +59,13 @@ class OnboardingStore extends NylasStore {
// but don't want to re-login to Nylas account. Very useful when
// switching environments.
this._pageStack = ['account-choose'];
} else if (hasAccounts) {
// Should only happen when the user has "signed out" of their Nylas ID,
// but already has accounts synced. Or is upgrading from a very old build.
// We used to show "Welcome Back", but now just jump to sign in.
this._pageStack = ['authenticate'];
} else {
// Standard new user onboarding flow.
// Note: If accounts are already connected, but no Nylas ID is, then
// the welcome page will show a separate page for returning users to
// create a Nylas Pro ID.
this._pageStack = ['welcome'];
}
}

View file

@ -1,5 +1,4 @@
import React from 'react';
import {AccountStore} from 'nylas-exports';
import {RetinaImg} from 'nylas-component-kit';
import OnboardingActions from './onboarding-actions';
@ -23,31 +22,15 @@ export default class WelcomePage extends React.Component {
OnboardingActions.moveToPage("self-hosting-restrictions");
}
_renderContent(isFirstAccount) {
if (isFirstAccount) {
return (
<div>
<RetinaImg className="logo" style={{marginTop: 166}} url="nylas://onboarding/assets/nylas-logo@2x.png" mode={RetinaImg.Mode.ContentPreserve} />
<p className="hero-text" style={{fontSize: 46, marginTop: 57}}>Welcome to Nylas N1</p>
<RetinaImg className="icons" url="nylas://onboarding/assets/icons-bg@2x.png" mode={RetinaImg.Mode.ContentPreserve} />
</div>
)
}
return (
<div>
<p className="hero-text" style={{fontSize: 46, marginTop: 187}}>Welcome back!</p>
<p className="hero-text" style={{fontSize: 20, maxWidth: 550, margin: 'auto', lineHeight: 1.7, marginTop: 30}}>Since you&#39;ve been gone, we&#39;ve <a href="https://nylas.com/blog/nylas-pro/">launched Nylas Pro</a>, which now requires a paid subscription. Create a Nylas ID to start your trial and continue using N1!</p>
<RetinaImg className="icons" url="nylas://onboarding/assets/icons-bg@2x.png" mode={RetinaImg.Mode.ContentPreserve} />
</div>
)
}
render() {
const isFirstAccount = (AccountStore.accounts().length === 0)
return (
<div className={`page welcome is-first-account-${isFirstAccount}`}>
<div className="page welcome">
<div className="steps-container">
{this._renderContent(isFirstAccount)}
<div>
<RetinaImg className="logo" style={{marginTop: 166}} url="nylas://onboarding/assets/nylas-logo@2x.png" mode={RetinaImg.Mode.ContentPreserve} />
<p className="hero-text" style={{fontSize: 46, marginTop: 57}}>Welcome to Nylas N1</p>
<RetinaImg className="icons" url="nylas://onboarding/assets/icons-bg@2x.png" mode={RetinaImg.Mode.ContentPreserve} />
</div>
</div>
<div className="footer">
<button key="next" className="btn btn-large btn-continue" onClick={this._onContinue}>Get Started</button>

View file

@ -513,14 +513,6 @@
}
}
.page.welcome.is-first-account-false {
.footer {
background-image: linear-gradient(to left, rgba(167,214,134,1) 0%,rgba(122,201,201,1) 100%);
}
.steps-container {
background-image: linear-gradient(to left, rgba(149,205,107,1) 0%,rgba(60,176,176,1) 100%);
}
}
.page.welcome,
.page.tutorial {
.footer {