diff options
Diffstat (limited to 'app/javascript/flavours/glitch/features/status')
| -rw-r--r-- | app/javascript/flavours/glitch/features/status/components/action_bar.jsx (renamed from app/javascript/flavours/glitch/features/status/components/action_bar.js) | 37 | ||||
| -rw-r--r-- | app/javascript/flavours/glitch/features/status/components/card.jsx (renamed from app/javascript/flavours/glitch/features/status/components/card.js) | 11 | ||||
| -rw-r--r-- | app/javascript/flavours/glitch/features/status/components/detailed_status.jsx (renamed from app/javascript/flavours/glitch/features/status/components/detailed_status.js) | 26 | ||||
| -rw-r--r-- | app/javascript/flavours/glitch/features/status/index.jsx (renamed from app/javascript/flavours/glitch/features/status/index.js) | 108 |
4 files changed, 94 insertions, 88 deletions
diff --git a/app/javascript/flavours/glitch/features/status/components/action_bar.js b/app/javascript/flavours/glitch/features/status/components/action_bar.jsx index 73913dd49..d5ab730d6 100644 --- a/app/javascript/flavours/glitch/features/status/components/action_bar.js +++ b/app/javascript/flavours/glitch/features/status/components/action_bar.jsx @@ -39,7 +39,6 @@ const messages = defineMessages({ openOriginalPage: { id: 'account.open_original_page', defaultMessage: 'Open original page' }, }); -export default @injectIntl class ActionBar extends React.PureComponent { static contextTypes = { @@ -68,75 +67,75 @@ class ActionBar extends React.PureComponent { handleReplyClick = () => { this.props.onReply(this.props.status); - } + }; handleReblogClick = (e) => { this.props.onReblog(this.props.status, e); - } + }; handleFavouriteClick = (e) => { this.props.onFavourite(this.props.status, e); - } + }; handleBookmarkClick = (e) => { this.props.onBookmark(this.props.status, e); - } + }; handleDeleteClick = () => { this.props.onDelete(this.props.status, this.context.router.history); - } + }; handleRedraftClick = () => { this.props.onDelete(this.props.status, this.context.router.history, true); - } + }; handleEditClick = () => { this.props.onEdit(this.props.status, this.context.router.history); - } + }; handleDirectClick = () => { this.props.onDirect(this.props.status.get('account'), this.context.router.history); - } + }; handleMentionClick = () => { this.props.onMention(this.props.status.get('account'), this.context.router.history); - } + }; handleMuteClick = () => { this.props.onMute(this.props.status.get('account')); - } + }; handleConversationMuteClick = () => { this.props.onMuteConversation(this.props.status); - } + }; handleBlockClick = () => { this.props.onBlock(this.props.status); - } + }; handleReport = () => { this.props.onReport(this.props.status); - } + }; handlePinClick = () => { this.props.onPin(this.props.status); - } + }; handleShare = () => { navigator.share({ text: this.props.status.get('search_index'), url: this.props.status.get('url'), }); - } + }; handleEmbed = () => { this.props.onEmbed(this.props.status); - } + }; handleCopy = () => { const url = this.props.status.get('url'); navigator.clipboard.writeText(url); - } + }; render () { const { status, intl } = this.props; @@ -228,3 +227,5 @@ class ActionBar extends React.PureComponent { } } + +export default injectIntl(ActionBar); diff --git a/app/javascript/flavours/glitch/features/status/components/card.js b/app/javascript/flavours/glitch/features/status/components/card.jsx index 2d2e49eb8..359dbbc20 100644 --- a/app/javascript/flavours/glitch/features/status/components/card.js +++ b/app/javascript/flavours/glitch/features/status/components/card.jsx @@ -138,7 +138,7 @@ export default class Card extends React.PureComponent { } else { this.setState({ embedded: true }); } - } + }; setRef = c => { this.node = c; @@ -146,17 +146,17 @@ export default class Card extends React.PureComponent { if (this.node) { this._setDimensions(); } - } + }; handleImageLoad = () => { this.setState({ previewLoaded: true }); - } + }; handleReveal = e => { e.preventDefault(); e.stopPropagation(); this.setState({ revealed: true }); - } + }; renderVideo () { const { card } = this.props; @@ -188,11 +188,12 @@ export default class Card extends React.PureComponent { const interactive = card.get('type') !== 'link'; const className = classnames('status-card', { horizontal, compact, interactive }); const title = interactive ? <a className='status-card__title' href={card.get('url')} title={card.get('title')} rel='noopener noreferrer' target='_blank'><strong>{card.get('title')}</strong></a> : <strong className='status-card__title' title={card.get('title')}>{card.get('title')}</strong>; + const language = card.get('language') || ''; const ratio = card.get('width') / card.get('height'); const height = (compact && !embedded) ? (width / (16 / 9)) : (width / ratio); const description = ( - <div className='status-card__content'> + <div className='status-card__content' lang={language}> {title} {!(horizontal || compact) && <p className='status-card__description'>{trim(card.get('description') || '', maxDescription)}</p>} <span className='status-card__host'>{provider}</span> diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.js b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx index 907fc3f1c..cfe6c965e 100644 --- a/app/javascript/flavours/glitch/features/status/components/detailed_status.js +++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx @@ -21,7 +21,6 @@ import AnimatedNumber from 'flavours/glitch/components/animated_number'; import PictureInPicturePlaceholder from 'flavours/glitch/components/picture_in_picture_placeholder'; import EditedTimestamp from 'flavours/glitch/components/edited_timestamp'; -export default @injectIntl class DetailedStatus extends ImmutablePureComponent { static contextTypes = { @@ -56,28 +55,28 @@ class DetailedStatus extends ImmutablePureComponent { handleAccountClick = (e) => { if (e.button === 0 && !(e.ctrlKey || e.altKey || e.metaKey) && this.context.router) { e.preventDefault(); - let state = {...this.context.router.history.location.state}; + let state = { ...this.context.router.history.location.state }; state.mastodonBackSteps = (state.mastodonBackSteps || 0) + 1; this.context.router.history.push(`/@${this.props.status.getIn(['account', 'acct'])}`, state); } e.stopPropagation(); - } + }; parseClick = (e, destination) => { if (e.button === 0 && !(e.ctrlKey || e.altKey || e.metaKey) && this.context.router) { e.preventDefault(); - let state = {...this.context.router.history.location.state}; + let state = { ...this.context.router.history.location.state }; state.mastodonBackSteps = (state.mastodonBackSteps || 0) + 1; this.context.router.history.push(destination, state); } e.stopPropagation(); - } + }; handleOpenVideo = (options) => { this.props.onOpenVideo(this.props.status.getIn(['media_attachments', 0]), options); - } + }; _measureHeight (heightJustChanged) { if (this.props.measureHeight && this.node) { @@ -92,7 +91,7 @@ class DetailedStatus extends ImmutablePureComponent { setRef = c => { this.node = c; this._measureHeight(); - } + }; componentDidUpdate (prevProps, prevState) { this._measureHeight(prevState.height !== this.state.height); @@ -100,7 +99,7 @@ class DetailedStatus extends ImmutablePureComponent { handleChildUpdate = () => { this._measureHeight(); - } + }; handleModalLink = e => { e.preventDefault(); @@ -114,12 +113,12 @@ class DetailedStatus extends ImmutablePureComponent { } window.open(href, 'mastodon-intent', 'width=445,height=600,resizable=no,menubar=no,status=no,scrollbars=yes'); - } + }; handleTranslate = () => { const { onTranslate, status } = this.props; onTranslate(status); - } + }; render () { const status = (this.props.status && this.props.status.get('reblog')) ? this.props.status.get('reblog') : this.props.status; @@ -169,6 +168,7 @@ class DetailedStatus extends ImmutablePureComponent { <Audio src={attachment.get('url')} alt={attachment.get('description')} + lang={status.get('language')} duration={attachment.getIn(['meta', 'original', 'duration'], 0)} poster={attachment.get('preview_url') || status.getIn(['account', 'avatar_static'])} backgroundColor={attachment.getIn(['meta', 'colors', 'background'])} @@ -191,6 +191,7 @@ class DetailedStatus extends ImmutablePureComponent { blurhash={attachment.get('blurhash')} src={attachment.get('url')} alt={attachment.get('description')} + lang={status.get('language')} inline sensitive={status.get('sensitive')} letterbox={settings.getIn(['media', 'letterbox'])} @@ -209,6 +210,7 @@ class DetailedStatus extends ImmutablePureComponent { standalone sensitive={status.get('sensitive')} media={status.get('media_attachments')} + lang={status.get('language')} letterbox={settings.getIn(['media', 'letterbox'])} fullwidth={settings.getIn(['media', 'fullwidth'])} hidden={!expanded} @@ -225,7 +227,7 @@ class DetailedStatus extends ImmutablePureComponent { } if (status.get('poll')) { - contentMedia.push(<PollContainer pollId={status.get('poll')} />); + contentMedia.push(<PollContainer pollId={status.get('poll')} lang={status.get('language')} />); contentMediaIcons.push('tasks'); } @@ -333,3 +335,5 @@ class DetailedStatus extends ImmutablePureComponent { } } + +export default injectIntl(DetailedStatus); diff --git a/app/javascript/flavours/glitch/features/status/index.js b/app/javascript/flavours/glitch/features/status/index.jsx index c22e7f0bd..f01ad2dbe 100644 --- a/app/javascript/flavours/glitch/features/status/index.js +++ b/app/javascript/flavours/glitch/features/status/index.jsx @@ -5,7 +5,17 @@ import PropTypes from 'prop-types'; import classNames from 'classnames'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { createSelector } from 'reselect'; -import { fetchStatus } from 'flavours/glitch/actions/statuses'; +import { + fetchStatus, + muteStatus, + unmuteStatus, + deleteStatus, + editStatus, + hideStatus, + revealStatus, + translateStatus, + undoStatusTranslation, +} from 'flavours/glitch/actions/statuses'; import MissingIndicator from 'flavours/glitch/components/missing_indicator'; import LoadingIndicator from 'flavours/glitch/components/loading_indicator'; import DetailedStatus from './components/detailed_status'; @@ -27,16 +37,6 @@ import { directCompose, } from 'flavours/glitch/actions/compose'; import { changeLocalSetting } from 'flavours/glitch/actions/local_settings'; -import { - muteStatus, - unmuteStatus, - deleteStatus, - editStatus, - hideStatus, - revealStatus, - translateStatus, - undoStatusTranslation, -} from 'flavours/glitch/actions/statuses'; import { initMuteModal } from 'flavours/glitch/actions/mutes'; import { initBlockModal } from 'flavours/glitch/actions/blocks'; import { initReport } from 'flavours/glitch/actions/reports'; @@ -171,8 +171,6 @@ const titleFromStatus = status => { return `${prefix}: "${truncate(text, 30)}"`; }; -export default @injectIntl -@connect(makeMapStateToProps) class Status extends ImmutablePureComponent { static contextTypes = { @@ -263,15 +261,15 @@ class Status extends ImmutablePureComponent { } else if (this.props.status.get('spoiler_text')) { this.setExpansion(!this.state.isExpanded); } - } + }; handleToggleMediaVisibility = () => { this.setState({ showMedia: !this.state.showMedia }); - } + }; handleModalFavourite = (status) => { this.props.dispatch(favourite(status)); - } + }; handleFavouriteClick = (status, e) => { const { dispatch } = this.props; @@ -294,7 +292,7 @@ class Status extends ImmutablePureComponent { url: status.get('url'), })); } - } + }; handlePin = (status) => { if (status.get('pinned')) { @@ -302,7 +300,7 @@ class Status extends ImmutablePureComponent { } else { this.props.dispatch(pin(status)); } - } + }; handleReplyClick = (status) => { const { askReplyConfirmation, dispatch, intl } = this.props; @@ -326,7 +324,7 @@ class Status extends ImmutablePureComponent { url: status.get('url'), })); } - } + }; handleModalReblog = (status, privacy) => { const { dispatch } = this.props; @@ -336,7 +334,7 @@ class Status extends ImmutablePureComponent { } else { dispatch(reblog(status, privacy)); } - } + }; handleReblogClick = (status, e) => { const { settings, dispatch } = this.props; @@ -357,7 +355,7 @@ class Status extends ImmutablePureComponent { url: status.get('url'), })); } - } + }; handleBookmarkClick = (status) => { if (status.get('bookmarked')) { @@ -365,7 +363,7 @@ class Status extends ImmutablePureComponent { } else { this.props.dispatch(bookmark(status)); } - } + }; handleDeleteClick = (status, history, withRedraft = false) => { const { dispatch, intl } = this.props; @@ -379,27 +377,27 @@ class Status extends ImmutablePureComponent { onConfirm: () => dispatch(deleteStatus(status.get('id'), history, withRedraft)), })); } - } + }; handleEditClick = (status, history) => { this.props.dispatch(editStatus(status.get('id'), history)); - } + }; handleDirectClick = (account, router) => { this.props.dispatch(directCompose(account, router)); - } + }; handleMentionClick = (account, router) => { this.props.dispatch(mentionCompose(account, router)); - } + }; handleOpenMedia = (media, index) => { this.props.dispatch(openModal('MEDIA', { statusId: this.props.status.get('id'), media, index })); - } + }; handleOpenVideo = (media, options) => { this.props.dispatch(openModal('VIDEO', { statusId: this.props.status.get('id'), media, options })); - } + }; handleHotkeyOpenMedia = e => { const { status } = this.props; @@ -413,11 +411,11 @@ class Status extends ImmutablePureComponent { this.handleOpenMedia(status.get('media_attachments'), 0); } } - } + }; handleMuteClick = (account) => { this.props.dispatch(initMuteModal(account)); - } + }; handleConversationMuteClick = (status) => { if (status.get('muted')) { @@ -425,7 +423,7 @@ class Status extends ImmutablePureComponent { } else { this.props.dispatch(muteStatus(status.get('id'))); } - } + }; handleToggleAll = () => { const { status, ancestorsIds, descendantsIds, settings } = this.props; @@ -442,7 +440,7 @@ class Status extends ImmutablePureComponent { } this.setState({ isExpanded: !isExpanded, threadExpanded: !isExpanded }); - } + }; handleTranslate = status => { const { dispatch } = this.props; @@ -452,61 +450,61 @@ class Status extends ImmutablePureComponent { } else { dispatch(translateStatus(status.get('id'))); } - } + }; handleBlockClick = (status) => { const { dispatch } = this.props; const account = status.get('account'); dispatch(initBlockModal(account)); - } + }; handleReport = (status) => { this.props.dispatch(initReport(status.get('account'), status)); - } + }; handleEmbed = (status) => { this.props.dispatch(openModal('EMBED', { url: status.get('url') })); - } + }; handleHotkeyToggleSensitive = () => { this.handleToggleMediaVisibility(); - } + }; handleHotkeyMoveUp = () => { this.handleMoveUp(this.props.status.get('id')); - } + }; handleHotkeyMoveDown = () => { this.handleMoveDown(this.props.status.get('id')); - } + }; handleHotkeyReply = e => { e.preventDefault(); this.handleReplyClick(this.props.status); - } + }; handleHotkeyFavourite = () => { this.handleFavouriteClick(this.props.status); - } + }; handleHotkeyBoost = () => { this.handleReblogClick(this.props.status); - } + }; handleHotkeyBookmark = () => { this.handleBookmarkClick(this.props.status); - } + }; handleHotkeyMention = e => { e.preventDefault(); this.handleMentionClick(this.props.status); - } + }; handleHotkeyOpenProfile = () => { - let state = {...this.context.router.history.location.state}; + let state = { ...this.context.router.history.location.state }; state.mastodonBackSteps = (state.mastodonBackSteps || 0) + 1; this.context.router.history.push(`/@${this.props.status.getIn(['account', 'acct'])}`, state); - } + }; handleMoveUp = id => { const { status, ancestorsIds, descendantsIds } = this.props; @@ -523,7 +521,7 @@ class Status extends ImmutablePureComponent { this._selectChild(index - 1, true); } } - } + }; handleMoveDown = id => { const { status, ancestorsIds, descendantsIds } = this.props; @@ -540,7 +538,7 @@ class Status extends ImmutablePureComponent { this._selectChild(index + 1, false); } } - } + }; _selectChild (index, align_top) { const container = this.node; @@ -558,7 +556,7 @@ class Status extends ImmutablePureComponent { handleHeaderClick = () => { this.column.scrollTop(); - } + }; renderChildren (list) { return list.map(id => ( @@ -575,15 +573,15 @@ class Status extends ImmutablePureComponent { setExpansion = value => { this.setState({ isExpanded: value }); - } + }; setRef = c => { this.node = c; - } + }; setColumnRef = c => { this.column = c; - } + }; componentDidUpdate (prevProps) { if (this.props.params.statusId && (this.props.params.statusId !== prevProps.params.statusId || prevProps.ancestorsIds.size < this.props.ancestorsIds.size)) { @@ -605,7 +603,7 @@ class Status extends ImmutablePureComponent { onFullScreenChange = () => { this.setState({ fullscreen: isFullscreen() }); - } + }; render () { let ancestors, descendants; @@ -674,7 +672,7 @@ class Status extends ImmutablePureComponent { {ancestors} <HotKeys handlers={handlers}> - <div className='focusable' tabIndex='0' aria-label={textForScreenReader(intl, status, false, isExpanded)}> + <div className='focusable' tabIndex={0} aria-label={textForScreenReader(intl, status, false, isExpanded)}> <DetailedStatus key={`details-${status.get('id')}`} status={status} @@ -724,3 +722,5 @@ class Status extends ImmutablePureComponent { } } + +export default injectIntl(connect(makeMapStateToProps)(Status)); |