2 files changed, 18 insertions, 5 deletions
diff --git a/app/assets/javascripts/projects/commit_box/info/components/commit_refs.vue b/app/assets/javascripts/projects/commit_box/info/components/commit_refs.vue
index 4258332ed6e..25af4cc8082 100644
--- a/app/assets/javascripts/projects/commit_box/info/components/commit_refs.vue
+++ b/app/assets/javascripts/projects/commit_box/info/components/commit_refs.vue
@@ -9,6 +9,8 @@ import {
   TAGS,
   FETCH_CONTAINING_REFS_EVENT,
   FETCH_COMMIT_REFERENCES_ERROR,
+  BRANCHES_REF_TYPE,
+  TAGS_REF_TYPE,
 } from '../constants';
 import RefsList from './refs_list.vue';
 
@@ -98,7 +100,9 @@ export default {
     tags: TAGS,
     errorMessage: FETCH_COMMIT_REFERENCES_ERROR,
   },
-  fetchContainingRefsEvent: FETCH_CONTAINING_REFS_EVENT,
+  FETCH_CONTAINING_REFS_EVENT,
+  BRANCHES_REF_TYPE,
+  TAGS_REF_TYPE,
 };
 </script>
 
@@ -112,7 +116,8 @@ export default {
       :containing-refs="containingBranches"
       :namespace="$options.i18n.branches"
       :url-part="commitsUrlPart"
-      @[$options.fetchContainingRefsEvent]="fetchContainingBranches"
+      :ref-type="$options.BRANCHES_REF_TYPE"
+      @[$options.FETCH_CONTAINING_REFS_EVENT]="fetchContainingBranches"
     />
     <refs-list
       v-if="hasTags"
@@ -122,7 +127,8 @@ export default {
       :containing-refs="containingTags"
       :namespace="$options.i18n.tags"
       :url-part="commitsUrlPart"
-      @[$options.fetchContainingRefsEvent]="fetchContainingTags"
+      :ref-type="$options.TAGS_REF_TYPE"
+      @[$options.FETCH_CONTAINING_REFS_EVENT]="fetchContainingTags"
     />
   </div>
 </template>
diff --git a/app/assets/javascripts/projects/commit_box/info/components/refs_list.vue b/app/assets/javascripts/projects/commit_box/info/components/refs_list.vue
index 7e21040a3b1..8ceab9cb60b 100644
--- a/app/assets/javascripts/projects/commit_box/info/components/refs_list.vue
+++ b/app/assets/javascripts/projects/commit_box/info/components/refs_list.vue
@@ -16,6 +16,10 @@ export default {
       type: String,
       required: true,
     },
+    refType: {
+      type: String,
+      required: true,
+    },
     containingRefs: {
       type: Array,
       required: false,
@@ -60,6 +64,9 @@ export default {
       this.toggleCollapse();
       this.$emit(FETCH_CONTAINING_REFS_EVENT);
     },
+    getRefUrl(ref) {
+      return `${this.urlPart}${ref}?ref_type=${this.refType}`;
+    },
   },
   i18n: {
     containingCommit: CONTAINING_COMMIT,
@@ -73,7 +80,7 @@ export default {
     <gl-badge
       v-for="ref in tippingRefs"
       :key="ref"
-      :href="`${urlPart}${ref}`"
+      :href="getRefUrl(ref)"
       class="gl-mt-2 gl-mr-2"
       size="sm"
       >{{ ref }}</gl-badge
@@ -94,7 +101,7 @@ export default {
         <gl-badge
           v-for="ref in containingRefs"
           :key="ref"
-          :href="`${urlPart}${ref}`"
+          :href="getRefUrl(ref)"
           class="gl-mt-3 gl-mr-2"
           size="sm"
           >{{ ref }}</gl-badge