Add reviewer suggestions

app/assets/javascripts/issues_list/queries/iteration.fragment.graphql

+fragment Iteration on Iteration {
+  id
+  title
+}

app/assets/javascripts/issues_list/queries/label.fragment.graphql

+fragment Label on Label {
+  id
+  color
+  textColor
+  title
+}

app/assets/javascripts/issues_list/queries/milestone.fragment.graphql

+fragment Milestone on Milestone {
+  id
+  title
+}

app/assets/javascripts/issues_list/queries/search_iterations.query.graphql

+#import "./iteration.fragment.graphql"
+
 query searchIterations($fullPath: ID!, $search: String, $id: ID, $isProject: Boolean = false) {
   group(fullPath: $fullPath) @skip(if: $isProject) {
     iterations(title: $search, id: $id, includeAncestors: true) {
       nodes {
-        id
-        title
+        ...Iteration
       }
     }
   }
   project(fullPath: $fullPath) @include(if: $isProject) {
     iterations(title: $search, id: $id, includeAncestors: true) {
       nodes {
-        id
-        title
+        ...Iteration
       }
     }
   }

app/assets/javascripts/issues_list/queries/search_labels.query.graphql

+#import "./label.fragment.graphql"
+
 query searchLabels($fullPath: ID!, $search: String, $isProject: Boolean = false) {
   group(fullPath: $fullPath) @skip(if: $isProject) {
     labels(searchTerm: $search, includeAncestorGroups: true, includeDescendantGroups: true) {
       nodes {
-        id
-        color
-        textColor
-        title
+        ...Label
       }
     }
   }
   project(fullPath: $fullPath) @include(if: $isProject) {
     labels(searchTerm: $search, includeAncestorGroups: true) {
       nodes {
-        id
-        color
-        textColor
-        title
+        ...Label
       }
     }
   }

app/assets/javascripts/issues_list/queries/search_milestones.query.graphql

+#import "./milestone.fragment.graphql"
+
 query searchMilestones($fullPath: ID!, $search: String, $isProject: Boolean = false) {
   group(fullPath: $fullPath) @skip(if: $isProject) {
     milestones(searchTitle: $search, includeAncestors: true, includeDescendants: true) {
       nodes {
-        id
-        title
+        ...Milestone
       }
     }
   }
   project(fullPath: $fullPath) @include(if: $isProject) {
     milestones(searchTitle: $search, includeAncestors: true) {
       nodes {
-        id
-        title
+        ...Milestone
       }
     }
   }

app/assets/javascripts/issues_list/queries/search_users.query.graphql

+#import "./user.fragment.graphql"
+
 query searchUsers($fullPath: ID!, $search: String, $isProject: Boolean = false) {
   group(fullPath: $fullPath) @skip(if: $isProject) {
     groupMembers(search: $search) {
       nodes {
         user {
-          id
-          avatarUrl
-          name
-          username
+          ...User
         }
       }
     }
@@ -15,10 +14,7 @@ query searchUsers($fullPath: ID!, $search: String, $isProject: Boolean = false)
     projectMembers(search: $search) {
       nodes {
         user {
-          id
-          avatarUrl
-          name
-          username
+          ...User
         }
       }
     }

app/assets/javascripts/issues_list/queries/user.fragment.graphql

+fragment User on User {
+  id
+  avatarUrl
+  name
+  username
+}

spec/frontend/issues_list/components/issues_list_app_spec.js

@@ -191,7 +191,7 @@ describe('IssuesListApp component', () => {
           setWindowLocation(search);
 
           wrapper = mountComponent({
-            provide: { ...defaultProvide, isSignedIn: true },
+            provide: { isSignedIn: true },
             mountFn: mount,
           });
 
@@ -208,7 +208,15 @@ describe('IssuesListApp component', () => {
 
       describe('when user is not signed in', () => {
         it('does not render', () => {
-          wrapper = mountComponent({ provide: { ...defaultProvide, isSignedIn: false } });
+          wrapper = mountComponent({ provide: { isSignedIn: false } });
+
+          expect(findCsvImportExportButtons().exists()).toBe(false);
+        });
+      });
+
+      describe('when in a group context', () => {
+        it('does not render', () => {
+          wrapper = mountComponent({ provide: { isProject: false } });
 
           expect(findCsvImportExportButtons().exists()).toBe(false);
         });
@@ -625,70 +633,87 @@ describe('IssuesListApp component', () => {
         ...defaultQueryResponse.data.project.issues.nodes[0],
         id: 'gid://gitlab/Issue/1',
         iid: '101',
+        reference: 'group/project#1',
         webPath: '/group/project/-/issues/1',
       };
       const issueTwo = {
         ...defaultQueryResponse.data.project.issues.nodes[0],
         id: 'gid://gitlab/Issue/2',
         iid: '102',
+        reference: 'group/project#2',
         webPath: '/group/project/-/issues/2',
       };
       const issueThree = {
         ...defaultQueryResponse.data.project.issues.nodes[0],
         id: 'gid://gitlab/Issue/3',
         iid: '103',
+        reference: 'group/project#3',
         webPath: '/group/project/-/issues/3',
       };
       const issueFour = {
         ...defaultQueryResponse.data.project.issues.nodes[0],
         id: 'gid://gitlab/Issue/4',
         iid: '104',
+        reference: 'group/project#4',
         webPath: '/group/project/-/issues/4',
       };
-      const response = {
+      const response = (isProject = true) => ({
         data: {
-          project: {
+          [isProject ? 'project' : 'group']: {
             issues: {
               ...defaultQueryResponse.data.project.issues,
               nodes: [issueOne, issueTwo, issueThree, issueFour],
             },
           },
         },
-      };
-
-      beforeEach(() => {
-        wrapper = mountComponent({ issuesQueryResponse: jest.fn().mockResolvedValue(response) });
-        jest.runOnlyPendingTimers();
       });
 
       describe('when successful', () => {
-        describe.each`
-          description                       | issueToMove   | oldIndex | newIndex | moveBeforeId    | moveAfterId
-          ${'to the beginning of the list'} | ${issueThree} | ${2}     | ${0}     | ${null}         | ${issueOne.id}
-          ${'down the list'}                | ${issueOne}   | ${0}     | ${1}     | ${issueTwo.id}  | ${issueThree.id}
-          ${'up the list'}                  | ${issueThree} | ${2}     | ${1}     | ${issueOne.id}  | ${issueTwo.id}
-          ${'to the end of the list'}       | ${issueTwo}   | ${1}     | ${3}     | ${issueFour.id} | ${null}
-        `(
-          'when moving issue $description',
-          ({ issueToMove, oldIndex, newIndex, moveBeforeId, moveAfterId }) => {
-            it('makes API call to reorder the issue', async () => {
-              findIssuableList().vm.$emit('reorder', { oldIndex, newIndex });
-
-              await waitForPromises();
-
-              expect(axiosMock.history.put[0]).toMatchObject({
-                url: joinPaths(issueToMove.webPath, 'reorder'),
-                data: JSON.stringify({
-                  move_before_id: getIdFromGraphQLId(moveBeforeId),
-                  move_after_id: getIdFromGraphQLId(moveAfterId),
-                }),
+        describe.each([true, false])('when isProject=%s', (isProject) => {
+          describe.each`
+            description                       | issueToMove   | oldIndex | newIndex | moveBeforeId    | moveAfterId
+            ${'to the beginning of the list'} | ${issueThree} | ${2}     | ${0}     | ${null}         | ${issueOne.id}
+            ${'down the list'}                | ${issueOne}   | ${0}     | ${1}     | ${issueTwo.id}  | ${issueThree.id}
+            ${'up the list'}                  | ${issueThree} | ${2}     | ${1}     | ${issueOne.id}  | ${issueTwo.id}
+            ${'to the end of the list'}       | ${issueTwo}   | ${1}     | ${3}     | ${issueFour.id} | ${null}
+          `(
+            'when moving issue $description',
+            ({ issueToMove, oldIndex, newIndex, moveBeforeId, moveAfterId }) => {
+              beforeEach(() => {
+                wrapper = mountComponent({
+                  provide: { isProject },
+                  issuesQueryResponse: jest.fn().mockResolvedValue(response(isProject)),
+                });
+                jest.runOnlyPendingTimers();
               });
-            });
-          },
-        );
+
+              it('makes API call to reorder the issue', async () => {
+                findIssuableList().vm.$emit('reorder', { oldIndex, newIndex });
+
+                await waitForPromises();
+
+                expect(axiosMock.history.put[0]).toMatchObject({
+                  url: joinPaths(issueToMove.webPath, 'reorder'),
+                  data: JSON.stringify({
+                    move_before_id: getIdFromGraphQLId(moveBeforeId),
+                    move_after_id: getIdFromGraphQLId(moveAfterId),
+                    group_full_path: isProject ? undefined : defaultProvide.fullPath,
+                  }),
+                });
+              });
+            },
+          );
+        });
       });
 
       describe('when unsuccessful', () => {
+        beforeEach(() => {
+          wrapper = mountComponent({
+            issuesQueryResponse: jest.fn().mockResolvedValue(response()),
+          });
+          jest.runOnlyPendingTimers();
+        });
+
         it('displays an error message', async () => {
           axiosMock.onPut(joinPaths(issueOne.webPath, 'reorder')).reply(500);