2015-11-24 04:20:51 +08:00
|
|
|
React = require 'react'
|
|
|
|
_ = require 'underscore'
|
2015-12-01 03:43:49 +08:00
|
|
|
{RetinaImg,
|
|
|
|
Flexbox,
|
|
|
|
ConfigPropContainer,
|
2015-12-22 12:20:29 +08:00
|
|
|
ScrollRegion,
|
|
|
|
KeyCommandsRegion} = require 'nylas-component-kit'
|
2015-12-01 03:43:49 +08:00
|
|
|
{PreferencesUIStore} = require 'nylas-exports'
|
2015-11-24 04:20:51 +08:00
|
|
|
|
|
|
|
PreferencesSidebar = require './preferences-sidebar'
|
|
|
|
|
|
|
|
class PreferencesRoot extends React.Component
|
|
|
|
@displayName: 'PreferencesRoot'
|
|
|
|
@containerRequired: false
|
|
|
|
|
|
|
|
constructor: (@props) ->
|
|
|
|
@state = @getStateFromStores()
|
|
|
|
|
|
|
|
componentDidMount: =>
|
2015-12-22 12:20:29 +08:00
|
|
|
React.findDOMNode(@).focus()
|
2015-11-24 04:20:51 +08:00
|
|
|
@unlisteners = []
|
2015-12-01 03:43:49 +08:00
|
|
|
@unlisteners.push PreferencesUIStore.listen =>
|
2015-11-24 04:20:51 +08:00
|
|
|
@setState(@getStateFromStores())
|
|
|
|
|
|
|
|
componentWillUnmount: =>
|
|
|
|
unlisten() for unlisten in @unlisteners
|
|
|
|
|
2015-12-22 12:20:29 +08:00
|
|
|
_localHandlers: ->
|
|
|
|
stopPropagation = (e) -> e.stopPropagation()
|
|
|
|
# This prevents some basic commands from propagating to the threads list and
|
|
|
|
# producing unexpected results
|
|
|
|
#
|
|
|
|
# TODO This is a partial/temporary solution and should go away when we do the
|
|
|
|
# Keymap/Commands/Menu refactor
|
|
|
|
return {
|
|
|
|
'core:next-item': stopPropagation
|
|
|
|
'core:previous-item': stopPropagation
|
|
|
|
'core:select-up': stopPropagation
|
|
|
|
'core:select-down': stopPropagation
|
|
|
|
'core:select-item': stopPropagation
|
|
|
|
'core:remove-from-view': stopPropagation
|
|
|
|
'core:messages-page-up': stopPropagation
|
|
|
|
'core:messages-page-down': stopPropagation
|
|
|
|
'core:list-page-up': stopPropagation
|
|
|
|
'core:list-page-down': stopPropagation
|
|
|
|
'application:archive-item': stopPropagation
|
|
|
|
'application:delete-item': stopPropagation
|
|
|
|
'application:print-thread': stopPropagation
|
|
|
|
}
|
|
|
|
|
2015-11-24 04:20:51 +08:00
|
|
|
getStateFromStores: =>
|
2015-12-01 03:43:49 +08:00
|
|
|
tabs: PreferencesUIStore.tabs()
|
|
|
|
selection: PreferencesUIStore.selection()
|
2015-11-24 04:20:51 +08:00
|
|
|
|
|
|
|
render: =>
|
2015-12-01 03:43:49 +08:00
|
|
|
tabId = @state.selection.get('tabId')
|
|
|
|
tab = @state.tabs.find (s) => s.tabId is tabId
|
2015-11-24 04:20:51 +08:00
|
|
|
|
2015-12-01 03:43:49 +08:00
|
|
|
if tab
|
|
|
|
bodyElement = <tab.component accountId={@state.selection.get('accountId')} />
|
2015-11-24 04:20:51 +08:00
|
|
|
else
|
2015-12-01 03:43:49 +08:00
|
|
|
bodyElement = <div></div>
|
2015-11-24 04:20:51 +08:00
|
|
|
|
2015-12-22 12:20:29 +08:00
|
|
|
<KeyCommandsRegion className="preferences-wrap" tabIndex="1" localHandlers={@_localHandlers()}>
|
|
|
|
<Flexbox direction="row">
|
|
|
|
<PreferencesSidebar tabs={@state.tabs}
|
|
|
|
selection={@state.selection} />
|
|
|
|
<ScrollRegion className="preferences-content">
|
|
|
|
<ConfigPropContainer>{bodyElement}</ConfigPropContainer>
|
|
|
|
</ScrollRegion>
|
|
|
|
</Flexbox>
|
|
|
|
</KeyCommandsRegion>
|
2015-11-24 04:20:51 +08:00
|
|
|
|
|
|
|
module.exports = PreferencesRoot
|