From 993438ada993880c166c376eba4ae6ab02e3064b Mon Sep 17 00:00:00 2001
From: Jose Ivan Vargas <jvargas@gitlab.com>
Date: Tue, 5 Jun 2018 08:11:13 +0000
Subject: [PATCH] Support smarter system notes

---
 app/assets/javascripts/notes/constants.js     |   1 +
 .../notes/stores/collapse_utils.js            | 108 ++++
 .../javascripts/notes/stores/getters.js       |   4 +-
 .../unreleased/jivl-smarter-system-notes.yml  |   5 +
 spec/javascripts/notes/mock_data.js           | 578 ++++++++++++++++++
 .../notes/stores/collapse_utils_spec.js       |  46 ++
 spec/javascripts/notes/stores/getters_spec.js |  19 +-
 7 files changed, 759 insertions(+), 2 deletions(-)
 create mode 100644 app/assets/javascripts/notes/stores/collapse_utils.js
 create mode 100644 changelogs/unreleased/jivl-smarter-system-notes.yml
 create mode 100644 spec/javascripts/notes/stores/collapse_utils_spec.js

diff --git a/app/assets/javascripts/notes/constants.js b/app/assets/javascripts/notes/constants.js
index c4de4826eda..5b5b1e89058 100644
--- a/app/assets/javascripts/notes/constants.js
+++ b/app/assets/javascripts/notes/constants.js
@@ -14,6 +14,7 @@ export const EPIC_NOTEABLE_TYPE = 'epic';
 export const MERGE_REQUEST_NOTEABLE_TYPE = 'merge_request';
 export const UNRESOLVE_NOTE_METHOD_NAME = 'delete';
 export const RESOLVE_NOTE_METHOD_NAME = 'post';
+export const DESCRIPTION_TYPE = 'changed the description';
 
 export const NOTEABLE_TYPE_MAPPING = {
   Issue: ISSUE_NOTEABLE_TYPE,
diff --git a/app/assets/javascripts/notes/stores/collapse_utils.js b/app/assets/javascripts/notes/stores/collapse_utils.js
new file mode 100644
index 00000000000..fa4a1c56b20
--- /dev/null
+++ b/app/assets/javascripts/notes/stores/collapse_utils.js
@@ -0,0 +1,108 @@
+import { n__, s__, sprintf } from '~/locale';
+import { DESCRIPTION_TYPE } from '../constants';
+
+/**
+ * Changes the description from a note, returns 'changed the description n number of times'
+ */
+export const changeDescriptionNote = (note, descriptionChangedTimes, timeDifferenceMinutes) => {
+  const descriptionNote = Object.assign({}, note);
+
+  descriptionNote.note_html = sprintf(
+    s__(`MergeRequest|
+  %{paragraphStart}changed the description %{descriptionChangedTimes} times %{timeDifferenceMinutes}%{paragraphEnd}`),
+    {
+      paragraphStart: '<p dir="auto">',
+      paragraphEnd: '</p>',
+      descriptionChangedTimes,
+      timeDifferenceMinutes: n__('within %d minute ', 'within %d minutes ', timeDifferenceMinutes),
+    },
+    false,
+  );
+
+  descriptionNote.times_updated = descriptionChangedTimes;
+
+  return descriptionNote;
+};
+
+/**
+ * Checks the time difference between two notes from their 'created_at' dates
+ * returns an integer
+ */
+
+export const getTimeDifferenceMinutes = (noteBeggining, noteEnd) => {
+  const descriptionNoteBegin = new Date(noteBeggining.created_at);
+  const descriptionNoteEnd = new Date(noteEnd.created_at);
+  const timeDifferenceMinutes = (descriptionNoteEnd - descriptionNoteBegin) / 1000 / 60;
+
+  return Math.ceil(timeDifferenceMinutes);
+};
+
+/**
+ * Checks if a note is a system note and if the content is description
+ *
+ * @param {Object} note
+ * @returns {Boolean}
+ */
+export const isDescriptionSystemNote = note => note.system && note.note === DESCRIPTION_TYPE;
+
+/**
+ * Collapses the system notes of a description type, e.g. Changed the description, n minutes ago
+ * the notes will collapse as long as they happen no more than 10 minutes away from each away
+ * in between the notes can be anything, another type of system note
+ * (such as 'changed the weight') or a comment.
+ *
+ * @param {Array} notes
+ * @returns {Array}
+ */
+export const collapseSystemNotes = notes => {
+  let lastDescriptionSystemNote = null;
+  let lastDescriptionSystemNoteIndex = -1;
+  let descriptionChangedTimes = 1;
+
+  return notes.slice(0).reduce((acc, currentNote) => {
+    const note = currentNote.notes[0];
+
+    if (isDescriptionSystemNote(note)) {
+      // is it the first one?
+      if (!lastDescriptionSystemNote) {
+        lastDescriptionSystemNote = note;
+        lastDescriptionSystemNoteIndex = acc.length;
+      } else if (lastDescriptionSystemNote) {
+        const timeDifferenceMinutes = getTimeDifferenceMinutes(
+          lastDescriptionSystemNote,
+          note,
+        );
+
+        // are they less than 10 minutes appart?
+        if (timeDifferenceMinutes > 10) {
+          // reset counter
+          descriptionChangedTimes = 1;
+          // update the previous system note
+          lastDescriptionSystemNote = note;
+          lastDescriptionSystemNoteIndex = acc.length;
+        } else {
+          // increase counter
+          descriptionChangedTimes += 1;
+
+          // delete the previous one
+          acc.splice(lastDescriptionSystemNoteIndex, 1);
+
+          // replace the text of the current system note with the collapsed note.
+          currentNote.notes.splice(
+            0,
+            1,
+            changeDescriptionNote(note, descriptionChangedTimes, timeDifferenceMinutes),
+          );
+
+          // update the previous system note index
+          lastDescriptionSystemNoteIndex = acc.length;
+        }
+      }
+    }
+    acc.push(currentNote);
+    return acc;
+  }, []);
+};
+
+// for babel-rewire
+export default {};
diff --git a/app/assets/javascripts/notes/stores/getters.js b/app/assets/javascripts/notes/stores/getters.js
index 787be6f4c99..bc373e0d0fc 100644
--- a/app/assets/javascripts/notes/stores/getters.js
+++ b/app/assets/javascripts/notes/stores/getters.js
@@ -1,6 +1,8 @@
 import _ from 'underscore';
+import { collapseSystemNotes } from './collapse_utils';
+
+export const notes = state => collapseSystemNotes(state.notes);
 
-export const notes = state => state.notes;
 export const targetNoteHash = state => state.targetNoteHash;
 
 export const getNotesData = state => state.notesData;
diff --git a/changelogs/unreleased/jivl-smarter-system-notes.yml b/changelogs/unreleased/jivl-smarter-system-notes.yml
new file mode 100644
index 00000000000..e640981de9a
--- /dev/null
+++ b/changelogs/unreleased/jivl-smarter-system-notes.yml
@@ -0,0 +1,5 @@
+---
+title: Add support for smarter system notes
+merge_request: 17164
+author:
+type: changed
diff --git a/spec/javascripts/notes/mock_data.js b/spec/javascripts/notes/mock_data.js
index bfe3a65feee..fa7adc32193 100644
--- a/spec/javascripts/notes/mock_data.js
+++ b/spec/javascripts/notes/mock_data.js
@@ -340,6 +340,79 @@ export const loggedOutnoteableData = {
     '/gitlab-org/gitlab-ce/preview_markdown?quick_actions_target_id=98&quick_actions_target_type=Issue',
 };
 
+export const collapseNotesMock = [
+  {
+    expanded: true,
+    id: '0fb4e0e3f9276e55ff32eb4195add694aece4edd',
+    individual_note: true,
+    notes: [
+      {
+        id: 1390,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Root',
+          username: 'root',
+          state: 'active',
+          avatar_url: 'test',
+          path: '/root',
+        },
+        created_at: '2018-02-26T18:07:41.071Z',
+        updated_at: '2018-02-26T18:07:41.071Z',
+        system: true,
+        system_note_icon_name: 'pencil',
+        noteable_id: 98,
+        noteable_type: 'Issue',
+        type: null,
+        human_access: 'Owner',
+        note: 'changed the description',
+        note_html: '<p dir="auto">changed the description</p>',
+        current_user: { can_edit: false },
+        discussion_id: 'b97fb7bda470a65b3e009377a9032edec0a4dd05',
+        emoji_awardable: false,
+        path: '/h5bp/html5-boilerplate/notes/1057',
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fh5bp%2Fhtml5-boilerplate%2Fissues%2F10%23note_1057&user_id=1',
+      },
+    ],
+  },
+  {
+    expanded: true,
+    id: 'ffde43f25984ad7f2b4275135e0e2846875336c0',
+    individual_note: true,
+    notes: [
+      {
+        id: 1391,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Root',
+          username: 'root',
+          state: 'active',
+          avatar_url: 'test',
+          path: '/root',
+        },
+        created_at: '2018-02-26T18:13:24.071Z',
+        updated_at: '2018-02-26T18:13:24.071Z',
+        system: true,
+        system_note_icon_name: 'pencil',
+        noteable_id: 99,
+        noteable_type: 'Issue',
+        type: null,
+        human_access: 'Owner',
+        note: 'changed the description',
+        note_html: '<p dir="auto">changed the description</p>',
+        current_user: { can_edit: false },
+        discussion_id: '3eb958b4d81dec207ec3537a2f3bd8b9f271bb34',
+        emoji_awardable: false,
+        path: '/h5bp/html5-boilerplate/notes/1057',
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fh5bp%2Fhtml5-boilerplate%2Fissues%2F10%23note_1057&user_id=1',
+      },
+    ],
+  },
+];
+
 export const INDIVIDUAL_NOTE_RESPONSE_MAP = {
   GET: {
     '/gitlab-org/gitlab-ce/issues/26/discussions.json': [
@@ -575,3 +648,508 @@ export function discussionNoteInterceptor(request, next) {
     }),
   );
 }
+
+export const notesWithDescriptionChanges = [
+  {
+    id: '39b271c2033e9ed43d8edb393702f65f7a830459',
+    reply_id: '39b271c2033e9ed43d8edb393702f65f7a830459',
+    expanded: true,
+    notes: [
+      {
+        id: 901,
+        type: null,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Administrator',
+          username: 'root',
+          state: 'active',
+          avatar_url:
+            'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+          path: '/root',
+        },
+        created_at: '2018-05-29T12:05:36.117Z',
+        updated_at: '2018-05-29T12:05:36.117Z',
+        system: false,
+        noteable_id: 182,
+        noteable_type: 'Issue',
+        resolvable: false,
+        noteable_iid: 12,
+        note:
+          'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+        note_html:
+          '<p dir="auto">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>',
+        current_user: { can_edit: true, can_award_emoji: true },
+        resolved: false,
+        resolved_by: null,
+        discussion_id: '39b271c2033e9ed43d8edb393702f65f7a830459',
+        emoji_awardable: true,
+        award_emoji: [],
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-shell%2Fissues%2F12%23note_901&user_id=1',
+        human_access: 'Owner',
+        toggle_award_path: '/gitlab-org/gitlab-shell/notes/901/toggle_award_emoji',
+        path: '/gitlab-org/gitlab-shell/notes/901',
+      },
+    ],
+    individual_note: true,
+    resolvable: false,
+    resolved: false,
+    diff_discussion: false,
+  },
+  {
+    id: '4852335d7dc40b9ceb8fde1a2bb9c1b67e4c7795',
+    reply_id: '4852335d7dc40b9ceb8fde1a2bb9c1b67e4c7795',
+    expanded: true,
+    notes: [
+      {
+        id: 902,
+        type: null,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Administrator',
+          username: 'root',
+          state: 'active',
+          avatar_url:
+            'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+          path: '/root',
+        },
+        created_at: '2018-05-29T12:05:58.694Z',
+        updated_at: '2018-05-29T12:05:58.694Z',
+        system: false,
+        noteable_id: 182,
+        noteable_type: 'Issue',
+        resolvable: false,
+        noteable_iid: 12,
+        note:
+          'Varius vel pharetra vel turpis nunc eget lorem. Ipsum dolor sit amet consectetur adipiscing.',
+        note_html:
+          '<p dir="auto">Varius vel pharetra vel turpis nunc eget lorem. Ipsum dolor sit amet consectetur adipiscing.</p>',
+        current_user: { can_edit: true, can_award_emoji: true },
+        resolved: false,
+        resolved_by: null,
+        discussion_id: '4852335d7dc40b9ceb8fde1a2bb9c1b67e4c7795',
+        emoji_awardable: true,
+        award_emoji: [],
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-shell%2Fissues%2F12%23note_902&user_id=1',
+        human_access: 'Owner',
+        toggle_award_path: '/gitlab-org/gitlab-shell/notes/902/toggle_award_emoji',
+        path: '/gitlab-org/gitlab-shell/notes/902',
+      },
+    ],
+    individual_note: true,
+    resolvable: false,
+    resolved: false,
+    diff_discussion: false,
+  },
+  {
+    id: '7f1feda384083eb31763366e6392399fde6f3f31',
+    reply_id: '7f1feda384083eb31763366e6392399fde6f3f31',
+    expanded: true,
+    notes: [
+      {
+        id: 903,
+        type: null,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Administrator',
+          username: 'root',
+          state: 'active',
+          avatar_url:
+            'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+          path: '/root',
+        },
+        created_at: '2018-05-29T12:06:05.772Z',
+        updated_at: '2018-05-29T12:06:05.772Z',
+        system: true,
+        noteable_id: 182,
+        noteable_type: 'Issue',
+        resolvable: false,
+        noteable_iid: 12,
+        note: 'changed the description',
+        note_html: '<p dir="auto">changed the description</p>',
+        current_user: { can_edit: false, can_award_emoji: true },
+        resolved: false,
+        resolved_by: null,
+        system_note_icon_name: 'pencil-square',
+        discussion_id: '7f1feda384083eb31763366e6392399fde6f3f31',
+        emoji_awardable: false,
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-shell%2Fissues%2F12%23note_903&user_id=1',
+        human_access: 'Owner',
+        path: '/gitlab-org/gitlab-shell/notes/903',
+      },
+    ],
+    individual_note: true,
+    resolvable: false,
+    resolved: false,
+    diff_discussion: false,
+  },
+  {
+    id: '091865fe3ae20f0045234a3d103e3b15e73405b5',
+    reply_id: '091865fe3ae20f0045234a3d103e3b15e73405b5',
+    expanded: true,
+    notes: [
+      {
+        id: 904,
+        type: null,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Administrator',
+          username: 'root',
+          state: 'active',
+          avatar_url:
+            'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+          path: '/root',
+        },
+        created_at: '2018-05-29T12:06:16.112Z',
+        updated_at: '2018-05-29T12:06:16.112Z',
+        system: false,
+        noteable_id: 182,
+        noteable_type: 'Issue',
+        resolvable: false,
+        noteable_iid: 12,
+        note: 'Ullamcorper eget nulla facilisi etiam',
+        note_html: '<p dir="auto">Ullamcorper eget nulla facilisi etiam</p>',
+        current_user: { can_edit: true, can_award_emoji: true },
+        resolved: false,
+        resolved_by: null,
+        discussion_id: '091865fe3ae20f0045234a3d103e3b15e73405b5',
+        emoji_awardable: true,
+        award_emoji: [],
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-shell%2Fissues%2F12%23note_904&user_id=1',
+        human_access: 'Owner',
+        toggle_award_path: '/gitlab-org/gitlab-shell/notes/904/toggle_award_emoji',
+        path: '/gitlab-org/gitlab-shell/notes/904',
+      },
+    ],
+    individual_note: true,
+    resolvable: false,
+    resolved: false,
+    diff_discussion: false,
+  },
+  {
+    id: 'a21cf2e804acc3c60d07e37d75e395f5a9a4d044',
+    reply_id: 'a21cf2e804acc3c60d07e37d75e395f5a9a4d044',
+    expanded: true,
+    notes: [
+      {
+        id: 905,
+        type: null,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Administrator',
+          username: 'root',
+          state: 'active',
+          avatar_url:
+            'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+          path: '/root',
+        },
+        created_at: '2018-05-29T12:06:28.851Z',
+        updated_at: '2018-05-29T12:06:28.851Z',
+        system: true,
+        noteable_id: 182,
+        noteable_type: 'Issue',
+        resolvable: false,
+        noteable_iid: 12,
+        note: 'changed the description',
+        note_html: '<p dir="auto">changed the description</p>',
+        current_user: { can_edit: false, can_award_emoji: true },
+        resolved: false,
+        resolved_by: null,
+        system_note_icon_name: 'pencil-square',
+        discussion_id: 'a21cf2e804acc3c60d07e37d75e395f5a9a4d044',
+        emoji_awardable: false,
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-shell%2Fissues%2F12%23note_905&user_id=1',
+        human_access: 'Owner',
+        path: '/gitlab-org/gitlab-shell/notes/905',
+      },
+    ],
+    individual_note: true,
+    resolvable: false,
+    resolved: false,
+    diff_discussion: false,
+  },
+  {
+    id: '70411b08cdfc01f24187a06d77daa33464cb2620',
+    reply_id: '70411b08cdfc01f24187a06d77daa33464cb2620',
+    expanded: true,
+    notes: [
+      {
+        id: 906,
+        type: null,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Administrator',
+          username: 'root',
+          state: 'active',
+          avatar_url:
+            'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+          path: '/root',
+        },
+        created_at: '2018-05-29T12:20:02.925Z',
+        updated_at: '2018-05-29T12:20:02.925Z',
+        system: true,
+        noteable_id: 182,
+        noteable_type: 'Issue',
+        resolvable: false,
+        noteable_iid: 12,
+        note: 'changed the description',
+        note_html: '<p dir="auto">changed the description</p>',
+        current_user: { can_edit: false, can_award_emoji: true },
+        resolved: false,
+        resolved_by: null,
+        system_note_icon_name: 'pencil-square',
+        discussion_id: '70411b08cdfc01f24187a06d77daa33464cb2620',
+        emoji_awardable: false,
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-shell%2Fissues%2F12%23note_906&user_id=1',
+        human_access: 'Owner',
+        path: '/gitlab-org/gitlab-shell/notes/906',
+      },
+    ],
+    individual_note: true,
+    resolvable: false,
+    resolved: false,
+    diff_discussion: false,
+  },
+];
+
+export const collapsedSystemNotes = [
+  {
+    id: '39b271c2033e9ed43d8edb393702f65f7a830459',
+    reply_id: '39b271c2033e9ed43d8edb393702f65f7a830459',
+    expanded: true,
+    notes: [
+      {
+        id: 901,
+        type: null,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Administrator',
+          username: 'root',
+          state: 'active',
+          avatar_url:
+            'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+          path: '/root',
+        },
+        created_at: '2018-05-29T12:05:36.117Z',
+        updated_at: '2018-05-29T12:05:36.117Z',
+        system: false,
+        noteable_id: 182,
+        noteable_type: 'Issue',
+        resolvable: false,
+        noteable_iid: 12,
+        note:
+          'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+        note_html:
+          '<p dir="auto">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>',
+        current_user: { can_edit: true, can_award_emoji: true },
+        resolved: false,
+        resolved_by: null,
+        discussion_id: '39b271c2033e9ed43d8edb393702f65f7a830459',
+        emoji_awardable: true,
+        award_emoji: [],
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-shell%2Fissues%2F12%23note_901&user_id=1',
+        human_access: 'Owner',
+        toggle_award_path: '/gitlab-org/gitlab-shell/notes/901/toggle_award_emoji',
+        path: '/gitlab-org/gitlab-shell/notes/901',
+      },
+    ],
+    individual_note: true,
+    resolvable: false,
+    resolved: false,
+    diff_discussion: false,
+  },
+  {
+    id: '4852335d7dc40b9ceb8fde1a2bb9c1b67e4c7795',
+    reply_id: '4852335d7dc40b9ceb8fde1a2bb9c1b67e4c7795',
+    expanded: true,
+    notes: [
+      {
+        id: 902,
+        type: null,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Administrator',
+          username: 'root',
+          state: 'active',
+          avatar_url:
+            'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+          path: '/root',
+        },
+        created_at: '2018-05-29T12:05:58.694Z',
+        updated_at: '2018-05-29T12:05:58.694Z',
+        system: false,
+        noteable_id: 182,
+        noteable_type: 'Issue',
+        resolvable: false,
+        noteable_iid: 12,
+        note:
+          'Varius vel pharetra vel turpis nunc eget lorem. Ipsum dolor sit amet consectetur adipiscing.',
+        note_html:
+          '<p dir="auto">Varius vel pharetra vel turpis nunc eget lorem. Ipsum dolor sit amet consectetur adipiscing.</p>',
+        current_user: { can_edit: true, can_award_emoji: true },
+        resolved: false,
+        resolved_by: null,
+        discussion_id: '4852335d7dc40b9ceb8fde1a2bb9c1b67e4c7795',
+        emoji_awardable: true,
+        award_emoji: [],
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-shell%2Fissues%2F12%23note_902&user_id=1',
+        human_access: 'Owner',
+        toggle_award_path: '/gitlab-org/gitlab-shell/notes/902/toggle_award_emoji',
+        path: '/gitlab-org/gitlab-shell/notes/902',
+      },
+    ],
+    individual_note: true,
+    resolvable: false,
+    resolved: false,
+    diff_discussion: false,
+  },
+  {
+    id: '091865fe3ae20f0045234a3d103e3b15e73405b5',
+    reply_id: '091865fe3ae20f0045234a3d103e3b15e73405b5',
+    expanded: true,
+    notes: [
+      {
+        id: 904,
+        type: null,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Administrator',
+          username: 'root',
+          state: 'active',
+          avatar_url:
+            'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+          path: '/root',
+        },
+        created_at: '2018-05-29T12:06:16.112Z',
+        updated_at: '2018-05-29T12:06:16.112Z',
+        system: false,
+        noteable_id: 182,
+        noteable_type: 'Issue',
+        resolvable: false,
+        noteable_iid: 12,
+        note: 'Ullamcorper eget nulla facilisi etiam',
+        note_html: '<p dir="auto">Ullamcorper eget nulla facilisi etiam</p>',
+        current_user: { can_edit: true, can_award_emoji: true },
+        resolved: false,
+        resolved_by: null,
+        discussion_id: '091865fe3ae20f0045234a3d103e3b15e73405b5',
+        emoji_awardable: true,
+        award_emoji: [],
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-shell%2Fissues%2F12%23note_904&user_id=1',
+        human_access: 'Owner',
+        toggle_award_path: '/gitlab-org/gitlab-shell/notes/904/toggle_award_emoji',
+        path: '/gitlab-org/gitlab-shell/notes/904',
+      },
+    ],
+    individual_note: true,
+    resolvable: false,
+    resolved: false,
+    diff_discussion: false,
+  },
+  {
+    id: 'a21cf2e804acc3c60d07e37d75e395f5a9a4d044',
+    reply_id: 'a21cf2e804acc3c60d07e37d75e395f5a9a4d044',
+    expanded: true,
+    notes: [
+      {
+        id: 905,
+        type: null,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Administrator',
+          username: 'root',
+          state: 'active',
+          avatar_url:
+            'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+          path: '/root',
+        },
+        created_at: '2018-05-29T12:06:28.851Z',
+        updated_at: '2018-05-29T12:06:28.851Z',
+        system: true,
+        noteable_id: 182,
+        noteable_type: 'Issue',
+        resolvable: false,
+        noteable_iid: 12,
+        note: 'changed the description',
+        note_html: '\n  <p dir="auto">changed the description 2 times within 1 minute </p>',
+        current_user: { can_edit: false, can_award_emoji: true },
+        resolved: false,
+        resolved_by: null,
+        system_note_icon_name: 'pencil-square',
+        discussion_id: 'a21cf2e804acc3c60d07e37d75e395f5a9a4d044',
+        emoji_awardable: false,
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-shell%2Fissues%2F12%23note_905&user_id=1',
+        human_access: 'Owner',
+        path: '/gitlab-org/gitlab-shell/notes/905',
+        times_updated: 2,
+      },
+    ],
+    individual_note: true,
+    resolvable: false,
+    resolved: false,
+    diff_discussion: false,
+  },
+  {
+    id: '70411b08cdfc01f24187a06d77daa33464cb2620',
+    reply_id: '70411b08cdfc01f24187a06d77daa33464cb2620',
+    expanded: true,
+    notes: [
+      {
+        id: 906,
+        type: null,
+        attachment: null,
+        author: {
+          id: 1,
+          name: 'Administrator',
+          username: 'root',
+          state: 'active',
+          avatar_url:
+            'https://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+          path: '/root',
+        },
+        created_at: '2018-05-29T12:20:02.925Z',
+        updated_at: '2018-05-29T12:20:02.925Z',
+        system: true,
+        noteable_id: 182,
+        noteable_type: 'Issue',
+        resolvable: false,
+        noteable_iid: 12,
+        note: 'changed the description',
+        note_html: '<p dir="auto">changed the description</p>',
+        current_user: { can_edit: false, can_award_emoji: true },
+        resolved: false,
+        resolved_by: null,
+        system_note_icon_name: 'pencil-square',
+        discussion_id: '70411b08cdfc01f24187a06d77daa33464cb2620',
+        emoji_awardable: false,
+        report_abuse_path:
+          '/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-shell%2Fissues%2F12%23note_906&user_id=1',
+        human_access: 'Owner',
+        path: '/gitlab-org/gitlab-shell/notes/906',
+      },
+    ],
+    individual_note: true,
+    resolvable: false,
+    resolved: false,
+    diff_discussion: false,
+  },
+];
diff --git a/spec/javascripts/notes/stores/collapse_utils_spec.js b/spec/javascripts/notes/stores/collapse_utils_spec.js
new file mode 100644
index 00000000000..06a6aab932a
--- /dev/null
+++ b/spec/javascripts/notes/stores/collapse_utils_spec.js
@@ -0,0 +1,46 @@
+import {
+  isDescriptionSystemNote,
+  changeDescriptionNote,
+  getTimeDifferenceMinutes,
+  collapseSystemNotes,
+} from '~/notes/stores/collapse_utils';
+import {
+  notesWithDescriptionChanges,
+  collapsedSystemNotes,
+} from '../mock_data';
+
+describe('Collapse utils', () => {
+  const mockSystemNote = {
+    note: 'changed the description',
+    note_html: '<p dir="auto">changed the description</p>',
+    system: true,
+    created_at: '2018-05-14T21:28:00.000Z',
+  };
+
+  it('checks if a system note is of a description type', () => {
+    expect(isDescriptionSystemNote(mockSystemNote)).toEqual(true);
+  });
+
+  it('returns false when a system note is not a description type', () => {
+    expect(isDescriptionSystemNote(Object.assign({}, mockSystemNote, { note: 'foo' }))).toEqual(false);
+  });
+
+  it('changes the description to contain the number of changed times', () => {
+    const changedNote = changeDescriptionNote(mockSystemNote, 3, 5);
+
+    expect(changedNote.times_updated).toEqual(3);
+    expect(changedNote.note_html.trim()).toContain('<p dir="auto">changed the description 3 times within 5 minutes </p>');
+  });
+
+  it('gets the time difference between two notes', () => {
+    const anotherSystemNote = {
+      created_at: '2018-05-14T21:33:00.000Z',
+    };
+
+    expect(getTimeDifferenceMinutes(mockSystemNote, anotherSystemNote)).toEqual(5);
+  });
+
+  it('collapses all description system notes made within 10 minutes or less from each other', () => {
+    expect(collapseSystemNotes(notesWithDescriptionChanges)).toEqual(collapsedSystemNotes);
+  });
+});
diff --git a/spec/javascripts/notes/stores/getters_spec.js b/spec/javascripts/notes/stores/getters_spec.js
index 8b2a8d2cd7a..e5550580bf8 100644
--- a/spec/javascripts/notes/stores/getters_spec.js
+++ b/spec/javascripts/notes/stores/getters_spec.js
@@ -1,8 +1,9 @@
 import * as getters from '~/notes/stores/getters';
-import { notesDataMock, userDataMock, noteableDataMock, individualNote } from '../mock_data';
+import { notesDataMock, userDataMock, noteableDataMock, individualNote, collapseNotesMock } from '../mock_data';
 
 describe('Getters Notes Store', () => {
   let state;
+
   beforeEach(() => {
     state = {
       notes: [individualNote],
@@ -20,6 +21,22 @@ describe('Getters Notes Store', () => {
     });
   });
 
+  describe('Collapsed notes', () => {
+    const stateCollapsedNotes = {
+      notes: collapseNotesMock,
+      targetNoteHash: 'hash',
+      lastFetchedAt: 'timestamp',
+
+      notesData: notesDataMock,
+      userData: userDataMock,
+      noteableData: noteableDataMock,
+    };
+
+    it('should return a single system note when a description was updated multiple times', () => {
+      expect(getters.notes(stateCollapsedNotes).length).toEqual(1);
+    });
+  });
+
   describe('targetNoteHash', () => {
     it('should return `targetNoteHash`', () => {
       expect(getters.targetNoteHash(state)).toEqual('hash');
-- 
GitLab