Leatherface/mastodon
1
0
Fork 0
mirror of https://github.com/glitch-soc/mastodon.git synced 2025-12-17 09:48:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactor notifications code to reduce differences with upstream (#2692)

Browse Source 
* Merge back `Follow` notification component

* Merge back part of `FollowRequestContainer` notification container

* Reduce differences with upstream in the `mention` case

* Reduce differences with upstream in the `favourite` case

* Reduce differences with upstream in the `reblog` case

* Reduce differences with upstream in the `status` case

* Reduce differences with upstream in the `update` case

* Reduce differences with upstream in the `poll` case

* Merge back `AdminSignup` notification component

* Merge back `AdminReport` notification container
This commit is contained in:
Claire
2024-04-06 19:34:30 +02:00
committed by GitHub
parent 8a64406d34
commit 9451997fa8
7 changed files with 433 additions and 642 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
app/javascript/flavours/glitch/features/notifications/components/follow_request.jsx
View File

@@ -1,26 +1,16 @@
import PropTypes from 'prop-types';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import classNames from 'classnames';
import { withRouter } from 'react-router-dom';
import { defineMessages, injectIntl } from 'react-intl';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { HotKeys } from 'react-hotkeys';
import CheckIcon from '@/material-icons/400-24px/check.svg?react';
import CloseIcon from '@/material-icons/400-24px/close.svg?react';
import PersonIcon from '@/material-icons/400-24px/person-fill.svg?react';
import { Avatar } from 'flavours/glitch/components/avatar';
import { DisplayName } from 'flavours/glitch/components/display_name';
import { Icon } from 'flavours/glitch/components/icon';
import { IconButton } from 'flavours/glitch/components/icon_button';
import { Permalink } from 'flavours/glitch/components/permalink';
import { WithRouterPropTypes } from 'flavours/glitch/utils/react_router';
import NotificationOverlayContainer from '../containers/overlay_container';
const messages = defineMessages({
authorize: { id: 'follow_request.authorize', defaultMessage: 'Authorize' },
@@ -34,50 +24,10 @@ class FollowRequest extends ImmutablePureComponent {
onAuthorize: PropTypes.func.isRequired,
onReject: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
notification: ImmutablePropTypes.map.isRequired,
unread: PropTypes.bool,
...WithRouterPropTypes,
};
handleMoveUp = () => {
const { notification, onMoveUp } = this.props;
onMoveUp(notification.get('id'));
};
handleMoveDown = () => {
const { notification, onMoveDown } = this.props;
onMoveDown(notification.get('id'));
};
handleOpen = () => {
this.handleOpenProfile();
};
handleOpenProfile = () => {
const { history, notification } = this.props;
history.push(`/@${notification.getIn(['account', 'acct'])}`);
};
handleMention = e => {
e.preventDefault();
const { history, notification, onMention } = this.props;
onMention(notification.get('account'), history);
};
getHandlers () {
return {
moveUp: this.handleMoveUp,
moveDown: this.handleMoveDown,
open: this.handleOpen,
openProfile: this.handleOpenProfile,
mention: this.handleMention,
reply: this.handleMention,
};
}
render () {
const { intl, hidden, account, onAuthorize, onReject, notification, unread } = this.props;
const { intl, hidden, account, onAuthorize, onReject } = this.props;
if (!account) {
return <div />;
@@ -92,51 +42,23 @@ class FollowRequest extends ImmutablePureComponent {
);
}
// Links to the display name.
const displayName = account.get('display_name_html') || account.get('username');
const link = (
<bdi><Permalink
className='notification__display-name'
href={account.get('url')}
title={account.get('acct')}
to={`/@${account.get('acct')}`}
dangerouslySetInnerHTML={{ __html: displayName }}
/></bdi>
);
return (
<HotKeys handlers={this.getHandlers()}>
<div className={classNames('notification notification-follow-request focusable', { unread })} tabIndex={0}>
<div className='notification__message'>
<Icon id='user' icon={PersonIcon} />
<div className='account'>
<div className='account__wrapper'>
<Permalink key={account.get('id')} className='account__display-name' title={account.get('acct')} href={account.get('url')} to={`/@${account.get('acct')}`}>
<div className='account__avatar-wrapper'><Avatar account={account} size={36} /></div>
<DisplayName account={account} />
</Permalink>
<FormattedMessage
id='notification.follow_request'
defaultMessage='{name} has requested to follow you'
values={{ name: link }}
/>
<div className='account__relationship'>
<IconButton title={intl.formatMessage(messages.authorize)} icon='check' iconComponent={CheckIcon} onClick={onAuthorize} />
<IconButton title={intl.formatMessage(messages.reject)} icon='times' iconComponent={CloseIcon} onClick={onReject} />
</div>
<div className='account'>
<div className='account__wrapper'>
<Permalink key={account.get('id')} className='account__display-name' title={account.get('acct')} href={account.get('url')} to={`/@${account.get('acct')}`}>
<div className='account__avatar-wrapper'><Avatar account={account} size={36} /></div>
<DisplayName account={account} />
</Permalink>
<div className='account__relationship'>
<IconButton title={intl.formatMessage(messages.authorize)} icon='check' iconComponent={CheckIcon} onClick={onAuthorize} />
<IconButton title={intl.formatMessage(messages.reject)} icon='times' iconComponent={CloseIcon} onClick={onReject} />
</div>
</div>
</div>
<NotificationOverlayContainer notification={notification} />
</div>
</HotKeys>
</div>
);
}
}
export default withRouter(injectIntl(FollowRequest));
export default injectIntl(FollowRequest);