Add notifications when a reblogged status has been updated (#17404)

* Add notifications when a reblogged status has been updated

* Change wording to say "edit" instead of "update" and add missing controls

* Replace previous update notifications with the most up-to-date one

app/javascript/mastodon/actions/notifications.js

@@ -34,7 +34,6 @@ export const NOTIFICATIONS_LOAD_PENDING = 'NOTIFICATIONS_LOAD_PENDING';
 export const NOTIFICATIONS_MOUNT   = 'NOTIFICATIONS_MOUNT';
 export const NOTIFICATIONS_UNMOUNT = 'NOTIFICATIONS_UNMOUNT';
 
-
 export const NOTIFICATIONS_MARK_AS_READ = 'NOTIFICATIONS_MARK_AS_READ';
 
 export const NOTIFICATIONS_SET_BROWSER_SUPPORT    = 'NOTIFICATIONS_SET_BROWSER_SUPPORT';
@@ -124,7 +123,17 @@ export function updateNotifications(notification, intlMessages, intlLocale) {
 const excludeTypesFromSettings = state => state.getIn(['settings', 'notifications', 'shows']).filter(enabled => !enabled).keySeq().toJS();
 
 const excludeTypesFromFilter = filter => {
-  const allTypes = ImmutableList(['follow', 'follow_request', 'favourite', 'reblog', 'mention', 'poll']);
+  const allTypes = ImmutableList([
+    'follow',
+    'follow_request',
+    'favourite',
+    'reblog',
+    'mention',
+    'poll',
+    'status',
+    'update',
+  ]);
+
   return allTypes.filterNot(item => item === filter).toJS();
 };
 

app/javascript/mastodon/features/notifications/components/column_settings.js

@@ -153,6 +153,17 @@ export default class ColumnSettings extends React.PureComponent {
             <SettingToggle prefix='notifications' settings={settings} settingPath={['sounds', 'status']} onChange={onChange} label={soundStr} />
           </div>
         </div>
+
+        <div role='group' aria-labelledby='notifications-update'>
+          <span id='notifications-status' 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} />
+          </div>
+        </div>
       </div>
     );
   }

app/javascript/mastodon/features/notifications/components/notification.js

@@ -19,6 +19,7 @@ const messages = defineMessages({
   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' },
 });
 
 const notificationForScreenReader = (intl, message, timestamp) => {
@@ -273,6 +274,38 @@ class Notification extends ImmutablePureComponent {
     );
   }
 
+  renderUpdate (notification, link) {
+    const { intl, unread } = this.props;
+
+    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='notification__message'>
+            <div className='notification__favourite-icon-wrapper'>
+              <Icon id='pencil' fixedWidth />
+            </div>
+
+            <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')}
+            muted
+            withDismiss
+            hidden={this.props.hidden}
+            getScrollPosition={this.props.getScrollPosition}
+            updateScrollBottom={this.props.updateScrollBottom}
+            cachedMediaWidth={this.props.cachedMediaWidth}
+            cacheMediaWidth={this.props.cacheMediaWidth}
+          />
+        </div>
+      </HotKeys>
+    );
+  }
+
   renderPoll (notification, account) {
     const { intl, unread } = this.props;
     const ownPoll  = me === account.get('id');
@@ -330,6 +363,8 @@ class Notification extends ImmutablePureComponent {
       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);
     }

app/javascript/mastodon/reducers/settings.js

@@ -36,6 +36,7 @@ const initialState = ImmutableMap({
       mention: false,
       poll: false,
       status: false,
+      update: false,
     }),
 
     quickFilter: ImmutableMap({
@@ -55,6 +56,7 @@ const initialState = ImmutableMap({
       mention: true,
       poll: true,
       status: true,
+      update: true,
     }),
 
     sounds: ImmutableMap({
@@ -65,6 +67,7 @@ const initialState = ImmutableMap({
       mention: true,
       poll: true,
       status: true,
+      update: true,
     }),
   }),
 

app/javascript/mastodon/service_worker/web_push_locales.js

@@ -20,6 +20,8 @@ filenames.forEach(filename => {
     'notification.mention': full['notification.mention'] || '',
     'notification.reblog': full['notification.reblog'] || '',
     'notification.poll': full['notification.poll'] || '',
+    'notification.status': full['notification.status'] || '',
+    'notification.update': full['notification.update'] || '',
 
     'status.show_more': full['status.show_more'] || '',
     'status.reblog': full['status.reblog'] || '',

app/javascript/mastodon/service_worker/web_push_notifications.js

@@ -102,7 +102,7 @@ const handlePush = (event) => {
 
         options.image   = undefined;
         options.actions = [actionExpand(preferred_locale)];
-      } else if (notification.type === 'mention') {
+      } else if (['mention', 'status'].includes(notification.type)) {
         options.actions = [actionReblog(preferred_locale), actionFavourite(preferred_locale)];
       }