mirror of
https://github.com/Foundry376/Mailspring.git
synced 2024-09-22 16:26:08 +08:00
76cb33b3f6
Summary: Package names must match directory names Not going to use new Swithc component, but might as well be part of component kit Move APMWrapper into core so it can be used from anywhere Move manual package install coe to package-manager Gray out window titles when in the background Do not allow multiple onboarding windows at the same time Finalize styling f initial-prefs and initial-packages, make it work (only github package atm) Other nits Change the welcome copy: - Call it easy to extend vs easy to use - Remove the subtitle from the first screen which doesn't really fit - Make the second page emphasize that its created /for/ developers and easy to extend with Javascript. - Explain what the sync engine is rather than saying it's "faster and more extensible" (??) Test Plan: Run tests Reviewers: evan, dillon Reviewed By: evan Maniphest Tasks: T3346 Differential Revision: https://phab.nylas.com/D2079
89 lines
3.1 KiB
CoffeeScript
89 lines
3.1 KiB
CoffeeScript
React = require 'react'
|
|
path = require 'path'
|
|
{RetinaImg, ConfigPropContainer} = require 'nylas-component-kit'
|
|
{EdgehillAPI} = require 'nylas-exports'
|
|
OnboardingActions = require './onboarding-actions'
|
|
|
|
InitialPackages = [{
|
|
'label': 'Templates',
|
|
'packageName': 'templates',
|
|
'description': 'Templates let you fill an email with a pre-set body of text and a snumber of fields you can fill quickly to save time.'
|
|
'icon': 'setup-icon-templates.png'
|
|
}, {
|
|
'label': 'Signatures',
|
|
'packageName': 'signatures',
|
|
'description': 'Select from and edit mutiple signatures that N1 will automatically append to your sent messages.'
|
|
'icon': 'setup-icon-signatures.png'
|
|
},{
|
|
'label': 'Github',
|
|
'packageName': 'N1-Github-Contact-Card-Section'
|
|
'description': 'Adds Github quick actions to many emails, and allows you to see the Github profiles of the people you email.'
|
|
'icon': 'setup-icon-github.png'
|
|
}]
|
|
|
|
class InstallButton extends React.Component
|
|
constructor: (@props) ->
|
|
@state =
|
|
installed: atom.packages.resolvePackagePath(@props.packageName)?
|
|
installing: false
|
|
|
|
render: =>
|
|
classname = "btn btn-install"
|
|
classname += " installing" if @state.installing
|
|
classname += " installed" if @state.installed
|
|
|
|
<div className={classname} onClick={@_onInstall}></div>
|
|
|
|
_onInstall: =>
|
|
return false unless @props.packageName
|
|
{resourcePath} = atom.getLoadSettings()
|
|
packagePath = path.join(resourcePath, "examples", @props.packageName)
|
|
@setState(installing: true)
|
|
atom.packages.installPackageFromPath packagePath, (err) =>
|
|
@setState({
|
|
installing: false
|
|
installed: atom.packages.resolvePackagePath(@props.packageName)?
|
|
})
|
|
|
|
componentWillUnmount: =>
|
|
@listener?.dispose()
|
|
|
|
class InitialPackagesPage extends React.Component
|
|
@displayName: "InitialPackagesPage"
|
|
|
|
render: =>
|
|
<div className="page opaque" style={width:900, height:650}>
|
|
<div className="back" onClick={@_onPrevPage}>
|
|
<RetinaImg name="onboarding-back.png" mode={RetinaImg.Mode.ContentPreserve}/>
|
|
</div>
|
|
|
|
<h1 style={paddingTop: 60, marginBottom: 20}>Explore packages</h1>
|
|
<p style={paddingBottom: 20}>
|
|
Packages lie at the heart of N1 and give it it's powerful features.<br/>
|
|
Want to enable a few example packages now? They'll be installed to <code>~/.nylas</code>
|
|
</p>
|
|
|
|
<div>
|
|
{InitialPackages.map (item) =>
|
|
<div className="initial-package" key={item.label}>
|
|
<RetinaImg name={item.icon} mode={RetinaImg.Mode.ContentPreserve} />
|
|
<div className="install-container">
|
|
<InstallButton packageName={item.packageName} />
|
|
</div>
|
|
<div className="name">{item.label}</div>
|
|
<div className="description">{item.description}</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
<button className="btn btn-large btn-emphasis" style={marginTop: 15} onClick={@_onGetStarted}>Start Using N1</button>
|
|
</div>
|
|
|
|
_onPrevPage: =>
|
|
OnboardingActions.moveToPage('initial-preferences')
|
|
|
|
_onGetStarted: =>
|
|
ipc = require 'ipc'
|
|
ipc.send('account-setup-successful')
|
|
|
|
module.exports = InitialPackagesPage
|