From 3ce08428c8d71d8ce6813367b173751118ff7538 Mon Sep 17 00:00:00 2001
From: gosangam <sangam4742@gmail.com>
Date: Sun, 30 Aug 2026 11:15:54 +0530
Subject: [PATCH] fix: notification matrix

---
 components/notifications/notification-matrix.tsx | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/components/notifications/notification-matrix.tsx b/components/notifications/notification-matrix.tsx
index e1fea35c..b6d57cba 100644
--- a/components/notifications/notification-matrix.tsx
+++ b/components/notifications/notification-matrix.tsx
@@ -53,11 +53,11 @@ const EVENTS: {
   {
     key: "messages",
     label: "Messages",
-    description: "New direct messages and group chats.",
-    // Push only. In-app delivery for chat is the inbox itself — a message
-    // highlights its row rather than entering the notification tray — and
-    // there is no such thing as an emailed chat message.
-    channels: ["push"],
+    description:
+      "New messages. Email is only ever sent when someone starts a conversation with you.",
+    // No in-app: chat's in-app delivery is the inbox itself, where a message
+    // highlights its row rather than entering the notification tray.
+    channels: ["email", "push"],
   },
   {
     key: "community",
@@ -139,7 +139,11 @@ export function NotificationMatrix() {
   }
 
   return (
-    <div className="grid grid-cols-[1fr_auto_auto_auto] items-center gap-x-4 gap-y-0 sm:gap-x-6">
+    // Fixed, EQUAL channel columns. With `auto` each one sized to its own
+    // widest content — "In-app" against the 44px toggle, "Push" against the
+    // same toggle — so the three columns came out different widths and
+    // neither the headers nor the switches lined up down the grid.
+    <div className="grid grid-cols-[1fr_repeat(3,3.25rem)] items-center gap-x-2 gap-y-0 sm:grid-cols-[1fr_repeat(3,4rem)] sm:gap-x-4">
       {/* Header row */}
       <span aria-hidden />
       {CHANNELS.map((c) => (