Comment refers to a user-generated response or reaction to a specific piece of content, such as a post or content. Comments enable users to engage in conversations and express their thoughts, opinions, and emotions about the content they see. They provide a way for users to interact with each other and create a sense of community around the content. Commenting is an essential feature for social platforms as it encourages user engagement, helps create a more immersive experience for users, and can be used to generate insights into user behavior and preferences. In a Social Plus SDK product, the SDK provides the necessary tools and functionality for developers to integrate commenting into their apps or websites.

Furthermore, a comment supports real-time events and Live Object features, for more information please refer to Live Objects/Collections and Realtime Events.

Comment Reference Type

Incorporating comment reference types within your app enhances user engagement and promotes interaction, as it allows users to comment on both regular posts and content-specific posts. By differentiating between these two comment types, your app can provide a more organized and contextual commenting experience, catering to the diverse needs of your users and the content they interact with. Comment's referenceType can be:

1. Post type comment: A post type comment is designed for regular posts, such as text updates, photos, or videos shared by users. These comments are associated with the regular post and are displayed beneath it, facilitating conversation and interaction.

2. Story type comment: Similar to post-type comments, these comments are associated with each story, driving user conversation.

3. Content type comment: A content type comment, on the other hand, is intended for content-specific posts, such as articles, or other specialized content.

Comment Repository

The functionality of comments can be utilized through the Comment Repository, which offers methods for interacting with a data source that stores posts. This includes methods for querying comments, creating a new comment, updating an existing comment, or deleting a comment.

import { CommentRepository } from '@amityco/js-sdk';

Comment Description

Social Plus SDK's comment creation is designed to handle comments efficiently and reliably across your application. Each comment is assigned a unique, immutable commentId, and the SDK includes an optimistic update feature to enhance user experience.

To work with comments, you'll need to use the CommentRepository.

With the SDK's optimistic creation feature, you don’t need to manually create a commentId. Instead, the SDK generates one automatically. However, you must provide the referenceId and referenceType parameters. This feature enables the app to display the comment immediately while assuming it will be successfully added, reducing perceived latency for users.

The referenceType parameter specifies the type of content the comment is associated with. Supported values are:

• post: Create a comment on a post.

• story: Create a comment on a story.

• content: Create a comment on other content types.

Create a Comment with an Image

Social Plus SDK also allows you to create comments with images. This feature works seamlessly with the SDK’s optimistic creation mechanism, ensuring the same fast and responsive user experience as with text comments.

The referenceType parameter determines the content type the image comment is associated with. Supported values are:

• post: Create a comment on a post.

• story: Create a comment on a story.

• content: Create a comment on other content types.

To create an image comment, you’ll need to:

1. Upload the image to obtain a fileId.

2. Provide the fileId in the attachments parameter along with the required referenceId and referenceType.

The SDK automatically generates a unique commentId for the image comment and handles the creation process optimistically.

Reply to a Comment

In addition to creating top-level comments, Social Plus SDK enables you to reply to existing comments in addition to creating top-level comments.

To reply to a comment, you must:

1. Specify the parent comment's commentId using the parentId parameter.

2. Provide the referenceId, referenceType, and the reply’s text content.

The referenceType parameter also supports replies to comments on stories. To reply to a story comment:

• Set referenceType to .story.

• Provide the corresponding referenceId for the story.

Similar to top-level comments, replies leverage the SDK's optimistic creation feature. You don’t need to provide a unique commentId for the reply, the SDK generates it automatically while associating it with the parent comment.

Reply to Comments with an Image

The ability to query comments and their replies is essential for creating a robust and user-friendly commenting experience. By using the getComments() method and passing in the appropriate parameters, you can retrieve the comments and replies that are most relevant to your users.

Comment Replies

The query returns a LiveCollection of all matching comments available. To retrieve replies to a specific comment, you can pass the commentId as the parentId. If you want to retrieve parent-level comments, pass parentId = null. If you omit the parentId, you'll receive all comments on all levels.

Deletion Filter

You can also use the includeDeleted() method to query for deleted comments and their replies. By passing true or false to this method, you can include or exclude deleted comments from the results.

The referenceType parameter specifies where the comment is made and helps filter the comments based on the type of content. Possible values include:

• post: Comments on posts.

• story: Comments on stories.

• content: Comments on other types of content (e.g., images, videos, etc.).

How to Query Comments

To query comments, provide the referenceType and referenceId. You can also include additional filters like parentId, includeDeleted, and orderBy to control the results.

To query comments for a post (including replies and excluding deleted comments):

Query Comments with Images

To query for image comments only, you can use the dataTypes parameter and pass the value TEXT , IMAGE, or both. There are two options for the dataTypes parameter: any and exact.

• any - When you use the any option, the retrieved comments will include any comment that contains at least one of the specified data types. For example, if you pass [image, text], the retrieved comments may contain only image content, only text content, or both image and text content.

• exact - On the other hand, when you use the exact option, the retrieved comments will include only comments that contain all of the specified data types. For example, if you pass [image, text], the retrieved comments must contain both image and text content. If you pass [image], the retrieved comments must contain only image content.

To query for comments containing only image content:

Refer to the following Limitations on the use of images in comments.

Social Plus SDK offers the AmityComment data type, which supports two types of content: TEXT and IMAGE. Users can view comments that include text, images, or a combination of both, providing a more versatile and engaging experience for your app's users.

The Social Plus SDK provides functionality that allows you to work with social features in your application, including the ability to retrieve a comment. In this section, we'll explore how to use the Social Plus SDK to retrieve a single comment from your application. By using a specific function provided by the SDK, you can retrieve a comment based on its ID, which provides a convenient way to access specific comment data. The retrieved result is returned as a live object of a comment. For more information on live objects, please refer to Live Objects/Collections.

To retrieve multiple comments, you can use getCommentByIds method provided by CommentRepository. This method accepts a collection of commentId as a parameter and returns a Live Collection ofAmityComment.

The Social Plus SDK offers the getLatestComment method, allowing you to fetch the most recent comment by a reference within your application. Integrating this feature enhances the user experience by keeping them informed about the latest interactions among users.

Using the getLatestComment method is straightforward: simply implement it to retrieve the latest comment by a reference, streamlining the process of accessing up-to-date information. Furthermore, the method returns a Live Object that you can observe for real-time updates once Realtime Events are subscribed, ensuring your app stays current with the latest comments and fostering a more interactive environment.

Social Plus SDK provides a comment editing functionality that fosters accountability and user awareness within your application. This feature enables users to edit their own comments exclusively. Users can only edit their comments, which encourages responsible interactions and maintains accountability. Upon completing an edit operation, the SDK updates the editedAt property to the current time, reflecting the changes made by the user. You can then leverage the updated editedAt timestamp to create a user interface that informs users of edited comments, fostering transparency.

Edit Comment with Image

Social Plus SDK extends its comment editing functionality to include images, allowing users to update their comments with images. This feature enables users to modify not only the text but also the images associated with their comments, providing a richer and more engaging experience for your app's audience.

Before editing images in comments, it is crucial to upload the images that will be included in the comment data to ensure that the necessary information is accessible and can be linked to the comment. This requires uploading the file first, to obtain the file data that will be used in creating the file post. To upload a file, please refer to Upload Images.

Upon successful completion of the file upload process, you can include the image data as a parameter when updating comments as demonstrated in the code sample below.

Refer to the following Limitations on the use of images in comments.

The SDK provides functionality for soft and hard deleting comments. Soft delete marks the comment as deleted while still keeping it in the system with the isDeleted flag set to true. On the other hand, hard delete completely removes the comment data, including its reactions and replies, from the system.

The need for soft and hard delete functions arises when users want to manage the comments on their app. Soft delete is helpful in situations where the comment has been flagged and needs to be hidden from users without actually deleting the comment. Hard delete, on the other hand, is useful in cases where the comment content is inappropriate and must be permanently deleted from the app.

To hard delete a comment, you can use the AmityCommentRepository, which provides a deleteComment method. When using this method, you need to pass the commentId and a boolean hardDelete parameter. Set the boolean parameter to true for hard delete and false for soft delete. If you do not specify the boolean parameter, it will be set to false by default, equivalent to a soft delete. It's important to note that hard-deleting children's comments will not delete the parent's comments.

It's worth mentioning that hard deleting posts and comments is only supported via SDK, with UIKit and Console support potentially being added in the future. By implementing the soft and hard delete features provided by Social Plus SDK, you can give your app's users more control over the comments they interact with while maintaining a safe and appropriate community.

const comment = await CommentRepository.deleteComment('commentId', true);

{
    "success": true
}

Flag

The Social Plus SDK product also includes a flag method that allows users to flag comments in their app. Once a comment is flagged, an indicator will appear in the Admin console, where an administrator can review and validate the flag. If the content is found to be in violation of your app's policies, it can be deleted from the app. On the other hand, if the content is not found to be in violation, the flag can be revoked.

This method allows users to notify the community moderators or admins about comments that they believe violate the community guidelines or are otherwise inappropriate. By flagging a post with reason that we provided, users can help ensure that the community remains a safe and welcoming place for all members.

Unflag

Another useful feature is the unflag method, which enables users to revoke a previously flagged comment. If a user flags a comment by mistake or if the comment is found not to violate your app's policies after review, the unflag method can be used to remove the flag from the comment. It ensures that users have control over the content they flag and the ability to reverse their flag if necessary.

Check for isFlaggedByMe

The isFlaggedByMe method allows users to check whether they have previously flagged a particular comment. This method provides a convenient way for users to keep track of the content they have flagged and to ensure that they are staying up-to-date with their moderation activities.

By using the isFlaggedByMe method, your app's users can quickly determine whether they have already flagged a particular comment and avoid duplicating their efforts.

The myReactions property allows users to retrieve a list of all reactions they have made on a particular comment. This feature makes it easy for users to keep track of their own reactions and to see how their engagement with the post has evolved over time.

The reactions property, on the other hand, provides a list of all reactions made on the post. This includes reactions made by other users, providing a broader perspective on the post's overall engagement and sentiment.

Finally, the reactionsCount property provides a simple way to get the total count of reactions on a comment. By using this property, users can quickly see how popular a post is and how engaged the community is with the content.

For more details on Reactions, refer to our Reactions documentation.

Mentions allow users to tag other users in comments. It's a powerful tool for fostering engagement and collaboration within your social application. With mentions, users can easily notify specific individuals or groups to new content or important updates. In the SDK, mentions can be implemented in a range of ways, depending on your application's needs and user experience. For more information about mentions, please refer to Mentions.

Create Comment with Mentions

You can easily mention users when creating a comment by including their user IDs in the mention user parameter as well as defining metadata for mention rendering. For further explanation, please refer to Mention Users.

Update Comment with Mentions

We provide developers with an efficient method for updating comments with mentions of specific users, you can easily add mentions to their post updates and but it will not notify the relevant users.

To remove mentions you can provide an empty JSON object for the metadata parameter, and an empty list for the mention users parameter. By doing so, You can easily remove mentions from the post content, while ensuring that the overall structure of the post remains intact.:

Render Mentions

To render mentions in a supported feature, please refer to Render Mentions, specifically the section on handling mentions. This documentation provides detailed information on how to represent mentions in your application, including information on metadata structure, custom mention objects, and rendering support.