Issue boards - Fetch recent board in GraphQL

Review feedback

app/helpers/boards_helper.rb

@@ -17,7 +17,6 @@ module BoardsHelper
       can_update: can_update?.to_s,
       can_admin_list: can_admin_list?.to_s,
       time_tracking_limit_to_hours: Gitlab::CurrentSettings.time_tracking_limit_to_hours.to_s,
-      recent_boards_endpoint: recent_boards_path,
       parent: current_board_parent.model_name.param_key,
       group_id: group_id,
       labels_filter_base_path: build_issue_link_base,
@@ -128,10 +127,6 @@ module BoardsHelper
     }
   end
 
-  def recent_boards_path
-    recent_project_boards_path(@project) if current_board_parent.is_a?(Project)
-  end
-
   def serializer
     CurrentBoardSerializer.new
   end

ee/app/helpers/ee/boards_helper.rb

@@ -84,12 +84,5 @@ module EE
 
       super
     end
-
-    override :recent_boards_path
-    def recent_boards_path
-      return recent_group_boards_path(@group) if current_board_parent.is_a?(Group)
-
-      super
-    end
   end
 end

ee/spec/frontend/boards/components/boards_selector_spec.js

@@ -52,7 +52,7 @@ describe('BoardsSelector', () => {
     });
   };
 
-  const findDropdown = () => wrapper.find(GlDropdown);
+  const findDropdown = () => wrapper.findComponent(GlDropdown);
 
   const projectBoardQueryHandlerSuccess = jest.fn().mockResolvedValue(mockProjectBoardResponse);
   const groupBoardQueryHandlerSuccess = jest.fn().mockResolvedValue(mockGroupBoardResponse);

spec/frontend/boards/components/boards_selector_spec.js

@@ -21,8 +21,8 @@ import {
   mockProjectAllBoardsResponse,
   mockGroupRecentBoardsResponse,
   mockProjectRecentBoardsResponse,
-  mockSmallGroupAllBoardsResponse,
-  mockEmptyGroupRecentBoardsResponse,
+  mockSmallProjectAllBoardsResponse,
+  mockEmptyProjectRecentBoardsResponse,
   boards,
   recentIssueBoards,
 } from '../mock_data';
@@ -60,9 +60,9 @@ describe('BoardsSelector', () => {
   };
 
   const getDropdownItems = () => wrapper.findAll('.js-dropdown-item');
-  const getDropdownHeaders = () => wrapper.findAll(GlDropdownSectionHeader);
-  const getLoadingIcon = () => wrapper.find(GlLoadingIcon);
-  const findDropdown = () => wrapper.find(GlDropdown);
+  const getDropdownHeaders = () => wrapper.findAllComponents(GlDropdownSectionHeader);
+  const getLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
+  const findDropdown = () => wrapper.findComponent(GlDropdown);
 
   const projectBoardQueryHandlerSuccess = jest.fn().mockResolvedValue(mockProjectBoardResponse);
   const groupBoardQueryHandlerSuccess = jest.fn().mockResolvedValue(mockGroupBoardResponse);
@@ -81,22 +81,22 @@ describe('BoardsSelector', () => {
 
   const smallBoardsQueryHandlerSuccess = jest
     .fn()
-    .mockResolvedValue(mockSmallGroupAllBoardsResponse);
+    .mockResolvedValue(mockSmallProjectAllBoardsResponse);
   const emptyRecentBoardsQueryHandlerSuccess = jest
     .fn()
-    .mockResolvedValue(mockEmptyGroupRecentBoardsResponse);
+    .mockResolvedValue(mockEmptyProjectRecentBoardsResponse);
 
   const createComponent = ({
-    groupBoardsQueryHandler = groupBoardsQueryHandlerSuccess,
-    groupRecentBoardsQueryHandler = groupRecentBoardsQueryHandlerSuccess,
+    projectBoardsQueryHandler = projectBoardsQueryHandlerSuccess,
+    projectRecentBoardsQueryHandler = projectRecentBoardsQueryHandlerSuccess,
   } = {}) => {
     fakeApollo = createMockApollo([
       [projectBoardQuery, projectBoardQueryHandlerSuccess],
       [groupBoardQuery, groupBoardQueryHandlerSuccess],
-      [projectBoardsQuery, projectBoardsQueryHandlerSuccess],
-      [groupBoardsQuery, groupBoardsQueryHandler],
-      [projectRecentBoardsQuery, projectRecentBoardsQueryHandlerSuccess],
-      [groupRecentBoardsQuery, groupRecentBoardsQueryHandler],
+      [projectBoardsQuery, projectBoardsQueryHandler],
+      [groupBoardsQuery, groupBoardsQueryHandlerSuccess],
+      [projectRecentBoardsQuery, projectRecentBoardsQueryHandler],
+      [groupRecentBoardsQuery, groupRecentBoardsQueryHandlerSuccess],
     ]);
 
     wrapper = mount(BoardsSelector, {
@@ -120,11 +120,12 @@ describe('BoardsSelector', () => {
 
   afterEach(() => {
     wrapper.destroy();
+    fakeApollo = null;
   });
 
   describe('template', () => {
     beforeEach(() => {
-      createStore({ isGroupBoard: true });
+      createStore({ isProjectBoard: true });
       createComponent();
     });
 
@@ -156,7 +157,7 @@ describe('BoardsSelector', () => {
       });
 
       it('fetches all issue boards', () => {
-        expect(groupBoardsQueryHandlerSuccess).toHaveBeenCalled();
+        expect(projectBoardsQueryHandlerSuccess).toHaveBeenCalled();
       });
 
       it('hides loading spinner', async () => {
@@ -196,19 +197,21 @@ describe('BoardsSelector', () => {
       describe('recent boards section', () => {
         it('shows only when boards are greater than 10', async () => {
           await nextTick();
-          expect(groupRecentBoardsQueryHandlerSuccess).toHaveBeenCalled();
+          expect(projectRecentBoardsQueryHandlerSuccess).toHaveBeenCalled();
           expect(getDropdownHeaders()).toHaveLength(2);
         });
 
         it('does not show when boards are less than 10', async () => {
-          createComponent({ groupBoardsQueryHandler: smallBoardsQueryHandlerSuccess });
+          createComponent({ projectBoardsQueryHandler: smallBoardsQueryHandlerSuccess });
 
           await nextTick();
           expect(getDropdownHeaders()).toHaveLength(0);
         });
 
         it('does not show when recentIssueBoards api returns empty array', async () => {
-          createComponent({ groupRecentBoardsQueryHandler: emptyRecentBoardsQueryHandlerSuccess });
+          createComponent({
+            projectRecentBoardsQueryHandler: emptyRecentBoardsQueryHandlerSuccess,
+          });
 
           await nextTick();
           expect(getDropdownHeaders()).toHaveLength(0);

spec/frontend/boards/mock_data.js

@@ -39,6 +39,7 @@ function boardGenerator(n) {
         id,
         name,
         weight: 0,
+        __typename: 'Board',
       },
     };
   });
@@ -47,22 +48,22 @@ function boardGenerator(n) {
 export const boards = boardGenerator(20);
 export const recentIssueBoards = boardGenerator(5);
 
-export const mockSmallGroupAllBoardsResponse = {
+export const mockSmallProjectAllBoardsResponse = {
   data: {
-    group: {
-      id: 'gid://gitlab/Group/114',
+    project: {
+      id: 'gid://gitlab/Project/114',
       boards: { edges: boardGenerator(3) },
-      __typename: 'Group',
+      __typename: 'Project',
     },
   },
 };
 
-export const mockEmptyGroupRecentBoardsResponse = {
+export const mockEmptyProjectRecentBoardsResponse = {
   data: {
-    group: {
-      id: 'gid://gitlab/Group/114',
+    project: {
+      id: 'gid://gitlab/Project/114',
       recentIssueBoards: { edges: [] },
-      __typename: 'Group',
+      __typename: 'Project',
     },
   },
 };