From 79ce836335373272534eb94741e8df718129ded7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marc-Andr=C3=A9=20Bombeck?= <mbombeck@gmail.com>
Date: Sat, 6 Jun 2026 23:14:04 +0200
Subject: [PATCH] fix(settings): guard notification panel against non-array
 status payload

The notifications settings panel white-screened with "x.map is not a
function" when a status payload reached the card as the whole
{ channels, events } object instead of the channels array (events is an
object map, not an array). Guard the channel map with an Array.isArray
check, default the mood reminder-hour read to optional chaining, and
add a regression test that renders the empty state instead of crashing
on a malformed payload.
---
 .../medications/sections/notifications-section.tsx |  2 +-
 .../__tests__/notification-status-card.test.tsx    | 14 ++++++++++++++
 src/components/settings/mood-reminder-card.tsx     |  2 +-
 .../settings/notification-status-card.tsx          |  7 ++++++-
 4 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/src/components/medications/sections/notifications-section.tsx b/src/components/medications/sections/notifications-section.tsx
index d4a089453..07d2eccff 100644
--- a/src/components/medications/sections/notifications-section.tsx
+++ b/src/components/medications/sections/notifications-section.tsx
@@ -201,7 +201,7 @@ export function NotificationsBody({
         </label>
       )}
 
-      {status && status.channels.length > 0 && (
+      {Array.isArray(status?.channels) && status.channels.length > 0 && (
         <div
           className="flex flex-wrap gap-1.5"
           aria-hidden="true"
diff --git a/src/components/settings/__tests__/notification-status-card.test.tsx b/src/components/settings/__tests__/notification-status-card.test.tsx
index 3bad29db0..bd46f631d 100644
--- a/src/components/settings/__tests__/notification-status-card.test.tsx
+++ b/src/components/settings/__tests__/notification-status-card.test.tsx
@@ -71,6 +71,20 @@ describe("<NotificationStatusCard />", () => {
     expect(html).not.toContain('data-testid="notification-status-list"');
   });
 
+  it("renders empty state instead of crashing when data is not an array", () => {
+    // Regression: the status endpoint returns `{ channels, events }` where
+    // `events` is an object map. A shape-drifted / poisoned cache read that
+    // hands the whole object to the card must not reach `.map` on a
+    // non-array and white-screen the notifications panel.
+    useQueryMock.mockReturnValue({
+      data: { channels: [], events: {} } as unknown as MockChannel[],
+      isLoading: false,
+    });
+    const html = render(<NotificationStatusCard />);
+    expect(html).toContain("No channels configured yet");
+    expect(html).not.toContain('data-testid="notification-status-list"');
+  });
+
   it("paints Active badge for a healthy channel", () => {
     setChannels([
       {
diff --git a/src/components/settings/mood-reminder-card.tsx b/src/components/settings/mood-reminder-card.tsx
index 7d1340400..d4d7863dd 100644
--- a/src/components/settings/mood-reminder-card.tsx
+++ b/src/components/settings/mood-reminder-card.tsx
@@ -84,7 +84,7 @@ export function MoodReminderCard({
   });
 
   const enabled = optimistic ?? profile?.moodReminderEnabled ?? false;
-  const reminderHour = optimisticHour ?? prefs?.mood.reminderHour ?? 22;
+  const reminderHour = optimisticHour ?? prefs?.mood?.reminderHour ?? 22;
 
   async function handleToggle(next: boolean) {
     setOptimistic(next);
diff --git a/src/components/settings/notification-status-card.tsx b/src/components/settings/notification-status-card.tsx
index fca8276c1..b0609ac8e 100644
--- a/src/components/settings/notification-status-card.tsx
+++ b/src/components/settings/notification-status-card.tsx
@@ -119,7 +119,12 @@ export function NotificationStatusCard() {
     );
   }
 
-  const channels = data ?? [];
+  // Defensive: the status endpoint returns `{ channels, events }` where
+  // `events` is an object map, not an array. A stale or shape-drifted
+  // payload (or a cache read that kept the whole object instead of the
+  // `.channels` slice) must never reach `.map` on a non-array — guard the
+  // type here rather than white-screening the whole notifications panel.
+  const channels = Array.isArray(data) ? data : [];
   if (channels.length === 0) {
     return (
       <div