> For the complete documentation index, see [llms.txt](https://docs.airdev.co/canvas-pages-and-modules/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.airdev.co/canvas-pages-and-modules/master-1/modules/nested-comments-thread-with-like-and-reply.md).

# 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.

![](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-Lch7DC2oqHIVpJRm3yA%2F-Lch8pSzvdQYop-esK5S%2FScreen%20Shot%202019-04-17%20at%202.15.01%20PM.png?alt=media\&token=098d5092-2de3-4ac1-ae51-4b106da57e4f)

## 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.

![](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-Lch7DC2oqHIVpJRm3yA%2F-LchENP8lge_ex4FkJgS%2FScreen%20Shot%202019-04-17%20at%202.35.14%20PM.png?alt=media\&token=79e6e978-6333-4f63-8078-bc5462020ee9)

## 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.

![](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-LbzT1_Nv9ROKl9Gt5jw%2F-LbzWjPZiiLmw8oGahZx%2Fimage.png?alt=media\&token=0b34150f-1f6d-4dc5-8e11-11a1fed306a5)

* 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`.

![](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-Lch7DC2oqHIVpJRm3yA%2F-LchFAIe395PmeYUl5Oe%2FScreen%20Shot%202019-04-17%20at%202.42.44%20PM.png?alt=media\&token=1e51f264-eec0-4aa9-942c-3cc412b86be6)

* 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;

![](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-Lch7DC2oqHIVpJRm3yA%2F-LchFU23O4r3ISmmKGbR%2FScreen%20Shot%202019-04-17%20at%202.44.07%20PM.png?alt=media\&token=fae1f1d6-44f1-400b-a09a-4bddac614fb8)

* 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.

![](https://8331092-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-LbzT1_Nv9ROKl9Gt5jw%2F-LbzXakg9MJ1NnGHtqbl%2Fimage.png?alt=media\&token=1d1448d4-c101-4c7c-93b2-b704dd186288)

* 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)
