Ported updates from #64

This commit is contained in:
kibigo! 2017-07-15 15:10:06 -07:00
parent 09cfc079b0
commit bc4202d00b
6 changed files with 51 additions and 29 deletions

View File

@ -47,7 +47,7 @@ export default class StatusActionBar extends ImmutablePureComponent {
onReport: PropTypes.func,
onMuteConversation: PropTypes.func,
onDeleteNotification: PropTypes.func,
me: PropTypes.number.isRequired,
me: PropTypes.number,
withDismiss: PropTypes.bool,
intl: PropTypes.object.isRequired,
};
@ -108,6 +108,7 @@ export default class StatusActionBar extends ImmutablePureComponent {
const { status, me, intl, withDismiss } = this.props;
const reblogDisabled = status.get('visibility') === 'private' || status.get('visibility') === 'direct';
const mutingConversation = status.get('muted');
const anonymousAccess = !me;
let menu = [];
let reblogIcon = 'retweet';
@ -151,12 +152,12 @@ export default class StatusActionBar extends ImmutablePureComponent {
return (
<div className='status__action-bar'>
<IconButton className='status__action-bar-button' title={replyTitle} icon={replyIcon} onClick={this.handleReplyClick} />
<IconButton className='status__action-bar-button' disabled={reblogDisabled} active={status.get('reblogged')} title={reblogDisabled ? intl.formatMessage(messages.cannot_reblog) : intl.formatMessage(messages.reblog)} icon={reblogIcon} onClick={this.handleReblogClick} />
<IconButton className='status__action-bar-button star-icon' animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} />
<IconButton className='status__action-bar-button' disabled={anonymousAccess} title={replyTitle} icon={replyIcon} onClick={this.handleReplyClick} />
<IconButton className='status__action-bar-button' disabled={anonymousAccess || reblogDisabled} active={status.get('reblogged')} title={reblogDisabled ? intl.formatMessage(messages.cannot_reblog) : intl.formatMessage(messages.reblog)} icon={reblogIcon} onClick={this.handleReblogClick} />
<IconButton className='status__action-bar-button star-icon' disabled={anonymousAccess} animate active={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} />
<div className='status__action-bar-dropdown'>
<DropdownMenu items={menu} icon='ellipsis-h' size={18} direction='right' ariaLabel='More' />
<DropdownMenu items={menu} disabled={anonymousAccess} icon='ellipsis-h' size={18} direction='right' ariaLabel='More' />
</div>
<a href={status.get('url')} className='status__relative-time' target='_blank' rel='noopener'><RelativeTimestamp timestamp={status.get('created_at')} /></a>

View File

@ -4,6 +4,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import escapeTextContentForBrowser from 'escape-html';
import PropTypes from 'prop-types';
import { FormattedMessage } from 'react-intl';
import classnames from 'classnames';
// Mastodon imports //
import emojify from '../../../mastodon/emoji';
@ -12,10 +13,6 @@ import Permalink from '../../../mastodon/components/permalink';
export default class StatusContent extends React.PureComponent {
static contextTypes = {
router: PropTypes.object,
};
static propTypes = {
status: ImmutablePropTypes.map.isRequired,
expanded: PropTypes.oneOf([true, false, null]),
@ -24,6 +21,7 @@ export default class StatusContent extends React.PureComponent {
media: PropTypes.element,
mediaIcon: PropTypes.string,
parseClick: PropTypes.func,
disabled: PropTypes.bool,
};
state = {
@ -45,10 +43,11 @@ export default class StatusContent extends React.PureComponent {
link.addEventListener('click', this.onHashtagClick.bind(this, link.text), false);
} else {
link.addEventListener('click', this.onLinkClick.bind(this), false);
link.setAttribute('target', '_blank');
link.setAttribute('rel', 'noopener');
link.setAttribute('title', link.href);
}
link.setAttribute('target', '_blank');
link.setAttribute('rel', 'noopener');
}
}
@ -118,7 +117,13 @@ export default class StatusContent extends React.PureComponent {
}
render () {
const { status, media, mediaIcon } = this.props;
const {
status,
media,
mediaIcon,
parseClick,
disabled,
} = this.props;
const hidden = (
this.props.setExpansion ?
@ -133,6 +138,9 @@ export default class StatusContent extends React.PureComponent {
)),
};
const directionStyle = { direction: 'ltr' };
const classNames = classnames('status__content', {
'status__content--with-action': parseClick && !disabled,
});
if (isRtl(status.get('search_index'))) {
directionStyle.direction = 'rtl';
@ -180,7 +188,7 @@ export default class StatusContent extends React.PureComponent {
}
return (
<div className='status__content status__content--with-action' ref={this.setRef}>
<div className={classNames} ref={this.setRef}>
<p
style={{ marginBottom: hidden && status.get('mentions').isEmpty() ? '0px' : null }}
onMouseDown={this.handleMouseDown}
@ -207,11 +215,11 @@ export default class StatusContent extends React.PureComponent {
</div>
);
} else if (this.props.parseClick) {
} else if (parseClick) {
return (
<div
ref={this.setRef}
className='status__content status__content--with-action'
className={classNames}
style={directionStyle}
>
<div

View File

@ -220,6 +220,7 @@ if we have a `friend` and a normal `<Avatar>` if we don't.
}
<a
href={account.get('url')}
target='_blank'
className='status__display-name'
onClick={this.handleAccountClick}
>

View File

@ -507,6 +507,7 @@ applicable.
const { router } = this.context;
const { status } = this.props;
const { isExpanded } = this.state;
if (!router) return;
if (destination === undefined) {
destination = `/statuses/${
status.getIn(['reblog', 'id'], status.get('id'))
@ -532,7 +533,13 @@ this operation are further explained in the code below.
*/
render () {
const { parseClick, setExpansion, handleRef } = this;
const {
parseClick,
setExpansion,
saveHeight,
handleRef,
} = this;
const { router } = this.context;
const {
status,
account,
@ -706,9 +713,10 @@ collapsed.
media={media}
mediaIcon={mediaIcon}
expanded={isExpanded}
setExpansion={this.setExpansion}
onHeightUpdate={this.saveHeight}
setExpansion={setExpansion}
onHeightUpdate={saveHeight}
parseClick={parseClick}
disabled={!router}
/>
{isExpanded !== false ? (
<StatusActionBar

View File

@ -17,6 +17,10 @@ const messages = defineMessages({
@injectIntl
export default class StatusPlayer extends React.PureComponent {
static contextTypes = {
router: PropTypes.object,
};
static propTypes = {
media: ImmutablePropTypes.map.isRequired,
letterbox: PropTypes.bool,
@ -122,7 +126,7 @@ export default class StatusPlayer extends React.PureComponent {
</div>
);
let expandButton = (
let expandButton = !this.context.router ? '' : (
<div className='status__video-player-expand'>
<IconButton overlay title={intl.formatMessage(messages.expand_video)} icon='expand' onClick={this.handleExpand} />
</div>

View File

@ -28,7 +28,7 @@ Imports
*/
// Package imports //
import Immutable from 'immutable';
import { Map as ImmutableMap } from 'immutable';
// Mastodon imports //
import { STORE_HYDRATE } from '../../mastodon/actions/store';
@ -48,27 +48,27 @@ These are only used if no previously-saved values exist.
*/
const initialState = Immutable.fromJS({
const initialState = ImmutableMap({
layout : 'auto',
stretch : true,
collapsed : {
collapsed : ImmutableMap({
enabled : true,
auto : {
auto : ImmutableMap({
all : false,
notifications : true,
lengthy : true,
replies : false,
media : false,
},
backgrounds : {
}),
backgrounds : ImmutableMap({
user_backgrounds : false,
preview_images : false,
},
},
media : {
}),
}),
media : ImmutableMap({
letterbox : true,
fullwidth : true,
},
}),
});
/* * * * */