mirror of
https://github.com/Foundry376/Mailspring.git
synced 2024-09-23 08:46:07 +08:00
e83bf2bbec
Summary: - New behavior is that the in split mode, you will perform actions on the selection via the MessageListToolbar (the toolbar positioned above the message list) - Refactored and moved around a bunch of code to achieve this: - Mostly renaming stuff and moving stuff around and removing some duplication - Update naming of toolbar role to a single role, and update relevant code - Converted and refactored a bunch of code into ES6, specifically to reuse the code for the ThreadActionsToolbar at the 2 locations - Deprecated MultiselectActionBar in favor of MultiselectToolbar - Deprecated old roles - Punted the animation for the stackable cards in the selection display for now. - #370 Test Plan: - Manual and unit tests Reviewers: evan, drew, bengotow Reviewed By: bengotow Differential Revision: https://phab.nylas.com/D2756
62 lines
1.6 KiB
JavaScript
62 lines
1.6 KiB
JavaScript
import Rx from 'rx-lite'
|
|
import React, {Component, PropTypes} from 'react'
|
|
import {FocusedContentStore} from 'nylas-exports'
|
|
import {TimeoutTransitionGroup} from 'nylas-component-kit'
|
|
import ThreadListStore from './thread-list-store'
|
|
import InjectsToolbarButtons, {ToolbarRole} from './injects-toolbar-buttons'
|
|
|
|
|
|
function getObservable() {
|
|
return (
|
|
Rx.Observable.merge(
|
|
Rx.Observable.fromStore(FocusedContentStore),
|
|
ThreadListStore.selectionObservable(),
|
|
)
|
|
.map((data) => {
|
|
const storeChanged = data === FocusedContentStore
|
|
const selectionChanged = data instanceof Array
|
|
|
|
if (storeChanged) {
|
|
const focusedThread = FocusedContentStore.focused('thread')
|
|
if (focusedThread) {
|
|
return [focusedThread]
|
|
}
|
|
} else if (selectionChanged) {
|
|
return data
|
|
}
|
|
return []
|
|
})
|
|
)
|
|
}
|
|
|
|
class MessageListToolbar extends Component {
|
|
static displayName = 'MessageListToolbar';
|
|
|
|
static propTypes = {
|
|
items: PropTypes.array,
|
|
injectedButtons: PropTypes.element,
|
|
};
|
|
|
|
render() {
|
|
const {items, injectedButtons} = this.props
|
|
const shouldRender = items.length > 0
|
|
|
|
return (
|
|
<TimeoutTransitionGroup
|
|
className="message-toolbar-items"
|
|
leaveTimeout={125}
|
|
enterTimeout={125}
|
|
transitionName="opacity-125ms">
|
|
{shouldRender ? injectedButtons : undefined}
|
|
</TimeoutTransitionGroup>
|
|
)
|
|
}
|
|
}
|
|
|
|
const toolbarProps = {
|
|
getObservable,
|
|
extraRoles: [`MessageList:${ToolbarRole}`],
|
|
}
|
|
|
|
export default InjectsToolbarButtons(MessageListToolbar, toolbarProps)
|