---
name: bijection-comments
description: "Evaluate and integrate the Comments component with Bijection."
---

# Comments

Threads, mentions and comments

- Package: @bijectionhq/comments
- Category: Collaboration
- Status: Preview
- License: Apache-2.0
- Bijection source (repository access required): https://github.com/bijectionhq/comments/tree/6ca6359f8a3746db5d2706fc7a7951738a42a2b7
- Upstream: https://github.com/hamzasaleem2/convex-comments/tree/5015cc7c651857abca5c7d0a6df683b9e4968865
- Documentation: https://docs.bijection.com/components/using
- Directory: https://bijection.com/components/comments

## Get the source

Bijection repository access is required. Request access at https://bijection.com/contact.

```sh
git clone https://github.com/bijectionhq/comments.git
cd comments
git checkout 6ca6359f8a3746db5d2706fc7a7951738a42a2b7
```

## Before using this component

Read the package README at the recorded revision for setup, dependencies, and API examples. Upstream documentation describes the original package and may differ from the Bijection adaptation. This is a source candidate for evaluation. Catalog inclusion does not establish npm availability or runtime qualification. Check compatibility with your SDK and deployment before adoption. External providers run their own compute.

## Integration workflow

1. Read the source README and package manifest at the recorded revision.
2. Confirm the required SDK, dependency availability, and runtime compatibility.
3. Follow the component's documented setup and configuration. Never invent an npm install command from a catalog package name.
4. Keep credentials in the project's existing secret store.
5. Follow the project's execution rules for verification and report what was actually checked.

## Original upstream skill

The following guidance describes @hamzasaleemorg/convex-comments. Its installation commands and APIs refer to the upstream package. Evaluate compatibility with the Bijection source separately.


# Convex Comments 

## Instructions

A complete comments system component that adds threaded discussions with real-time features to any Convex application. It provides backend functions for managing comment threads organized into zones, messages with automatic mention parsing, emoji reactions, and typing indicators. The component includes optional React UI components and supports both simple flat comment lists and positioned comments for document annotation workflows.

### Installation

```bash
npm install @hamzasaleemorg/convex-comments
```

## Use cases

• **Document collaboration** - Add comment threads to pages, posts, or documents where users need to discuss specific content with mentions and reactions
• **Code review systems** - Implement threaded discussions on pull requests or code changes with positioned comments anchored to specific line numbers
• **Design tool feedback** - Enable stakeholders to leave comments at specific x/y coordinates on designs, mockups, or canvas-based applications
• **Content management workflows** - Build approval processes where editors can comment on drafts, resolve discussion threads, and track conversation history
• **Video or media annotation** - Allow users to comment at specific timestamps or regions within media content with persistent positioning

## How it works

The component organizes comments into a three-tier hierarchy: zones (containers tied to your entities like documents or posts), threads (conversation groups within zones), and messages (individual comments). You integrate it by adding the component to your `convex.config.ts`, then create wrapper functions that call the provided `Comments` class methods like `getOrCreateZone()` and `addComment()`.

The quickstart pattern uses `getThreadForDocument()` to handle the zero-to-one setup, automatically creating a zone for your entity ID and ensuring a default thread exists. Messages support automatic parsing of mentions and links, emoji reactions via `toggleReaction()`, and real-time typing indicators through `setIsTyping()` with automatic expiration.

For advanced use cases, threads accept an optional `position` field in `addThread()` to anchor comments to specific locations like canvas coordinates or document paragraphs. The component provides three integration approaches: the type-safe `Comments` class, direct component calls via `ctx.runMutation()`, or generated wrapper functions through `exposeApi()` with built-in authentication.

## When NOT to use

- When a simpler built-in solution exists for your specific use case
- If you are not using Convex as your backend
- When the functionality provided by Convex Comments  is not needed

## Resources

- [npm package](https://www.npmjs.com/package/%40hamzasaleemorg%2Fconvex-comments)
- [GitHub repository](https://github.com/hamzasaleem2/convex-comments)
- [Live demo](https://convex-comments.vercel.app)
- [Convex Components Directory](https://www.convex.dev/components/hamzasaleem2/convex-comments)
- [Convex documentation](https://docs.convex.dev)