Merge pull request #2803 from ClearlyClaire/glitch-soc/merge-upstream

Merge upstream changes up to a50c8e9
glitch-soc · Jul 31, 2024 · a9ffec4 · a9ffec4
2 parents 3271765 + 49ad147
commit a9ffec4
Show file tree

Hide file tree

Showing 46 changed files with 351 additions and 187 deletions.
diff --git a/Gemfile.lock b/Gemfile.lock
@@ -517,7 +517,7 @@ GEM
       opentelemetry-api (~> 1.0)
       opentelemetry-instrumentation-active_support (~> 0.1)
       opentelemetry-instrumentation-base (~> 0.22.1)
-    opentelemetry-instrumentation-active_job (0.7.3)
+    opentelemetry-instrumentation-active_job (0.7.4)
       opentelemetry-api (~> 1.0)
       opentelemetry-instrumentation-base (~> 0.22.1)
     opentelemetry-instrumentation-active_model_serializers (0.20.2)

diff --git a/app/controllers/api/v2_alpha/notifications_controller.rb b/app/controllers/api/v2_alpha/notifications_controller.rb
@@ -33,7 +33,8 @@ def index
         'app.notification_grouping.status.unique_count' => statuses.uniq.size
       )
 
-      render json: @grouped_notifications, each_serializer: REST::NotificationGroupSerializer, relationships: @relationships, group_metadata: @group_metadata
+      presenter = GroupedNotificationsPresenter.new(@grouped_notifications)
+      render json: presenter, serializer: REST::DedupNotificationGroupSerializer, relationships: @relationships, group_metadata: @group_metadata
     end
   end
 
@@ -47,7 +48,8 @@ def unread_count
 
   def show
     @notification = current_account.notifications.without_suspended.find_by!(group_key: params[:id])
-    render json: NotificationGroup.from_notification(@notification), serializer: REST::NotificationGroupSerializer
+    presenter = GroupedNotificationsPresenter.new([NotificationGroup.from_notification(@notification)])
+    render json: presenter, serializer: REST::DedupNotificationGroupSerializer
   end
 
   def clear

diff --git a/app/javascript/flavours/glitch/actions/notification_groups.ts b/app/javascript/flavours/glitch/actions/notification_groups.ts
@@ -38,10 +38,6 @@ function dispatchAssociatedRecords(
   const fetchedStatuses: ApiStatusJSON[] = [];
 
   notifications.forEach((notification) => {
-    if ('sample_accounts' in notification) {
-      fetchedAccounts.push(...notification.sample_accounts);
-    }
-
     if (notification.type === 'admin.report') {
       fetchedAccounts.push(notification.report.target_account);
     }
@@ -75,7 +71,9 @@ export const fetchNotifications = createDataLoadingThunk(
           : excludeAllTypesExcept(activeFilter),
     });
   },
-  ({ notifications }, { dispatch }) => {
+  ({ notifications, accounts, statuses }, { dispatch }) => {
+    dispatch(importFetchedAccounts(accounts));
+    dispatch(importFetchedStatuses(statuses));
     dispatchAssociatedRecords(dispatch, notifications);
     const payload: (ApiNotificationGroupJSON | NotificationGap)[] =
       notifications;
@@ -95,7 +93,9 @@ export const fetchNotificationsGap = createDataLoadingThunk(
   async (params: { gap: NotificationGap }) =>
     apiFetchNotifications({ max_id: params.gap.maxId }),
 
-  ({ notifications }, { dispatch }) => {
+  ({ notifications, accounts, statuses }, { dispatch }) => {
+    dispatch(importFetchedAccounts(accounts));
+    dispatch(importFetchedStatuses(statuses));
     dispatchAssociatedRecords(dispatch, notifications);
 
     return { notifications };

diff --git a/app/javascript/flavours/glitch/api/notifications.ts b/app/javascript/flavours/glitch/api/notifications.ts
@@ -1,17 +1,24 @@
 import api, { apiRequest, getLinks } from 'flavours/glitch/api';
-import type { ApiNotificationGroupJSON } from 'flavours/glitch/api_types/notifications';
+import type { ApiNotificationGroupsResultJSON } from 'flavours/glitch/api_types/notifications';
 
 export const apiFetchNotifications = async (params?: {
   exclude_types?: string[];
   max_id?: string;
 }) => {
-  const response = await api().request<ApiNotificationGroupJSON[]>({
+  const response = await api().request<ApiNotificationGroupsResultJSON>({
     method: 'GET',
     url: '/api/v2_alpha/notifications',
     params,
   });
 
-  return { notifications: response.data, links: getLinks(response) };
+  const { statuses, accounts, notification_groups } = response.data;
+
+  return {
+    statuses,
+    accounts,
+    notifications: notification_groups,
+    links: getLinks(response),
+  };
 };
 
 export const apiClearNotifications = () =>

diff --git a/app/javascript/flavours/glitch/api_types/notifications.ts b/app/javascript/flavours/glitch/api_types/notifications.ts
@@ -51,7 +51,7 @@ export interface BaseNotificationGroupJSON {
   group_key: string;
   notifications_count: number;
   type: NotificationType;
-  sample_accounts: ApiAccountJSON[];
+  sample_account_ids: string[];
   latest_page_notification_at: string; // FIXME: This will only be present if the notification group is returned in a paginated list, not requested directly
   most_recent_notification_id: string;
   page_min_id?: string;
@@ -60,7 +60,7 @@ export interface BaseNotificationGroupJSON {
 
 interface NotificationGroupWithStatusJSON extends BaseNotificationGroupJSON {
   type: NotificationWithStatusType;
-  status: ApiStatusJSON;
+  status_id: string;
 }
 
 interface NotificationWithStatusJSON extends BaseNotificationJSON {
@@ -143,3 +143,9 @@ export type ApiNotificationGroupJSON =
   | AccountRelationshipSeveranceNotificationGroupJSON
   | NotificationGroupWithStatusJSON
   | ModerationWarningNotificationGroupJSON;
+
+export interface ApiNotificationGroupsResultJSON {
+  accounts: ApiAccountJSON[];
+  statuses: ApiStatusJSON[];
+  notification_groups: ApiNotificationGroupJSON[];
+}
diff --git a/...cript/flavours/glitch/features/notifications/components/filtered_notifications_banner.tsx b/...cript/flavours/glitch/features/notifications/components/filtered_notifications_banner.tsx
@@ -49,21 +49,14 @@ export const FilteredNotificationsBanner: React.FC = () => {
         <span>
           <FormattedMessage
             id='filtered_notifications_banner.pending_requests'
-            defaultMessage='Notifications from {count, plural, =0 {no one} one {one person} other {# people}} you may know'
+            defaultMessage='From {count, plural, =0 {no one} one {one person} other {# people}} you may know'
             values={{ count: policy.summary.pending_requests_count }}
           />
         </span>
       </div>
 
       <div className='filtered-notifications-banner__badge'>
-        <div className='filtered-notifications-banner__badge__badge'>
-          {toCappedNumber(policy.summary.pending_notifications_count)}
-        </div>
-        <FormattedMessage
-          id='filtered_notifications_banner.mentions'
-          defaultMessage='{count, plural, one {mention} other {mentions}}'
-          values={{ count: policy.summary.pending_notifications_count }}
-        />
+        {toCappedNumber(policy.summary.pending_notifications_count)}
       </div>
     </Link>
   );

diff --git a/app/javascript/flavours/glitch/features/notifications/request.jsx b/app/javascript/flavours/glitch/features/notifications/request.jsx
@@ -7,9 +7,9 @@ import { Helmet } from 'react-helmet';
 
 import { useSelector, useDispatch } from 'react-redux';
 
+import DeleteIcon from '@/material-icons/400-24px/delete.svg?react';
 import DoneIcon from '@/material-icons/400-24px/done.svg?react';
 import InventoryIcon from '@/material-icons/400-24px/inventory_2.svg?react';
-import VolumeOffIcon from '@/material-icons/400-24px/volume_off.svg?react';
 import { fetchNotificationRequest, fetchNotificationsForRequest, expandNotificationsForRequest, acceptNotificationRequest, dismissNotificationRequest } from 'flavours/glitch/actions/notifications';
 import Column from 'flavours/glitch/components/column';
 import ColumnHeader from 'flavours/glitch/components/column_header';
@@ -101,7 +101,7 @@ export const NotificationRequest = ({ multiColumn, params: { id } }) => {
         showBackButton
         extraButton={!removed && (
           <>
-            <IconButton className='column-header__button' iconComponent={VolumeOffIcon} onClick={handleDismiss} title={intl.formatMessage(messages.dismiss)} />
+            <IconButton className='column-header__button' iconComponent={DeleteIcon} onClick={handleDismiss} title={intl.formatMessage(messages.dismiss)} />
             <IconButton className='column-header__button' iconComponent={DoneIcon} onClick={handleAccept} title={intl.formatMessage(messages.accept)} />
           </>
         )}

diff --git a/app/javascript/flavours/glitch/features/notifications_v2/components/notification_mention.tsx b/app/javascript/flavours/glitch/features/notifications_v2/components/notification_mention.tsx
@@ -1,5 +1,6 @@
 import { FormattedMessage } from 'react-intl';
 
+import AlternateEmailIcon from '@/material-icons/400-24px/alternate_email.svg?react';
 import ReplyIcon from '@/material-icons/400-24px/reply-fill.svg?react';
 import type { StatusVisibility } from 'flavours/glitch/api_types/statuses';
 import type { NotificationGroupMention } from 'flavours/glitch/models/notification_group';
@@ -39,7 +40,7 @@ export const NotificationMention: React.FC<{
   return (
     <NotificationWithStatus
       type='mention'
-      icon={ReplyIcon}
+      icon={statusVisibility === 'direct' ? AlternateEmailIcon : ReplyIcon}
       iconId='reply'
       accountIds={notification.sampleAccountIds}
       count={notification.notifications_count}

diff --git a/app/javascript/flavours/glitch/models/notification_group.ts b/app/javascript/flavours/glitch/models/notification_group.ts
@@ -14,7 +14,7 @@ import type { ApiReportJSON } from 'flavours/glitch/api_types/reports';
 export const NOTIFICATIONS_GROUP_MAX_AVATARS = 8;
 
 interface BaseNotificationGroup
-  extends Omit<BaseNotificationGroupJSON, 'sample_accounts'> {
+  extends Omit<BaseNotificationGroupJSON, 'sample_account_ids'> {
   sampleAccountIds: string[];
 }
 
@@ -115,8 +115,7 @@ function createAccountRelationshipSeveranceEventFromJSON(
 export function createNotificationGroupFromJSON(
   groupJson: ApiNotificationGroupJSON,
 ): NotificationGroup {
-  const { sample_accounts, ...group } = groupJson;
-  const sampleAccountIds = sample_accounts.map((account) => account.id);
+  const { sample_account_ids: sampleAccountIds, ...group } = groupJson;
 
   switch (group.type) {
     case 'favourite':
@@ -125,9 +124,9 @@ export function createNotificationGroupFromJSON(
     case 'mention':
     case 'poll':
     case 'update': {
-      const { status, ...groupWithoutStatus } = group;
+      const { status_id: statusId, ...groupWithoutStatus } = group;
       return {
-        statusId: status.id,
+        statusId,
         sampleAccountIds,
         ...groupWithoutStatus,
       };

diff --git a/app/javascript/flavours/glitch/styles/components.scss b/app/javascript/flavours/glitch/styles/components.scss
@@ -10730,25 +10730,10 @@ noscript {
   }
 
   &__badge {
-    display: flex;
-    align-items: center;
-    border-radius: 999px;
-    background: var(--background-border-color);
-    color: $darker-text-color;
-    padding: 4px;
-    padding-inline-end: 8px;
-    gap: 6px;
-    font-weight: 500;
-    font-size: 11px;
-    line-height: 16px;
-    word-break: keep-all;
-
-    &__badge {
-      background: $ui-button-background-color;
-      color: $white;
-      border-radius: 100px;
-      padding: 2px 8px;
-    }
+    background: $ui-button-background-color;
+    color: $white;
+    border-radius: 100px;
+    padding: 2px 8px;
   }
 }
 

diff --git a/app/javascript/mastodon/actions/notification_groups.ts b/app/javascript/mastodon/actions/notification_groups.ts
@@ -38,10 +38,6 @@ function dispatchAssociatedRecords(
   const fetchedStatuses: ApiStatusJSON[] = [];
 
   notifications.forEach((notification) => {
-    if ('sample_accounts' in notification) {
-      fetchedAccounts.push(...notification.sample_accounts);
-    }
-
     if (notification.type === 'admin.report') {
       fetchedAccounts.push(notification.report.target_account);
     }
@@ -75,7 +71,9 @@ export const fetchNotifications = createDataLoadingThunk(
           : excludeAllTypesExcept(activeFilter),
     });
   },
-  ({ notifications }, { dispatch }) => {
+  ({ notifications, accounts, statuses }, { dispatch }) => {
+    dispatch(importFetchedAccounts(accounts));
+    dispatch(importFetchedStatuses(statuses));
     dispatchAssociatedRecords(dispatch, notifications);
     const payload: (ApiNotificationGroupJSON | NotificationGap)[] =
       notifications;
@@ -95,7 +93,9 @@ export const fetchNotificationsGap = createDataLoadingThunk(
   async (params: { gap: NotificationGap }) =>
     apiFetchNotifications({ max_id: params.gap.maxId }),
 
-  ({ notifications }, { dispatch }) => {
+  ({ notifications, accounts, statuses }, { dispatch }) => {
+    dispatch(importFetchedAccounts(accounts));
+    dispatch(importFetchedStatuses(statuses));
     dispatchAssociatedRecords(dispatch, notifications);
 
     return { notifications };

diff --git a/app/javascript/mastodon/api/notifications.ts b/app/javascript/mastodon/api/notifications.ts
@@ -1,17 +1,24 @@
 import api, { apiRequest, getLinks } from 'mastodon/api';
-import type { ApiNotificationGroupJSON } from 'mastodon/api_types/notifications';
+import type { ApiNotificationGroupsResultJSON } from 'mastodon/api_types/notifications';
 
 export const apiFetchNotifications = async (params?: {
   exclude_types?: string[];
   max_id?: string;
 }) => {
-  const response = await api().request<ApiNotificationGroupJSON[]>({
+  const response = await api().request<ApiNotificationGroupsResultJSON>({
     method: 'GET',
     url: '/api/v2_alpha/notifications',
     params,
   });
 
-  return { notifications: response.data, links: getLinks(response) };
+  const { statuses, accounts, notification_groups } = response.data;
+
+  return {
+    statuses,
+    accounts,
+    notifications: notification_groups,
+    links: getLinks(response),
+  };
 };
 
 export const apiClearNotifications = () =>

diff --git a/app/javascript/mastodon/api_types/notifications.ts b/app/javascript/mastodon/api_types/notifications.ts
@@ -51,7 +51,7 @@ export interface BaseNotificationGroupJSON {
   group_key: string;
   notifications_count: number;
   type: NotificationType;
-  sample_accounts: ApiAccountJSON[];
+  sample_account_ids: string[];
   latest_page_notification_at: string; // FIXME: This will only be present if the notification group is returned in a paginated list, not requested directly
   most_recent_notification_id: string;
   page_min_id?: string;
@@ -60,7 +60,7 @@ export interface BaseNotificationGroupJSON {
 
 interface NotificationGroupWithStatusJSON extends BaseNotificationGroupJSON {
   type: NotificationWithStatusType;
-  status: ApiStatusJSON;
+  status_id: string;
 }
 
 interface NotificationWithStatusJSON extends BaseNotificationJSON {
@@ -143,3 +143,9 @@ export type ApiNotificationGroupJSON =
   | AccountRelationshipSeveranceNotificationGroupJSON
   | NotificationGroupWithStatusJSON
   | ModerationWarningNotificationGroupJSON;
+
+export interface ApiNotificationGroupsResultJSON {
+  accounts: ApiAccountJSON[];
+  statuses: ApiStatusJSON[];
+  notification_groups: ApiNotificationGroupJSON[];
+}
diff --git a/app/javascript/mastodon/features/notifications/components/filtered_notifications_banner.tsx b/app/javascript/mastodon/features/notifications/components/filtered_notifications_banner.tsx
@@ -49,21 +49,14 @@ export const FilteredNotificationsBanner: React.FC = () => {
         <span>
           <FormattedMessage
             id='filtered_notifications_banner.pending_requests'
-            defaultMessage='Notifications from {count, plural, =0 {no one} one {one person} other {# people}} you may know'
+            defaultMessage='From {count, plural, =0 {no one} one {one person} other {# people}} you may know'
             values={{ count: policy.summary.pending_requests_count }}
           />
         </span>
       </div>
 
       <div className='filtered-notifications-banner__badge'>
-        <div className='filtered-notifications-banner__badge__badge'>
-          {toCappedNumber(policy.summary.pending_notifications_count)}
-        </div>
-        <FormattedMessage
-          id='filtered_notifications_banner.mentions'
-          defaultMessage='{count, plural, one {mention} other {mentions}}'
-          values={{ count: policy.summary.pending_notifications_count }}
-        />
+        {toCappedNumber(policy.summary.pending_notifications_count)}
       </div>
     </Link>
   );

diff --git a/app/javascript/mastodon/features/notifications/request.jsx b/app/javascript/mastodon/features/notifications/request.jsx
@@ -7,9 +7,9 @@ import { Helmet } from 'react-helmet';
 
 import { useSelector, useDispatch } from 'react-redux';
 
+import DeleteIcon from '@/material-icons/400-24px/delete.svg?react';
 import DoneIcon from '@/material-icons/400-24px/done.svg?react';
 import InventoryIcon from '@/material-icons/400-24px/inventory_2.svg?react';
-import VolumeOffIcon from '@/material-icons/400-24px/volume_off.svg?react';
 import { fetchNotificationRequest, fetchNotificationsForRequest, expandNotificationsForRequest, acceptNotificationRequest, dismissNotificationRequest } from 'mastodon/actions/notifications';
 import Column from 'mastodon/components/column';
 import ColumnHeader from 'mastodon/components/column_header';
@@ -101,7 +101,7 @@ export const NotificationRequest = ({ multiColumn, params: { id } }) => {
         showBackButton
         extraButton={!removed && (
           <>
-            <IconButton className='column-header__button' iconComponent={VolumeOffIcon} onClick={handleDismiss} title={intl.formatMessage(messages.dismiss)} />
+            <IconButton className='column-header__button' iconComponent={DeleteIcon} onClick={handleDismiss} title={intl.formatMessage(messages.dismiss)} />
             <IconButton className='column-header__button' iconComponent={DoneIcon} onClick={handleAccept} title={intl.formatMessage(messages.accept)} />
           </>
         )}

diff --git a/app/javascript/mastodon/features/notifications_v2/components/notification_mention.tsx b/app/javascript/mastodon/features/notifications_v2/components/notification_mention.tsx
@@ -1,5 +1,6 @@
 import { FormattedMessage } from 'react-intl';
 
+import AlternateEmailIcon from '@/material-icons/400-24px/alternate_email.svg?react';
 import ReplyIcon from '@/material-icons/400-24px/reply-fill.svg?react';
 import type { StatusVisibility } from 'mastodon/api_types/statuses';
 import type { NotificationGroupMention } from 'mastodon/models/notification_group';
@@ -39,7 +40,7 @@ export const NotificationMention: React.FC<{
   return (
     <NotificationWithStatus
       type='mention'
-      icon={ReplyIcon}
+      icon={statusVisibility === 'direct' ? AlternateEmailIcon : ReplyIcon}
       iconId='reply'
       accountIds={notification.sampleAccountIds}
       count={notification.notifications_count}

diff --git a/app/javascript/mastodon/locales/en.json b/app/javascript/mastodon/locales/en.json
@@ -300,8 +300,7 @@
   "filter_modal.select_filter.subtitle": "Use an existing category or create a new one",
   "filter_modal.select_filter.title": "Filter this post",
   "filter_modal.title.status": "Filter a post",
-  "filtered_notifications_banner.mentions": "{count, plural, one {mention} other {mentions}}",
-  "filtered_notifications_banner.pending_requests": "Notifications from {count, plural, =0 {no one} one {one person} other {# people}} you may know",
+  "filtered_notifications_banner.pending_requests": "From {count, plural, =0 {no one} one {one person} other {# people}} you may know",
   "filtered_notifications_banner.title": "Filtered notifications",
   "firehose.all": "All",
   "firehose.local": "This server",