1 files changed, 16 insertions, 1 deletions
diff --git a/app/assets/javascripts/pages/projects/merge_requests/init_merge_request_show.js b/app/assets/javascripts/pages/projects/merge_requests/init_merge_request_show.js
index 0714fc21b17..1a0c5860991 100644
--- a/app/assets/javascripts/pages/projects/merge_requests/init_merge_request_show.js
+++ b/app/assets/javascripts/pages/projects/merge_requests/init_merge_request_show.js
@@ -1,3 +1,4 @@
+import Vue from 'vue';
 import ZenMode from '~/zen_mode';
 import initIssuableSidebar from '~/init_issuable_sidebar';
 import ShortcutsIssuable from '~/behaviors/shortcuts/shortcuts_issuable';
@@ -7,8 +8,9 @@ import initSourcegraph from '~/sourcegraph';
 import loadAwardsHandler from '~/awards_handler';
 import initInviteMemberTrigger from '~/invite_member/init_invite_member_trigger';
 import initInviteMemberModal from '~/invite_member/init_invite_member_modal';
+import StatusBox from '~/merge_request/components/status_box.vue';
 
-export default function() {
+export default function () {
   new ZenMode(); // eslint-disable-line no-new
   initIssuableSidebar();
   initPipelines();
@@ -18,4 +20,17 @@ export default function() {
   loadAwardsHandler();
   initInviteMemberModal();
   initInviteMemberTrigger();
+
+  const el = document.querySelector('.js-mr-status-box');
+  // eslint-disable-next-line no-new
+  new Vue({
+    el,
+    render(h) {
+      return h(StatusBox, {
+        props: {
+          initialState: el.dataset.state,
+        },
+      });
+    },
+  });
 }