1 files changed, 19 insertions, 8 deletions
diff --git a/app/assets/javascripts/search/sidebar/components/results_filters.vue b/app/assets/javascripts/search/sidebar/components/results_filters.vue
index 5b53f94bb53..9b993ab9a86 100644
--- a/app/assets/javascripts/search/sidebar/components/results_filters.vue
+++ b/app/assets/javascripts/search/sidebar/components/results_filters.vue
@@ -2,6 +2,8 @@
 import { GlButton, GlLink } from '@gitlab/ui';
 import { mapActions, mapState } from 'vuex';
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
+import { confidentialFilterData } from '../constants/confidential_filter_data';
+import { stateFilterData } from '../constants/state_filter_data';
 import ConfidentialityFilter from './confidentiality_filter.vue';
 import StatusFilter from './status_filter.vue';
 
@@ -22,6 +24,15 @@ export default {
     searchPageVerticalNavFeatureFlag() {
       return this.glFeatures.searchPageVerticalNav;
     },
+    showConfidentialityFilter() {
+      return Object.values(confidentialFilterData.scopes).includes(this.urlQuery.scope);
+    },
+    showStatusFilter() {
+      return Object.values(stateFilterData.scopes).includes(this.urlQuery.scope);
+    },
+    ffBasedXPadding() {
+      return this.glFeatures.searchPageVerticalNav ? 'gl-px-5' : 'gl-px-0';
+    },
   },
   methods: {
     ...mapActions(['applyQuery', 'resetQuery']),
@@ -30,14 +41,14 @@ export default {
 </script>
 
 <template>
-  <form
-    :class="searchPageVerticalNavFeatureFlag ? 'gl-px-5' : 'gl-px-0'"
-    @submit.prevent="applyQuery"
-  >
-    <hr v-if="searchPageVerticalNavFeatureFlag" class="gl-my-5 gl-border-gray-100" />
-    <status-filter />
-    <confidentiality-filter />
-    <div class="gl-display-flex gl-align-items-center gl-mt-4">
+  <form class="gl-pt-5 gl-md-pt-0" @submit.prevent="applyQuery">
+    <hr
+      v-if="searchPageVerticalNavFeatureFlag"
+      class="gl-my-5 gl-border-gray-100 gl-display-none gl-md-display-block"
+    />
+    <status-filter v-if="showStatusFilter" />
+    <confidentiality-filter v-if="showConfidentialityFilter" />
+    <div class="gl-display-flex gl-align-items-center gl-mt-4" :class="ffBasedXPadding">
       <gl-button category="primary" variant="confirm" type="submit" :disabled="!sidebarDirty">
         {{ __('Apply') }}
       </gl-button>