From 44a7d87cb1f5df953b6c14c16c59e2e4ead1bcb9 Mon Sep 17 00:00:00 2001 From: Renaud Chaput Date: Mon, 20 Feb 2023 03:20:59 +0100 Subject: Rename JSX files with proper `.jsx` extension (#23733) --- .../notifications/components/notification.jsx | 449 +++++++++++++++++++++ 1 file changed, 449 insertions(+) create mode 100644 app/javascript/mastodon/features/notifications/components/notification.jsx (limited to 'app/javascript/mastodon/features/notifications/components/notification.jsx') diff --git a/app/javascript/mastodon/features/notifications/components/notification.jsx b/app/javascript/mastodon/features/notifications/components/notification.jsx new file mode 100644 index 000000000..9e2517f08 --- /dev/null +++ b/app/javascript/mastodon/features/notifications/components/notification.jsx @@ -0,0 +1,449 @@ +import React from 'react'; +import ImmutablePropTypes from 'react-immutable-proptypes'; +import { injectIntl, FormattedMessage, defineMessages } from 'react-intl'; +import { HotKeys } from 'react-hotkeys'; +import PropTypes from 'prop-types'; +import ImmutablePureComponent from 'react-immutable-pure-component'; +import { me } from 'mastodon/initial_state'; +import StatusContainer from 'mastodon/containers/status_container'; +import AccountContainer from 'mastodon/containers/account_container'; +import Report from './report'; +import FollowRequestContainer from '../containers/follow_request_container'; +import Icon from 'mastodon/components/icon'; +import { Link } from 'react-router-dom'; +import classNames from 'classnames'; + +const messages = defineMessages({ + favourite: { id: 'notification.favourite', defaultMessage: '{name} favourited your status' }, + follow: { id: 'notification.follow', defaultMessage: '{name} followed you' }, + ownPoll: { id: 'notification.own_poll', defaultMessage: 'Your poll has ended' }, + poll: { id: 'notification.poll', defaultMessage: 'A poll you have voted in has ended' }, + reblog: { id: 'notification.reblog', defaultMessage: '{name} boosted your status' }, + status: { id: 'notification.status', defaultMessage: '{name} just posted' }, + update: { id: 'notification.update', defaultMessage: '{name} edited a post' }, + adminSignUp: { id: 'notification.admin.sign_up', defaultMessage: '{name} signed up' }, + adminReport: { id: 'notification.admin.report', defaultMessage: '{name} reported {target}' }, +}); + +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(', '); +}; + +export default @injectIntl +class Notification extends ImmutablePureComponent { + + static contextTypes = { + router: PropTypes.object, + }; + + static propTypes = { + notification: ImmutablePropTypes.map.isRequired, + hidden: PropTypes.bool, + onMoveUp: PropTypes.func.isRequired, + onMoveDown: PropTypes.func.isRequired, + onMention: PropTypes.func.isRequired, + onFavourite: PropTypes.func.isRequired, + onReblog: PropTypes.func.isRequired, + onToggleHidden: PropTypes.func.isRequired, + status: ImmutablePropTypes.map, + intl: PropTypes.object.isRequired, + getScrollPosition: PropTypes.func, + updateScrollBottom: PropTypes.func, + cacheMediaWidth: PropTypes.func, + cachedMediaWidth: PropTypes.number, + unread: PropTypes.bool, + }; + + handleMoveUp = () => { + const { notification, onMoveUp } = this.props; + onMoveUp(notification.get('id')); + }; + + handleMoveDown = () => { + const { notification, onMoveDown } = this.props; + onMoveDown(notification.get('id')); + }; + + handleOpen = () => { + const { notification } = this.props; + + if (notification.get('status')) { + this.context.router.history.push(`/@${notification.getIn(['status', 'account', 'acct'])}/${notification.get('status')}`); + } else { + this.handleOpenProfile(); + } + }; + + handleOpenProfile = () => { + const { notification } = this.props; + this.context.router.history.push(`/@${notification.getIn(['account', 'acct'])}`); + }; + + handleMention = e => { + e.preventDefault(); + + const { notification, onMention } = this.props; + onMention(notification.get('account'), this.context.router.history); + }; + + handleHotkeyFavourite = () => { + const { status } = this.props; + if (status) this.props.onFavourite(status); + }; + + handleHotkeyBoost = e => { + const { status } = this.props; + if (status) this.props.onReblog(status, e); + }; + + handleHotkeyToggleHidden = () => { + const { status } = this.props; + if (status) this.props.onToggleHidden(status); + }; + + getHandlers () { + return { + reply: this.handleMention, + favourite: this.handleHotkeyFavourite, + boost: this.handleHotkeyBoost, + mention: this.handleMention, + open: this.handleOpen, + openProfile: this.handleOpenProfile, + moveUp: this.handleMoveUp, + moveDown: this.handleMoveDown, + toggleHidden: this.handleHotkeyToggleHidden, + }; + } + + renderFollow (notification, account, link) { + const { intl, unread } = this.props; + + return ( + +
+
+
+ +
+ + + + +
+ +
+ + ); + } + + renderFollowRequest (notification, account, link) { + const { intl, unread } = this.props; + + return ( + +
+
+
+ +
+ + + + +
+ +
+ + ); + } + + renderMention (notification) { + return ( +