Adapt to new changes in group notifications API

Reference: https://github.com/mastodon/mastodon/pull/31214

src/pages/home.jsx

@@ -12,7 +12,7 @@ import Loader from '../components/loader';
 import Notification from '../components/notification';
 import { api } from '../utils/api';
 import db from '../utils/db';
-import groupNotifications from '../utils/group-notifications';
+import { massageNotifications2 } from '../utils/group-notifications';
 import states, { saveStatus } from '../utils/states';
 import { getCurrentAccountNS } from '../utils/store-utils';
 
@@ -98,7 +98,7 @@ function NotificationsMenu({ anchorRef, state, onClose }) {
 
   async function fetchNotifications() {
     const allNotifications = await notificationsIterator.next();
-    const notifications = allNotifications.value;
+    const notifications = massageNotifications2(allNotifications.value);
 
     if (notifications?.length) {
       notifications.forEach((notification) => {

src/pages/notifications.jsx

@@ -22,6 +22,7 @@ import { api } from '../utils/api';
 import enhanceContent from '../utils/enhance-content';
 import groupNotifications, {
   groupNotifications2,
+  massageNotifications2,
 } from '../utils/group-notifications';
 import handleContentLinks from '../utils/handle-content-links';
 import mem from '../utils/mem';
@@ -120,7 +121,7 @@ function Notifications({ columnMode }) {
       };
     }
     const allNotifications = await notificationsIterator.current.next();
-    const notifications = allNotifications.value;
+    const notifications = massageNotifications2(allNotifications.value);
 
     if (notifications?.length) {
       notifications.forEach((notification) => {

src/utils/group-notifications.jsx

@@ -28,8 +28,26 @@ export function fixNotifications(notifications) {
   });
 }
 
+export function massageNotifications2(notifications) {
+  if (notifications?.accounts) {
+    const { accounts, notificationGroups, statuses } = notifications;
+    return notificationGroups.map((group) => {
+      const { sampleAccountIds, statusId } = group;
+      const sampleAccounts =
+        sampleAccountIds?.map((id) => accounts.find((a) => a.id === id)) || [];
+      const status = statuses?.find((s) => s.id === statusId) || null;
+      return {
+        ...group,
+        sampleAccounts,
+        status,
+      };
+    });
+  }
+  return notifications;
+}
+
 export function groupNotifications2(groupNotifications) {
-  // Massage grouped notifications to look like faux grouped notifications above
+  // Make grouped notifications to look like faux grouped notifications
   const newGroupNotifications = groupNotifications.map((gn) => {
     const {
       latestPageNotificationAt,