Introduction

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…