Add latest changes from gitlab-org/gitlab@master

4 files changed, 113 insertions, 143 deletions

diff --git a/app/assets/javascripts/merge_requests/components/header_metadata.vue b/app/assets/javascripts/merge_requests/components/header_metadata.vue
deleted file mode 100644
index bce67c54c27..00000000000
--- a/app/assets/javascripts/merge_requests/components/header_metadata.vue
+++ /dev/null
@@ -1,50 +0,0 @@
-<script>
-// eslint-disable-next-line no-restricted-imports
-import { mapGetters } from 'vuex';
-import HiddenBadge from '~/issuable/components/hidden_badge.vue';
-import LockedBadge from '~/issuable/components/locked_badge.vue';
-import { TYPE_ISSUE, TYPE_MERGE_REQUEST, WORKSPACE_PROJECT } from '~/issues/constants';
-import ConfidentialityBadge from '~/vue_shared/components/confidentiality_badge.vue';
-
-export default {
-  TYPE_ISSUE,
-  TYPE_MERGE_REQUEST,
-  WORKSPACE_PROJECT,
-  components: {
-    ConfidentialityBadge,
-    HiddenBadge,
-    LockedBadge,
-  },
-  inject: ['hidden'],
-  computed: {
-    ...mapGetters(['getNoteableData']),
-    isLocked() {
-      return this.getNoteableData.discussion_locked;
-    },
-    isConfidential() {
-      return this.getNoteableData.confidential;
-    },
-  },
-};
-</script>
-
-<template>
-  <span class="gl-display-contents">
-    <confidentiality-badge
-      v-if="isConfidential"
-      class="gl-align-self-center gl-mr-2"
-      :issuable-type="$options.TYPE_ISSUE"
-      :workspace-type="$options.WORKSPACE_PROJECT"
-    />
-    <locked-badge
-      v-if="isLocked"
-      class="gl-align-self-center gl-mr-2"
-      :issuable-type="$options.TYPE_MERGE_REQUEST"
-    />
-    <hidden-badge
-      v-if="hidden"
-      class="gl-align-self-center gl-mr-2"
-      :issuable-type="$options.TYPE_MERGE_REQUEST"
-    />
-  </span>
-</template>
diff --git a/app/assets/javascripts/merge_requests/components/merge_request_header.vue b/app/assets/javascripts/merge_requests/components/merge_request_header.vue
new file mode 100644
index 00000000000..b2e7245bd88
--- /dev/null
+++ b/app/assets/javascripts/merge_requests/components/merge_request_header.vue
@@ -0,0 +1,113 @@
+<script>
+import Vue from 'vue';
+// eslint-disable-next-line no-restricted-imports
+import { mapGetters } from 'vuex';
+import HiddenBadge from '~/issuable/components/hidden_badge.vue';
+import LockedBadge from '~/issuable/components/locked_badge.vue';
+import StatusBadge from '~/issuable/components/status_badge.vue';
+import { TYPE_ISSUE, TYPE_MERGE_REQUEST, WORKSPACE_PROJECT } from '~/issues/constants';
+import { fetchPolicies } from '~/lib/graphql';
+import ConfidentialityBadge from '~/vue_shared/components/confidentiality_badge.vue';
+
+export const badgeState = Vue.observable({
+  state: '',
+  updateStatus: null,
+});
+
+export default {
+  TYPE_ISSUE,
+  TYPE_MERGE_REQUEST,
+  WORKSPACE_PROJECT,
+  components: {
+    ConfidentialityBadge,
+    LockedBadge,
+    HiddenBadge,
+    StatusBadge,
+  },
+  inject: {
+    query: { default: null },
+    projectPath: { default: null },
+    hidden: { default: false },
+    iid: { default: null },
+  },
+  props: {
+    initialState: {
+      type: String,
+      required: false,
+      default: null,
+    },
+  },
+  data() {
+    if (!this.iid) {
+      return {
+        state: this.initialState,
+      };
+    }
+
+    if (!badgeState.state && this.initialState) {
+      badgeState.state = this.initialState;
+    }
+
+    return badgeState;
+  },
+  computed: {
+    ...mapGetters(['getNoteableData']),
+    isLocked() {
+      return this.getNoteableData.discussion_locked;
+    },
+    isConfidential() {
+      return this.getNoteableData.confidential;
+    },
+  },
+  created() {
+    if (!badgeState.updateStatus) {
+      badgeState.updateStatus = this.fetchState;
+    }
+  },
+  beforeDestroy() {
+    if (badgeState.updateStatus && this.query) {
+      badgeState.updateStatus = null;
+    }
+  },
+  methods: {
+    async fetchState() {
+      const { data } = await this.$apollo.query({
+        query: this.query,
+        variables: {
+          projectPath: this.projectPath,
+          iid: this.iid,
+        },
+        fetchPolicy: fetchPolicies.NO_CACHE,
+      });
+
+      badgeState.state = data?.workspace?.issuable?.state;
+    },
+  },
+};
+</script>
+
+<template>
+  <span class="gl-display-contents">
+    <status-badge
+      class="gl-align-self-center gl-mr-2"
+      :issuable-type="$options.TYPE_MERGE_REQUEST"
+      :state="state"
+    />
+    <confidentiality-badge
+      v-if="isConfidential"
+      class="gl-align-self-center gl-mr-2"
+      :issuable-type="$options.TYPE_ISSUE"
+      :workspace-type="$options.WORKSPACE_PROJECT"
+    />
+    <locked-badge
+      v-if="isLocked"
+      class="gl-align-self-center gl-mr-2"
+      :issuable-type="$options.TYPE_MERGE_REQUEST"
+    />
+    <hidden-badge
+      v-if="hidden"
+      class="gl-align-self-center gl-mr-2"
+      :issuable-type="$options.TYPE_MERGE_REQUEST"
+    />
+  </span>
+</template>
diff --git a/app/assets/javascripts/merge_requests/components/merge_request_status_badge.vue b/app/assets/javascripts/merge_requests/components/merge_request_status_badge.vue
deleted file mode 100644
index d5900137484..00000000000
--- a/app/assets/javascripts/merge_requests/components/merge_request_status_badge.vue
+++ /dev/null
@@ -1,74 +0,0 @@
-<script>
-import Vue from 'vue';
-import { fetchPolicies } from '~/lib/graphql';
-import StatusBadge from '~/issuable/components/status_badge.vue';
-
-export const badgeState = Vue.observable({
-  state: '',
-  updateStatus: null,
-});
-
-export default {
-  components: {
-    StatusBadge,
-  },
-  inject: {
-    query: { default: null },
-    projectPath: { default: null },
-    iid: { default: null },
-  },
-  props: {
-    initialState: {
-      type: String,
-      required: false,
-      default: null,
-    },
-    issuableType: {
-      type: String,
-      required: false,
-      default: '',
-    },
-  },
-  data() {
-    if (!this.iid) {
-      return {
-        state: this.initialState,
-      };
-    }
-
-    if (!badgeState.state && this.initialState) {
-      badgeState.state = this.initialState;
-    }
-
-    return badgeState;
-  },
-  created() {
-    if (!badgeState.updateStatus) {
-      badgeState.updateStatus = this.fetchState;
-    }
-  },
-  beforeDestroy() {
-    if (badgeState.updateStatus && this.query) {
-      badgeState.updateStatus = null;
-    }
-  },
-  methods: {
-    async fetchState() {
-      const { data } = await this.$apollo.query({
-        query: this.query,
-        variables: {
-          projectPath: this.projectPath,
-          iid: this.iid,
-        },
-        fetchPolicy: fetchPolicies.NO_CACHE,
-      });
-
-      badgeState.state = data?.workspace?.issuable?.state;
-    },
-  },
-};
-</script>
-
-<template>
-  <status-badge class="gl-align-self-center gl-mr-2" :issuable-type="issuableType" :state="state" />
-</template>
diff --git a/app/assets/javascripts/merge_requests/index.js b/app/assets/javascripts/merge_requests/index.js
deleted file mode 100644
index bd5faf0329c..00000000000
--- a/app/assets/javascripts/merge_requests/index.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import Vue from 'vue';
-import { parseBoolean } from '~/lib/utils/common_utils';
-import HeaderMetadata from './components/header_metadata.vue';
-
-export function mountHeaderMetadata(store) {
-  const el = document.querySelector('.js-mr-header-metadata-root');
-
-  if (!el) {
-    return null;
-  }
-
-  return new Vue({
-    el,
-    name: 'HeaderMetadataRoot',
-    store,
-    provide: { hidden: parseBoolean(el.dataset.hidden) },
-    render: (createElement) => createElement(HeaderMetadata),
-  });
-}