dispatch(importFetchedStatus(notification.status));
}
+ if (notification.report) {
+ dispatch(importFetchedAccount(notification.report.target_account));
+ }
+
dispatch({
type: NOTIFICATIONS_UPDATE,
notification,
'status',
'update',
'admin.sign_up',
+ 'admin.report',
]);
return allTypes.filterNot(item => item === filter).toJS();
dispatch(importFetchedAccounts(response.data.map(item => item.account)));
dispatch(importFetchedStatuses(response.data.map(item => item.status).filter(status => !!status)));
+ dispatch(importFetchedAccounts(response.data.filter(item => item.report).map(item => item.report.target_account)));
dispatch(expandNotificationsSuccess(response.data, next ? next.uri : null, isLoadingMore, isLoadingRecent, isLoadingRecent && preferPendingItems));
fetchRelatedRelationships(dispatch, response.data);
);
if (href) {
- contents = (
- <a href={href} target='_blank' rel='noopener noreferrer'>
+ return (
+ <a
+ href={href}
+ aria-label={title}
+ title={title}
+ target='_blank'
+ rel='noopener noreferrer'
+ className={classes}
+ style={style}
+ >
{contents}
</a>
);
--- /dev/null
+// Package imports.
+import React from 'react';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import PropTypes from 'prop-types';
+import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import { HotKeys } from 'react-hotkeys';
+import classNames from 'classnames';
+
+// Our imports.
+import Permalink from 'flavours/glitch/components/permalink';
+import AccountContainer from 'flavours/glitch/containers/account_container';
+import NotificationOverlayContainer from '../containers/overlay_container';
+import Icon from 'flavours/glitch/components/icon';
+import Report from './report';
+
+const messages = defineMessages({
+ adminReport: { id: 'notification.admin.report', defaultMessage: '{name} reported {target}' },
+});
+
+export default class AdminReport extends ImmutablePureComponent {
+
+ static propTypes = {
+ hidden: PropTypes.bool,
+ id: PropTypes.string.isRequired,
+ account: ImmutablePropTypes.map.isRequired,
+ notification: ImmutablePropTypes.map.isRequired,
+ unread: PropTypes.bool,
+ report: ImmutablePropTypes.map.isRequired,
+ };
+
+ 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 { 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);
+ }
+
+ getHandlers () {
+ return {
+ moveUp: this.handleMoveUp,
+ moveDown: this.handleMoveDown,
+ open: this.handleOpen,
+ openProfile: this.handleOpenProfile,
+ mention: this.handleMention,
+ reply: this.handleMention,
+ };
+ }
+
+ render () {
+ const { intl, account, notification, unread, report } = this.props;
+
+ // 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>
+ );
+
+ const targetAccount = report.get('target_account');
+ const targetDisplayNameHtml = { __html: targetAccount.get('display_name_html') };
+ const targetLink = <bdi><Permalink className='notification__display-name' href={targetAccount.get('url')} title={targetAccount.get('acct')} to={`/@${targetAccount.get('acct')}`} dangerouslySetInnerHTML={targetDisplayNameHtml} /></bdi>;
+
+ return (
+ <HotKeys handlers={this.getHandlers()}>
+ <div className={classNames('notification notification-admin-report focusable', { unread })} tabIndex='0'>
+ <div className='notification__message'>
+ <div className='notification__favourite-icon-wrapper'>
+ <Icon id='flag' fixedWidth />
+ </div>
+
+ <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} />
+ <NotificationOverlayContainer notification={notification} />
+ </div>
+ </HotKeys>
+ );
+ }
+
+}
</div>
</div>
)}
+
+ {isStaff && (
+ <div role='group' aria-labelledby='notifications-admin-report'>
+ <span id='notifications-status' className='column-settings__section'><FormattedMessage id='notifications.column_settings.admin.report' defaultMessage='New reports:' /></span>
+
+ <div className='column-settings__pillbar'>
+ <PillBarButton disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'admin.report']} onChange={onChange} label={alertStr} />
+ {showPushSettings && <PillBarButton prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'admin.report']} onChange={this.onPushChange} label={pushStr} />}
+ <PillBarButton prefix='notifications' settings={settings} settingPath={['shows', 'admin.report']} onChange={onChange} label={showStr} />
+ <PillBarButton prefix='notifications' settings={settings} settingPath={['sounds', 'admin.report']} onChange={onChange} label={soundStr} />
+ </div>
+ </div>
+ )}
</div>
);
}
import NotificationFollow from './follow';
import NotificationFollowRequestContainer from '../containers/follow_request_container';
import NotificationAdminSignup from './admin_signup';
+import NotificationAdminReportContainer from '../containers/admin_report_container';
export default class Notification extends ImmutablePureComponent {
unread={this.props.unread}
/>
);
+ case 'admin.report':
+ return (
+ <NotificationAdminReportContainer
+ hidden={hidden}
+ id={notification.get('id')}
+ account={notification.get('account')}
+ notification={notification}
+ onMoveDown={onMoveDown}
+ onMoveUp={onMoveUp}
+ onMention={onMention}
+ unread={this.props.unread}
+ />
+ );
case 'mention':
return (
<StatusContainer
--- /dev/null
+import React, { Fragment } from 'react';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import PropTypes from 'prop-types';
+import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import AvatarOverlay from 'flavours/glitch/components/avatar_overlay';
+import RelativeTimestamp from 'flavours/glitch/components/relative_timestamp';
+
+const messages = defineMessages({
+ openReport: { id: 'report_notification.open', defaultMessage: 'Open report' },
+ other: { id: 'report_notification.categories.other', defaultMessage: 'Other' },
+ spam: { id: 'report_notification.categories.spam', defaultMessage: 'Spam' },
+ violation: { id: 'report_notification.categories.violation', defaultMessage: 'Rule violation' },
+});
+
+export default @injectIntl
+class Report extends ImmutablePureComponent {
+
+ static propTypes = {
+ account: ImmutablePropTypes.map.isRequired,
+ report: ImmutablePropTypes.map.isRequired,
+ hidden: PropTypes.bool,
+ intl: PropTypes.object.isRequired,
+ };
+
+ render () {
+ const { intl, hidden, report, account } = this.props;
+
+ if (!report) {
+ return null;
+ }
+
+ if (hidden) {
+ return (
+ <Fragment>
+ {report.get('id')}
+ </Fragment>
+ );
+ }
+
+ return (
+ <div className='notification__report'>
+ <div className='notification__report__avatar'>
+ <AvatarOverlay account={report.get('target_account')} friend={account} />
+ </div>
+
+ <div className='notification__report__details'>
+ <div>
+ <RelativeTimestamp timestamp={report.get('created_at')} short={false} /> ยท <FormattedMessage id='report_notification.attached_statuses' defaultMessage='{count, plural, one {{count} post} other {{count} posts}} attached' values={{ count: report.get('status_ids').size }} />
+ <br />
+ <strong>{intl.formatMessage(messages[report.get('category')])}</strong>
+ </div>
+
+ <div className='notification__report__actions'>
+ <a href={`/admin/reports/${report.get('id')}`} className='button' target='_blank' rel='noopener noreferrer'>{intl.formatMessage(messages.openReport)}</a>
+ </div>
+ </div>
+ </div>
+ );
+ }
+
+}
--- /dev/null
+import { connect } from 'react-redux';
+import { makeGetReport } from 'flavours/glitch/selectors';
+import AdminReport from '../components/admin_report';
+
+const mapStateToProps = (state, { notification }) => {
+ const getReport = makeGetReport();
+
+ return {
+ report: notification.get('report') ? getReport(state, notification.get('report'), notification.getIn(['report', 'target_account', 'id'])) : null,
+ };
+};
+
+export default connect(mapStateToProps)(AdminReport);
} from 'flavours/glitch/actions/markers';
import { DOMAIN_BLOCK_SUCCESS } from 'flavours/glitch/actions/domain_blocks';
import { TIMELINE_DELETE, TIMELINE_DISCONNECT } from 'flavours/glitch/actions/timelines';
-import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
+import { fromJS, Map as ImmutableMap, List as ImmutableList } from 'immutable';
import compareId from 'flavours/glitch/util/compare_id';
const initialState = ImmutableMap({
account: notification.account.id,
markedForDelete: state.get('markNewForDelete'),
status: notification.status ? notification.status.id : null,
+ report: notification.report ? fromJS(notification.report) : null,
});
const normalizeNotification = (state, notification, usePendingItems) => {
status: false,
update: false,
'admin.sign_up': false,
+ 'admin.report': false,
}),
quickFilter: ImmutableMap({
status: true,
update: true,
'admin.sign_up': true,
+ 'admin.report': true,
}),
sounds: ImmutableMap({
status: true,
update: true,
'admin.sign_up': true,
+ 'admin.report': true,
}),
}),
return arr;
});
-export const makeGetNotification = () => {
- return createSelector([
- (_, base) => base,
- (state, _, accountId) => state.getIn(['accounts', accountId]),
- ], (base, account) => {
- return base.set('account', account);
- });
-};
+export const makeGetNotification = () => createSelector([
+ (_, base) => base,
+ (state, _, accountId) => state.getIn(['accounts', accountId]),
+], (base, account) => base.set('account', account));
+
+export const makeGetReport = () => createSelector([
+ (_, base) => base,
+ (state, _, targetAccountId) => state.getIn(['accounts', targetAccountId]),
+], (base, targetAccount) => base.set('target_account', targetAccount));
export const getAccountGallery = createSelector([
(state, id) => state.getIn(['timelines', `account:${id}:media`, 'items'], ImmutableList()),
position: relative;
@include avatar-size(48px);
+ position: relative;
+
&-base {
@include avatar-radius();
@include avatar-size(36px);
margin-right: 10px;
}
+.notification__report {
+ padding: 8px 10px;
+ padding-left: 68px;
+ position: relative;
+ border-bottom: 1px solid lighten($ui-base-color, 8%);
+ min-height: 54px;
+
+ &__details {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ color: $darker-text-color;
+ font-size: 15px;
+ line-height: 22px;
+
+ strong {
+ font-weight: 500;
+ }
+ }
+
+ &__avatar {
+ position: absolute;
+ left: 10px;
+ top: 10px;
+ }
+}
+
.notification__message {
margin-left: 42px;
padding: 8px 0 0 26px;
padding-top: 15px;
}
+ .notification__report {
+ padding: 15px 15px 15px (48px + 15px * 2);
+ min-height: 48px + 2px;
+
+ &__avatar {
+ left: 15px;
+ top: 17px;
+ }
+ }
+
.status {
padding: 15px;
min-height: 48px + 2px;
cat aescling's git repositories / mastodon.git / commitdiff