1 files changed, 21 insertions, 7 deletions
diff --git a/app/assets/javascripts/notes/components/noteable_note.vue b/app/assets/javascripts/notes/components/noteable_note.vue
index 7579fc852c6..f391ed848a4 100644
--- a/app/assets/javascripts/notes/components/noteable_note.vue
+++ b/app/assets/javascripts/notes/components/noteable_note.vue
@@ -52,7 +52,7 @@ export default {
       return this.note.resolvable && !!this.getUserData.id;
     },
     canReportAsAbuse() {
-      return this.note.report_abuse_path && this.author.id !== this.getUserData.id;
+      return !!this.note.report_abuse_path && this.author.id !== this.getUserData.id;
     },
     noteAnchorId() {
       return `note_${this.note.id}`;
@@ -81,13 +81,17 @@ export default {
     ...mapActions(['deleteNote', 'updateNote', 'toggleResolveNote', 'scrollToNoteIfNeeded']),
     editHandler() {
       this.isEditing = true;
+      this.$emit('handleEdit');
     },
     deleteHandler() {
+      const typeOfComment = this.note.isDraft ? 'pending comment' : 'comment';
       // eslint-disable-next-line no-alert
-      if (window.confirm('Are you sure you want to delete this comment?')) {
+      if (window.confirm(`Are you sure you want to delete this ${typeOfComment}?`)) {
         this.isDeleting = true;
         this.$emit('handleDeleteNote', this.note);
 
+        if (this.note.isDraft) return;
+
         this.deleteNote(this.note)
           .then(() => {
             this.isDeleting = false;
@@ -98,7 +102,20 @@ export default {
           });
       }
     },
+    updateSuccess() {
+      this.isEditing = false;
+      this.isRequesting = false;
+      this.oldContent = null;
+      $(this.$refs.noteBody.$el).renderGFM();
+      this.$refs.noteBody.resetAutoSave();
+      this.$emit('updateSuccess');
+    },
     formUpdateHandler(noteText, parentElement, callback) {
+      this.$emit('handleUpdateNote', {
+        note: this.note,
+        noteText,
+        callback: () => this.updateSuccess(),
+      });
       const data = {
         endpoint: this.note.path,
         note: {
@@ -113,11 +130,7 @@ export default {
 
       this.updateNote(data)
         .then(() => {
-          this.isEditing = false;
-          this.isRequesting = false;
-          this.oldContent = null;
-          $(this.$refs.noteBody.$el).renderGFM();
-          this.$refs.noteBody.resetAutoSave();
+          this.updateSuccess();
           callback();
         })
         .catch(() => {
@@ -142,6 +155,7 @@ export default {
         this.oldContent = null;
       }
       this.isEditing = false;
+      this.$emit('cancelForm');
     },
     recoverNoteContent(noteText) {
       // we need to do this to prevent noteForm inconsistent content warning