mirror of
https://github.com/Foundry376/Mailspring.git
synced 2024-09-22 16:26:08 +08:00
66d3d89979
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
104 lines
3.2 KiB
CoffeeScript
104 lines
3.2 KiB
CoffeeScript
React = require 'react'
|
|
_ = require 'underscore'
|
|
{AccountStore, DatabaseStore, EdgehillAPI} = require 'nylas-exports'
|
|
{RetinaImg, Flexbox} = require 'nylas-component-kit'
|
|
|
|
class PreferencesAccounts extends React.Component
|
|
@displayName: 'PreferencesAccounts'
|
|
|
|
constructor: (@props) ->
|
|
@state = @getStateFromStores()
|
|
|
|
componentDidMount: =>
|
|
@unsubscribe = AccountStore.listen @_onAccountChange
|
|
|
|
componentWillUnmount: =>
|
|
@unsubscribe?()
|
|
|
|
render: =>
|
|
<div className="container-accounts">
|
|
{@_renderAccounts()}
|
|
<div style={textAlign:"right", marginTop: '20'}>
|
|
<button className="btn btn-large" onClick={@_onAddAccount}>Add Account...</button>
|
|
</div>
|
|
|
|
{@_renderLinkedAccounts()}
|
|
</div>
|
|
|
|
_renderAccounts: =>
|
|
return false unless @state.accounts
|
|
|
|
<div>
|
|
<div className="section-header">
|
|
Accounts:
|
|
</div>
|
|
{ @state.accounts.map (account) =>
|
|
<div className="well large" style={marginBottom:10} key={account.id}>
|
|
<Flexbox direction="row" style={alignItems: 'middle'}>
|
|
<div style={textAlign: "center"}>
|
|
<RetinaImg name={"ic-settings-account-#{account.provider}.png"}
|
|
fallback="ic-settings-account-imap.png"
|
|
mode={RetinaImg.Mode.ContentPreserve} />
|
|
</div>
|
|
<div style={flex: 1, marginLeft: 10}>
|
|
<div className="account-name">{account.emailAddress}</div>
|
|
<div className="account-subtext">{account.name || "No name provided."} ({account.displayProvider()})</div>
|
|
</div>
|
|
<div style={textAlign:"right", marginTop:10, display:'inline-block'}>
|
|
<button className="btn btn-large" onClick={ => @_onUnlinkAccount(account) }>Unlink</button>
|
|
</div>
|
|
</Flexbox>
|
|
</div>
|
|
}
|
|
</div>
|
|
|
|
_renderLinkedAccounts: =>
|
|
tokens = @getSecondaryTokens()
|
|
return false unless tokens.length > 0
|
|
<div>
|
|
<div className="section-header">
|
|
Linked Accounts:
|
|
</div>
|
|
{ tokens.map (token) =>
|
|
<div className="well small" key={token.id}>
|
|
{@_renderLinkedAccount(token)}
|
|
</div>
|
|
}
|
|
</div>
|
|
|
|
_renderLinkedAccount: (token) =>
|
|
<Flexbox direction="row" style={alignItems: "center"}>
|
|
<div>
|
|
<RetinaImg name={"ic-settings-account-#{token.provider}.png"} fallback="ic-settings-account-imap.png" />
|
|
</div>
|
|
<div style={flex: 1, marginLeft: 10}>
|
|
<div className="account-name">{token.provider}</div>
|
|
</div>
|
|
<div style={textAlign:"right"}>
|
|
<button onClick={ => @_onUnlinkToken(token) } className="btn btn-large">Unlink</button>
|
|
</div>
|
|
</Flexbox>
|
|
|
|
getStateFromStores: =>
|
|
accounts: AccountStore.items()
|
|
|
|
getSecondaryTokens: =>
|
|
return [] unless @props.config
|
|
tokens = @props.config.get('tokens') || []
|
|
tokens = tokens.filter (token) -> token.provider isnt 'nylas'
|
|
tokens
|
|
|
|
_onAddAccount: =>
|
|
ipc = require('ipc')
|
|
ipc.send('command', 'application:add-account')
|
|
|
|
_onAccountChange: =>
|
|
@setState(@getStateFromStores())
|
|
|
|
_onUnlinkAccount: (account) =>
|
|
AccountStore.removeAccountId(account.id)
|
|
|
|
_onUnlinkToken: (token) =>
|
|
|
|
module.exports = PreferencesAccounts
|