Mailspring/internal_packages/preferences/lib/preferences-root.cjsx
Juan Tejada 64ae82a7e2 fix(prefs): Prevent main key commands from being fired to thread list while on prefs page
Summary:
- When the preferences sheet is open, any commands triggered through key presses were being received by the thread-list, producing unexpected
(and unseen) results
- This is a partial/temporary solution and should go away when we do the Keymap/Commands/Menu refactor

Test Plan: - Manaul

Reviewers: evan, bengotow

Reviewed By: bengotow

Differential Revision: https://phab.nylas.com/D2380
2015-12-22 09:38:56 -08:00

74 lines
2.4 KiB
CoffeeScript

React = require 'react'
_ = require 'underscore'
{RetinaImg,
Flexbox,
ConfigPropContainer,
ScrollRegion,
KeyCommandsRegion} = require 'nylas-component-kit'
{PreferencesUIStore} = require 'nylas-exports'
PreferencesSidebar = require './preferences-sidebar'
class PreferencesRoot extends React.Component
@displayName: 'PreferencesRoot'
@containerRequired: false
constructor: (@props) ->
@state = @getStateFromStores()
componentDidMount: =>
React.findDOMNode(@).focus()
@unlisteners = []
@unlisteners.push PreferencesUIStore.listen =>
@setState(@getStateFromStores())
componentWillUnmount: =>
unlisten() for unlisten in @unlisteners
_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
}
getStateFromStores: =>
tabs: PreferencesUIStore.tabs()
selection: PreferencesUIStore.selection()
render: =>
tabId = @state.selection.get('tabId')
tab = @state.tabs.find (s) => s.tabId is tabId
if tab
bodyElement = <tab.component accountId={@state.selection.get('accountId')} />
else
bodyElement = <div></div>
<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>
module.exports = PreferencesRoot