1 files changed, 19 insertions, 25 deletions

diff --git a/app/assets/javascripts/notes/components/noteable_discussion.vue b/app/assets/javascripts/notes/components/noteable_discussion.vue
index b8eaff32cce..ac743d9f4b8 100644
--- a/app/assets/javascripts/notes/components/noteable_discussion.vue
+++ b/app/assets/javascripts/notes/components/noteable_discussion.vue
@@ -132,7 +132,7 @@ export default {
       return this.discussion.diff_discussion && this.renderDiffFile;
     },
     shouldGroupReplies() {
-      return !this.shouldRenderDiffs && !this.discussion.diff_discussion;
+      return !this.shouldRenderDiffs;
     },
     wrapperComponent() {
       return this.shouldRenderDiffs ? diffWithNote : 'div';
@@ -144,15 +144,6 @@ export default {
 
       return {};
     },
-    componentClassName() {
-      if (this.shouldRenderDiffs) {
-        if (!this.lastUpdatedAt && !this.discussion.resolved) {
-          return 'unresolved';
-        }
-      }
-
-      return '';
-    },
     isExpanded() {
       return this.discussion.expanded || this.alwaysExpanded;
     },
@@ -174,22 +165,20 @@ export default {
         active: isActive,
       } = this.discussion;
 
-      let text = s__('MergeRequests|started a discussion');
+      let text = s__('MergeRequests|started a thread');
       if (isForCommit) {
-        text = s__(
-          'MergeRequests|started a discussion on commit %{linkStart}%{commitId}%{linkEnd}',
-        );
+        text = s__('MergeRequests|started a thread on commit %{linkStart}%{commitId}%{linkEnd}');
       } else if (isDiffDiscussion && commitId) {
         text = isActive
-          ? s__('MergeRequests|started a discussion on commit %{linkStart}%{commitId}%{linkEnd}')
+          ? s__('MergeRequests|started a thread on commit %{linkStart}%{commitId}%{linkEnd}')
           : s__(
-              'MergeRequests|started a discussion on an outdated change in commit %{linkStart}%{commitId}%{linkEnd}',
+              'MergeRequests|started a thread on an outdated change in commit %{linkStart}%{commitId}%{linkEnd}',
             );
       } else if (isDiffDiscussion) {
         text = isActive
-          ? s__('MergeRequests|started a discussion on %{linkStart}the diff%{linkEnd}')
+          ? s__('MergeRequests|started a thread on %{linkStart}the diff%{linkEnd}')
           : s__(
-              'MergeRequests|started a discussion on %{linkStart}an old version of the diff%{linkEnd}',
+              'MergeRequests|started a thread on %{linkStart}an old version of the diff%{linkEnd}',
             );
       }
 
@@ -250,6 +239,11 @@ export default {
       clearDraft(this.autosaveKey);
     },
     saveReply(noteText, form, callback) {
+      if (!noteText) {
+        this.cancelReplyForm();
+        callback();
+        return;
+      }
       const postData = {
         in_reply_to_discussion_id: this.discussion.reply_id,
         target_type: this.getNoteableData.targetType,
@@ -280,8 +274,9 @@ export default {
           this.removePlaceholderNotes();
           this.isReplying = true;
           this.$nextTick(() => {
-            const msg = `Your comment could not be submitted!
-Please check your network connection and try again.`;
+            const msg = __(
+              'Your comment could not be submitted! Please check your network connection and try again.',
+            );
             Flash(msg, 'alert', this.$el);
             this.$refs.noteForm.note = noteText;
             callback(err);
@@ -309,11 +304,11 @@ Please check your network connection and try again.`;
 </script>
 
 <template>
-  <timeline-entry-item class="note note-discussion" :class="componentClassName">
+  <timeline-entry-item class="note note-discussion">
     <div class="timeline-content">
       <div :data-discussion-id="discussion.id" class="discussion js-discussion-container">
         <div v-if="shouldRenderDiffs" class="discussion-header note-wrapper">
-          <div v-once class="timeline-icon">
+          <div v-once class="timeline-icon align-self-start flex-shrink-0">
             <user-avatar-link
               v-if="author"
               :link-href="author.path"
@@ -322,7 +317,7 @@ Please check your network connection and try again.`;
               :img-size="40"
             />
           </div>
-          <div class="timeline-content">
+          <div class="timeline-content w-100">
             <note-header
               :author="author"
               :created-at="firstNote.created_at"
@@ -363,7 +358,6 @@ Please check your network connection and try again.`;
               :line="line"
               :should-group-replies="shouldGroupReplies"
               @startReplying="showReplyForm"
-              @toggleDiscussion="toggleDiscussionHandler"
               @deleteNote="deleteNoteHandler"
             >
               <slot slot="avatar-badge" name="avatar-badge"></slot>
@@ -376,7 +370,7 @@ Please check your network connection and try again.`;
                 <div
                   v-else-if="showReplies"
                   :class="{ 'is-replying': isReplying }"
-                  class="discussion-reply-holder"
+                  class="discussion-reply-holder clearfix"
                 >
                   <user-avatar-link
                     v-if="!isReplying && userCanReply"