{
  "from": {
    "color": "#FDA192",
    "contacts": [
      {
        "email": "maria@trysnippyly.com",
        "name": "Maria Garcia",
        "userId": "2"
      },
      {
        "email": "sarah@trysnippyly.com",
        "name": "Sarah Wilson",
        "userId": "3"
      }
    ],
    "email": "john@trysnippyly.com",
    "name": "John Smith",
    "plan": "free",
    "type": "signedIn",
    "userId": "1",
    "userSnippylyId": "7828918330450307"
  },
  "commentText": "comment 1.1",
  "commentTextFrom": {
    "color": "#FDA192",
    "contacts": [
      {
        "email": "maria@trysnippyly.com",
        "name": "Maria Garcia",
        "userId": "2"
      },
      {
        "email": "sarah@trysnippyly.com",
        "name": "Sarah Wilson",
        "userId": "3"
      }
    ],
    "email": "john@trysnippyly.com",
    "name": "John Smith",
    "plan": "free",
    "type": "signedIn",
    "userId": "1",
    "userSnippylyId": "7828918330450307"
  },
  "toContactsTagged": [],
  "toContactsUpdated": [],
  "pageTitle": "Velt React Demo",
  "pageUrl": "http://localhost:3000/?scommentId=-NopwKerRE6Ukaqijp5k",
  "actionType": "newlyAdded",
  "status": {
    "color": "#625DF5",
    "id": "OPEN",
    "lightColor": "#E7E8FA",
    "name": "Open",
    "svg": "\n      <svg\n        width=\"16\"\n        height=\"16\"\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M8.00016 13.3333C10.9457 13.3333 13.3335 10.9455 13.3335 8.00001C13.3335 5.05449 10.9457 2.66668 8.00016 2.66668C5.05464 2.66668 2.66683 5.05449 2.66683 8.00001C2.66683 10.9455 5.05464 13.3333 8.00016 13.3333ZM8.00016 14.6667C11.6821 14.6667 14.6668 11.6819 14.6668 8.00001C14.6668 4.31811 11.6821 1.33334 8.00016 1.33334C4.31826 1.33334 1.3335 4.31811 1.3335 8.00001C1.3335 11.6819 4.31826 14.6667 8.00016 14.6667Z\"\n          fill=\"currentColor\"\n        />\n      </svg>\n      ",
    "type": "default"
  },
  "notificationSource": "comment",
  "slackChannelId": "",
  "documentId": "6952850071713467",
  "clientDocumentId": "http://localhost:3000/123",
  "deviceInfo": {
    "browserName": "Chrome",
    "browserVersion": "120",
    "deviceType": "Tablet",
    "orientation": "portrait",
    "osName": "Macintosh",
    "osVersion": "10.15.7",
    "screenHeight": 982,
    "screenWidth": 1512,
    "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36"
  },
  "targetAnnotationId": "-NopwKerRE6Ukaqijp5k", 
  "targetComment": { 
    "commentHtml": "comment 1.1",
    "commentId": 738538,
    "commentText": "comment 1.1",
    "from": {
      "color": "#FDA192",
      "contacts": [
        {
          "email": "maria@trysnippyly.com",
          "name": "Maria Garcia",
          "userId": "2"
        },
        {
          "email": "sarah@trysnippyly.com",
          "name": "Sarah Wilson",
          "userId": "3"
        }
      ],
      "email": "john@trysnippyly.com",
      "name": "John Smith",
      "plan": "free",
      "type": "signedIn",
      "userId": "1",
      "userSnippylyId": "7828918330450307"
    },
    "lastUpdated": "2024-01-23T10:50:31.630Z",
    "status": "added",
    "type": "text"
  },
  "targetCommentId": 738538
}

The Comments component will emit webhook notifications whenever an action type occurs on a comment.

To read more about how to setup webhooks with our SDK, click here.

List of Action Types

Action TypeDescription
newlyAddedWhen the first comment in a thread is added
addedWhen a new comment is added. Not used for the first comment in a thread - see newlyAdded
updatedWhen an existing comment gets updated
deletedWhen an existing comments gets deleted
approvedWhen the comment is approved by the moderator. This is only applicable if you have turned on Moderator Mode.
assignedWhen a comment gets assigned to a user
statusChangedWhen a comment has its status changed (e.g. in progress, resolved, opened)
priorityChangedWhen a comment has its priority changed (e.g. P0, P1, P2 or custom set priorities)
accessModeChangedWhen a comment gets assigned to a user
acceptedWhen a comment gets accepted by the moderator. This is only applicable if you have turned on Moderator Mode.
rejectedWhen a comment gets rejected by the moderator. This is only applicable if you have turned on Moderator Mode.

Processed vs Raw Formats

The Raw Format contains lot more metadata that might not be very useful for your notification processing.

In the Processed Format, we will automatically populate who should get what type of notification so that you dont have to write that logic. Eg: If someone was previously tagged on a comment, then they should receive an update notification vs if someone if tagged in this thread, then they should receive a notification that they were tagged in a comment. We recommend using this so that you dont have to maintain the logic on your end.

Processed format

FieldTypeRequiredDescription
fromUserYesThe user who added, updated or deleted the target Comment.
commentTextstringOptionaltext for the added, updated or deleted Comment. This is empty when entire CommentAnnotation is deleted.
toContactsTaggedUserContact[]OptionalList of user contacts that are tagged to the target Comment.
toContactsUpdatedUserContact[]OptionalList of user contacts that are on the target CommentAnnotation. This excludes all the user contacts that are on the target Comment.
pageTitlestringYesTitle of the page on which the target CommentAnnotation is present.
pageUrlstringYesFull URL of the page on which the target CommentAnnotation is present.
actionTypestringYesThis can have 5 values: added, updated, deleted, resolved, approved
targetAnnotationIdCommentOptionalThe ID of the target annotation
targetCommentCommentOptionalThe target Comment object on which the event happened. This field will not be present if the event was at CommentAnnotation level. Eg: deleted the entire comment annotation, resolved comment, approved comment.
targetCommentIdstringOptionalThe ID of the target Comment

Raw format

FieldTypeRequiredDescription
commentAnnotationCommentAnnotationYesThe target CommentAnnotation object on which the event happened.
targetCommentCommentOptionalThe target Comment object on which the event happened. This field will not be present if the event was at CommentAnnotation level. Eg: deleted the entire comment annotation, resolved comment, approved comment.
actionTypestringYesThis can have 5 values: added, updated, deleted, resolved, approved
notificationSourcestringYesIndicates the source of the notification
actionUserstringYesContains information about the user who performed the action, including their name, email, and user ID.
metadatastringYesThis field contains additional metadata related to the annotation, such as the API key, client document ID, document ID, and information about various locations where the annotation is associated with a web page.