Add latest changes from gitlab-org/gitlab@master

2 files changed, 33 insertions, 1 deletions

diff --git a/app/assets/javascripts/merge_requests/components/sticky_header.vue b/app/assets/javascripts/merge_requests/components/sticky_header.vue
index 525094271d9..bcef11e9b26 100644
--- a/app/assets/javascripts/merge_requests/components/sticky_header.vue
+++ b/app/assets/javascripts/merge_requests/components/sticky_header.vue
@@ -10,8 +10,31 @@ import StatusBox from '~/issuable/components/status_box.vue';
 import DiscussionCounter from '~/notes/components/discussion_counter.vue';
 import TodoWidget from '~/sidebar/components/todo_toggle/sidebar_todo_widget.vue';
 import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
+import titleSubscription from '../queries/title.subscription.graphql';
 
 export default {
+  apollo: {
+    $subscribe: {
+      title: {
+        query() {
+          return titleSubscription;
+        },
+        variables() {
+          return {
+            issuableId: this.issuableId,
+          };
+        },
+        skip() {
+          return !this.issuableId || !this.glFeatures.realtimeMrStatusChange;
+        },
+        result({ data: { mergeRequestMergeStatusUpdated } }) {
+          if (mergeRequestMergeStatusUpdated) {
+            this.titleHtml = mergeRequestMergeStatusUpdated.titleHtml;
+          }
+        },
+      },
+    },
+  },
   components: {
     GlIntersectionObserver,
     GlLink,
@@ -36,6 +59,7 @@ export default {
     return {
       isStickyHeaderVisible: false,
       discussionCounter: 0,
+      titleHtml: this.title,
     };
   },
   computed: {
@@ -92,7 +116,7 @@ export default {
         <div class="gl-w-full gl-display-flex gl-align-items-center">
           <status-box :initial-state="getNoteableData.state" issuable-type="merge_request" />
           <p
-            v-safe-html:[$options.safeHtmlConfig]="title"
+            v-safe-html:[$options.safeHtmlConfig]="titleHtml"
             class="gl-display-none gl-lg-display-block gl-font-weight-bold gl-overflow-hidden gl-white-space-nowrap gl-text-overflow-ellipsis gl-my-0 gl-mr-4"
           ></p>
           <div class="gl-display-flex gl-align-items-center">
diff --git a/app/assets/javascripts/merge_requests/queries/title.subscription.graphql b/app/assets/javascripts/merge_requests/queries/title.subscription.graphql
new file mode 100644
index 00000000000..4f04e944f7e
--- /dev/null
+++ b/app/assets/javascripts/merge_requests/queries/title.subscription.graphql
@@ -0,0 +1,8 @@
+subscription getTitleSubscription($issuableId: IssuableID!) {
+  mergeRequestMergeStatusUpdated(issuableId: $issuableId) {
+    ... on MergeRequest {
+      id
+      titleHtml
+    }
+  }
+}