diff options
| -rw-r--r-- | app/javascript/glitch/components/status/action_bar.js | 11 | ||||
| -rw-r--r-- | app/javascript/glitch/components/status/content.js | 28 | ||||
| -rw-r--r-- | app/javascript/glitch/components/status/header.js | 1 | ||||
| -rw-r--r-- | app/javascript/glitch/components/status/index.js | 14 | ||||
| -rw-r--r-- | app/javascript/glitch/components/status/player.js | 6 | ||||
| -rw-r--r-- | app/javascript/glitch/reducers/local_settings.js | 20 |
6 files changed, 51 insertions, 29 deletions
diff --git a/app/javascript/glitch/components/status/action_bar.js b/app/javascript/glitch/components/status/action_bar.js index 6aa088c04..df0904a7c 100644 --- a/app/javascript/glitch/components/status/action_bar.js +++ b/app/javascript/glitch/components/status/action_bar.js @@ -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> diff --git a/app/javascript/glitch/components/status/content.js b/app/javascript/glitch/components/status/content.js index 76f5b765a..06fe04ce0 100644 --- a/app/javascript/glitch/components/status/content.js +++ b/app/javascript/glitch/components/status/content.js @@ -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 diff --git a/app/javascript/glitch/components/status/header.js b/app/javascript/glitch/components/status/header.js index 78aef1ed5..3187fa7fb 100644 --- a/app/javascript/glitch/components/status/header.js +++ b/app/javascript/glitch/components/status/header.js @@ -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} > diff --git a/app/javascript/glitch/components/status/index.js b/app/javascript/glitch/components/status/index.js index 314e8b51c..4a91b5aa3 100644 --- a/app/javascript/glitch/components/status/index.js +++ b/app/javascript/glitch/components/status/index.js @@ -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 diff --git a/app/javascript/glitch/components/status/player.js b/app/javascript/glitch/components/status/player.js index 37e4b8995..cc65cd34e 100644 --- a/app/javascript/glitch/components/status/player.js +++ b/app/javascript/glitch/components/status/player.js @@ -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> diff --git a/app/javascript/glitch/reducers/local_settings.js b/app/javascript/glitch/reducers/local_settings.js index 79ff96307..776dcead7 100644 --- a/app/javascript/glitch/reducers/local_settings.js +++ b/app/javascript/glitch/reducers/local_settings.js @@ -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, - }, + }), }); /* * * * */ |