Fix @mention notifications in activity comments (#219)

prazgaitis · web-flow · commit b62cb532dd2a · 2026-03-12T22:37:44.000-05:00
diff --git a/apps/web/app/challenges/[id]/(dashboard)/notifications/notifications-list.tsx b/apps/web/app/challenges/[id]/(dashboard)/notifications/notifications-list.tsx
@@ -38,6 +38,7 @@ function getNotificationIcon(type: string) {
     case "comment_like":
       return <Heart className="h-4 w-4 text-pink-500" />;
     case "comment":
+    case "comment_mention":
       return <MessageCircle className="h-4 w-4 text-blue-500" />;
     case "follow":
     case "new_follower":
@@ -83,6 +84,8 @@ export function getNotificationMessage(notification: Notification) {
       return `${actorName} liked your comment`;
     case "comment":
       return `${actorName} commented on your activity`;
+    case "comment_mention":
+      return `${actorName} mentioned you in a comment`;
     case "mention":
       return `${actorName} mentioned you`;
     case "forum_mention":
@@ -186,7 +189,7 @@ export function getNotificationLink(notification: Notification, challengeId: str
     const cId = notification.data?.challengeId ?? challengeId;
     return `/challenges/${cId}/users/${notification.actor.id}`;
   }
-  if (notification.type === "comment_like" && notification.data?.activityId) {
+  if ((notification.type === "comment_like" || notification.type === "comment_mention") && notification.data?.activityId) {
     const commentId = notification.data.commentId as string | undefined;
     const base = `/challenges/${challengeId}/activities/${notification.data.activityId}`;
     return commentId ? `${base}?commentId=${commentId}` : base;
diff --git a/apps/web/tests/api/comments.test.ts b/apps/web/tests/api/comments.test.ts
@@ -1,4 +1,4 @@
-import { describe, it, expect, beforeEach } from "vitest";
+import { describe, it, expect, beforeEach, afterEach, vi } from "vitest";
 import { api, internal } from "@repo/backend";
 import type { Id } from "@repo/backend/_generated/dataModel";
 import {
@@ -803,6 +803,136 @@ describe("Comments", () => {
     });
   });
 
+  // ── Comment Mention Notifications ───────────────────────────
+
+  describe("comment mention notifications", () => {
+    beforeEach(() => {
+      vi.useFakeTimers({ toFake: ["setTimeout", "clearTimeout"] });
+    });
+
+    afterEach(async () => {
+      await t.finishAllScheduledFunctions(vi.runAllTimers);
+      vi.useRealTimers();
+    });
+
+    function tiptapMention(userId: string): string {
+      return JSON.stringify({
+        type: "doc",
+        content: [
+          {
+            type: "paragraph",
+            content: [
+              { type: "text", text: "Hey " },
+              { type: "mention", attrs: { id: userId, label: "someone" } },
+              { type: "text", text: " nice work!" },
+            ],
+          },
+        ],
+      });
+    }
+
+    it("sends comment_mention notification to mentioned user", async () => {
+      const { ownerId, participantId, activityId } =
+        await setupChallengeWithActivity();
+
+      // Create a third user to be mentioned
+      const mentionedId = await createTestUser(t, {
+        email: "mentioned@example.com",
+        username: "mentioned",
+      });
+      const challengeId = (
+        await t.run(async (ctx) => ctx.db.get(activityId))
+      )!.challengeId;
+      await createTestParticipation(t, mentionedId, challengeId);
+
+      const tOwnerAuth = t.withIdentity({
+        subject: "owner-sub",
+        email: "owner@example.com",
+      });
+
+      await tOwnerAuth.mutation(api.mutations.comments.create, {
+        activityId: activityId as Id<"activities">,
+        content: tiptapMention(mentionedId as string),
+      });
+
+      // Run the scheduled sendCommentMentionNotifications
+      await t.finishAllScheduledFunctions(vi.runAllTimers);
+
+      const notifications = await t.run(async (ctx) => {
+        return ctx.db
+          .query("notifications")
+          .withIndex("userId", (q) => q.eq("userId", mentionedId))
+          .collect();
+      });
+
+      expect(notifications.some((n) => n.type === "comment_mention")).toBe(
+        true,
+      );
+      const mentionNotif = notifications.find(
+        (n) => n.type === "comment_mention",
+      )!;
+      expect(mentionNotif.actorId).toBe(ownerId);
+      expect(mentionNotif.data.activityId).toBe(activityId);
+    });
+
+    it("does NOT send comment_mention for self-mentions", async () => {
+      const { ownerId, activityId } = await setupChallengeWithActivity();
+
+      const tOwnerAuth = t.withIdentity({
+        subject: "owner-sub",
+        email: "owner@example.com",
+      });
+
+      // Owner mentions themselves
+      await tOwnerAuth.mutation(api.mutations.comments.create, {
+        activityId: activityId as Id<"activities">,
+        content: tiptapMention(ownerId as string),
+      });
+
+      await t.finishAllScheduledFunctions(vi.runAllTimers);
+
+      const notifications = await t.run(async (ctx) => {
+        return ctx.db
+          .query("notifications")
+          .withIndex("userId", (q) => q.eq("userId", ownerId))
+          .collect();
+      });
+
+      expect(notifications.some((n) => n.type === "comment_mention")).toBe(
+        false,
+      );
+    });
+
+    it("does NOT send comment_mention for plain text comments", async () => {
+      const { participantId, activityId } =
+        await setupChallengeWithActivity();
+
+      const tOwnerAuth = t.withIdentity({
+        subject: "owner-sub",
+        email: "owner@example.com",
+      });
+
+      await tOwnerAuth.mutation(api.mutations.comments.create, {
+        activityId: activityId as Id<"activities">,
+        content: "Just a plain text comment",
+      });
+
+      await t.finishAllScheduledFunctions(vi.runAllTimers);
+
+      const notifications = await t.run(async (ctx) => {
+        return ctx.db
+          .query("notifications")
+          .withIndex("userId", (q) => q.eq("userId", participantId))
+          .collect();
+      });
+
+      // Should only have the "comment" notification to the activity owner, no mention
+      expect(notifications.some((n) => n.type === "comment_mention")).toBe(
+        false,
+      );
+    });
+  });
+
   // ── Feed Score Guard ─────────────────────────────────────────
 
   describe("feed score guard", () => {
diff --git a/apps/web/tests/lib/notification-utils.test.ts b/apps/web/tests/lib/notification-utils.test.ts
@@ -40,6 +40,11 @@ describe("getNotificationMessage", () => {
     expect(getNotificationMessage(n)).toBe("Alice commented on your activity");
   });
 
+  it("returns correct message for comment_mention", () => {
+    const n = makeNotification({ type: "comment_mention" });
+    expect(getNotificationMessage(n)).toBe("Alice mentioned you in a comment");
+  });
+
   it("returns correct message for new_follower", () => {
     const n = makeNotification({ type: "new_follower" });
     expect(getNotificationMessage(n)).toBe("Alice started following you");
@@ -185,6 +190,26 @@ describe("getNotificationLink", () => {
     );
   });
 
+  it("routes comment_mention to activity page with commentId query param", () => {
+    const n = makeNotification({
+      type: "comment_mention",
+      data: { activityId: "act-1", commentId: "comm-1" },
+    });
+    expect(getNotificationLink(n, challengeId)).toBe(
+      "/challenges/challenge-1/activities/act-1?commentId=comm-1",
+    );
+  });
+
+  it("routes comment_mention to activity page without commentId when missing", () => {
+    const n = makeNotification({
+      type: "comment_mention",
+      data: { activityId: "act-1" },
+    });
+    expect(getNotificationLink(n, challengeId)).toBe(
+      "/challenges/challenge-1/activities/act-1",
+    );
+  });
+
   it("routes like with activityId to activity page", () => {
     const n = makeNotification({
       type: "like",
diff --git a/packages/backend/mutations/comments.ts b/packages/backend/mutations/comments.ts
@@ -1,8 +1,10 @@
-import { mutation } from "../_generated/server";
+import { internalMutation, mutation } from "../_generated/server";
 import { v } from "convex/values";
 import type { Id } from "../_generated/dataModel";
 import type { MutationCtx } from "../_generated/server";
+import { internal } from "../_generated/api";
 import { requireCurrentUser } from "../lib/ids";
+import { extractMentionedUserIds } from "../lib/mentions";
 import { insertNotification } from "../lib/notifications";
 import { recomputeFeedScore } from "../lib/feedScore";
 
@@ -67,13 +69,62 @@ export const create = mutation({
       });
     }
 
+    // Send mention notifications async
+    const mentionedUserIds = extractMentionedUserIds(args.content);
+    if (mentionedUserIds.length > 0) {
+      await ctx.scheduler.runAfter(
+        0,
+        internal.mutations.comments.sendCommentMentionNotifications,
+        {
+          commentId,
+          activityId: args.activityId,
+          actorId: user._id,
+          mentionedUserIds,
+        },
+      );
+    }
+
     // Recompute feed score after new comment
     await recomputeFeedScore(ctx, args.activityId);
 
     return commentId;
   },
 });
 
+/**
+ * Internal: send mention notifications for a comment on an activity.
+ */
+export const sendCommentMentionNotifications = internalMutation({
+  args: {
+    commentId: v.id("comments"),
+    activityId: v.id("activities"),
+    actorId: v.id("users"),
+    mentionedUserIds: v.array(v.string()),
+  },
+  handler: async (ctx, args) => {
+    const now = Date.now();
+    for (const userId of args.mentionedUserIds) {
+      // Skip self-mentions
+      if (userId === args.actorId) continue;
+
+      // Verify the user exists
+      const user = await ctx.db.get(userId as Id<"users">);
+      if (!user) continue;
+
+      await ctx.db.insert("notifications", {
+        userId: userId as Id<"users">,
+        actorId: args.actorId,
+        type: "comment_mention",
+        data: {
+          activityId: args.activityId,
+          commentId: args.commentId,
+        },
+        createdAt: now,
+      });
+    }
+  },
+});
+
 /**
  * Create a comment on a feedback item. Reporter and admins can comment.
  */
diff --git a/tasks/2026-03-13-fix-comment-tag-notifications.md b/tasks/2026-03-13-fix-comment-tag-notifications.md
@@ -0,0 +1,21 @@
+# Fix Comment Tag Notifications
+
+**Date:** 2026-03-13
+**Description:** @mentions in activity comments were not triggering notifications in the notification feed.
+
+## Root Cause
+
+The `comments.create` mutation notified the activity owner but did not extract `@mention` nodes from the Tiptap JSON content. The forum posts module already had this working via `extractMentionedUserIds` + a scheduled internal mutation, but comments never implemented the same pattern.
+
+## Changes
+
+- [x] Import `extractMentionedUserIds` and `internal` in `packages/backend/mutations/comments.ts`
+- [x] After creating a comment, extract mentioned user IDs from Tiptap content and schedule `sendCommentMentionNotifications`
+- [x] Add `sendCommentMentionNotifications` internal mutation (skips self-mentions and non-existent users)
+- [x] Add `comment_mention` notification type to frontend icon map, message generator, and link handler
+- [x] Deep-link comment mention notifications to the specific comment on the activity page
+
+## Files Modified
+
+- `packages/backend/mutations/comments.ts` — mention extraction + internal mutation
+- `apps/web/app/challenges/[id]/(dashboard)/notifications/notifications-list.tsx` — UI for `comment_mention` type
