mirror of
https://github.com/Foundry376/Mailspring.git
synced 2024-09-24 09:16:07 +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
96 lines
3.3 KiB
CoffeeScript
96 lines
3.3 KiB
CoffeeScript
React = require 'react'
|
|
path = require 'path'
|
|
fs = require 'fs'
|
|
{RetinaImg, Flexbox, ConfigPropContainer} = require 'nylas-component-kit'
|
|
{EdgehillAPI} = require 'nylas-exports'
|
|
OnboardingActions = require './onboarding-actions'
|
|
|
|
# NOTE: Temporarily copied from preferences module
|
|
class AppearanceModeOption extends React.Component
|
|
@propTypes:
|
|
mode: React.PropTypes.string.isRequired
|
|
active: React.PropTypes.bool
|
|
onClick: React.PropTypes.func
|
|
|
|
render: =>
|
|
classname = "appearance-mode"
|
|
classname += " active" if @props.active
|
|
<div className={classname} onClick={@props.onClick}>
|
|
<RetinaImg name={"appearance-mode-#{@props.mode}.png"} mode={RetinaImg.Mode.ContentIsMask}/>
|
|
<div>{@props.mode} View</div>
|
|
</div>
|
|
|
|
class InitialPreferencesOptions extends React.Component
|
|
@propTypes:
|
|
config: React.PropTypes.object
|
|
|
|
constructor: (@props) ->
|
|
@state =
|
|
templates: []
|
|
@_loadTemplates()
|
|
|
|
_loadTemplates: =>
|
|
templatesDir = path.join(atom.getLoadSettings().resourcePath, 'keymaps', 'templates')
|
|
fs.readdir templatesDir, (err, files) =>
|
|
return unless files and files instanceof Array
|
|
templates = files.filter (filename) =>
|
|
path.extname(filename) is '.cson' or path.extname(filename) is '.json'
|
|
templates = templates.map (filename) =>
|
|
path.parse(filename).name
|
|
@setState(templates: templates)
|
|
|
|
render: =>
|
|
return false unless @props.config
|
|
|
|
<div style={display:'flex', width:600, marginBottom: 50, marginLeft:150, marginRight: 150, textAlign: 'left'}>
|
|
<div style={flex:1}>
|
|
<p>
|
|
Do you prefer a single-panel Gmail-style
|
|
layout or a dual panel layout?
|
|
</p>
|
|
<Flexbox direction="row" style={alignItems: "center"}>
|
|
{['list', 'split'].map (mode) =>
|
|
<AppearanceModeOption
|
|
mode={mode} key={mode}
|
|
active={@props.config.get('core.workspace.mode') is mode}
|
|
onClick={ => @props.config.set('core.workspace.mode', mode)} />
|
|
}
|
|
</Flexbox>
|
|
</div>
|
|
<div key="divider" style={marginLeft:20, marginRight:20, borderLeft:'1px solid #ccc'}></div>
|
|
<div style={flex:1}>
|
|
<p>
|
|
We see you're a Gmail user, so N1 is set up to use
|
|
Gmail keyboard shortcuts. You can also pick another set:
|
|
</p>
|
|
<select
|
|
style={margin:0}
|
|
value={@props.config.get('core.keymapTemplate')}
|
|
onChange={ (event) => @props.config.set('core.keymapTemplate', event.target.value) }>
|
|
{ @state.templates.map (template) =>
|
|
<option key={template} value={template}>{template}</option>
|
|
}
|
|
</select>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
class InitialPreferencesPage extends React.Component
|
|
@displayName: "InitialPreferencesPage"
|
|
|
|
render: =>
|
|
<div className="page no-top opaque" style={width:900, height:620}>
|
|
<h1 style={paddingTop: 100}>Welcome to N1</h1>
|
|
<h4 style={marginBottom: 70}>Let's set things up to your liking.</h4>
|
|
<ConfigPropContainer>
|
|
<InitialPreferencesOptions />
|
|
</ConfigPropContainer>
|
|
<button className="btn btn-large" style={marginBottom:60} onClick={@_onNextPage}>Looks Good!</button>
|
|
</div>
|
|
|
|
_onNextPage: =>
|
|
OnboardingActions.moveToPage("initial-packages")
|
|
|
|
module.exports = InitialPreferencesPage
|