Merge branch '54206-show-the-activity-filter-dropdown-in-discussion-tab-only' into 'master'

Resolve "Show the activity filter dropdown in discussion tab only, show all discussions always in changes tab"

Closes #54206

See merge request gitlab-org/gitlab-ce!24082

2 files changed, 19 insertions, 2 deletions

diff --git a/app/assets/javascripts/notes/components/discussion_filter.vue b/app/assets/javascripts/notes/components/discussion_filter.vue
index 86c114a761a..f5c410211b6 100644
--- a/app/assets/javascripts/notes/components/discussion_filter.vue
+++ b/app/assets/javascripts/notes/components/discussion_filter.vue
@@ -2,7 +2,11 @@
 import $ from 'jquery';
 import { mapGetters, mapActions } from 'vuex';
 import Icon from '~/vue_shared/components/icon.vue';
-import { DISCUSSION_FILTERS_DEFAULT_VALUE, HISTORY_ONLY_FILTER_VALUE } from '../constants';
+import {
+  DISCUSSION_FILTERS_DEFAULT_VALUE,
+  HISTORY_ONLY_FILTER_VALUE,
+  DISCUSSION_TAB_LABEL,
+} from '../constants';
 
 export default {
   components: {
@@ -23,6 +27,7 @@ export default {
     return {
       currentValue: this.selectedValue,
       defaultValue: DISCUSSION_FILTERS_DEFAULT_VALUE,
+      displayFilters: true,
     };
   },
   computed: {
@@ -32,6 +37,14 @@ export default {
       return this.filters.find(filter => filter.value === this.currentValue);
     },
   },
+  created() {
+    if (window.mrTabs) {
+      const { eventHub, currentTab } = window.mrTabs;
+
+      eventHub.$on('MergeRequestTabChange', this.toggleFilters);
+      this.toggleFilters(currentTab);
+    }
+  },
   mounted() {
     this.toggleCommentsForm();
   },
@@ -51,12 +64,15 @@ export default {
     toggleCommentsForm() {
       this.setCommentsDisabled(this.currentValue === HISTORY_ONLY_FILTER_VALUE);
     },
+    toggleFilters(tab) {
+      this.displayFilters = tab === DISCUSSION_TAB_LABEL;
+    },
   },
 };
 </script>
 
 <template>
-  <div class="discussion-filter-container d-inline-block align-bottom">
+  <div v-if="displayFilters" class="discussion-filter-container d-inline-block align-bottom">
     <button
       id="discussion-filter-dropdown"
       ref="dropdownToggle"
diff --git a/app/assets/javascripts/notes/constants.js b/app/assets/javascripts/notes/constants.js
index 3147dc64c27..78d365fe94b 100644
--- a/app/assets/javascripts/notes/constants.js
+++ b/app/assets/javascripts/notes/constants.js
@@ -17,6 +17,7 @@ export const RESOLVE_NOTE_METHOD_NAME = 'post';
 export const DESCRIPTION_TYPE = 'changed the description';
 export const HISTORY_ONLY_FILTER_VALUE = 2;
 export const DISCUSSION_FILTERS_DEFAULT_VALUE = 0;
+export const DISCUSSION_TAB_LABEL = 'show';
 
 export const NOTEABLE_TYPE_MAPPING = {
   Issue: ISSUE_NOTEABLE_TYPE,