Mailspring/internal_packages/category-picker/lib/category-picker.cjsx
Juan Tejada c6acca8ca3 remove(popover): Remove Popover in favor of FixedPopover
Summary:
- FixedPopover now correctly adjusts itself when overflowing outside
  window, in all directions
  - Updates styles
  - Adds specs
- Remove Popover and popover.less, and refactor all code that used it in
  favor of the new FixedPopover

Test Plan: Unit tests

Reviewers: drew, evan, bengotow

Reviewed By: bengotow

Differential Revision: https://phab.nylas.com/D2697
2016-03-09 10:05:46 -08:00

84 lines
2.3 KiB
CoffeeScript

_ = require 'underscore'
React = require 'react'
{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:
thread: React.PropTypes.object
items: React.PropTypes.array
@contextTypes:
sheetDepth: React.PropTypes.number
constructor: (@props) ->
@_threads = @_getThreads(@props)
@_account = AccountStore.accountForItems(@_threads)
# 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) ->
@_threads = @_getThreads(nextProps)
@_account = AccountStore.accountForItems(@_threads)
_getThreads: (props = @props) =>
if props.items then return (props.items ? [])
else if props.thread then return [props.thread]
else return []
_keymapHandlers: ->
"application:change-category": @_onOpenCategoryPopover
_onOpenCategoryPopover: =>
return unless @_threads.length > 0
return unless @context.sheetDepth is WorkspaceStore.sheetStack().length - 1
buttonRect = React.findDOMNode(@refs.button).getBoundingClientRect()
Actions.openPopover(
<CategoryPickerPopover
threads={@_threads}
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()}>
<button
ref="button"
title={tooltip}
onClick={@_onOpenCategoryPopover}
className={btnClasses} >
<RetinaImg name={img} mode={RetinaImg.Mode.ContentIsMask}/>
</button>
</KeyCommandsRegion>
)
module.exports = CategoryPicker