Skip to content

feat: @mentions in comments and posts with notifications and username autocomplete #105

@kingRayhan

Description

@kingRayhan

Summary

Support @username mentions in comments and posts (articles / diary bodies). When a user is mentioned, they should receive a notification. While typing @, show a dropdown that suggests matching usernames (search-as-you-type).

Motivation

  • Surface relevant people in discussions and collaborative editing.
  • Align with familiar patterns from GitHub, Slack, etc.

Scope (suggested)

Where mentions work

  • Comments (CommentSection / comment create flows for articles, gists, etc.).
  • Article body (editor + rendered markdown if we parse mentions server-side for notifications).

UX

  • Trigger autocomplete when user types @ followed by optional query (debounced).
  • Dropdown: avatar, display name, @username; keyboard navigation; select inserts @handle or normalized token agreed by product.
  • Avoid firing inside code fences / Markdoc {% %} if feasible (parity with “no linkify in code” behavior).

Backend / data

  • User search API or server action: prefix (or fuzzy) match on username / name, rate-limited, auth-required where appropriate.
  • Persistence: store mention targets on comment (and article revision if mentions in body) — e.g. JSON array of user_id or join table comment_mentions.
  • Notifications: extend existing notification pipeline (notifications.actions, types in domain-models) with e.g. MENTION_IN_COMMENT / MENTION_IN_ARTICLE (exact naming TBD), dedupe idempotency similar to other notification types.

Out of scope (optional follow-ups)

  • Email digest for mentions.
  • Mentioning teams or @here.

Acceptance criteria (draft)

  • Typing @ in a supported composer shows a suggestion list populated from the backend.
  • Selecting a user inserts a stable mention syntax that survives save/load.
  • On submit, mentioned users receive an in-app notification (and unread count updates if applicable).
  • Mentioned users who are not allowed to view the resource do not receive notifications (or receive no link — product decision).

References

  • Notifications: src/backend/services/notifications.actions.ts, MyNotificationsFeed, NotificationType in domain models.
  • Comments: comment section components and related server actions.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions