Delete epic board list

Allow user to delete epic board list for list settings sidebar

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

@@ -84,7 +84,7 @@ export default {
       return this.list?.label?.description || this.list?.assignee?.name || this.list.title || '';
     },
     showListHeaderButton() {
-      return !this.disabled && this.listType !== ListType.closed && !this.isEpicBoard;
+      return !this.disabled && this.listType !== ListType.closed;
     },
     showMilestoneListDetails() {
       return this.listType === ListType.milestone && this.list.milestone && this.showListDetails;

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

@@ -29,17 +29,17 @@ export default {
     };
   },
   computed: {
-    ...mapGetters(['isSidebarOpen', 'shouldUseGraphQL']),
+    ...mapGetters(['isSidebarOpen', 'shouldUseGraphQL', 'isEpicBoard']),
     ...mapState(['activeId', 'sidebarType', 'boardLists']),
     isWipLimitsOn() {
-      return this.glFeatures.wipLimits;
+      return this.glFeatures.wipLimits && !this.isEpicBoard;
     },
     activeList() {
       /*
         Warning: Though a computed property it is not reactive because we are
         referencing a List Model class. Reactivity only applies to plain JS objects
       */
-      if (this.shouldUseGraphQL) {
+      if (this.shouldUseGraphQL || this.isEpicBoard) {
         return this.boardLists[this.activeId];
       }
       return boardsStore.state.lists.find(({ id }) => id === this.activeId);
@@ -71,7 +71,7 @@ export default {
     deleteBoard() {
       // eslint-disable-next-line no-alert
       if (window.confirm(__('Are you sure you want to remove this list?'))) {
-        if (this.shouldUseGraphQL) {
+        if (this.shouldUseGraphQL || this.isEpicBoard) {
           this.removeList(this.activeId);
         } else {
           this.activeList.destroy();

app/assets/javascripts/boards/constants.js

@@ -2,6 +2,7 @@ import { __ } from '~/locale';
 import updateEpicSubscriptionMutation from '~/sidebar/queries/update_epic_subscription.mutation.graphql';
 import updateEpicTitleMutation from '~/sidebar/queries/update_epic_title.mutation.graphql';
 import boardBlockingIssuesQuery from './graphql/board_blocking_issues.query.graphql';
+import destroyBoardListMutation from './graphql/board_list_destroy.mutation.graphql';
 import updateBoardListMutation from './graphql/board_list_update.mutation.graphql';
 import issueSetSubscriptionMutation from './graphql/issue_set_subscription.mutation.graphql';
 import issueSetTitleMutation from './graphql/issue_set_title.mutation.graphql';
@@ -73,6 +74,12 @@ export const updateListQueries = {
   },
 };
 
+export const deleteListQueries = {
+  [issuableTypes.issue]: {
+    mutation: destroyBoardListMutation,
+  },
+};
+
 export const titleQueries = {
   [issuableTypes.issue]: {
     mutation: issueSetTitleMutation,

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

@@ -8,6 +8,7 @@ import {
   titleQueries,
   subscriptionQueries,
   SupportedFilters,
+  deleteListQueries,
   updateListQueries,
 } from 'ee_else_ce/boards/constants';
 import createBoardListMutation from 'ee_else_ce/boards/graphql/board_list_create.mutation.graphql';
@@ -31,7 +32,6 @@ import {
   getSupportedParams,
 } from '../boards_util';
 import boardLabelsQuery from '../graphql/board_labels.query.graphql';
-import destroyBoardListMutation from '../graphql/board_list_destroy.mutation.graphql';
 import groupProjectsQuery from '../graphql/group_projects.query.graphql';
 import issueCreateMutation from '../graphql/issue_create.mutation.graphql';
 import issueSetDueDateMutation from '../graphql/issue_set_due_date.mutation.graphql';
@@ -266,13 +266,14 @@ export default {
   },
 
   removeList: ({ state, commit }, listId) => {
+    const { issuableType } = state;
     const listsBackup = { ...state.boardLists };
 
     commit(types.REMOVE_LIST, listId);
 
     return gqlClient
       .mutate({
-        mutation: destroyBoardListMutation,
+        mutation: deleteListQueries[issuableType].mutation,
         variables: {
           listId,
         },

ee/app/assets/javascripts/boards/constants.js

 import { issuableTypes } from '~/boards/constants';
+import destroyBoardListMutation from '~/boards/graphql/board_list_destroy.mutation.graphql';
 import updateBoardListMutation from '~/boards/graphql/board_list_update.mutation.graphql';
 
 import { s__ } from '~/locale';
 
+import destroyEpicBoardListMutation from './graphql/epic_board_list_destroy.mutation.graphql';
 import updateEpicBoardListMutation from './graphql/epic_board_list_update.mutation.graphql';
 
 export const DRAGGABLE_TAG = 'div';
@@ -68,6 +70,15 @@ export const updateListQueries = {
   },
 };
 
+export const deleteListQueries = {
+  [issuableTypes.issue]: {
+    mutation: destroyBoardListMutation,
+  },
+  [issuableTypes.epic]: {
+    mutation: destroyEpicBoardListMutation,
+  },
+};
+
 // re-export some FOSS constants so that lint does not yell
 // https://gitlab.com/gitlab-org/gitlab/-/issues/329164
 export {
@@ -82,6 +93,7 @@ export {
 } from '~/boards/constants';
 
 export default {
+  deleteListQueries,
   updateListQueries,
   DRAGGABLE_TAG,
   EpicFilterType,

ee/app/assets/javascripts/boards/graphql/epic_board_list_destroy.mutation.graphql

+mutation DestroyEpicBoardList($listId: BoardsEpicListID!) {
+  destroyBoardList: epicBoardListDestroy(input: { listId: $listId }) {
+    errors
+  }
+}

ee/spec/features/epic_boards/epic_boards_spec.rb

@@ -128,6 +128,18 @@ RSpec.describe 'epic boards', :js do
 
         expect(page).to have_selector(selector, text: label.title, count: 1)
       end
+
+      it 'allows user to delete list from list settings sidebar' do
+        expect(page).to have_content(label.name)
+
+        page.within(find('.board:nth-child(2)')) do
+          click_button 'List settings'
+        end
+
+        accept_confirm { click_button 'Remove list' }
+
+        expect(page).not_to have_content(label.name)
+      end
     end
   end
 
@@ -189,6 +201,14 @@ RSpec.describe 'epic boards', :js do
         end
       end
     end
+
+    it 'does not show Remove list in list settings sidebar' do
+      page.within(find('.board:nth-child(2)')) do
+        click_button 'List settings'
+      end
+
+      expect(page).not_to have_button('Remove list')
+    end
   end
 
   context 'filtered search' do

spec/frontend/boards/stores/actions_spec.js

@@ -503,6 +503,7 @@ describe('removeList', () => {
   beforeEach(() => {
     state = {
       boardLists: mockListsById,
+      issuableType: 'issue',
     };
   });