This component is developed as a SharePoint Framework Web-part to capture and store the comments. The web part can be used as replacement for the out-of-box comments box that is available in SharePoint Online. You can disable the out-of-box comments and this web-part to a page, save it as a template and you can start creating the pages based on the template.
Features
- Comments classification by Popular, Newest, Oldest and Attachments
- Support for sharing images, document, videos.
- Options like Edit, Reply (nested comments) & Delete are available.
- You can like the comments shared.
- You can make use of Hashtag & Ping Users.
- You can make use of Document Preview feature to view the files and videos shared in the comments.
- New icon will be displayed based on the current day’s comments
Properties
There are few properties associated with this web-part which gives you full control on the features, you shall be able to enable or disable features based on the configuration. Below are the properties that are configurable
- Date Time format on when the comments were added or modified
- Profile Picture style, whether it has to be rounded or square
- Enable or Disable Navigation whether to display the comments classification
- Enable or disable Attachments. Following properties are required when attachments are enabled
- Library to store the files uploaded.
- Allowed File Formats in the comments box.
- Maximum File Size allowed.
- Ping Users will allow to mention the users. The users are pulled from the Site Users.
- Edit comments can be enabled or disabled to allow the users to edit the comments. Files added can be deleted not edited.
- Delete option can be enabled or disabled to allow the users to delete the comments. Comments with no-replies are allowed to delete. Delete is allowed only if Edit is allowed.
- Up voting of comments to like or dislike the comments.
- Hashtags
- Document Preview can be enabled or disabled for the office files and videos.
Preview
Below is a short video presented in the SharePoint Framework community call.
Source Code
The above web-part is shared with the community and is of free to use. Please click the below link to download the code and have fun.
https://github.com/pnp/sp-dev-fx-webparts/tree/master/samples/js-advanced-commenting
Happy Coding…
Knowledge Share 
Do the comments autorefresh without a page refresh?
LikeLike
Hi Shawn, the comments are not auto refreshed. I am planning to implement the auto update. Thanks for trying out the component, let me know if have any feedbacks.
LikeLike
Hi Sudarshan, Can this be used for classic pages?
LikeLike
I havent tried. Let me know if you have any issues. It should work.
LikeLike
Thanks – I took the source code, and updated to allow for “multiple” webparts on a page. We now have a 9 webpart page – with a photo and then comments/likes for each. It’s a gallery of images, with a separate LIKE/COMMENT for each.
I’ve made a set of changes – and can add them back to the repo – or include a screenshot/video – but I couldn’t find your email address.
LikeLike
You can use the contact page and send me your queries.
LikeLike
How to delete comments automatically from the root page comments list after someone deleted his/her comment on the web part located on news page?
LikeLike
Hi, when there is delete option enabled, the comments are deleted automatically from the list when the user deletes a comment. I am not sure what do u mean by root page comments and news page. Can you please explain in detail?
LikeLike