1 files changed, 12 insertions, 52 deletions

diff --git a/app/assets/javascripts/vue_shared/components/sidebar/labels_select_widget/dropdown_contents_labels_view.vue b/app/assets/javascripts/vue_shared/components/sidebar/labels_select_widget/dropdown_contents_labels_view.vue
index e6a25362ff0..e9a2d7747e2 100644
--- a/app/assets/javascripts/vue_shared/components/sidebar/labels_select_widget/dropdown_contents_labels_view.vue
+++ b/app/assets/javascripts/vue_shared/components/sidebar/labels_select_widget/dropdown_contents_labels_view.vue
@@ -1,18 +1,10 @@
 <script>
-import {
-  GlDropdownForm,
-  GlDropdownItem,
-  GlLoadingIcon,
-  GlSearchBoxByType,
-  GlIntersectionObserver,
-} from '@gitlab/ui';
+import { GlDropdownForm, GlDropdownItem, GlLoadingIcon, GlIntersectionObserver } from '@gitlab/ui';
 import fuzzaldrinPlus from 'fuzzaldrin-plus';
-import { debounce } from 'lodash';
 import createFlash from '~/flash';
 import { getIdFromGraphQLId } from '~/graphql_shared/utils';
-import { DEFAULT_DEBOUNCE_AND_THROTTLE_MS } from '~/lib/utils/constants';
 import { __ } from '~/locale';
-import { labelsQueries } from '~/sidebar/constants';
+import { workspaceLabelsQueries } from '~/sidebar/constants';
 import LabelItem from './label_item.vue';
 
 export default {
@@ -20,7 +12,6 @@ export default {
     GlDropdownForm,
     GlDropdownItem,
     GlLoadingIcon,
-    GlSearchBoxByType,
     GlIntersectionObserver,
     LabelItem,
   },
@@ -28,18 +19,10 @@ export default {
     prop: 'localSelectedLabels',
   },
   props: {
-    selectedLabels: {
-      type: Array,
-      required: true,
-    },
     allowMultiselect: {
       type: Boolean,
       required: true,
     },
-    issuableType: {
-      type: String,
-      required: true,
-    },
     localSelectedLabels: {
       type: Array,
       required: true,
@@ -48,10 +31,17 @@ export default {
       type: String,
       required: true,
     },
+    searchKey: {
+      type: String,
+      required: true,
+    },
+    workspaceType: {
+      type: String,
+      required: true,
+    },
   },
   data() {
     return {
-      searchKey: '',
       labels: [],
       isVisible: false,
     };
@@ -59,7 +49,7 @@ export default {
   apollo: {
     labels: {
       query() {
-        return labelsQueries[this.issuableType].workspaceQuery;
+        return workspaceLabelsQueries[this.workspaceType].query;
       },
       variables() {
         return {
@@ -71,12 +61,6 @@ export default {
         return this.searchKey.length === 1 || !this.isVisible;
       },
       update: (data) => data.workspace?.labels?.nodes || [],
-      async result() {
-        if (this.$refs.searchInput) {
-          await this.$nextTick;
-          this.$refs.searchInput.focusInput();
-        }
-      },
       error() {
         createFlash({ message: __('Error fetching labels.') });
       },
@@ -101,12 +85,6 @@ export default {
       return Boolean(this.searchKey) && this.visibleLabels.length === 0;
     },
   },
-  created() {
-    this.debouncedSearchKeyUpdate = debounce(this.setSearchKey, DEFAULT_DEBOUNCE_AND_THROTTLE_MS);
-  },
-  beforeDestroy() {
-    this.debouncedSearchKeyUpdate.cancel();
-  },
   methods: {
     isLabelSelected(label) {
       return this.localSelectedLabelsIds.includes(getIdFromGraphQLId(label.id));
@@ -137,13 +115,7 @@ export default {
           ({ id }) => id !== getIdFromGraphQLId(label.id) && id !== label.id,
         );
       } else {
-        labels = [
-          ...this.localSelectedLabels,
-          {
-            ...label,
-            id: getIdFromGraphQLId(label.id),
-          },
-        ];
+        labels = [...this.localSelectedLabels, label];
       }
       this.$emit('input', labels);
     },
@@ -153,12 +125,8 @@ export default {
         this.$emit('closeDropdown', this.localSelectedLabels);
       }
     },
-    setSearchKey(value) {
-      this.searchKey = value;
-    },
     onDropdownAppear() {
       this.isVisible = true;
-      this.$refs.searchInput.focusInput();
     },
   },
 };
@@ -167,14 +135,6 @@ export default {
 <template>
   <gl-intersection-observer @appear="onDropdownAppear">
     <gl-dropdown-form class="labels-select-contents-list js-labels-list">
-      <gl-search-box-by-type
-        ref="searchInput"
-        :value="searchKey"
-        :disabled="labelsFetchInProgress"
-        data-qa-selector="dropdown_input_field"
-        data-testid="dropdown-input-field"
-        @input="debouncedSearchKeyUpdate"
-      />
       <div ref="labelsListContainer" data-testid="dropdown-content">
         <gl-loading-icon
           v-if="labelsFetchInProgress"