Fix notification screen crashing in rare cases where the status no longer exists (#31403)

app/javascript/mastodon/actions/notification_groups.ts

@@ -47,7 +47,7 @@ function dispatchAssociatedRecords(
       fetchedAccounts.push(notification.moderation_warning.target_account);
     }
 
-    if ('status' in notification) {
+    if ('status' in notification && notification.status) {
       fetchedStatuses.push(notification.status);
     }
   });
@@ -119,7 +119,7 @@ export const processNewNotificationForGroups = createAppAsyncThunk(
 
     if (
       (notification.type === 'mention' || notification.type === 'update') &&
-      notification.status.filtered
+      notification.status?.filtered
     ) {
       const filters = notification.status.filtered.filter((result) =>
         result.filter.context.includes('notifications'),

app/javascript/mastodon/api_types/notifications.ts

@@ -60,12 +60,12 @@ export interface BaseNotificationGroupJSON {
 
 interface NotificationGroupWithStatusJSON extends BaseNotificationGroupJSON {
   type: NotificationWithStatusType;
-  status_id: string;
+  status_id: string | null;
 }
 
 interface NotificationWithStatusJSON extends BaseNotificationJSON {
   type: NotificationWithStatusType;
-  status: ApiStatusJSON;
+  status: ApiStatusJSON | null;
 }
 
 interface ReportNotificationGroupJSON extends BaseNotificationGroupJSON {

app/javascript/mastodon/features/notifications_v2/components/notification_mention.tsx

@@ -37,7 +37,11 @@ export const NotificationMention: React.FC<{
   unread: boolean;
 }> = ({ notification, unread }) => {
   const [isDirect, isReply] = useAppSelector((state) => {
-    const status = state.statuses.get(notification.statusId) as Status;
+    const status = state.statuses.get(notification.statusId) as
+      | Status
+      | undefined;
+
+    if (!status) return [false, false] as const;
 
     return [
       status.get('visibility') === 'direct',

app/javascript/mastodon/features/notifications_v2/components/notification_with_status.tsx

@@ -23,7 +23,7 @@ export const NotificationWithStatus: React.FC<{
   icon: IconProp;
   iconId: string;
   accountIds: string[];
-  statusId: string;
+  statusId: string | undefined;
   count: number;
   labelRenderer: LabelRenderer;
   unread: boolean;
@@ -76,6 +76,8 @@ export const NotificationWithStatus: React.FC<{
     [dispatch, statusId],
   );
 
+  if (!statusId) return null;
+
   return (
     <HotKeys handlers={handlers}>
       <div

app/javascript/mastodon/models/notification_group.ts

@@ -21,7 +21,7 @@ interface BaseNotificationGroup
 interface BaseNotificationWithStatus<Type extends NotificationWithStatusType>
   extends BaseNotificationGroup {
   type: Type;
-  statusId: string;
+  statusId: string | undefined;
 }
 
 interface BaseNotification<Type extends NotificationType>
@@ -126,7 +126,7 @@ export function createNotificationGroupFromJSON(
     case 'update': {
       const { status_id: statusId, ...groupWithoutStatus } = group;
       return {
-        statusId,
+        statusId: statusId ?? undefined,
         sampleAccountIds,
         ...groupWithoutStatus,
       };
@@ -183,7 +183,7 @@ export function createNotificationGroupFromNotificationJSON(
     case 'mention':
     case 'poll':
     case 'update':
-      return { ...group, statusId: notification.status.id };
+      return { ...group, statusId: notification.status?.id };
     case 'admin.report':
       return { ...group, report: createReportFromJSON(notification.report) };
     case 'severed_relationships':