implemented comment deletion

Author: ksraj123

src/user/Admin/Tickets/TicketDiscussion/Discussion/Discussion.js

@@ -13,6 +13,7 @@ import SendOutlinedIcon from "@material-ui/icons/SendOutlined";
 import userIcon2 from "../../../../../assets/images/userIcon2.jpg";
 import ThumbDownOutlinedIcon from "@material-ui/icons/ThumbDownOutlined";
 import ThumbUpAltOutlinedIcon from "@material-ui/icons/ThumbUpAltOutlined";
+import DeleteOutlineOutlinedIcon from "@material-ui/icons/DeleteOutlineOutlined";
 
 class Discussion extends Component {
   constructor(props) {
@@ -169,7 +170,17 @@ class Discussion extends Component {
                   />
                 </div>
                 <div className="img-desc">
-                  <h2>{ele.createdBy.name}</h2>
+                  <h2>
+                    {ele.createdBy.name}
+                    {this.props.deleteAllowed && <DeleteOutlineOutlinedIcon
+                      style={{
+                        color: "rgba(0,0,0,0.5)",
+                        fontSize: "18px",
+                        cursor: "pointer"
+                      }}
+                      onClick={() => this.props.deleteComment(ele._id)}
+                    />}
+                  </h2>
                   <p className="discussion-date">
                     <Moment format="DD MMM YYYY">{ele.createdAt}</Moment>
                   </p>

src/user/Admin/Tickets/TicketDiscussion/TicketDiscussion.scss

@@ -146,6 +146,7 @@
                 width: 50px;
                 height: 40px;
                 display: flex;
+                cursor: pointer;
                 align-items: center;
                 span {
                   margin-left: 5px;

src/user/Admin/Tickets/TicketDiscussion/TicketDiscussions.js

@@ -37,6 +37,9 @@ class TicketDiscussions extends Component {
       localStorage.getItem("ticketModerator") === "true" ||
       localStorage.getItem("admin") === "true" ||
       localStorage.getItem("userId") === ticket.createdBy.id;
+    this.deleteAllowed =
+      localStorage.getItem("ticketModerator") === "true" ||
+      localStorage.getItem("admin") === "true";
     this.setState({ ticket: ticket });
   };
 
@@ -106,6 +109,21 @@ class TicketDiscussions extends Component {
     }
   };
 
+  handleCommentDelete = async (commentId) => {
+    try {
+      const newTicket = (
+        await Axios.delete(
+          `${BASE_URL}/ticket/${this.state.ticket._id}/comment/${commentId}`
+        )
+      ).data.ticket;
+      this.setState({
+        ticket: newTicket,
+      });
+    } catch (err) {
+      console.log(err);
+    }
+  };
+
   handleAddTag = async (tagName) => {
     if (this.state.ticket.tags.indexOf(tagName) !== -1) {
       toast.error("Tag already present");
@@ -172,8 +190,10 @@ class TicketDiscussions extends Component {
                 ticket={this.state.ticket}
                 sendComment={this.sendComment}
                 editsAllowed={this.editsAllowed}
+                deleteAllowed={this.deleteAllowed}
                 updateTicket={this.handleUpdateTicket}
                 upVoteComment={this.handleCommentUpvote}
+                deleteComment={this.handleCommentDelete}
                 downVoteComment={this.handleCommentDownvote}
               />
             )}