diff options
author | Eugen Rochko <eugen@zeonfederated.com> | 2018-10-20 02:23:58 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2018-10-20 02:23:58 +0200 |
commit | eb1b9903a6f60d024d71bffd635e6fec7edc59a9 (patch) | |
tree | 4bdb567460b53a0f022a522193309f8e3750405d /app/javascript/mastodon/features/direct_timeline/components/conversation.js | |
parent | 029943d59b222e96a2f7839390a5628888249bf6 (diff) |
Redesign direct messages column (#9022)
Diffstat (limited to 'app/javascript/mastodon/features/direct_timeline/components/conversation.js')
-rw-r--r-- | app/javascript/mastodon/features/direct_timeline/components/conversation.js | 56 |
1 files changed, 13 insertions, 43 deletions
diff --git a/app/javascript/mastodon/features/direct_timeline/components/conversation.js b/app/javascript/mastodon/features/direct_timeline/components/conversation.js index 52e33c3c8..7277b7f0f 100644 --- a/app/javascript/mastodon/features/direct_timeline/components/conversation.js +++ b/app/javascript/mastodon/features/direct_timeline/components/conversation.js @@ -2,13 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePureComponent from 'react-immutable-pure-component'; -import StatusContent from '../../../components/status_content'; -import RelativeTimestamp from '../../../components/relative_timestamp'; -import DisplayName from '../../../components/display_name'; -import Avatar from '../../../components/avatar'; -import AttachmentList from '../../../components/attachment_list'; -import { HotKeys } from 'react-hotkeys'; -import classNames from 'classnames'; +import StatusContainer from '../../../containers/status_container'; export default class Conversation extends ImmutablePureComponent { @@ -19,7 +13,7 @@ export default class Conversation extends ImmutablePureComponent { static propTypes = { conversationId: PropTypes.string.isRequired, accounts: ImmutablePropTypes.list.isRequired, - lastStatus: ImmutablePropTypes.map.isRequired, + lastStatusId: PropTypes.string, unread:PropTypes.bool.isRequired, onMoveUp: PropTypes.func, onMoveDown: PropTypes.func, @@ -31,13 +25,13 @@ export default class Conversation extends ImmutablePureComponent { return; } - const { lastStatus, unread, markRead } = this.props; + const { lastStatusId, unread, markRead } = this.props; if (unread) { markRead(); } - this.context.router.history.push(`/statuses/${lastStatus.get('id')}`); + this.context.router.history.push(`/statuses/${lastStatusId}`); } handleHotkeyMoveUp = () => { @@ -49,44 +43,20 @@ export default class Conversation extends ImmutablePureComponent { } render () { - const { accounts, lastStatus, lastAccount, unread } = this.props; + const { accounts, lastStatusId, unread } = this.props; - if (lastStatus === null) { + if (lastStatusId === null) { return null; } - const handlers = { - moveDown: this.handleHotkeyMoveDown, - moveUp: this.handleHotkeyMoveUp, - open: this.handleClick, - }; - - let media; - - if (lastStatus.get('media_attachments').size > 0) { - media = <AttachmentList compact media={lastStatus.get('media_attachments')} />; - } - return ( - <HotKeys handlers={handlers}> - <div className={classNames('conversation', 'focusable', { 'conversation--unread': unread })} tabIndex='0' onClick={this.handleClick} role='button'> - <div className='conversation__header'> - <div className='conversation__avatars'> - <div>{accounts.map(account => <Avatar key={account.get('id')} size={36} account={account} />)}</div> - </div> - - <div className='conversation__time'> - <RelativeTimestamp timestamp={lastStatus.get('created_at')} /> - <br /> - <DisplayName account={lastAccount} withAcct={false} /> - </div> - </div> - - <StatusContent status={lastStatus} onClick={this.handleClick} /> - - {media} - </div> - </HotKeys> + <StatusContainer + id={lastStatusId} + unread={unread} + otherAccounts={accounts} + onMoveUp={this.handleHotkeyMoveUp} + onMoveDown={this.handleHotkeyMoveDown} + /> ); } |