1 files changed, 17 insertions, 14 deletions

diff --git a/app/assets/javascripts/vue_shared/components/user_select/user_select.vue b/app/assets/javascripts/vue_shared/components/user_select/user_select.vue
index 86a99b8f0ed..edcfabe7da3 100644
--- a/app/assets/javascripts/vue_shared/components/user_select/user_select.vue
+++ b/app/assets/javascripts/vue_shared/components/user_select/user_select.vue
@@ -2,18 +2,19 @@
 import { debounce } from 'lodash';
 import {
   GlDropdown,
-  GlDropdownForm,
   GlDropdownDivider,
+  GlDropdownForm,
   GlDropdownItem,
-  GlSearchBoxByType,
   GlLoadingIcon,
+  GlSearchBoxByType,
   GlTooltipDirective,
 } from '@gitlab/ui';
 import { __ } from '~/locale';
 import SidebarParticipant from '~/sidebar/components/assignees/sidebar_participant.vue';
-import { IssuableType } from '~/issues/constants';
+import { IssuableType, TYPE_ISSUE } from '~/issues/constants';
 import { DEFAULT_DEBOUNCE_AND_THROTTLE_MS } from '~/lib/utils/constants';
 import { participantsQueries, userSearchQueries } from '~/sidebar/constants';
+import { TYPENAME_MERGE_REQUEST } from '~/graphql_shared/constants';
 import { convertToGraphQLId } from '~/graphql_shared/utils';
 
 export default {
@@ -47,7 +48,8 @@ export default {
     },
     iid: {
       type: String,
-      required: true,
+      required: false,
+      default: null,
     },
     value: {
       type: Array,
@@ -65,7 +67,7 @@ export default {
     issuableType: {
       type: String,
       required: false,
-      default: IssuableType.Issue,
+      default: TYPE_ISSUE,
     },
     isEditing: {
       type: Boolean,
@@ -160,20 +162,17 @@ export default {
       }
       return {
         ...variables,
-        mergeRequestId: convertToGraphQLId('MergeRequest', this.issuableId),
+        mergeRequestId: convertToGraphQLId(TYPENAME_MERGE_REQUEST, this.issuableId),
       };
     },
     isLoading() {
       return this.$apollo.queries.searchUsers.loading || this.$apollo.queries.participants.loading;
     },
     users() {
-      if (!this.participants) {
-        return [];
-      }
-
-      const filteredParticipants = this.participants.filter(
-        (user) => user.name.includes(this.search) || user.username.includes(this.search),
-      );
+      const filteredParticipants =
+        this.participants?.filter(
+          (user) => user.name.includes(this.search) || user.username.includes(this.search),
+        ) || [];
 
       // TODO this de-duplication is temporary (BE fix required)
       // https://gitlab.com/gitlab-org/gitlab/-/issues/327822
@@ -254,6 +253,10 @@ export default {
         this.$emit('input', selected);
       }
     },
+    unassign() {
+      this.$emit('input', []);
+      this.$refs.dropdown.hide();
+    },
     unselect(name) {
       const selected = this.value.filter((user) => user.username !== name);
       this.$emit('input', selected);
@@ -323,7 +326,7 @@ export default {
             :is-checked="selectedIsEmpty"
             is-check-centered
             data-testid="unassign"
-            @click.native.capture.stop="$emit('input', [])"
+            @click.native.capture.stop="unassign"
           >
             <span :class="selectedIsEmpty ? 'gl-pl-0' : 'gl-pl-6'" class="gl-font-weight-bold">{{
               $options.i18n.unassigned