fix: notifications now appear in notification center

trycompai · Feb 10, 2025 · 016caec · 016caec
1 parent cb10949
commit 016caec
Show file tree

Hide file tree

Showing 2 changed files with 50 additions and 63 deletions.
diff --git a/apps/app/src/components/notification-center.tsx b/apps/app/src/components/notification-center.tsx
@@ -28,73 +28,70 @@ function NotificationItem({
   description,
   createdAt,
   recordId,
-  from,
-  to,
   markMessageAsRead,
-  type,
 }: {
   id: string;
   setOpen: (open: boolean) => void;
   description: string;
   createdAt: string;
-  recordId: string;
-  from: string;
-  to: string;
+  recordId?: string;
+  from?: string;
+  to?: string;
   markMessageAsRead: (id: string) => void;
-  type: string;
+  type?: string;
 }) {
-  switch (type) {
-    case "inapp_task_reminder":
-      return (
-        <div className="flex items-between justify-between space-x-4 px-3 py-3 hover:bg-secondary">
-          <Link
-            className="flex items-between justify-between space-x-4"
-            onClick={() => setOpen(false)}
-            href={`/tasks/${recordId}`}
+  return (
+    <div className="flex items-between justify-between space-x-4 px-3 py-3 hover:bg-secondary">
+      <Link
+        className="flex items-between justify-between space-x-4"
+        onClick={() => setOpen(false)}
+        href={recordId ? `/tasks/${recordId}` : "#"}
+      >
+        <div>
+          <div className="h-9 w-9 flex items-center justify-center space-y-0 border rounded-full">
+            <Icons.Match />
+          </div>
+        </div>
+        <div>
+          <p className="text-sm">{description}</p>
+          <span className="text-xs text-muted">
+            {formatDistanceToNow(new Date(createdAt))} ago
+          </span>
+        </div>
+      </Link>
+      {markMessageAsRead && (
+        <div>
+          <Button
+            size="icon"
+            variant="secondary"
+            className="rounded-full bg-transparent hover:bg-[#1A1A1A]"
+            onClick={() => markMessageAsRead(id)}
           >
-            <div>
-              <div className="h-9 w-9 flex items-center justify-center space-y-0 border rounded-full">
-                <Icons.Match />
-              </div>
-            </div>
-            <div>
-              <p className="text-sm">{description}</p>
-              <span className="text-xs text-muted">
-                {formatDistanceToNow(new Date(createdAt))} ago
-              </span>
-            </div>
-          </Link>
-          {markMessageAsRead && (
-            <div>
-              <Button
-                size="icon"
-                variant="secondary"
-                className="rounded-full bg-transparent hover:bg-[#1A1A1A]"
-                onClick={() => markMessageAsRead(id)}
-              >
-                <Icons.Inventory2 />
-              </Button>
-            </div>
-          )}
+            <Icons.Inventory2 />
+          </Button>
         </div>
-      );
-    default:
-      return null;
-  }
+      )}
+    </div>
+  );
 }
 
 export function NotificationCenter() {
   const t = useI18n();
 
   const [isOpen, setOpen] = useState(false);
+
   const {
     hasUnseenNotifications,
     notifications,
     markMessageAsRead,
     markAllMessagesAsSeen,
     markAllMessagesAsRead,
+    subscriberId,
   } = useNotifications();
 
+  console.log(subscriberId);
+  console.log(notifications);
+
   const unreadNotifications = notifications.filter(
     (notification) => !notification.read,
   );
@@ -167,12 +164,9 @@ export function NotificationCenter() {
                         id={notification.id}
                         markMessageAsRead={markMessageAsRead}
                         setOpen={setOpen}
-                        description={notification.payload.description}
+                        description={notification.payload.description || ""}
                         createdAt={notification.createdAt}
                         recordId={notification.payload.recordId}
-                        type={notification.payload.type}
-                        from={notification.payload?.from}
-                        to={notification.payload?.to}
                       />
                     );
                   })}
@@ -209,12 +203,9 @@ export function NotificationCenter() {
                         key={notification.id}
                         id={notification.id}
                         setOpen={setOpen}
-                        description={notification.payload.description}
+                        description={notification.payload.description || ""}
                         createdAt={notification.createdAt}
                         recordId={notification.payload.recordId}
-                        type={notification.payload.type}
-                        from={notification.payload?.from}
-                        to={notification.payload?.to}
                         markMessageAsRead={markMessageAsRead}
                       />
                     );

diff --git a/apps/app/src/hooks/use-notifications.ts b/apps/app/src/hooks/use-notifications.ts
@@ -9,11 +9,12 @@ interface Notification {
   seen: boolean;
   createdAt: string;
   payload: {
-    description: string;
-    recordId: string;
-    type: string;
-    from: string;
-    to: string;
+    description?: string;
+    recordId?: string;
+    type?: string;
+    from?: string;
+    to?: string;
+    [key: string]: any; // Allow for other payload fields
   }
 }
 
@@ -83,13 +84,7 @@ export function useNotifications() {
               read: msg.read,
               seen: msg.seen,
               createdAt: msg.createdAt,
-              payload: {
-                description: msg.payload.description as string,
-                recordId: msg.payload.recordId as string,
-                type: msg.payload.type as string,
-                from: msg.payload.from as string,
-                to: msg.payload.to as string,
-              }
+              payload: msg.payload || {} // Handle case where payload might be empty
             }))
           );
         },
@@ -160,5 +155,6 @@ export function useNotifications() {
     markAllMessagesAsSeen,
     hasUnseenNotifications: notifications.some((notification) => !notification.seen),
     notifications,
+    subscriberId,
   };
 }