This updates only the actual new discussion and not the full tree , which leads to a very costly full rerender

3 files changed, 12 insertions, 4 deletions

diff --git a/app/assets/javascripts/diffs/components/diff_line_note_form.vue b/app/assets/javascripts/diffs/components/diff_line_note_form.vue
index 6943b462e86..f48cf80153f 100644
--- a/app/assets/javascripts/diffs/components/diff_line_note_form.vue
+++ b/app/assets/javascripts/diffs/components/diff_line_note_form.vue
@@ -59,7 +59,7 @@ export default {
     }
   },
   methods: {
-    ...mapActions(['cancelCommentForm', 'saveNote', 'fetchDiscussions']),
+    ...mapActions(['cancelCommentForm', 'saveNote', 'refetchDiscussionById']),
     handleCancelCommentForm() {
       this.autosave.reset();
       this.cancelCommentForm({
@@ -78,10 +78,10 @@ export default {
       });
 
       this.saveNote(postData)
-        .then(() => {
+        .then(result => {
           const endpoint = this.getNotesDataByProp('discussionsPath');
 
-          this.fetchDiscussions(endpoint)
+          this.refetchDiscussionById({ path: endpoint, discussionId: result.discussion_id })
             .then(() => {
               this.handleCancelCommentForm();
             })
diff --git a/app/assets/javascripts/notes/stores/actions.js b/app/assets/javascripts/notes/stores/actions.js
index 671fa4d7d22..b2bf86eea56 100644
--- a/app/assets/javascripts/notes/stores/actions.js
+++ b/app/assets/javascripts/notes/stores/actions.js
@@ -41,6 +41,15 @@ export const fetchDiscussions = ({ commit }, path) =>
       commit(types.SET_INITIAL_DISCUSSIONS, discussions);
     });
 
+export const refetchDiscussionById = ({ commit }, { path, discussionId }) =>
+  service
+    .fetchDiscussions(path)
+    .then(res => res.json())
+    .then(discussions => {
+      const selectedDiscussion = discussions.find(discussion => discussion.id === discussionId);
+      if (selectedDiscussion) commit(types.UPDATE_DISCUSSION, selectedDiscussion);
+    });
+
 export const deleteNote = ({ commit }, note) =>
   service.deleteNote(note.path).then(() => {
     commit(types.DELETE_NOTE, note);
diff --git a/app/assets/javascripts/notes/stores/mutations.js b/app/assets/javascripts/notes/stores/mutations.js
index e5e40ce07fa..a1849269010 100644
--- a/app/assets/javascripts/notes/stores/mutations.js
+++ b/app/assets/javascripts/notes/stores/mutations.js
@@ -114,7 +114,6 @@ export default {
 
     Object.assign(state, { discussions });
   },
-
   [types.SET_LAST_FETCHED_AT](state, fetchedAt) {
     Object.assign(state, { lastFetchedAt: fetchedAt });
   },