# Nested Comments Thread (with Like and Reply)

## Overview

This module is a list of comments or messages by different users, with the ability for a user to create a new comment, reply, or like a comment. It can be added on any object (a topic, a product, etc.). App admins (or users with admin access) will be able to click on the `... icon` to delete any comment in the thread via a menu focus group.

![](/files/-Lch8pSzvdQYop-esK5S)

## Structure

* When this module is added to a page, it has a reusable element inside called `nestedcomments`. This reusable element contains all of the logic and UI for the module.
* Within the `nestedcomments` reusable element, there is another reusable element called `commentsmenufocusgroup`. For more information on how to use `menufocusgroups`, please [click here](https://docs.airdev.co/canvas/assets/reuseables/menufocusgroup).
* The module also comes with a data type called `t-Comments`.  This is the data type that will store all of the comments.
* All of the parent comments are displayed in `RepeatingGroup t-Comment parent` and all of the children comments are displayed in `RepeatingGroup t-Comment`.
* `Button POST` creates a new parent comment.
* `Button REPLY` creates a new child comment.
* `Text Like` likes a comment.
* `Group Option 2 (Delete)` deletes a comment.

![](/files/-LchENP8lge_ex4FkJgS)

## How to set up

* Add a field to the `t-Comment` data type that represents the object on which you want users to comment. For example, if you want users to comment on products, you should add a `Product` field.

![](/files/-LbzWjPZiiLmw8oGahZx)

* Open the `nestedcomments` reusable&#x20;
* Modify the type of content displayed in the reusable to be whatever object for which you want to show comments. In this case you should make the group type be `Product`.

![](/files/-LchFAIe395PmeYUl5Oe)

* Modify the data source for `RepeatingGroup t-Comment parent` to include whatever filter you need. In this case, you should only include comments that are linked to the Product being displayed. &#x20;

![](/files/-LchFU23O4r3ISmmKGbR)

* Modify the action that runs when the `Button POST` is clicked to also link the `t-Comment` created to the relevant object, in this case the Product that's displayed in the reusable.

![](/files/-LbzXakg9MJ1NnGHtqbl)

* Add a data source whenever you use the `nestedcomments` reusable that links to the appropriate object (in this case the Product that's displayed on the page).

![](https://blobscdn.gitbook.com/v0/b/gitbook-28427.appspot.com/o/assets%2F-LbzMeM9XfnblRd78nga%2F-Lch7DC2oqHIVpJRm3yA%2F-LchG49kVyGKPKOGu1fS%2FScreen%20Shot%202019-04-17%20at%202.46.44%20PM.png?alt=media\&token=9db98455-a020-409f-9ebb-de196cd1fb21)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.airdev.co/canvas-pages-and-modules/master-1/modules/nested-comments-thread-with-like-and-reply.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
