1 files changed, 19 insertions, 8 deletions
diff --git a/app/assets/javascripts/issue_show/issue_title_description.vue b/app/assets/javascripts/issue_show/issue_title_description.vue
index dc3ba2550c5..3f77ba22d23 100644
--- a/app/assets/javascripts/issue_show/issue_title_description.vue
+++ b/app/assets/javascripts/issue_show/issue_title_description.vue
@@ -3,6 +3,7 @@ import Visibility from 'visibilityjs';
 import Poll from './../lib/utils/poll';
 import Service from './services/index';
 import tasks from './actions/tasks';
+import edited from './components/edited.vue';
 
 export default {
   props: {
@@ -14,6 +15,11 @@ export default {
       required: true,
       type: String,
     },
+    isEdited: {
+      type: Boolean,
+      default: false,
+      required: false,
+    },
   },
   data() {
     const resource = new Service(this.$http, this.endpoint);
@@ -46,10 +52,13 @@ export default {
         pre: true,
         pulse: false,
       },
-      timeAgoEl: $('.issue_edited_ago'),
       titleEl: document.querySelector('title'),
+      hasBeenEdited: this.isEdited,
     };
   },
+  components: {
+    edited,
+  },
   methods: {
     updateFlag(key, toggle) {
       this[key].pre = toggle;
@@ -57,6 +66,9 @@ export default {
     },
     renderResponse(res) {
       this.apiData = res.json();
+
+      if (this.apiData.updated_at) this.hasBeenEdited = true;
+
       this.triggerAnimation();
     },
     updateTaskHTML() {
@@ -110,11 +122,6 @@ export default {
       this.elementsToVisualize(noTitleChange, noDescriptionChange);
       this.animate(title, description);
     },
-    updateEditedTimeAgo() {
-      const toolTipTime = gl.utils.formatDate(this.apiData.updated_at);
-      this.timeAgoEl.attr('datetime', this.apiData.updated_at);
-      this.timeAgoEl.attr('title', toolTipTime).tooltip('fixTitle');
-    },
   },
   created() {
     if (!Visibility.hidden()) {
@@ -132,8 +139,6 @@ export default {
   updated() {
     // if new html is injected (description changed) - bind TaskList and call renderGFM
     if (this.descriptionChange) {
-      this.updateEditedTimeAgo();
-
       $(this.$refs['issue-content-container-gfm-entry']).renderGFM();
 
       const tl = new gl.TaskList({
@@ -176,5 +181,11 @@ export default {
         v-if="descriptionText"
       >{{descriptionText}}</textarea>
     </div>
+    <edited
+      v-if="hasBeenEdited"
+      :updated-at="apiData.updated_at"
+      :updated-by-name="apiData.updated_by_name"
+      :updated-by-path="apiData.updated_by_path"
+    />
   </div>
 </template>