Add flash error for setAssignees failure

When set assignees fail in group issues board,
we show the createFlash banner

app/assets/javascripts/boards/components/board_assignee_dropdown.vue

@@ -134,7 +134,7 @@ export default {
 <template>
   <board-editable-item :loading="isSettingAssignees" :title="assigneeText" @close="saveAssignees">
     <template #collapsed>
-      <issuable-assignees :users="selected" @assign-self="assignSelf" />
+      <issuable-assignees :users="activeIssue.assignees" @assign-self="assignSelf" />
     </template>
 
     <template #default>

app/assets/javascripts/boards/stores/actions.js

@@ -13,7 +13,8 @@ import {
   formatIssue,
 } from '../boards_util';
 import boardStore from '~/boards/stores/boards_store';
-
+import createFlash from '~/flash';
+import { __ } from '~/locale';
 import updateAssigneesMutation from '~/vue_shared/components/sidebar/queries/updateAssignees.mutation.graphql';
 import listsIssuesQuery from '../graphql/lists_issues.query.graphql';
 import boardLabelsQuery from '../graphql/board_labels.query.graphql';
@@ -340,6 +341,9 @@ export default {
 
         return nodes;
       })
+      .catch(() => {
+        createFlash({ message: __('An error occurred while updating assignees.') });
+      })
       .finally(() => {
         commit(types.SET_ASSIGNEE_LOADING, false);
       });

changelogs/unreleased/ss-add-error-state-for-assignees.yml

+---
+title: Add flash message for setAssignees on group issue boards
+merge_request: 48277
+author:
+type: added

locale/gitlab.pot

@@ -3297,6 +3297,9 @@ msgstr ""
 msgid "An error occurred while updating approvers"
 msgstr ""
 
+msgid "An error occurred while updating assignees."
+msgstr ""
+
 msgid "An error occurred while updating configuration."
 msgstr ""
 

spec/frontend/boards/stores/actions_spec.js

@@ -18,6 +18,9 @@ import issueMoveListMutation from '~/boards/graphql/issue_move_list.mutation.gra
 import destroyBoardListMutation from '~/boards/graphql/board_list_destroy.mutation.graphql';
 import updateAssignees from '~/vue_shared/components/sidebar/queries/updateAssignees.mutation.graphql';
 import { fullBoardId, formatListIssues, formatBoardLists } from '~/boards/boards_util';
+import createFlash from '~/flash';
+
+jest.mock('~/flash');
 
 const expectNotImplemented = action => {
   it('is not implemented', () => {
@@ -666,46 +669,59 @@ describe('setAssignees', () => {
   const refPath = `${projectPath}#3`;
   const iid = '1';
 
-  beforeEach(() => {
-    jest.spyOn(gqlClient, 'mutate').mockResolvedValue({
-      data: { issueSetAssignees: { issue: { assignees: { nodes: [{ ...node }] } } } },
+  describe('when succeeds', () => {
+    beforeEach(() => {
+      jest.spyOn(gqlClient, 'mutate').mockResolvedValue({
+        data: { issueSetAssignees: { issue: { assignees: { nodes: [{ ...node }] } } } },
+      });
     });
-  });
 
-  it('calls mutate with the correct values', async () => {
-    await actions.setAssignees(
-      { commit: () => {}, getters: { activeIssue: { iid, referencePath: refPath } } },
-      [name],
-    );
+    it('calls mutate with the correct values', async () => {
+      await actions.setAssignees(
+        { commit: () => {}, getters: { activeIssue: { iid, referencePath: refPath } } },
+        [name],
+      );
 
-    expect(gqlClient.mutate).toHaveBeenCalledWith({
-      mutation: updateAssignees,
-      variables: { iid, assigneeUsernames: [name], projectPath },
+      expect(gqlClient.mutate).toHaveBeenCalledWith({
+        mutation: updateAssignees,
+        variables: { iid, assigneeUsernames: [name], projectPath },
+      });
+    });
+
+    it('calls the correct mutation with the correct values', done => {
+      testAction(
+        actions.setAssignees,
+        {},
+        { activeIssue: { iid, referencePath: refPath }, commit: () => {} },
+        [
+          { type: types.SET_ASSIGNEE_LOADING, payload: true },
+          {
+            type: 'UPDATE_ISSUE_BY_ID',
+            payload: { prop: 'assignees', issueId: undefined, value: [node] },
+          },
+          { type: types.SET_ASSIGNEE_LOADING, payload: false },
+        ],
+        [],
+        done,
+      );
     });
   });
 
-  it('calls the correct mutation with the correct values', done => {
-    testAction(
-      actions.setAssignees,
-      {},
-      { activeIssue: { iid, referencePath: refPath }, commit: () => {} },
-      [
-        {
-          type: 'SET_ASSIGNEE_LOADING',
-          payload: true,
-        },
-        {
-          type: 'UPDATE_ISSUE_BY_ID',
-          payload: { prop: 'assignees', issueId: undefined, value: [node] },
-        },
-        {
-          type: 'SET_ASSIGNEE_LOADING',
-          payload: false,
-        },
-      ],
-      [],
-      done,
-    );
+  describe('when fails', () => {
+    beforeEach(() => {
+      jest.spyOn(gqlClient, 'mutate').mockRejectedValue();
+    });
+
+    it('calls createFlash', async () => {
+      await actions.setAssignees({
+        commit: () => {},
+        getters: { activeIssue: { iid, referencePath: refPath } },
+      });
+
+      expect(createFlash).toHaveBeenCalledWith({
+        message: 'An error occurred while updating assignees.',
+      });
+    });
   });
 });