1 files changed, 32 insertions, 1 deletions
diff --git a/app/assets/javascripts/search/sidebar/components/merge_requests_filters.vue b/app/assets/javascripts/search/sidebar/components/merge_requests_filters.vue
index bc5b797dd56..2845eb2049b 100644
--- a/app/assets/javascripts/search/sidebar/components/merge_requests_filters.vue
+++ b/app/assets/javascripts/search/sidebar/components/merge_requests_filters.vue
@@ -1,18 +1,49 @@
 <script>
+// eslint-disable-next-line no-restricted-imports
+import { mapGetters, mapState } from 'vuex';
+import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
+import { HR_DEFAULT_CLASSES, SEARCH_TYPE_ADVANCED } from '../constants';
+import { statusFilterData } from './status_filter/data';
 import StatusFilter from './status_filter/index.vue';
 import FiltersTemplate from './filters_template.vue';
+import { archivedFilterData } from './archived_filter/data';
+import ArchivedFilter from './archived_filter/index.vue';
 
 export default {
   name: 'MergeRequestsFilters',
   components: {
     StatusFilter,
     FiltersTemplate,
+    ArchivedFilter,
+  },
+  mixins: [glFeatureFlagsMixin()],
+  computed: {
+    ...mapGetters(['currentScope']),
+    ...mapState(['useSidebarNavigation', 'searchType']),
+    showArchivedFilter() {
+      return (
+        Object.values(archivedFilterData.scopes).includes(this.currentScope) &&
+        this.glFeatures.searchMergeRequestsHideArchivedProjects &&
+        this.searchType === SEARCH_TYPE_ADVANCED
+      );
+    },
+    showStatusFilter() {
+      return Object.values(statusFilterData.scopes).includes(this.currentScope);
+    },
+    showDivider() {
+      return !this.useSidebarNavigation;
+    },
+    hrClasses() {
+      return [...HR_DEFAULT_CLASSES, 'gl-display-none', 'gl-md-display-block'];
+    },
   },
 };
 </script>
 
 <template>
   <filters-template>
-    <status-filter class="gl-mb-5" />
+    <status-filter v-if="showStatusFilter" class="gl-mb-5" />
+    <hr v-if="showArchivedFilter && showDivider" :class="hrClasses" />
+    <archived-filter v-if="showArchivedFilter" class="gl-mb-5" />
   </filters-template>
 </template>