2019-10-27 20:46:35 +09:00
import PropTypes from 'prop-types' ;
2023-05-24 00:15:17 +09:00
import { injectIntl , FormattedMessage , defineMessages } from 'react-intl' ;
import classNames from 'classnames' ;
2023-10-20 02:44:55 +09:00
import { Link , withRouter } from 'react-router-dom' ;
2023-05-24 00:15:17 +09:00
import ImmutablePropTypes from 'react-immutable-proptypes' ;
2019-10-27 20:46:35 +09:00
import ImmutablePureComponent from 'react-immutable-pure-component' ;
2023-05-24 00:15:17 +09:00
import { HotKeys } from 'react-hotkeys' ;
2024-01-16 19:27:26 +09:00
import EditIcon from '@/material-icons/400-24px/edit.svg?react' ;
import FlagIcon from '@/material-icons/400-24px/flag-fill.svg?react' ;
import HomeIcon from '@/material-icons/400-24px/home-fill.svg?react' ;
import InsertChartIcon from '@/material-icons/400-24px/insert_chart.svg?react' ;
import PersonIcon from '@/material-icons/400-24px/person-fill.svg?react' ;
import PersonAddIcon from '@/material-icons/400-24px/person_add-fill.svg?react' ;
import RepeatIcon from '@/material-icons/400-24px/repeat.svg?react' ;
import StarIcon from '@/material-icons/400-24px/star-fill.svg?react' ;
2023-05-24 00:15:17 +09:00
import { Icon } from 'mastodon/components/icon' ;
2019-10-27 20:46:35 +09:00
import AccountContainer from 'mastodon/containers/account_container' ;
2023-05-24 00:15:17 +09:00
import StatusContainer from 'mastodon/containers/status_container' ;
import { me } from 'mastodon/initial_state' ;
2023-10-20 02:44:55 +09:00
import { WithRouterPropTypes } from 'mastodon/utils/react_router' ;
2023-05-24 00:15:17 +09:00
2019-12-02 01:25:29 +09:00
import FollowRequestContainer from '../containers/follow_request_container' ;
2023-05-24 00:15:17 +09:00
2024-04-26 02:26:05 +09:00
import { ModerationWarning } from './moderation_warning' ;
2024-03-25 22:27:38 +09:00
import { RelationshipsSeveranceEvent } from './relationships_severance_event' ;
2023-05-24 00:15:17 +09:00
import Report from './report' ;
2019-10-27 20:46:35 +09:00
const messages = defineMessages ( {
2023-07-22 02:09:13 +09:00
favourite : { id : 'notification.favourite' , defaultMessage : '{name} favorited your status' } ,
2019-10-27 20:46:35 +09:00
follow : { id : 'notification.follow' , defaultMessage : '{name} followed you' } ,
ownPoll : { id : 'notification.own_poll' , defaultMessage : 'Your poll has ended' } ,
2024-07-18 23:36:09 +09:00
poll : { id : 'notification.poll' , defaultMessage : 'A poll you voted in has ended' } ,
2019-10-27 20:46:35 +09:00
reblog : { id : 'notification.reblog' , defaultMessage : '{name} boosted your status' } ,
2020-09-19 00:26:45 +09:00
status : { id : 'notification.status' , defaultMessage : '{name} just posted' } ,
2022-02-12 06:20:19 +09:00
update : { id : 'notification.update' , defaultMessage : '{name} edited a post' } ,
2022-02-24 00:45:22 +09:00
adminSignUp : { id : 'notification.admin.sign_up' , defaultMessage : '{name} signed up' } ,
2022-06-27 16:30:15 +09:00
adminReport : { id : 'notification.admin.report' , defaultMessage : '{name} reported {target}' } ,
2024-03-25 22:27:38 +09:00
relationshipsSevered : { id : 'notification.relationships_severance_event' , defaultMessage : 'Lost connections with {name}' } ,
2024-05-10 18:19:27 +09:00
moderationWarning : { id : 'notification.moderation_warning' , defaultMessage : 'You have received a moderation warning' } ,
2019-10-27 20:46:35 +09:00
} ) ;
2016-11-21 03:39:18 +09:00
2018-08-27 00:53:26 +09:00
const notificationForScreenReader = ( intl , message , timestamp ) => {
const output = [ message ] ;
output . push ( intl . formatDate ( timestamp , { hour : '2-digit' , minute : '2-digit' , month : 'short' , day : 'numeric' } ) ) ;
return output . join ( ', ' ) ;
} ;
2018-09-15 00:59:48 +09:00
class Notification extends ImmutablePureComponent {
2017-05-12 21:44:10 +09:00
static propTypes = {
2017-05-21 00:31:47 +09:00
notification : ImmutablePropTypes . map . isRequired ,
2017-08-29 05:23:44 +09:00
hidden : PropTypes . bool ,
2017-10-06 08:07:59 +09:00
onMoveUp : PropTypes . func . isRequired ,
onMoveDown : PropTypes . func . isRequired ,
onMention : PropTypes . func . isRequired ,
2019-01-28 01:54:54 +09:00
onFavourite : PropTypes . func . isRequired ,
onReblog : PropTypes . func . isRequired ,
onToggleHidden : PropTypes . func . isRequired ,
2019-03-17 04:10:42 +09:00
status : ImmutablePropTypes . map ,
2018-08-27 00:53:26 +09:00
intl : PropTypes . object . isRequired ,
2019-02-11 21:19:59 +09:00
getScrollPosition : PropTypes . func ,
updateScrollBottom : PropTypes . func ,
cacheMediaWidth : PropTypes . func ,
cachedMediaWidth : PropTypes . number ,
2020-09-27 03:57:07 +09:00
unread : PropTypes . bool ,
2023-10-20 02:44:55 +09:00
... WithRouterPropTypes ,
2017-05-12 21:44:10 +09:00
} ;
2017-10-06 08:07:59 +09:00
handleMoveUp = ( ) => {
const { notification , onMoveUp } = this . props ;
onMoveUp ( notification . get ( 'id' ) ) ;
2023-01-30 09:45:35 +09:00
} ;
2017-10-06 08:07:59 +09:00
handleMoveDown = ( ) => {
const { notification , onMoveDown } = this . props ;
onMoveDown ( notification . get ( 'id' ) ) ;
2023-01-30 09:45:35 +09:00
} ;
2017-10-06 08:07:59 +09:00
handleOpen = ( ) => {
const { notification } = this . props ;
if ( notification . get ( 'status' ) ) {
2023-10-20 02:44:55 +09:00
this . props . history . push ( ` /@ ${ notification . getIn ( [ 'status' , 'account' , 'acct' ] ) } / ${ notification . get ( 'status' ) } ` ) ;
2017-10-06 08:07:59 +09:00
} else {
this . handleOpenProfile ( ) ;
}
2023-01-30 09:45:35 +09:00
} ;
2017-10-06 08:07:59 +09:00
handleOpenProfile = ( ) => {
const { notification } = this . props ;
2023-10-20 02:44:55 +09:00
this . props . history . push ( ` /@ ${ notification . getIn ( [ 'account' , 'acct' ] ) } ` ) ;
2023-01-30 09:45:35 +09:00
} ;
2017-10-06 08:07:59 +09:00
handleMention = e => {
e . preventDefault ( ) ;
const { notification , onMention } = this . props ;
2023-10-20 02:44:55 +09:00
onMention ( notification . get ( 'account' ) , this . props . history ) ;
2023-01-30 09:45:35 +09:00
} ;
2017-10-06 08:07:59 +09:00
2019-01-28 01:54:54 +09:00
handleHotkeyFavourite = ( ) => {
const { status } = this . props ;
if ( status ) this . props . onFavourite ( status ) ;
2023-01-30 09:45:35 +09:00
} ;
2019-01-28 01:54:54 +09:00
handleHotkeyBoost = e => {
const { status } = this . props ;
if ( status ) this . props . onReblog ( status , e ) ;
2023-01-30 09:45:35 +09:00
} ;
2019-01-28 01:54:54 +09:00
handleHotkeyToggleHidden = ( ) => {
const { status } = this . props ;
if ( status ) this . props . onToggleHidden ( status ) ;
2023-01-30 09:45:35 +09:00
} ;
2019-01-28 01:54:54 +09:00
2017-10-06 08:07:59 +09:00
getHandlers ( ) {
return {
2019-01-28 01:54:54 +09:00
reply : this . handleMention ,
favourite : this . handleHotkeyFavourite ,
boost : this . handleHotkeyBoost ,
mention : this . handleMention ,
2017-10-06 08:07:59 +09:00
open : this . handleOpen ,
openProfile : this . handleOpenProfile ,
2019-01-28 01:54:54 +09:00
moveUp : this . handleMoveUp ,
moveDown : this . handleMoveDown ,
toggleHidden : this . handleHotkeyToggleHidden ,
2017-10-06 08:07:59 +09:00
} ;
}
2018-08-27 00:53:26 +09:00
renderFollow ( notification , account , link ) {
2020-09-27 03:57:07 +09:00
const { intl , unread } = this . props ;
2018-08-27 00:53:26 +09:00
2016-11-21 03:39:18 +09:00
return (
2017-10-06 08:07:59 +09:00
< HotKeys handlers = { this . getHandlers ( ) } >
2023-04-04 23:33:44 +09:00
< div className = { classNames ( 'notification notification-follow focusable' , { unread } ) } tabIndex = { 0 } aria - label = { notificationForScreenReader ( intl , intl . formatMessage ( messages . follow , { name : account . get ( 'acct' ) } ) , notification . get ( 'created_at' ) ) } >
2017-10-06 08:07:59 +09:00
< div className = 'notification__message' >
2023-10-25 02:45:08 +09:00
< Icon id = 'user-plus' icon = { PersonAddIcon } / >
2019-01-01 02:12:07 +09:00
2018-09-28 00:11:06 +09:00
< span title = { notification . get ( 'created_at' ) } >
< FormattedMessage id = 'notification.follow' defaultMessage = '{name} followed you' values = { { name : link } } / >
< / span >
2016-12-02 22:52:41 +09:00
< / div >
2019-01-01 02:12:07 +09:00
2019-12-02 01:25:29 +09:00
< AccountContainer id = { account . get ( 'id' ) } hidden = { this . props . hidden } / >
< / div >
< / HotKeys >
) ;
}
renderFollowRequest ( notification , account , link ) {
2020-09-27 03:57:07 +09:00
const { intl , unread } = this . props ;
2019-12-02 01:25:29 +09:00
return (
< HotKeys handlers = { this . getHandlers ( ) } >
2023-04-04 23:33:44 +09:00
< div className = { classNames ( 'notification notification-follow-request focusable' , { unread } ) } tabIndex = { 0 } aria - label = { notificationForScreenReader ( intl , intl . formatMessage ( { id : 'notification.follow_request' , defaultMessage : '{name} has requested to follow you' } , { name : account . get ( 'acct' ) } ) , notification . get ( 'created_at' ) ) } >
2019-12-02 01:25:29 +09:00
< div className = 'notification__message' >
2023-10-25 02:45:08 +09:00
< Icon id = 'user' icon = { PersonIcon } / >
2019-12-02 01:25:29 +09:00
< span title = { notification . get ( 'created_at' ) } >
< FormattedMessage id = 'notification.follow_request' defaultMessage = '{name} has requested to follow you' values = { { name : link } } / >
< / span >
< / div >
< FollowRequestContainer id = { account . get ( 'id' ) } withNote = { false } hidden = { this . props . hidden } / >
2016-12-02 22:52:41 +09:00
< / div >
2017-10-06 08:07:59 +09:00
< / HotKeys >
2016-11-21 03:39:18 +09:00
) ;
2017-04-22 03:05:35 +09:00
}
2016-11-21 03:39:18 +09:00
renderMention ( notification ) {
2017-10-06 08:07:59 +09:00
return (
< StatusContainer
id = { notification . get ( 'status' ) }
withDismiss
hidden = { this . props . hidden }
onMoveDown = { this . handleMoveDown }
onMoveUp = { this . handleMoveUp }
2018-07-08 02:31:19 +09:00
contextType = 'notifications'
2019-02-11 21:19:59 +09:00
getScrollPosition = { this . props . getScrollPosition }
updateScrollBottom = { this . props . updateScrollBottom }
cachedMediaWidth = { this . props . cachedMediaWidth }
cacheMediaWidth = { this . props . cacheMediaWidth }
2020-09-27 03:57:07 +09:00
unread = { this . props . unread }
2017-10-06 08:07:59 +09:00
/ >
) ;
2017-04-22 03:05:35 +09:00
}
2016-11-21 03:39:18 +09:00
renderFavourite ( notification , link ) {
2020-09-27 03:57:07 +09:00
const { intl , unread } = this . props ;
2018-08-27 00:53:26 +09:00
2016-11-21 03:39:18 +09:00
return (
2017-10-06 08:07:59 +09:00
< HotKeys handlers = { this . getHandlers ( ) } >
2023-04-04 23:33:44 +09:00
< div className = { classNames ( 'notification notification-favourite focusable' , { unread } ) } tabIndex = { 0 } aria - label = { notificationForScreenReader ( intl , intl . formatMessage ( messages . favourite , { name : notification . getIn ( [ 'account' , 'acct' ] ) } ) , notification . get ( 'created_at' ) ) } >
2017-10-06 08:07:59 +09:00
< div className = 'notification__message' >
2023-10-25 02:45:08 +09:00
< Icon id = 'star' icon = { StarIcon } className = 'star-icon' / >
2019-01-01 02:12:07 +09:00
< span title = { notification . get ( 'created_at' ) } >
2023-07-22 02:09:13 +09:00
< FormattedMessage id = 'notification.favourite' defaultMessage = '{name} favorited your status' values = { { name : link } } / >
2018-12-05 13:08:43 +09:00
< / span >
2016-12-02 22:52:41 +09:00
< / div >
2019-02-11 21:19:59 +09:00
< StatusContainer
id = { notification . get ( 'status' ) }
account = { notification . get ( 'account' ) }
muted
withDismiss
hidden = { ! ! this . props . hidden }
getScrollPosition = { this . props . getScrollPosition }
updateScrollBottom = { this . props . updateScrollBottom }
cachedMediaWidth = { this . props . cachedMediaWidth }
cacheMediaWidth = { this . props . cacheMediaWidth }
/ >
2017-10-06 08:07:59 +09:00
< / div >
< / HotKeys >
2016-11-21 03:39:18 +09:00
) ;
2017-04-22 03:05:35 +09:00
}
2016-11-21 03:39:18 +09:00
renderReblog ( notification , link ) {
2020-09-27 03:57:07 +09:00
const { intl , unread } = this . props ;
2018-08-27 00:53:26 +09:00
2016-11-21 03:39:18 +09:00
return (
2017-10-06 08:07:59 +09:00
< HotKeys handlers = { this . getHandlers ( ) } >
2023-04-04 23:33:44 +09:00
< div className = { classNames ( 'notification notification-reblog focusable' , { unread } ) } tabIndex = { 0 } aria - label = { notificationForScreenReader ( intl , intl . formatMessage ( messages . reblog , { name : notification . getIn ( [ 'account' , 'acct' ] ) } ) , notification . get ( 'created_at' ) ) } >
2017-10-06 08:07:59 +09:00
< div className = 'notification__message' >
2023-10-25 02:45:08 +09:00
< Icon id = 'retweet' icon = { RepeatIcon } / >
2019-01-01 02:12:07 +09:00
< span title = { notification . get ( 'created_at' ) } >
< FormattedMessage id = 'notification.reblog' defaultMessage = '{name} boosted your status' values = { { name : link } } / >
2018-12-05 13:08:43 +09:00
< / span >
2016-12-02 22:52:41 +09:00
< / div >
2019-02-11 21:19:59 +09:00
< StatusContainer
id = { notification . get ( 'status' ) }
account = { notification . get ( 'account' ) }
muted
withDismiss
hidden = { this . props . hidden }
getScrollPosition = { this . props . getScrollPosition }
updateScrollBottom = { this . props . updateScrollBottom }
cachedMediaWidth = { this . props . cachedMediaWidth }
cacheMediaWidth = { this . props . cacheMediaWidth }
/ >
2017-10-06 08:07:59 +09:00
< / div >
< / HotKeys >
2016-11-21 03:39:18 +09:00
) ;
2017-04-22 03:05:35 +09:00
}
2016-11-21 03:39:18 +09:00
2020-09-19 00:26:45 +09:00
renderStatus ( notification , link ) {
2023-01-23 21:21:50 +09:00
const { intl , unread , status } = this . props ;
if ( ! status ) {
return null ;
}
2020-09-19 00:26:45 +09:00
return (
< HotKeys handlers = { this . getHandlers ( ) } >
2023-04-04 23:33:44 +09:00
< div className = { classNames ( 'notification notification-status focusable' , { unread } ) } tabIndex = { 0 } aria - label = { notificationForScreenReader ( intl , intl . formatMessage ( messages . status , { name : notification . getIn ( [ 'account' , 'acct' ] ) } ) , notification . get ( 'created_at' ) ) } >
2020-09-19 00:26:45 +09:00
< div className = 'notification__message' >
2023-10-25 02:45:08 +09:00
< Icon id = 'home' icon = { HomeIcon } / >
2020-09-19 00:26:45 +09:00
< span title = { notification . get ( 'created_at' ) } >
< FormattedMessage id = 'notification.status' defaultMessage = '{name} just posted' values = { { name : link } } / >
< / span >
< / div >
< StatusContainer
id = { notification . get ( 'status' ) }
account = { notification . get ( 'account' ) }
2023-01-23 21:21:50 +09:00
contextType = 'notifications'
2020-09-19 00:26:45 +09:00
muted
withDismiss
hidden = { this . props . hidden }
getScrollPosition = { this . props . getScrollPosition }
updateScrollBottom = { this . props . updateScrollBottom }
cachedMediaWidth = { this . props . cachedMediaWidth }
cacheMediaWidth = { this . props . cacheMediaWidth }
/ >
< / div >
< / HotKeys >
) ;
}
2022-02-12 06:20:19 +09:00
renderUpdate ( notification , link ) {
2023-01-23 21:21:50 +09:00
const { intl , unread , status } = this . props ;
if ( ! status ) {
return null ;
}
2022-02-12 06:20:19 +09:00
return (
< HotKeys handlers = { this . getHandlers ( ) } >
2023-04-04 23:33:44 +09:00
< div className = { classNames ( 'notification notification-update focusable' , { unread } ) } tabIndex = { 0 } aria - label = { notificationForScreenReader ( intl , intl . formatMessage ( messages . update , { name : notification . getIn ( [ 'account' , 'acct' ] ) } ) , notification . get ( 'created_at' ) ) } >
2022-02-12 06:20:19 +09:00
< div className = 'notification__message' >
2023-10-25 02:45:08 +09:00
< Icon id = 'pencil' icon = { EditIcon } / >
2022-02-12 06:20:19 +09:00
< span title = { notification . get ( 'created_at' ) } >
< FormattedMessage id = 'notification.update' defaultMessage = '{name} edited a post' values = { { name : link } } / >
< / span >
< / div >
< StatusContainer
id = { notification . get ( 'status' ) }
account = { notification . get ( 'account' ) }
2023-01-23 21:21:50 +09:00
contextType = 'notifications'
2022-02-12 06:20:19 +09:00
muted
withDismiss
hidden = { this . props . hidden }
getScrollPosition = { this . props . getScrollPosition }
updateScrollBottom = { this . props . updateScrollBottom }
cachedMediaWidth = { this . props . cachedMediaWidth }
cacheMediaWidth = { this . props . cacheMediaWidth }
/ >
< / div >
< / HotKeys >
) ;
}
2019-10-27 20:46:35 +09:00
renderPoll ( notification , account ) {
2023-01-23 21:21:50 +09:00
const { intl , unread , status } = this . props ;
2019-10-27 20:46:35 +09:00
const ownPoll = me === account . get ( 'id' ) ;
const message = ownPoll ? intl . formatMessage ( messages . ownPoll ) : intl . formatMessage ( messages . poll ) ;
2019-03-11 08:49:31 +09:00
2023-01-23 21:21:50 +09:00
if ( ! status ) {
return null ;
}
2019-03-11 08:49:31 +09:00
return (
< HotKeys handlers = { this . getHandlers ( ) } >
2023-04-04 23:33:44 +09:00
< div className = { classNames ( 'notification notification-poll focusable' , { unread } ) } tabIndex = { 0 } aria - label = { notificationForScreenReader ( intl , message , notification . get ( 'created_at' ) ) } >
2019-03-11 08:49:31 +09:00
< div className = 'notification__message' >
2023-10-25 02:45:08 +09:00
< Icon id = 'tasks' icon = { InsertChartIcon } / >
2019-03-11 08:49:31 +09:00
< span title = { notification . get ( 'created_at' ) } >
2019-10-27 20:46:35 +09:00
{ ownPoll ? (
2019-11-04 21:03:29 +09:00
< FormattedMessage id = 'notification.own_poll' defaultMessage = 'Your poll has ended' / >
2019-10-27 20:46:35 +09:00
) : (
2024-07-18 23:36:09 +09:00
< FormattedMessage id = 'notification.poll' defaultMessage = 'A poll you voted in has ended' / >
2019-10-27 20:46:35 +09:00
) }
2019-03-11 08:49:31 +09:00
< / span >
< / div >
< StatusContainer
id = { notification . get ( 'status' ) }
2019-10-27 20:46:35 +09:00
account = { account }
2023-01-23 21:21:50 +09:00
contextType = 'notifications'
2019-03-11 08:49:31 +09:00
muted
withDismiss
hidden = { this . props . hidden }
getScrollPosition = { this . props . getScrollPosition }
updateScrollBottom = { this . props . updateScrollBottom }
cachedMediaWidth = { this . props . cachedMediaWidth }
cacheMediaWidth = { this . props . cacheMediaWidth }
/ >
< / div >
< / HotKeys >
) ;
}
2024-03-21 00:37:21 +09:00
renderRelationshipsSevered ( notification ) {
2024-03-25 22:27:38 +09:00
const { intl , unread , hidden } = this . props ;
const event = notification . get ( 'event' ) ;
2024-03-21 00:37:21 +09:00
2024-03-25 22:27:38 +09:00
if ( ! event ) {
2024-03-21 00:37:21 +09:00
return null ;
}
return (
< HotKeys handlers = { this . getHandlers ( ) } >
2024-03-25 22:27:38 +09:00
< div className = { classNames ( 'notification notification-severed-relationships focusable' , { unread } ) } tabIndex = { 0 } aria - label = { notificationForScreenReader ( intl , intl . formatMessage ( messages . relationshipsSevered , { name : notification . getIn ( [ 'event' , 'target_name' ] ) } ) , notification . get ( 'created_at' ) ) } >
< RelationshipsSeveranceEvent
type = { event . get ( 'type' ) }
target = { event . get ( 'target_name' ) }
followersCount = { event . get ( 'followers_count' ) }
followingCount = { event . get ( 'following_count' ) }
hidden = { hidden }
/ >
2024-03-21 00:37:21 +09:00
< / div >
< / HotKeys >
) ;
}
2024-04-26 02:26:05 +09:00
renderModerationWarning ( notification ) {
const { intl , unread , hidden } = this . props ;
const warning = notification . get ( 'moderation_warning' ) ;
if ( ! warning ) {
return null ;
}
return (
< HotKeys handlers = { this . getHandlers ( ) } >
< div className = { classNames ( 'notification notification-moderation-warning focusable' , { unread } ) } tabIndex = { 0 } aria - label = { notificationForScreenReader ( intl , intl . formatMessage ( messages . moderationWarning ) , notification . get ( 'created_at' ) ) } >
< ModerationWarning
action = { warning . get ( 'action' ) }
id = { warning . get ( 'id' ) }
hidden = { hidden }
/ >
< / div >
< / HotKeys >
) ;
}
2022-02-24 00:45:22 +09:00
renderAdminSignUp ( notification , account , link ) {
const { intl , unread } = this . props ;
return (
< HotKeys handlers = { this . getHandlers ( ) } >
2023-04-04 23:33:44 +09:00
< div className = { classNames ( 'notification notification-admin-sign-up focusable' , { unread } ) } tabIndex = { 0 } aria - label = { notificationForScreenReader ( intl , intl . formatMessage ( messages . adminSignUp , { name : account . get ( 'acct' ) } ) , notification . get ( 'created_at' ) ) } >
2022-02-24 00:45:22 +09:00
< div className = 'notification__message' >
2023-10-25 02:45:08 +09:00
< Icon id = 'user-plus' icon = { PersonAddIcon } / >
2022-02-24 00:45:22 +09:00
< span title = { notification . get ( 'created_at' ) } >
< FormattedMessage id = 'notification.admin.sign_up' defaultMessage = '{name} signed up' values = { { name : link } } / >
< / span >
< / div >
< AccountContainer id = { account . get ( 'id' ) } hidden = { this . props . hidden } / >
< / div >
< / HotKeys >
) ;
}
2022-06-27 16:30:15 +09:00
renderAdminReport ( notification , account , link ) {
const { intl , unread , report } = this . props ;
2022-10-27 09:10:54 +09:00
if ( ! report ) {
return null ;
}
2022-06-27 16:30:15 +09:00
const targetAccount = report . get ( 'target_account' ) ;
const targetDisplayNameHtml = { _ _html : targetAccount . get ( 'display_name_html' ) } ;
2024-07-12 04:42:58 +09:00
const targetLink = < bdi > < Link className = 'notification__display-name' title = { targetAccount . get ( 'acct' ) } data - hover - card - account = { targetAccount . get ( 'id' ) } to = { ` /@ ${ targetAccount . get ( 'acct' ) } ` } dangerouslySetInnerHTML = { targetDisplayNameHtml } / > < / bdi > ;
2022-06-27 16:30:15 +09:00
return (
< HotKeys handlers = { this . getHandlers ( ) } >
2023-04-04 23:33:44 +09:00
< div className = { classNames ( 'notification notification-admin-report focusable' , { unread } ) } tabIndex = { 0 } aria - label = { notificationForScreenReader ( intl , intl . formatMessage ( messages . adminReport , { name : account . get ( 'acct' ) , target : notification . getIn ( [ 'report' , 'target_account' , 'acct' ] ) } ) , notification . get ( 'created_at' ) ) } >
2022-06-27 16:30:15 +09:00
< div className = 'notification__message' >
2023-10-25 02:45:08 +09:00
< Icon id = 'flag' icon = { FlagIcon } / >
2022-06-27 16:30:15 +09:00
< span title = { notification . get ( 'created_at' ) } >
< FormattedMessage id = 'notification.admin.report' defaultMessage = '{name} reported {target}' values = { { name : link , target : targetLink } } / >
< / span >
< / div >
< Report account = { account } report = { notification . get ( 'report' ) } hidden = { this . props . hidden } / >
< / div >
< / HotKeys >
) ;
}
2017-06-11 17:42:42 +09:00
render ( ) {
2016-11-21 03:39:18 +09:00
const { notification } = this . props ;
const account = notification . get ( 'account' ) ;
2017-08-08 03:32:03 +09:00
const displayNameHtml = { _ _html : account . get ( 'display_name_html' ) } ;
2024-07-12 04:42:58 +09:00
const link = < bdi > < Link className = 'notification__display-name' href = { ` /@ ${ account . get ( 'acct' ) } ` } title = { account . get ( 'acct' ) } data - hover - card - account = { account . get ( 'id' ) } to = { ` /@ ${ account . get ( 'acct' ) } ` } dangerouslySetInnerHTML = { displayNameHtml } / > < / bdi > ;
2016-11-21 03:39:18 +09:00
switch ( notification . get ( 'type' ) ) {
2017-04-12 05:53:58 +09:00
case 'follow' :
2018-08-27 00:53:26 +09:00
return this . renderFollow ( notification , account , link ) ;
2019-12-02 01:25:29 +09:00
case 'follow_request' :
return this . renderFollowRequest ( notification , account , link ) ;
2017-04-12 05:53:58 +09:00
case 'mention' :
return this . renderMention ( notification ) ;
case 'favourite' :
return this . renderFavourite ( notification , link ) ;
case 'reblog' :
return this . renderReblog ( notification , link ) ;
2020-09-19 00:26:45 +09:00
case 'status' :
return this . renderStatus ( notification , link ) ;
2022-02-12 06:20:19 +09:00
case 'update' :
return this . renderUpdate ( notification , link ) ;
2019-03-11 08:49:31 +09:00
case 'poll' :
2019-10-27 20:46:35 +09:00
return this . renderPoll ( notification , account ) ;
2024-03-21 00:37:21 +09:00
case 'severed_relationships' :
return this . renderRelationshipsSevered ( notification ) ;
2024-04-26 02:26:05 +09:00
case 'moderation_warning' :
return this . renderModerationWarning ( notification ) ;
2022-02-24 00:45:22 +09:00
case 'admin.sign_up' :
return this . renderAdminSignUp ( notification , account , link ) ;
2022-06-27 16:30:15 +09:00
case 'admin.report' :
return this . renderAdminReport ( notification , account , link ) ;
2016-11-21 03:39:18 +09:00
}
2017-06-11 17:42:42 +09:00
return null ;
2016-11-21 03:39:18 +09:00
}
2017-04-22 03:05:35 +09:00
}
2023-03-24 11:17:53 +09:00
2023-10-20 02:44:55 +09:00
export default withRouter ( injectIntl ( Notification ) ) ;