[build] upgrade eslint to 9.37.0 (#88)
Co-authored-by: tobi <tobi.smethurst@protonmail.com> Reviewed-on: https://codeberg.org/superseriousbusiness/masto-fe-standalone/pulls/88 Co-authored-by: Zoë Bijl <moiety@noreply.codeberg.org> Co-committed-by: Zoë Bijl <moiety@noreply.codeberg.org>
This commit is contained in:
Zoë Bijl
@@ -1,9 +1,9 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import { PureComponent } from 'react';
|
||||
import PropTypes from "prop-types";
|
||||
import { PureComponent } from "react";
|
||||
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
import { FormattedMessage } from "react-intl";
|
||||
|
||||
import { Icon } from 'mastodon/components/icon';
|
||||
import { Icon } from "mastodon/components/icon";
|
||||
|
||||
export default class ClearColumnButton extends PureComponent {
|
||||
|
||||
|
||||
@@ -1,15 +1,15 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import { PureComponent } from 'react';
|
||||
import PropTypes from "prop-types";
|
||||
import { PureComponent } from "react";
|
||||
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
import { FormattedMessage } from "react-intl";
|
||||
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import ImmutablePropTypes from "react-immutable-proptypes";
|
||||
|
||||
import { PERMISSION_MANAGE_USERS, PERMISSION_MANAGE_REPORTS } from 'mastodon/permissions';
|
||||
import { PERMISSION_MANAGE_USERS, PERMISSION_MANAGE_REPORTS } from "mastodon/permissions";
|
||||
|
||||
import ClearColumnButton from './clear_column_button';
|
||||
import GrantPermissionButton from './grant_permission_button';
|
||||
import SettingToggle from './setting_toggle';
|
||||
import ClearColumnButton from "./clear_column_button";
|
||||
import GrantPermissionButton from "./grant_permission_button";
|
||||
import SettingToggle from "./setting_toggle";
|
||||
|
||||
export default class ColumnSettings extends PureComponent {
|
||||
|
||||
@@ -29,7 +29,7 @@ export default class ColumnSettings extends PureComponent {
|
||||
};
|
||||
|
||||
onPushChange = (path, checked) => {
|
||||
this.props.onChange(['push', ...path], checked);
|
||||
this.props.onChange(["push", ...path], checked);
|
||||
};
|
||||
|
||||
render () {
|
||||
@@ -42,18 +42,18 @@ export default class ColumnSettings extends PureComponent {
|
||||
const showStr = <FormattedMessage id='notifications.column_settings.show' defaultMessage='Show in column' />;
|
||||
const soundStr = <FormattedMessage id='notifications.column_settings.sound' defaultMessage='Play sound' />;
|
||||
|
||||
const showPushSettings = pushSettings.get('browserSupport') && pushSettings.get('isSubscribed');
|
||||
const showPushSettings = pushSettings.get("browserSupport") && pushSettings.get("isSubscribed");
|
||||
const pushStr = showPushSettings && <FormattedMessage id='notifications.column_settings.push' defaultMessage='Push notifications' />;
|
||||
|
||||
return (
|
||||
<div>
|
||||
{alertsEnabled && browserSupport && browserPermission === 'denied' && (
|
||||
{alertsEnabled && browserSupport && browserPermission === "denied" && (
|
||||
<div className='column-settings__row column-settings__row--with-margin'>
|
||||
<span className='warning-hint'><FormattedMessage id='notifications.permission_denied' defaultMessage='Desktop notifications are unavailable due to previously denied browser permissions request' /></span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{alertsEnabled && browserSupport && browserPermission === 'default' && (
|
||||
{alertsEnabled && browserSupport && browserPermission === "default" && (
|
||||
<div className='column-settings__row column-settings__row--with-margin'>
|
||||
<span className='warning-hint'>
|
||||
<FormattedMessage id='notifications.permission_required' defaultMessage='Desktop notifications are unavailable because the required permission has not been granted.' /> <GrantPermissionButton onClick={onRequestNotificationPermission} />
|
||||
@@ -71,7 +71,7 @@ export default class ColumnSettings extends PureComponent {
|
||||
</span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle id='unread-notification-markers' prefix='notifications' settings={settings} settingPath={['showUnread']} onChange={onChange} label={unreadMarkersShowStr} />
|
||||
<SettingToggle id='unread-notification-markers' prefix='notifications' settings={settings} settingPath={["showUnread"]} onChange={onChange} label={unreadMarkersShowStr} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -81,8 +81,8 @@ export default class ColumnSettings extends PureComponent {
|
||||
</span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle id='show-filter-bar' prefix='notifications' settings={settings} settingPath={['quickFilter', 'show']} onChange={onChange} label={filterBarShowStr} />
|
||||
<SettingToggle id='show-filter-bar' prefix='notifications' settings={settings} settingPath={['quickFilter', 'advanced']} onChange={onChange} label={filterAdvancedStr} />
|
||||
<SettingToggle id='show-filter-bar' prefix='notifications' settings={settings} settingPath={["quickFilter", "show"]} onChange={onChange} label={filterBarShowStr} />
|
||||
<SettingToggle id='show-filter-bar' prefix='notifications' settings={settings} settingPath={["quickFilter", "advanced"]} onChange={onChange} label={filterAdvancedStr} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -90,10 +90,10 @@ export default class ColumnSettings extends PureComponent {
|
||||
<span id='notifications-follow' className='column-settings__section'><FormattedMessage id='notifications.column_settings.follow' defaultMessage='New followers:' /></span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'follow']} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'follow']} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'follow']} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'follow']} onChange={onChange} label={soundStr} />
|
||||
<SettingToggle disabled={browserPermission === "denied"} prefix='notifications_desktop' settings={settings} settingPath={["alerts", "follow"]} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={["alerts", "follow"]} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["shows", "follow"]} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["sounds", "follow"]} onChange={onChange} label={soundStr} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -101,10 +101,10 @@ export default class ColumnSettings extends PureComponent {
|
||||
<span id='notifications-follow-request' className='column-settings__section'><FormattedMessage id='notifications.column_settings.follow_request' defaultMessage='New follow requests:' /></span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'follow_request']} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'follow_request']} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'follow_request']} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'follow_request']} onChange={onChange} label={soundStr} />
|
||||
<SettingToggle disabled={browserPermission === "denied"} prefix='notifications_desktop' settings={settings} settingPath={["alerts", "follow_request"]} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={["alerts", "follow_request"]} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["shows", "follow_request"]} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["sounds", "follow_request"]} onChange={onChange} label={soundStr} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -112,10 +112,10 @@ export default class ColumnSettings extends PureComponent {
|
||||
<span id='notifications-favourite' className='column-settings__section'><FormattedMessage id='notifications.column_settings.favourite' defaultMessage='Favorites:' /></span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'favourite']} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'favourite']} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'favourite']} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'favourite']} onChange={onChange} label={soundStr} />
|
||||
<SettingToggle disabled={browserPermission === "denied"} prefix='notifications_desktop' settings={settings} settingPath={["alerts", "favourite"]} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={["alerts", "favourite"]} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["shows", "favourite"]} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["sounds", "favourite"]} onChange={onChange} label={soundStr} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -123,10 +123,10 @@ export default class ColumnSettings extends PureComponent {
|
||||
<span id='notifications-mention' className='column-settings__section'><FormattedMessage id='notifications.column_settings.mention' defaultMessage='Mentions:' /></span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'mention']} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'mention']} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'mention']} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'mention']} onChange={onChange} label={soundStr} />
|
||||
<SettingToggle disabled={browserPermission === "denied"} prefix='notifications_desktop' settings={settings} settingPath={["alerts", "mention"]} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={["alerts", "mention"]} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["shows", "mention"]} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["sounds", "mention"]} onChange={onChange} label={soundStr} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -134,10 +134,10 @@ export default class ColumnSettings extends PureComponent {
|
||||
<span id='notifications-reblog' className='column-settings__section'><FormattedMessage id='notifications.column_settings.reblog' defaultMessage='Boosts:' /></span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'reblog']} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'reblog']} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'reblog']} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'reblog']} onChange={onChange} label={soundStr} />
|
||||
<SettingToggle disabled={browserPermission === "denied"} prefix='notifications_desktop' settings={settings} settingPath={["alerts", "reblog"]} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={["alerts", "reblog"]} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["shows", "reblog"]} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["sounds", "reblog"]} onChange={onChange} label={soundStr} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -145,10 +145,10 @@ export default class ColumnSettings extends PureComponent {
|
||||
<span id='notifications-poll' className='column-settings__section'><FormattedMessage id='notifications.column_settings.poll' defaultMessage='Poll results:' /></span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'poll']} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'poll']} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'poll']} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'poll']} onChange={onChange} label={soundStr} />
|
||||
<SettingToggle disabled={browserPermission === "denied"} prefix='notifications_desktop' settings={settings} settingPath={["alerts", "poll"]} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={["alerts", "poll"]} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["shows", "poll"]} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["sounds", "poll"]} onChange={onChange} label={soundStr} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -156,10 +156,10 @@ export default class ColumnSettings extends PureComponent {
|
||||
<span id='notifications-status' className='column-settings__section'><FormattedMessage id='notifications.column_settings.status' defaultMessage='New posts:' /></span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'status']} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'status']} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'status']} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'status']} onChange={onChange} label={soundStr} />
|
||||
<SettingToggle disabled={browserPermission === "denied"} prefix='notifications_desktop' settings={settings} settingPath={["alerts", "status"]} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={["alerts", "status"]} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["shows", "status"]} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["sounds", "status"]} onChange={onChange} label={soundStr} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -167,10 +167,10 @@ export default class ColumnSettings extends PureComponent {
|
||||
<span id='notifications-update' className='column-settings__section'><FormattedMessage id='notifications.column_settings.update' defaultMessage='Edits:' /></span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'update']} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'update']} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'update']} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'update']} onChange={onChange} label={soundStr} />
|
||||
<SettingToggle disabled={browserPermission === "denied"} prefix='notifications_desktop' settings={settings} settingPath={["alerts", "update"]} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={["alerts", "update"]} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["shows", "update"]} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["sounds", "update"]} onChange={onChange} label={soundStr} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -179,10 +179,10 @@ export default class ColumnSettings extends PureComponent {
|
||||
<span id='notifications-status' className='column-settings__section'><FormattedMessage id='notifications.column_settings.admin.sign_up' defaultMessage='New sign-ups:' /></span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'admin.sign_up']} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'admin.sign_up']} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'admin.sign_up']} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'admin.sign_up']} onChange={onChange} label={soundStr} />
|
||||
<SettingToggle disabled={browserPermission === "denied"} prefix='notifications_desktop' settings={settings} settingPath={["alerts", "admin.sign_up"]} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={["alerts", "admin.sign_up"]} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["shows", "admin.sign_up"]} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["sounds", "admin.sign_up"]} onChange={onChange} label={soundStr} />
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
@@ -192,10 +192,10 @@ export default class ColumnSettings extends PureComponent {
|
||||
<span id='notifications-status' className='column-settings__section'><FormattedMessage id='notifications.column_settings.admin.report' defaultMessage='New reports:' /></span>
|
||||
|
||||
<div className='column-settings__row'>
|
||||
<SettingToggle disabled={browserPermission === 'denied'} prefix='notifications_desktop' settings={settings} settingPath={['alerts', 'admin.report']} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={['alerts', 'admin.report']} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['shows', 'admin.report']} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'admin.report']} onChange={onChange} label={soundStr} />
|
||||
<SettingToggle disabled={browserPermission === "denied"} prefix='notifications_desktop' settings={settings} settingPath={["alerts", "admin.report"]} onChange={onChange} label={alertStr} />
|
||||
{showPushSettings && <SettingToggle prefix='notifications_push' settings={pushSettings} settingPath={["alerts", "admin.report"]} onChange={this.onPushChange} label={pushStr} />}
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["shows", "admin.report"]} onChange={onChange} label={showStr} />
|
||||
<SettingToggle prefix='notifications' settings={settings} settingPath={["sounds", "admin.report"]} onChange={onChange} label={soundStr} />
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -1,17 +1,17 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import { PureComponent } from 'react';
|
||||
import PropTypes from "prop-types";
|
||||
import { PureComponent } from "react";
|
||||
|
||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||
import { defineMessages, injectIntl, FormattedMessage } from "react-intl";
|
||||
|
||||
import { Icon } from 'mastodon/components/icon';
|
||||
import { Icon } from "mastodon/components/icon";
|
||||
|
||||
const tooltips = defineMessages({
|
||||
mentions: { id: 'notifications.filter.mentions', defaultMessage: 'Mentions' },
|
||||
favourites: { id: 'notifications.filter.favourites', defaultMessage: 'Favorites' },
|
||||
boosts: { id: 'notifications.filter.boosts', defaultMessage: 'Boosts' },
|
||||
polls: { id: 'notifications.filter.polls', defaultMessage: 'Poll results' },
|
||||
follows: { id: 'notifications.filter.follows', defaultMessage: 'Follows' },
|
||||
statuses: { id: 'notifications.filter.statuses', defaultMessage: 'Updates from people you follow' },
|
||||
mentions: { id: "notifications.filter.mentions", defaultMessage: "Mentions" },
|
||||
favourites: { id: "notifications.filter.favourites", defaultMessage: "Favorites" },
|
||||
boosts: { id: "notifications.filter.boosts", defaultMessage: "Boosts" },
|
||||
polls: { id: "notifications.filter.polls", defaultMessage: "Poll results" },
|
||||
follows: { id: "notifications.filter.follows", defaultMessage: "Follows" },
|
||||
statuses: { id: "notifications.filter.statuses", defaultMessage: "Updates from people you follow" },
|
||||
});
|
||||
|
||||
class FilterBar extends PureComponent {
|
||||
@@ -32,8 +32,8 @@ class FilterBar extends PureComponent {
|
||||
const renderedElement = !advancedMode ? (
|
||||
<div className='notification__filter-bar'>
|
||||
<button
|
||||
className={selectedFilter === 'all' ? 'active' : ''}
|
||||
onClick={this.onClick('all')}
|
||||
className={selectedFilter === "all" ? "active" : ""}
|
||||
onClick={this.onClick("all")}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='notifications.filter.all'
|
||||
@@ -41,8 +41,8 @@ class FilterBar extends PureComponent {
|
||||
/>
|
||||
</button>
|
||||
<button
|
||||
className={selectedFilter === 'mention' ? 'active' : ''}
|
||||
onClick={this.onClick('mention')}
|
||||
className={selectedFilter === "mention" ? "active" : ""}
|
||||
onClick={this.onClick("mention")}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='notifications.filter.mentions'
|
||||
@@ -53,8 +53,8 @@ class FilterBar extends PureComponent {
|
||||
) : (
|
||||
<div className='notification__filter-bar'>
|
||||
<button
|
||||
className={selectedFilter === 'all' ? 'active' : ''}
|
||||
onClick={this.onClick('all')}
|
||||
className={selectedFilter === "all" ? "active" : ""}
|
||||
onClick={this.onClick("all")}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='notifications.filter.all'
|
||||
@@ -62,43 +62,43 @@ class FilterBar extends PureComponent {
|
||||
/>
|
||||
</button>
|
||||
<button
|
||||
className={selectedFilter === 'mention' ? 'active' : ''}
|
||||
onClick={this.onClick('mention')}
|
||||
className={selectedFilter === "mention" ? "active" : ""}
|
||||
onClick={this.onClick("mention")}
|
||||
title={intl.formatMessage(tooltips.mentions)}
|
||||
>
|
||||
<Icon id='reply-all' fixedWidth />
|
||||
</button>
|
||||
<button
|
||||
className={selectedFilter === 'favourite' ? 'active' : ''}
|
||||
onClick={this.onClick('favourite')}
|
||||
className={selectedFilter === "favourite" ? "active" : ""}
|
||||
onClick={this.onClick("favourite")}
|
||||
title={intl.formatMessage(tooltips.favourites)}
|
||||
>
|
||||
<Icon id='star' fixedWidth />
|
||||
</button>
|
||||
<button
|
||||
className={selectedFilter === 'reblog' ? 'active' : ''}
|
||||
onClick={this.onClick('reblog')}
|
||||
className={selectedFilter === "reblog" ? "active" : ""}
|
||||
onClick={this.onClick("reblog")}
|
||||
title={intl.formatMessage(tooltips.boosts)}
|
||||
>
|
||||
<Icon id='retweet' fixedWidth />
|
||||
</button>
|
||||
<button
|
||||
className={selectedFilter === 'poll' ? 'active' : ''}
|
||||
onClick={this.onClick('poll')}
|
||||
className={selectedFilter === "poll" ? "active" : ""}
|
||||
onClick={this.onClick("poll")}
|
||||
title={intl.formatMessage(tooltips.polls)}
|
||||
>
|
||||
<Icon id='tasks' fixedWidth />
|
||||
</button>
|
||||
<button
|
||||
className={selectedFilter === 'status' ? 'active' : ''}
|
||||
onClick={this.onClick('status')}
|
||||
className={selectedFilter === "status" ? "active" : ""}
|
||||
onClick={this.onClick("status")}
|
||||
title={intl.formatMessage(tooltips.statuses)}
|
||||
>
|
||||
<Icon id='home' fixedWidth />
|
||||
</button>
|
||||
<button
|
||||
className={selectedFilter === 'follow' ? 'active' : ''}
|
||||
onClick={this.onClick('follow')}
|
||||
className={selectedFilter === "follow" ? "active" : ""}
|
||||
onClick={this.onClick("follow")}
|
||||
title={intl.formatMessage(tooltips.follows)}
|
||||
>
|
||||
<Icon id='user-plus' fixedWidth />
|
||||
|
||||
@@ -1,19 +1,19 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import PropTypes from "prop-types";
|
||||
|
||||
import { defineMessages, injectIntl } from 'react-intl';
|
||||
import { defineMessages, injectIntl } from "react-intl";
|
||||
|
||||
import { Link } from 'react-router-dom';
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||
import ImmutablePropTypes from "react-immutable-proptypes";
|
||||
import ImmutablePureComponent from "react-immutable-pure-component";
|
||||
|
||||
import { Avatar } from 'mastodon/components/avatar';
|
||||
import { DisplayName } from 'mastodon/components/display_name';
|
||||
import { IconButton } from 'mastodon/components/icon_button';
|
||||
import { Avatar } from "mastodon/components/avatar";
|
||||
import { DisplayName } from "mastodon/components/display_name";
|
||||
import { IconButton } from "mastodon/components/icon_button";
|
||||
|
||||
const messages = defineMessages({
|
||||
authorize: { id: 'follow_request.authorize', defaultMessage: 'Authorize' },
|
||||
reject: { id: 'follow_request.reject', defaultMessage: 'Reject' },
|
||||
authorize: { id: "follow_request.authorize", defaultMessage: "Authorize" },
|
||||
reject: { id: "follow_request.reject", defaultMessage: "Reject" },
|
||||
});
|
||||
|
||||
class FollowRequest extends ImmutablePureComponent {
|
||||
@@ -35,8 +35,8 @@ class FollowRequest extends ImmutablePureComponent {
|
||||
if (hidden) {
|
||||
return (
|
||||
<>
|
||||
{account.get('display_name')}
|
||||
{account.get('username')}
|
||||
{account.get("display_name")}
|
||||
{account.get("username")}
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -44,7 +44,7 @@ class FollowRequest extends ImmutablePureComponent {
|
||||
return (
|
||||
<div className='account'>
|
||||
<div className='account__wrapper'>
|
||||
<Link key={account.get('id')} className='account__display-name' title={account.get('acct')} to={`/@${account.get('acct')}`}>
|
||||
<Link key={account.get("id")} className='account__display-name' title={account.get("acct")} to={`/@${account.get("acct")}`}>
|
||||
<div className='account__avatar-wrapper'><Avatar account={account} size={36} /></div>
|
||||
<DisplayName account={account} />
|
||||
</Link>
|
||||
|
||||
+3
-3
@@ -1,7 +1,7 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import { PureComponent } from 'react';
|
||||
import PropTypes from "prop-types";
|
||||
import { PureComponent } from "react";
|
||||
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
import { FormattedMessage } from "react-intl";
|
||||
|
||||
export default class GrantPermissionButton extends PureComponent {
|
||||
|
||||
|
||||
@@ -1,42 +1,42 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import PropTypes from "prop-types";
|
||||
|
||||
import { injectIntl, FormattedMessage, defineMessages } from 'react-intl';
|
||||
import { injectIntl, FormattedMessage, defineMessages } from "react-intl";
|
||||
|
||||
import classNames from 'classnames';
|
||||
import { Link } from 'react-router-dom';
|
||||
import classNames from "classnames";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||
import ImmutablePropTypes from "react-immutable-proptypes";
|
||||
import ImmutablePureComponent from "react-immutable-pure-component";
|
||||
|
||||
import { HotKeys } from 'react-hotkeys';
|
||||
import { HotKeys } from "react-hotkeys";
|
||||
|
||||
import { Icon } from 'mastodon/components/icon';
|
||||
import AccountContainer from 'mastodon/containers/account_container';
|
||||
import StatusContainer from 'mastodon/containers/status_container';
|
||||
import { me } from 'mastodon/initial_state';
|
||||
import { Icon } from "mastodon/components/icon";
|
||||
import AccountContainer from "mastodon/containers/account_container";
|
||||
import StatusContainer from "mastodon/containers/status_container";
|
||||
import { me } from "mastodon/initial_state";
|
||||
|
||||
import FollowRequestContainer from '../containers/follow_request_container';
|
||||
import FollowRequestContainer from "../containers/follow_request_container";
|
||||
|
||||
import Report from './report';
|
||||
import Report from "./report";
|
||||
|
||||
const messages = defineMessages({
|
||||
favourite: { id: 'notification.favourite', defaultMessage: '{name} favorited 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}' },
|
||||
favourite: { id: "notification.favourite", defaultMessage: "{name} favorited 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' }));
|
||||
output.push(intl.formatDate(timestamp, { hour: "2-digit", minute: "2-digit", month: "short", day: "numeric" }));
|
||||
|
||||
return output.join(', ');
|
||||
return output.join(", ");
|
||||
};
|
||||
|
||||
class Notification extends ImmutablePureComponent {
|
||||
@@ -65,19 +65,19 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
handleMoveUp = () => {
|
||||
const { notification, onMoveUp } = this.props;
|
||||
onMoveUp(notification.get('id'));
|
||||
onMoveUp(notification.get("id"));
|
||||
};
|
||||
|
||||
handleMoveDown = () => {
|
||||
const { notification, onMoveDown } = this.props;
|
||||
onMoveDown(notification.get('id'));
|
||||
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')}`);
|
||||
if (notification.get("status")) {
|
||||
this.context.router.history.push(`/@${notification.getIn(["status", "account", "acct"])}/${notification.get("status")}`);
|
||||
} else {
|
||||
this.handleOpenProfile();
|
||||
}
|
||||
@@ -85,29 +85,35 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
handleOpenProfile = () => {
|
||||
const { notification } = this.props;
|
||||
this.context.router.history.push(`/@${notification.getIn(['account', 'acct'])}`);
|
||||
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);
|
||||
onMention(notification.get("account"), this.context.router.history);
|
||||
};
|
||||
|
||||
handleHotkeyFavourite = () => {
|
||||
const { status } = this.props;
|
||||
if (status) this.props.onFavourite(status);
|
||||
if (status) {
|
||||
this.props.onFavourite(status);
|
||||
}
|
||||
};
|
||||
|
||||
handleHotkeyBoost = e => {
|
||||
const { status } = this.props;
|
||||
if (status) this.props.onReblog(status, e);
|
||||
if (status) {
|
||||
this.props.onReblog(status, e);
|
||||
}
|
||||
};
|
||||
|
||||
handleHotkeyToggleHidden = () => {
|
||||
const { status } = this.props;
|
||||
if (status) this.props.onToggleHidden(status);
|
||||
if (status) {
|
||||
this.props.onToggleHidden(status);
|
||||
}
|
||||
};
|
||||
|
||||
getHandlers () {
|
||||
@@ -129,18 +135,18 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
return (
|
||||
<HotKeys handlers={this.getHandlers()}>
|
||||
<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'))}>
|
||||
<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"))}>
|
||||
<div className='notification__message'>
|
||||
<div className='notification__favourite-icon-wrapper'>
|
||||
<Icon id='user-plus' fixedWidth />
|
||||
</div>
|
||||
|
||||
<span title={notification.get('created_at')}>
|
||||
<span title={notification.get("created_at")}>
|
||||
<FormattedMessage id='notification.follow' defaultMessage='{name} followed you' values={{ name: link }} />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<AccountContainer id={account.get('id')} hidden={this.props.hidden} />
|
||||
<AccountContainer id={account.get("id")} hidden={this.props.hidden} />
|
||||
</div>
|
||||
</HotKeys>
|
||||
);
|
||||
@@ -151,18 +157,18 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
return (
|
||||
<HotKeys handlers={this.getHandlers()}>
|
||||
<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'))}>
|
||||
<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"))}>
|
||||
<div className='notification__message'>
|
||||
<div className='notification__favourite-icon-wrapper'>
|
||||
<Icon id='user' fixedWidth />
|
||||
</div>
|
||||
|
||||
<span title={notification.get('created_at')}>
|
||||
<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} />
|
||||
<FollowRequestContainer id={account.get("id")} withNote={false} hidden={this.props.hidden} />
|
||||
</div>
|
||||
</HotKeys>
|
||||
);
|
||||
@@ -171,7 +177,7 @@ class Notification extends ImmutablePureComponent {
|
||||
renderMention (notification) {
|
||||
return (
|
||||
<StatusContainer
|
||||
id={notification.get('status')}
|
||||
id={notification.get("status")}
|
||||
withDismiss
|
||||
hidden={this.props.hidden}
|
||||
onMoveDown={this.handleMoveDown}
|
||||
@@ -191,20 +197,20 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
return (
|
||||
<HotKeys handlers={this.getHandlers()}>
|
||||
<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'))}>
|
||||
<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"))}>
|
||||
<div className='notification__message'>
|
||||
<div className='notification__favourite-icon-wrapper'>
|
||||
<Icon id='star' className='star-icon' fixedWidth />
|
||||
</div>
|
||||
|
||||
<span title={notification.get('created_at')}>
|
||||
<span title={notification.get("created_at")}>
|
||||
<FormattedMessage id='notification.favourite' defaultMessage='{name} favorited your status' values={{ name: link }} />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<StatusContainer
|
||||
id={notification.get('status')}
|
||||
account={notification.get('account')}
|
||||
id={notification.get("status")}
|
||||
account={notification.get("account")}
|
||||
muted
|
||||
withDismiss
|
||||
hidden={!!this.props.hidden}
|
||||
@@ -223,20 +229,20 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
return (
|
||||
<HotKeys handlers={this.getHandlers()}>
|
||||
<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'))}>
|
||||
<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"))}>
|
||||
<div className='notification__message'>
|
||||
<div className='notification__favourite-icon-wrapper'>
|
||||
<Icon id='retweet' fixedWidth />
|
||||
</div>
|
||||
|
||||
<span title={notification.get('created_at')}>
|
||||
<span title={notification.get("created_at")}>
|
||||
<FormattedMessage id='notification.reblog' defaultMessage='{name} boosted your status' values={{ name: link }} />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<StatusContainer
|
||||
id={notification.get('status')}
|
||||
account={notification.get('account')}
|
||||
id={notification.get("status")}
|
||||
account={notification.get("account")}
|
||||
muted
|
||||
withDismiss
|
||||
hidden={this.props.hidden}
|
||||
@@ -259,20 +265,20 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
return (
|
||||
<HotKeys handlers={this.getHandlers()}>
|
||||
<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'))}>
|
||||
<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"))}>
|
||||
<div className='notification__message'>
|
||||
<div className='notification__favourite-icon-wrapper'>
|
||||
<Icon id='home' fixedWidth />
|
||||
</div>
|
||||
|
||||
<span title={notification.get('created_at')}>
|
||||
<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')}
|
||||
id={notification.get("status")}
|
||||
account={notification.get("account")}
|
||||
contextType='notifications'
|
||||
muted
|
||||
withDismiss
|
||||
@@ -296,20 +302,20 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
return (
|
||||
<HotKeys handlers={this.getHandlers()}>
|
||||
<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'))}>
|
||||
<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"))}>
|
||||
<div className='notification__message'>
|
||||
<div className='notification__favourite-icon-wrapper'>
|
||||
<Icon id='pencil' fixedWidth />
|
||||
</div>
|
||||
|
||||
<span title={notification.get('created_at')}>
|
||||
<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')}
|
||||
id={notification.get("status")}
|
||||
account={notification.get("account")}
|
||||
contextType='notifications'
|
||||
muted
|
||||
withDismiss
|
||||
@@ -326,7 +332,7 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
renderPoll (notification, account) {
|
||||
const { intl, unread, status } = this.props;
|
||||
const ownPoll = me === account.get('id');
|
||||
const ownPoll = me === account.get("id");
|
||||
const message = ownPoll ? intl.formatMessage(messages.ownPoll) : intl.formatMessage(messages.poll);
|
||||
|
||||
if (!status) {
|
||||
@@ -335,13 +341,13 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
return (
|
||||
<HotKeys handlers={this.getHandlers()}>
|
||||
<div className={classNames('notification notification-poll focusable', { unread })} tabIndex={0} aria-label={notificationForScreenReader(intl, message, notification.get('created_at'))}>
|
||||
<div className={classNames("notification notification-poll focusable", { unread })} tabIndex={0} aria-label={notificationForScreenReader(intl, message, notification.get("created_at"))}>
|
||||
<div className='notification__message'>
|
||||
<div className='notification__favourite-icon-wrapper'>
|
||||
<Icon id='tasks' fixedWidth />
|
||||
</div>
|
||||
|
||||
<span title={notification.get('created_at')}>
|
||||
<span title={notification.get("created_at")}>
|
||||
{ownPoll ? (
|
||||
<FormattedMessage id='notification.own_poll' defaultMessage='Your poll has ended' />
|
||||
) : (
|
||||
@@ -351,7 +357,7 @@ class Notification extends ImmutablePureComponent {
|
||||
</div>
|
||||
|
||||
<StatusContainer
|
||||
id={notification.get('status')}
|
||||
id={notification.get("status")}
|
||||
account={account}
|
||||
contextType='notifications'
|
||||
muted
|
||||
@@ -372,18 +378,18 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
return (
|
||||
<HotKeys handlers={this.getHandlers()}>
|
||||
<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'))}>
|
||||
<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"))}>
|
||||
<div className='notification__message'>
|
||||
<div className='notification__favourite-icon-wrapper'>
|
||||
<Icon id='user-plus' fixedWidth />
|
||||
</div>
|
||||
|
||||
<span title={notification.get('created_at')}>
|
||||
<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} />
|
||||
<AccountContainer id={account.get("id")} hidden={this.props.hidden} />
|
||||
</div>
|
||||
</HotKeys>
|
||||
);
|
||||
@@ -396,24 +402,24 @@ class Notification extends ImmutablePureComponent {
|
||||
return null;
|
||||
}
|
||||
|
||||
const targetAccount = report.get('target_account');
|
||||
const targetDisplayNameHtml = { __html: targetAccount.get('display_name_html') };
|
||||
const targetLink = <bdi><Link className='notification__display-name' title={targetAccount.get('acct')} to={`/@${targetAccount.get('acct')}`} dangerouslySetInnerHTML={targetDisplayNameHtml} /></bdi>;
|
||||
const targetAccount = report.get("target_account");
|
||||
const targetDisplayNameHtml = { __html: targetAccount.get("display_name_html") };
|
||||
const targetLink = <bdi><Link className='notification__display-name' 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} aria-label={notificationForScreenReader(intl, intl.formatMessage(messages.adminReport, { name: account.get('acct'), target: notification.getIn(['report', 'target_account', 'acct']) }), notification.get('created_at'))}>
|
||||
<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"))}>
|
||||
<div className='notification__message'>
|
||||
<div className='notification__favourite-icon-wrapper'>
|
||||
<Icon id='flag' fixedWidth />
|
||||
</div>
|
||||
|
||||
<span title={notification.get('created_at')}>
|
||||
<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} />
|
||||
<Report account={account} report={notification.get("report")} hidden={this.props.hidden} />
|
||||
</div>
|
||||
</HotKeys>
|
||||
);
|
||||
@@ -421,31 +427,31 @@ class Notification extends ImmutablePureComponent {
|
||||
|
||||
render () {
|
||||
const { notification } = this.props;
|
||||
const account = notification.get('account');
|
||||
const displayNameHtml = { __html: account.get('display_name_html') };
|
||||
const link = <bdi><Link className='notification__display-name' href={`/@${account.get('acct')}`} title={account.get('acct')} to={`/@${account.get('acct')}`} dangerouslySetInnerHTML={displayNameHtml} /></bdi>;
|
||||
const account = notification.get("account");
|
||||
const displayNameHtml = { __html: account.get("display_name_html") };
|
||||
const link = <bdi><Link className='notification__display-name' href={`/@${account.get("acct")}`} title={account.get("acct")} to={`/@${account.get("acct")}`} dangerouslySetInnerHTML={displayNameHtml} /></bdi>;
|
||||
|
||||
switch(notification.get('type')) {
|
||||
case 'follow':
|
||||
return this.renderFollow(notification, account, link);
|
||||
case 'follow_request':
|
||||
return this.renderFollowRequest(notification, account, link);
|
||||
case 'mention':
|
||||
return this.renderMention(notification);
|
||||
case 'favourite':
|
||||
return this.renderFavourite(notification, link);
|
||||
case 'reblog':
|
||||
return this.renderReblog(notification, link);
|
||||
case 'status':
|
||||
return this.renderStatus(notification, link);
|
||||
case 'update':
|
||||
return this.renderUpdate(notification, link);
|
||||
case 'poll':
|
||||
return this.renderPoll(notification, account);
|
||||
case 'admin.sign_up':
|
||||
return this.renderAdminSignUp(notification, account, link);
|
||||
case 'admin.report':
|
||||
return this.renderAdminReport(notification, account, link);
|
||||
switch(notification.get("type")) {
|
||||
case "follow":
|
||||
return this.renderFollow(notification, account, link);
|
||||
case "follow_request":
|
||||
return this.renderFollowRequest(notification, account, link);
|
||||
case "mention":
|
||||
return this.renderMention(notification);
|
||||
case "favourite":
|
||||
return this.renderFavourite(notification, link);
|
||||
case "reblog":
|
||||
return this.renderReblog(notification, link);
|
||||
case "status":
|
||||
return this.renderStatus(notification, link);
|
||||
case "update":
|
||||
return this.renderUpdate(notification, link);
|
||||
case "poll":
|
||||
return this.renderPoll(notification, account);
|
||||
case "admin.sign_up":
|
||||
return this.renderAdminSignUp(notification, account, link);
|
||||
case "admin.report":
|
||||
return this.renderAdminReport(notification, account, link);
|
||||
}
|
||||
|
||||
return null;
|
||||
|
||||
+11
-11
@@ -1,18 +1,18 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import { PureComponent } from 'react';
|
||||
import PropTypes from "prop-types";
|
||||
import { PureComponent } from "react";
|
||||
|
||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||
import { defineMessages, injectIntl, FormattedMessage } from "react-intl";
|
||||
|
||||
import { connect } from 'react-redux';
|
||||
import { connect } from "react-redux";
|
||||
|
||||
import { requestBrowserPermission } from 'mastodon/actions/notifications';
|
||||
import { changeSetting } from 'mastodon/actions/settings';
|
||||
import Button from 'mastodon/components/button';
|
||||
import { Icon } from 'mastodon/components/icon';
|
||||
import { IconButton } from 'mastodon/components/icon_button';
|
||||
import { requestBrowserPermission } from "mastodon/actions/notifications";
|
||||
import { changeSetting } from "mastodon/actions/settings";
|
||||
import Button from "mastodon/components/button";
|
||||
import { Icon } from "mastodon/components/icon";
|
||||
import { IconButton } from "mastodon/components/icon_button";
|
||||
|
||||
const messages = defineMessages({
|
||||
close: { id: 'lightbox.close', defaultMessage: 'Close' },
|
||||
close: { id: "lightbox.close", defaultMessage: "Close" },
|
||||
});
|
||||
|
||||
class NotificationsPermissionBanner extends PureComponent {
|
||||
@@ -27,7 +27,7 @@ class NotificationsPermissionBanner extends PureComponent {
|
||||
};
|
||||
|
||||
handleClose = () => {
|
||||
this.props.dispatch(changeSetting(['notifications', 'dismissPermissionBanner'], true));
|
||||
this.props.dispatch(changeSetting(["notifications", "dismissPermissionBanner"], true));
|
||||
};
|
||||
|
||||
render () {
|
||||
|
||||
@@ -1,20 +1,20 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import PropTypes from "prop-types";
|
||||
|
||||
import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';
|
||||
import { defineMessages, FormattedMessage, injectIntl } from "react-intl";
|
||||
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||
import ImmutablePropTypes from "react-immutable-proptypes";
|
||||
import ImmutablePureComponent from "react-immutable-pure-component";
|
||||
|
||||
import { AvatarOverlay } from 'mastodon/components/avatar_overlay';
|
||||
import { RelativeTimestamp } from 'mastodon/components/relative_timestamp';
|
||||
import { AvatarOverlay } from "mastodon/components/avatar_overlay";
|
||||
import { RelativeTimestamp } from "mastodon/components/relative_timestamp";
|
||||
|
||||
// This needs to be kept in sync with app/models/report.rb
|
||||
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' },
|
||||
legal: { id: 'report_notification.categories.legal', defaultMessage: 'Legal' },
|
||||
violation: { id: 'report_notification.categories.violation', defaultMessage: 'Rule violation' },
|
||||
openReport: { id: "report_notification.open", defaultMessage: "Open report" },
|
||||
other: { id: "report_notification.categories.other", defaultMessage: "Other" },
|
||||
spam: { id: "report_notification.categories.spam", defaultMessage: "Spam" },
|
||||
legal: { id: "report_notification.categories.legal", defaultMessage: "Legal" },
|
||||
violation: { id: "report_notification.categories.violation", defaultMessage: "Rule violation" },
|
||||
});
|
||||
|
||||
class Report extends ImmutablePureComponent {
|
||||
@@ -36,7 +36,7 @@ class Report extends ImmutablePureComponent {
|
||||
if (hidden) {
|
||||
return (
|
||||
<>
|
||||
{report.get('id')}
|
||||
{report.get("id")}
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -44,18 +44,18 @@ class Report extends ImmutablePureComponent {
|
||||
return (
|
||||
<div className='notification__report'>
|
||||
<div className='notification__report__avatar'>
|
||||
<AvatarOverlay account={report.get('target_account')} friend={account} />
|
||||
<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 {# post} other {# posts}} attached' values={{ count: report.get('status_ids').size }} />
|
||||
<RelativeTimestamp timestamp={report.get("created_at")} short={false} /> · <FormattedMessage id='report_notification.attached_statuses' defaultMessage='{count, plural, one {# post} other {# posts}} attached' values={{ count: report.get("status_ids").size }} />
|
||||
<br />
|
||||
<strong>{intl.formatMessage(messages[report.get('category')])}</strong>
|
||||
<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>
|
||||
<a href={`/admin/reports/${report.get("id")}`} className='button' target='_blank' rel='noopener noreferrer'>{intl.formatMessage(messages.openReport)}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import { PureComponent } from 'react';
|
||||
import PropTypes from "prop-types";
|
||||
import { PureComponent } from "react";
|
||||
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import ImmutablePropTypes from "react-immutable-proptypes";
|
||||
|
||||
import Toggle from 'react-toggle';
|
||||
import Toggle from "react-toggle";
|
||||
|
||||
export default class SettingToggle extends PureComponent {
|
||||
|
||||
@@ -23,7 +23,7 @@ export default class SettingToggle extends PureComponent {
|
||||
|
||||
render () {
|
||||
const { prefix, settings, settingPath, label, defaultValue, disabled } = this.props;
|
||||
const id = ['setting-toggle', prefix, ...settingPath].filter(Boolean).join('-');
|
||||
const id = ["setting-toggle", prefix, ...settingPath].filter(Boolean).join("-");
|
||||
|
||||
return (
|
||||
<div className='setting-toggle'>
|
||||
|
||||
+29
-29
@@ -1,35 +1,35 @@
|
||||
import { defineMessages, injectIntl } from 'react-intl';
|
||||
import { defineMessages, injectIntl } from "react-intl";
|
||||
|
||||
import { connect } from 'react-redux';
|
||||
import { connect } from "react-redux";
|
||||
|
||||
import { showAlert } from '../../../actions/alerts';
|
||||
import { openModal } from '../../../actions/modal';
|
||||
import { setFilter, clearNotifications, requestBrowserPermission } from '../../../actions/notifications';
|
||||
import { changeAlerts as changePushNotifications } from '../../../actions/push_notifications';
|
||||
import { changeSetting } from '../../../actions/settings';
|
||||
import ColumnSettings from '../components/column_settings';
|
||||
import { showAlert } from "../../../actions/alerts";
|
||||
import { openModal } from "../../../actions/modal";
|
||||
import { setFilter, clearNotifications, requestBrowserPermission } from "../../../actions/notifications";
|
||||
import { changeAlerts as changePushNotifications } from "../../../actions/push_notifications";
|
||||
import { changeSetting } from "../../../actions/settings";
|
||||
import ColumnSettings from "../components/column_settings";
|
||||
|
||||
const messages = defineMessages({
|
||||
clearMessage: { id: 'notifications.clear_confirmation', defaultMessage: 'Are you sure you want to permanently clear all your notifications?' },
|
||||
clearConfirm: { id: 'notifications.clear', defaultMessage: 'Clear notifications' },
|
||||
permissionDenied: { id: 'notifications.permission_denied_alert', defaultMessage: 'Desktop notifications can\'t be enabled, as browser permission has been denied before' },
|
||||
clearMessage: { id: "notifications.clear_confirmation", defaultMessage: "Are you sure you want to permanently clear all your notifications?" },
|
||||
clearConfirm: { id: "notifications.clear", defaultMessage: "Clear notifications" },
|
||||
permissionDenied: { id: "notifications.permission_denied_alert", defaultMessage: "Desktop notifications can't be enabled, as browser permission has been denied before" },
|
||||
});
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
settings: state.getIn(['settings', 'notifications']),
|
||||
pushSettings: state.get('push_notifications'),
|
||||
alertsEnabled: state.getIn(['settings', 'notifications', 'alerts']).includes(true),
|
||||
browserSupport: state.getIn(['notifications', 'browserSupport']),
|
||||
browserPermission: state.getIn(['notifications', 'browserPermission']),
|
||||
settings: state.getIn(["settings", "notifications"]),
|
||||
pushSettings: state.get("push_notifications"),
|
||||
alertsEnabled: state.getIn(["settings", "notifications", "alerts"]).includes(true),
|
||||
browserSupport: state.getIn(["notifications", "browserSupport"]),
|
||||
browserPermission: state.getIn(["notifications", "browserPermission"]),
|
||||
});
|
||||
|
||||
const mapDispatchToProps = (dispatch, { intl }) => ({
|
||||
|
||||
onChange (path, checked) {
|
||||
if (path[0] === 'push') {
|
||||
if (checked && typeof window.Notification !== 'undefined' && Notification.permission !== 'granted') {
|
||||
if (path[0] === "push") {
|
||||
if (checked && typeof window.Notification !== "undefined" && Notification.permission !== "granted") {
|
||||
dispatch(requestBrowserPermission((permission) => {
|
||||
if (permission === 'granted') {
|
||||
if (permission === "granted") {
|
||||
dispatch(changePushNotifications(path.slice(1), checked));
|
||||
} else {
|
||||
dispatch(showAlert({ message: messages.permissionDenied }));
|
||||
@@ -38,29 +38,29 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
|
||||
} else {
|
||||
dispatch(changePushNotifications(path.slice(1), checked));
|
||||
}
|
||||
} else if (path[0] === 'quickFilter') {
|
||||
dispatch(changeSetting(['notifications', ...path], checked));
|
||||
dispatch(setFilter('all'));
|
||||
} else if (path[0] === 'alerts' && checked && typeof window.Notification !== 'undefined' && Notification.permission !== 'granted') {
|
||||
if (checked && typeof window.Notification !== 'undefined' && Notification.permission !== 'granted') {
|
||||
} else if (path[0] === "quickFilter") {
|
||||
dispatch(changeSetting(["notifications", ...path], checked));
|
||||
dispatch(setFilter("all"));
|
||||
} else if (path[0] === "alerts" && checked && typeof window.Notification !== "undefined" && Notification.permission !== "granted") {
|
||||
if (checked && typeof window.Notification !== "undefined" && Notification.permission !== "granted") {
|
||||
dispatch(requestBrowserPermission((permission) => {
|
||||
if (permission === 'granted') {
|
||||
dispatch(changeSetting(['notifications', ...path], checked));
|
||||
if (permission === "granted") {
|
||||
dispatch(changeSetting(["notifications", ...path], checked));
|
||||
} else {
|
||||
dispatch(showAlert({ message: messages.permissionDenied }));
|
||||
}
|
||||
}));
|
||||
} else {
|
||||
dispatch(changeSetting(['notifications', ...path], checked));
|
||||
dispatch(changeSetting(["notifications", ...path], checked));
|
||||
}
|
||||
} else {
|
||||
dispatch(changeSetting(['notifications', ...path], checked));
|
||||
dispatch(changeSetting(["notifications", ...path], checked));
|
||||
}
|
||||
},
|
||||
|
||||
onClear () {
|
||||
dispatch(openModal({
|
||||
modalType: 'CONFIRM',
|
||||
modalType: "CONFIRM",
|
||||
modalProps: {
|
||||
message: intl.formatMessage(messages.clearMessage),
|
||||
confirm: intl.formatMessage(messages.clearConfirm),
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
import { connect } from 'react-redux';
|
||||
import { connect } from "react-redux";
|
||||
|
||||
import { setFilter } from '../../../actions/notifications';
|
||||
import FilterBar from '../components/filter_bar';
|
||||
import { setFilter } from "../../../actions/notifications";
|
||||
import FilterBar from "../components/filter_bar";
|
||||
|
||||
const makeMapStateToProps = state => ({
|
||||
selectedFilter: state.getIn(['settings', 'notifications', 'quickFilter', 'active']),
|
||||
advancedMode: state.getIn(['settings', 'notifications', 'quickFilter', 'advanced']),
|
||||
selectedFilter: state.getIn(["settings", "notifications", "quickFilter", "active"]),
|
||||
advancedMode: state.getIn(["settings", "notifications", "quickFilter", "advanced"]),
|
||||
});
|
||||
|
||||
const mapDispatchToProps = (dispatch) => ({
|
||||
|
||||
+4
-4
@@ -1,9 +1,9 @@
|
||||
import { connect } from 'react-redux';
|
||||
import { connect } from "react-redux";
|
||||
|
||||
import { authorizeFollowRequest, rejectFollowRequest } from 'mastodon/actions/accounts';
|
||||
import { makeGetAccount } from 'mastodon/selectors';
|
||||
import { authorizeFollowRequest, rejectFollowRequest } from "mastodon/actions/accounts";
|
||||
import { makeGetAccount } from "mastodon/selectors";
|
||||
|
||||
import FollowRequest from '../components/follow_request';
|
||||
import FollowRequest from "../components/follow_request";
|
||||
|
||||
const makeMapStateToProps = () => {
|
||||
const getAccount = makeGetAccount();
|
||||
|
||||
+15
-15
@@ -1,20 +1,20 @@
|
||||
import { connect } from 'react-redux';
|
||||
import { connect } from "react-redux";
|
||||
|
||||
import { initBoostModal } from '../../../actions/boosts';
|
||||
import { mentionCompose } from '../../../actions/compose';
|
||||
import { initBoostModal } from "../../../actions/boosts";
|
||||
import { mentionCompose } from "../../../actions/compose";
|
||||
import {
|
||||
reblog,
|
||||
favourite,
|
||||
unreblog,
|
||||
unfavourite,
|
||||
} from '../../../actions/interactions';
|
||||
} from "../../../actions/interactions";
|
||||
import {
|
||||
hideStatus,
|
||||
revealStatus,
|
||||
} from '../../../actions/statuses';
|
||||
import { boostModal } from '../../../initial_state';
|
||||
import { makeGetNotification, makeGetStatus, makeGetReport } from '../../../selectors';
|
||||
import Notification from '../components/notification';
|
||||
} from "../../../actions/statuses";
|
||||
import { boostModal } from "../../../initial_state";
|
||||
import { makeGetNotification, makeGetStatus, makeGetReport } from "../../../selectors";
|
||||
import Notification from "../components/notification";
|
||||
|
||||
const makeMapStateToProps = () => {
|
||||
const getNotification = makeGetNotification();
|
||||
@@ -25,8 +25,8 @@ const makeMapStateToProps = () => {
|
||||
const notification = getNotification(state, props.notification, props.accountId);
|
||||
return {
|
||||
notification: notification,
|
||||
status: notification.get('status') ? getStatus(state, { id: notification.get('status'), contextType: 'notifications' }) : null,
|
||||
report: notification.get('report') ? getReport(state, notification.get('report'), notification.getIn(['report', 'target_account', 'id'])) : null,
|
||||
status: notification.get("status") ? getStatus(state, { id: notification.get("status"), contextType: "notifications" }) : null,
|
||||
report: notification.get("report") ? getReport(state, notification.get("report"), notification.getIn(["report", "target_account", "id"])) : null,
|
||||
};
|
||||
};
|
||||
|
||||
@@ -43,7 +43,7 @@ const mapDispatchToProps = dispatch => ({
|
||||
},
|
||||
|
||||
onReblog (status, e) {
|
||||
if (status.get('reblogged')) {
|
||||
if (status.get("reblogged")) {
|
||||
dispatch(unreblog(status));
|
||||
} else {
|
||||
if (e.shiftKey || !boostModal) {
|
||||
@@ -55,7 +55,7 @@ const mapDispatchToProps = dispatch => ({
|
||||
},
|
||||
|
||||
onFavourite (status) {
|
||||
if (status.get('favourited')) {
|
||||
if (status.get("favourited")) {
|
||||
dispatch(unfavourite(status));
|
||||
} else {
|
||||
dispatch(favourite(status));
|
||||
@@ -63,10 +63,10 @@ const mapDispatchToProps = dispatch => ({
|
||||
},
|
||||
|
||||
onToggleHidden (status) {
|
||||
if (status.get('hidden')) {
|
||||
dispatch(revealStatus(status.get('id')));
|
||||
if (status.get("hidden")) {
|
||||
dispatch(revealStatus(status.get("id")));
|
||||
} else {
|
||||
dispatch(hideStatus(status.get('id')));
|
||||
dispatch(hideStatus(status.get("id")));
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
@@ -1,23 +1,23 @@
|
||||
import PropTypes from 'prop-types';
|
||||
import { PureComponent } from 'react';
|
||||
import PropTypes from "prop-types";
|
||||
import { PureComponent } from "react";
|
||||
|
||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||
import { defineMessages, injectIntl, FormattedMessage } from "react-intl";
|
||||
|
||||
import { Helmet } from 'react-helmet';
|
||||
import { Helmet } from "react-helmet";
|
||||
|
||||
import { List as ImmutableList } from 'immutable';
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import { connect } from 'react-redux';
|
||||
import { createSelector } from 'reselect';
|
||||
import { List as ImmutableList } from "immutable";
|
||||
import ImmutablePropTypes from "react-immutable-proptypes";
|
||||
import { connect } from "react-redux";
|
||||
import { createSelector } from "reselect";
|
||||
|
||||
import { debounce } from 'lodash';
|
||||
import { debounce } from "lodash";
|
||||
|
||||
import { compareId } from 'mastodon/compare_id';
|
||||
import { Icon } from 'mastodon/components/icon';
|
||||
import { NotSignedInIndicator } from 'mastodon/components/not_signed_in_indicator';
|
||||
import { compareId } from "mastodon/compare_id";
|
||||
import { Icon } from "mastodon/components/icon";
|
||||
import { NotSignedInIndicator } from "mastodon/components/not_signed_in_indicator";
|
||||
|
||||
import { addColumn, removeColumn, moveColumn } from '../../actions/columns';
|
||||
import { submitMarkers } from '../../actions/markers';
|
||||
import { addColumn, removeColumn, moveColumn } from "../../actions/columns";
|
||||
import { submitMarkers } from "../../actions/markers";
|
||||
import {
|
||||
expandNotifications,
|
||||
scrollTopNotifications,
|
||||
@@ -25,53 +25,53 @@ import {
|
||||
mountNotifications,
|
||||
unmountNotifications,
|
||||
markNotificationsAsRead,
|
||||
} from '../../actions/notifications';
|
||||
import Column from '../../components/column';
|
||||
import ColumnHeader from '../../components/column_header';
|
||||
import { LoadGap } from '../../components/load_gap';
|
||||
import ScrollableList from '../../components/scrollable_list';
|
||||
} from "../../actions/notifications";
|
||||
import Column from "../../components/column";
|
||||
import ColumnHeader from "../../components/column_header";
|
||||
import { LoadGap } from "../../components/load_gap";
|
||||
import ScrollableList from "../../components/scrollable_list";
|
||||
|
||||
import NotificationsPermissionBanner from './components/notifications_permission_banner';
|
||||
import ColumnSettingsContainer from './containers/column_settings_container';
|
||||
import FilterBarContainer from './containers/filter_bar_container';
|
||||
import NotificationContainer from './containers/notification_container';
|
||||
import NotificationsPermissionBanner from "./components/notifications_permission_banner";
|
||||
import ColumnSettingsContainer from "./containers/column_settings_container";
|
||||
import FilterBarContainer from "./containers/filter_bar_container";
|
||||
import NotificationContainer from "./containers/notification_container";
|
||||
|
||||
const messages = defineMessages({
|
||||
title: { id: 'column.notifications', defaultMessage: 'Notifications' },
|
||||
markAsRead : { id: 'notifications.mark_as_read', defaultMessage: 'Mark every notification as read' },
|
||||
title: { id: "column.notifications", defaultMessage: "Notifications" },
|
||||
markAsRead : { id: "notifications.mark_as_read", defaultMessage: "Mark every notification as read" },
|
||||
});
|
||||
|
||||
const getExcludedTypes = createSelector([
|
||||
state => state.getIn(['settings', 'notifications', 'shows']),
|
||||
state => state.getIn(["settings", "notifications", "shows"]),
|
||||
], (shows) => {
|
||||
return ImmutableList(shows.filter(item => !item).keys());
|
||||
});
|
||||
|
||||
const getNotifications = createSelector([
|
||||
state => state.getIn(['settings', 'notifications', 'quickFilter', 'show']),
|
||||
state => state.getIn(['settings', 'notifications', 'quickFilter', 'active']),
|
||||
state => state.getIn(["settings", "notifications", "quickFilter", "show"]),
|
||||
state => state.getIn(["settings", "notifications", "quickFilter", "active"]),
|
||||
getExcludedTypes,
|
||||
state => state.getIn(['notifications', 'items']),
|
||||
state => state.getIn(["notifications", "items"]),
|
||||
], (showFilterBar, allowedType, excludedTypes, notifications) => {
|
||||
if (!showFilterBar || allowedType === 'all') {
|
||||
if (!showFilterBar || allowedType === "all") {
|
||||
// used if user changed the notification settings after loading the notifications from the server
|
||||
// otherwise a list of notifications will come pre-filtered from the backend
|
||||
// we need to turn it off for FilterBar in order not to block ourselves from seeing a specific category
|
||||
return notifications.filterNot(item => item !== null && excludedTypes.includes(item.get('type')));
|
||||
return notifications.filterNot(item => item !== null && excludedTypes.includes(item.get("type")));
|
||||
}
|
||||
return notifications.filter(item => item === null || allowedType === item.get('type'));
|
||||
return notifications.filter(item => item === null || allowedType === item.get("type"));
|
||||
});
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
showFilterBar: state.getIn(['settings', 'notifications', 'quickFilter', 'show']),
|
||||
showFilterBar: state.getIn(["settings", "notifications", "quickFilter", "show"]),
|
||||
notifications: getNotifications(state),
|
||||
isLoading: state.getIn(['notifications', 'isLoading'], 0) > 0,
|
||||
isUnread: state.getIn(['notifications', 'unread']) > 0 || state.getIn(['notifications', 'pendingItems']).size > 0,
|
||||
hasMore: state.getIn(['notifications', 'hasMore']),
|
||||
numPending: state.getIn(['notifications', 'pendingItems'], ImmutableList()).size,
|
||||
lastReadId: state.getIn(['settings', 'notifications', 'showUnread']) ? state.getIn(['notifications', 'readMarkerId']) : '0',
|
||||
canMarkAsRead: state.getIn(['settings', 'notifications', 'showUnread']) && state.getIn(['notifications', 'readMarkerId']) !== '0' && getNotifications(state).some(item => item !== null && compareId(item.get('id'), state.getIn(['notifications', 'readMarkerId'])) > 0),
|
||||
needsNotificationPermission: state.getIn(['settings', 'notifications', 'alerts']).includes(true) && state.getIn(['notifications', 'browserSupport']) && state.getIn(['notifications', 'browserPermission']) === 'default' && !state.getIn(['settings', 'notifications', 'dismissPermissionBanner']),
|
||||
isLoading: state.getIn(["notifications", "isLoading"], 0) > 0,
|
||||
isUnread: state.getIn(["notifications", "unread"]) > 0 || state.getIn(["notifications", "pendingItems"]).size > 0,
|
||||
hasMore: state.getIn(["notifications", "hasMore"]),
|
||||
numPending: state.getIn(["notifications", "pendingItems"], ImmutableList()).size,
|
||||
lastReadId: state.getIn(["settings", "notifications", "showUnread"]) ? state.getIn(["notifications", "readMarkerId"]) : "0",
|
||||
canMarkAsRead: state.getIn(["settings", "notifications", "showUnread"]) && state.getIn(["notifications", "readMarkerId"]) !== "0" && getNotifications(state).some(item => item !== null && compareId(item.get("id"), state.getIn(["notifications", "readMarkerId"])) > 0),
|
||||
needsNotificationPermission: state.getIn(["settings", "notifications", "alerts"]).includes(true) && state.getIn(["notifications", "browserSupport"]) && state.getIn(["notifications", "browserPermission"]) === "default" && !state.getIn(["settings", "notifications", "dismissPermissionBanner"]),
|
||||
});
|
||||
|
||||
class Notifications extends PureComponent {
|
||||
@@ -118,7 +118,7 @@ class Notifications extends PureComponent {
|
||||
|
||||
handleLoadOlder = debounce(() => {
|
||||
const last = this.props.notifications.last();
|
||||
this.props.dispatch(expandNotifications({ maxId: last && last.get('id') }));
|
||||
this.props.dispatch(expandNotifications({ maxId: last && last.get("id") }));
|
||||
}, 300, { leading: true });
|
||||
|
||||
handleLoadPending = () => {
|
||||
@@ -139,7 +139,7 @@ class Notifications extends PureComponent {
|
||||
if (columnId) {
|
||||
dispatch(removeColumn(columnId));
|
||||
} else {
|
||||
dispatch(addColumn('NOTIFICATIONS', {}));
|
||||
dispatch(addColumn("NOTIFICATIONS", {}));
|
||||
}
|
||||
};
|
||||
|
||||
@@ -157,12 +157,12 @@ class Notifications extends PureComponent {
|
||||
};
|
||||
|
||||
handleMoveUp = id => {
|
||||
const elementIndex = this.props.notifications.findIndex(item => item !== null && item.get('id') === id) - 1;
|
||||
const elementIndex = this.props.notifications.findIndex(item => item !== null && item.get("id") === id) - 1;
|
||||
this._selectChild(elementIndex, true);
|
||||
};
|
||||
|
||||
handleMoveDown = id => {
|
||||
const elementIndex = this.props.notifications.findIndex(item => item !== null && item.get('id') === id) + 1;
|
||||
const elementIndex = this.props.notifications.findIndex(item => item !== null && item.get("id") === id) + 1;
|
||||
this._selectChild(elementIndex, false);
|
||||
};
|
||||
|
||||
@@ -191,8 +191,7 @@ class Notifications extends PureComponent {
|
||||
const emptyMessage = <FormattedMessage id='empty_column.notifications' defaultMessage="You don't have any notifications yet. When other people interact with you, you will see it here." />;
|
||||
const { signedIn } = this.context.identity;
|
||||
|
||||
let scrollableContent = null;
|
||||
|
||||
let scrollableContent;
|
||||
const filterBarContainer = (signedIn && showFilterBar)
|
||||
? (<FilterBarContainer />)
|
||||
: null;
|
||||
@@ -202,19 +201,19 @@ class Notifications extends PureComponent {
|
||||
} else if (notifications.size > 0 || hasMore) {
|
||||
scrollableContent = notifications.map((item, index) => item === null ? (
|
||||
<LoadGap
|
||||
key={'gap:' + notifications.getIn([index + 1, 'id'])}
|
||||
key={"gap:" + notifications.getIn([index + 1, "id"])}
|
||||
disabled={isLoading}
|
||||
maxId={index > 0 ? notifications.getIn([index - 1, 'id']) : null}
|
||||
maxId={index > 0 ? notifications.getIn([index - 1, "id"]) : null}
|
||||
onClick={this.handleLoadGap}
|
||||
/>
|
||||
) : (
|
||||
<NotificationContainer
|
||||
key={item.get('id')}
|
||||
key={item.get("id")}
|
||||
notification={item}
|
||||
accountId={item.get('account')}
|
||||
accountId={item.get("account")}
|
||||
onMoveUp={this.handleMoveUp}
|
||||
onMoveDown={this.handleMoveDown}
|
||||
unread={lastReadId !== '0' && compareId(item.get('id'), lastReadId) > 0}
|
||||
unread={lastReadId !== "0" && compareId(item.get("id"), lastReadId) > 0}
|
||||
/>
|
||||
));
|
||||
} else {
|
||||
|
||||
Reference in New Issue
Block a user