From 4c996964c7df866f311a80a91a69c493a76088da Mon Sep 17 00:00:00 2001
From: Claire <claire.github-309c@sitedethib.com>
Date: Tue, 13 Aug 2024 10:18:11 +0200
Subject: [PATCH] Fix web UI crash when a encoutering an orphaned notification
 group

Fixes #31392
---
 .../components/notification_group.tsx         | 22 ++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/app/javascript/mastodon/features/notifications_v2/components/notification_group.tsx b/app/javascript/mastodon/features/notifications_v2/components/notification_group.tsx
index 36f033261ae..ec08d62c887 100644
--- a/app/javascript/mastodon/features/notifications_v2/components/notification_group.tsx
+++ b/app/javascript/mastodon/features/notifications_v2/components/notification_group.tsx
@@ -20,6 +20,21 @@ import { NotificationSeveredRelationships } from './notification_severed_relatio
 import { NotificationStatus } from './notification_status';
 import { NotificationUpdate } from './notification_update';
 
+function missingActivity(notificationGroup: NotificationGroupModel) {
+  switch (notificationGroup.type) {
+    case 'reblog':
+    case 'favourite':
+    case 'mention':
+    case 'update':
+    case 'status':
+    case 'poll':
+      // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- our type is actually not correct as the server can occasionally have orphaned notifications
+      return notificationGroup.statusId === null;
+    default:
+      return false;
+  }
+}
+
 export const NotificationGroup: React.FC<{
   notificationGroupId: NotificationGroupModel['group_key'];
   unread: boolean;
@@ -60,7 +75,12 @@ export const NotificationGroup: React.FC<{
     [dispatch, notificationGroupId, accountId, onMoveUp, onMoveDown],
   );
 
-  if (!notificationGroup || notificationGroup.type === 'gap') return null;
+  if (
+    !notificationGroup ||
+    notificationGroup.type === 'gap' ||
+    missingActivity(notificationGroup)
+  )
+    return null;
 
   let content;