Mailspring/internal_packages/category-picker/lib/category-picker.cjsx
Ben Gotow a48ddd51f8 refactor(menus): Major prune of keymaps/commands, real conditional menus
Summary:
Keymaps & menus CSON => JSON, remove AtomKeymaps, CommandRegistry use of CSS selectors, use Mousetrap instead

Important Notes:

- The `application:` prefix is reserved for commands which are handled in the application process. Don't use it for other things. You will not receive the events in the window.

- Maintaining dynamic menus seems to come with quite an overhead, because Electron updates the entire menu every time. In the future, we'll need https://github.com/electron/electron/issues/528 to really make things nice. I will be tracking this upstream.

- The format for keyboard shortcuts has changed. `cmd-X` is now `command+shift+x`

Test Plan: Run tests

Reviewers: juan, evan

Reviewed By: evan

Differential Revision: https://phab.nylas.com/D2917
2016-04-24 12:16:25 -05:00

86 lines
2.3 KiB
CoffeeScript

_ = require 'underscore'
React = require 'react'
ReactDOM = require 'react-dom'
{Actions,
AccountStore,
WorkspaceStore} = require 'nylas-exports'
{RetinaImg,
KeyCommandsRegion} = require 'nylas-component-kit'
CategoryPickerPopover = require './category-picker-popover'
# This changes the category on one or more threads.
class CategoryPicker extends React.Component
@displayName: "CategoryPicker"
@containerRequired: false
@propTypes:
items: React.PropTypes.array
@contextTypes:
sheetDepth: React.PropTypes.number
constructor: (@props) ->
@_account = AccountStore.accountForItems(@props.items)
# If the threads we're picking categories for change, (like when they
# get their categories updated), we expect our parents to pass us new
# props. We don't listen to the DatabaseStore ourselves.
componentWillReceiveProps: (nextProps) ->
@_account = AccountStore.accountForItems(nextProps.items)
_keymapHandlers: ->
"core:change-category": @_onOpenCategoryPopover
_onOpenCategoryPopover: =>
return unless @props.items.length > 0
return unless @context.sheetDepth is WorkspaceStore.sheetStack().length - 1
buttonRect = ReactDOM.findDOMNode(@refs.button).getBoundingClientRect()
Actions.openPopover(
<CategoryPickerPopover
threads={@props.items}
account={@_account} />,
{originRect: buttonRect, direction: 'down'}
)
return
render: =>
return <span /> unless @_account
btnClasses = "btn btn-toolbar btn-category-picker"
img = ""
tooltip = ""
if @_account.usesLabels()
img = "toolbar-tag.png"
tooltip = "Apply Labels"
else
img = "toolbar-movetofolder.png"
tooltip = "Move to Folder"
return (
<KeyCommandsRegion
style={order: -103}
globalHandlers={@_keymapHandlers()}
globalMenuItems={[
{
"label": "Thread",
"submenu": [{ "label": "#{tooltip}...", "command": "core:change-category", "position": "endof=thread-actions" }]
}
]}
>
<button
tabIndex={-1}
ref="button"
title={tooltip}
onClick={@_onOpenCategoryPopover}
className={btnClasses} >
<RetinaImg name={img} mode={RetinaImg.Mode.ContentIsMask}/>
</button>
</KeyCommandsRegion>
)
module.exports = CategoryPicker