Epic board list reorder

Review feedback

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

@@ -4,7 +4,6 @@ import { sortBy } from 'lodash';
 import Draggable from 'vuedraggable';
 import { mapState, mapGetters, mapActions } from 'vuex';
 import BoardAddNewColumn from 'ee_else_ce/boards/components/board_add_new_column.vue';
-import { sortableEnd, sortableStart } from '~/boards/mixins/sortable_default_options';
 import defaultSortableConfig from '~/sortable/sortable_config';
 import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import BoardColumn from './board_column.vue';
@@ -73,12 +72,7 @@ export default {
       const el = this.canDragColumns ? this.$refs.list.$el : this.$refs.list;
       el.scrollTo({ left: el.scrollWidth, behavior: 'smooth' });
     },
-    handleDragOnStart() {
-      sortableStart();
-    },
-
     handleDragOnEnd(params) {
-      sortableEnd();
       const { item, newIndex, oldIndex, to } = params;
 
       const listId = item.dataset.id;
@@ -106,7 +100,6 @@ export default {
       ref="list"
       v-bind="draggableOptions"
       class="boards-list gl-w-full gl-py-5 gl-px-3 gl-white-space-nowrap"
-      @start="handleDragOnStart"
       @end="handleDragOnEnd"
     >
       <board-column

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

@@ -238,8 +238,10 @@ export default {
     dispatch('updateList', { listId, position: newPosition, backupList });
   },
 
-  updateList: ({ commit, state }, { listId, position, collapsed, backupList }) => {
-    const { issuableType } = state;
+  updateList: (
+    { commit, state: { issuableType } },
+    { listId, position, collapsed, backupList },
+  ) => {
     gqlClient
       .mutate({
         mutation: updateListQueries[issuableType].mutation,

ee/spec/features/epic_boards/epic_boards_spec.rb

@@ -93,31 +93,31 @@ RSpec.describe 'epic boards', :js do
       drag(list_from_index: 0, list_to_index: 1)
       wait_for_all_requests
 
-      expect(find('.board:nth-child(1)')).not_to have_content(epic3.title)
-      expect(find('.board:nth-child(2)')).to have_content(epic3.title)
+      expect(find_board_list(1)).not_to have_content(epic3.title)
+      expect(find_board_list(2)).to have_content(epic3.title)
     end
 
     context 'lists' do
       let_it_be(:label_list2) { create(:epic_list, epic_board: epic_board, label: label2, position: 1) }
 
       it 'changes position of list' do
-        expect(find('.board:nth-child(2)')).to have_content(label.title)
-        expect(find('.board:nth-child(3)')).to have_content(label2.title)
+        expect(find_board_list(2)).to have_content(label.title)
+        expect(find_board_list(3)).to have_content(label2.title)
 
         drag(list_from_index: 2, list_to_index: 1, selector: '.board-header')
 
         wait_for_all_requests
 
-        expect(find('.board:nth-child(2)')).to have_content(label2.title)
-        expect(find('.board:nth-child(3)')).to have_content(label.title)
+        expect(find_board_list(2)).to have_content(label2.title)
+        expect(find_board_list(3)).to have_content(label.title)
 
         # Make sure list positions are preserved after a reload
         visit_epic_boards_page
 
         wait_for_all_requests
 
-        expect(find('.board:nth-child(2)')).to have_content(label2.title)
-        expect(find('.board:nth-child(3)')).to have_content(label.title)
+        expect(find_board_list(2)).to have_content(label2.title)
+        expect(find_board_list(3)).to have_content(label.title)
       end
 
       it 'dragging does not duplicate list' do
@@ -322,4 +322,8 @@ RSpec.describe 'epic boards', :js do
   def click_on_board_modal
     find('.board-config-modal .modal-content').click
   end
+
+  def find_board_list(board_number)
+    find(".board:nth-child(#{board_number})")
+  end
 end