mirror of
https://github.com/Foundry376/Mailspring.git
synced 2024-09-22 16:26:08 +08:00
297320df94
Summary: Better error handling in the account settings page and a loading spinner Add Account... replaces "Link External Account", and it works Clean dead code from onboarding pages, remove base class component Always show the account switcher rm dead EdgehillAPI code, AccountStore now manages accounts and credentials in config, not in database Fix specs Test Plan: Run tests Reviewers: dillon, evan Reviewed By: evan Projects: #edgehill Differential Revision: https://phab.nylas.com/D2059
60 lines
2.1 KiB
CoffeeScript
60 lines
2.1 KiB
CoffeeScript
React = require 'react'
|
|
{RetinaImg, TimeoutTransitionGroup} = require 'nylas-component-kit'
|
|
OnboardingActions = require './onboarding-actions'
|
|
|
|
class WelcomePage extends React.Component
|
|
@displayName: "WelcomePage"
|
|
|
|
constructor: (@props) ->
|
|
@state =
|
|
step: 0
|
|
|
|
render: =>
|
|
buttons = []
|
|
if @state.step > 0
|
|
buttons.push <button key="back" className="btn btn-large" style={marginRight: 10} onClick={@_onBack}>Back</button>
|
|
buttons.push <button key="next" className="btn btn-large" onClick={@_onContinue}>Continue</button>
|
|
|
|
<div className="page no-top opaque" style={width: 667, display: "inline-block"}>
|
|
<div className="quit" onClick={ => atom.close() }>
|
|
<RetinaImg name="onboarding-close.png" mode={RetinaImg.Mode.ContentPreserve}/>
|
|
</div>
|
|
|
|
<TimeoutTransitionGroup leaveTimeout={300}
|
|
enterTimeout={300}
|
|
className="welcome-image-container"
|
|
transitionName="welcome-image">
|
|
{@_renderStep()}
|
|
</TimeoutTransitionGroup>
|
|
|
|
<div style={textAlign:'center', paddingTop:30, paddingBottom:30}>
|
|
{buttons}
|
|
</div>
|
|
</div>
|
|
|
|
_renderStep: =>
|
|
if @state.step is 0
|
|
<div className="welcome-image" key="step-0">
|
|
<RetinaImg name="welcome1bg.png" mode={RetinaImg.Mode.ContentPreserve} />
|
|
<RetinaImg name="welcome1icon.png" mode={RetinaImg.Mode.ContentPreserve} style={position:'absolute', top:'50%', left:'50%', transform:'translate(-50%, -50%)'}/>
|
|
</div>
|
|
else if @state.step is 1
|
|
<div className="welcome-image" key="step-1">
|
|
<RetinaImg name="welcome2bg.png" mode={RetinaImg.Mode.ContentPreserve} />
|
|
</div>
|
|
else if @state.step is 2
|
|
<div className="welcome-image" key="step-2">
|
|
<RetinaImg name="welcome3bg.png" mode={RetinaImg.Mode.ContentPreserve} />
|
|
</div>
|
|
|
|
_onBack: =>
|
|
@setState(step: @state.step - 1)
|
|
|
|
_onContinue: =>
|
|
if @state.step < 2
|
|
@setState(step: @state.step + 1)
|
|
else
|
|
OnboardingActions.moveToPage("account-choose")
|
|
|
|
module.exports = WelcomePage
|