Port of EE refactoring to extract EE lines from boards

3 files changed, 45 insertions, 21 deletions

diff --git a/app/assets/javascripts/boards/components/modal/footer.vue b/app/assets/javascripts/boards/components/modal/footer.vue
index e0dac6003f1..d4affc8c3de 100644
--- a/app/assets/javascripts/boards/components/modal/footer.vue
+++ b/app/assets/javascripts/boards/components/modal/footer.vue
@@ -28,23 +28,29 @@ export default {
     },
   },
   methods: {
+    buildUpdateRequest(list) {
+      return {
+        add_label_ids: [list.label.id],
+      };
+    },
     addIssues() {
       const firstListIndex = 1;
       const list = this.modal.selectedList || this.state.lists[firstListIndex];
       const selectedIssues = ModalStore.getSelectedIssues();
       const issueIds = selectedIssues.map(issue => issue.id);
+      const req = this.buildUpdateRequest(list);
 
       // Post the data to the backend
-      gl.boardService.bulkUpdate(issueIds, {
-        add_label_ids: [list.label.id],
-      }).catch(() => {
-        Flash(__('Failed to update issues, please try again.'));
+      gl.boardService
+        .bulkUpdate(issueIds, req)
+        .catch(() => {
+          Flash(__('Failed to update issues, please try again.'));
 
-        selectedIssues.forEach((issue) => {
-          list.removeIssue(issue);
-          list.issuesSize -= 1;
+          selectedIssues.forEach((issue) => {
+            list.removeIssue(issue);
+            list.issuesSize -= 1;
+          });
         });
-      });
 
       // Add the issues on the frontend
       selectedIssues.forEach((issue) => {
diff --git a/app/assets/javascripts/boards/components/modal/list.vue b/app/assets/javascripts/boards/components/modal/list.vue
index 02ac36d7367..a58b5afe970 100644
--- a/app/assets/javascripts/boards/components/modal/list.vue
+++ b/app/assets/javascripts/boards/components/modal/list.vue
@@ -121,8 +121,7 @@
     <div
       v-if="issuesCount > 0 && issues.length === 0"
       class="empty-state add-issues-empty-state-filter text-center">
-      <div
-        class="svg-content">
+      <div class="svg-content">
         <img :src="emptyStateSvg" />
       </div>
       <div class="text-content">
diff --git a/app/assets/javascripts/boards/components/sidebar/remove_issue.vue b/app/assets/javascripts/boards/components/sidebar/remove_issue.vue
index 55278626ffc..90d4c710daf 100644
--- a/app/assets/javascripts/boards/components/sidebar/remove_issue.vue
+++ b/app/assets/javascripts/boards/components/sidebar/remove_issue.vue
@@ -5,7 +5,7 @@
 
   const Store = gl.issueBoards.BoardsStore;
 
-  export default {
+  export default Vue.extend({
     props: {
       issue: {
         type: Object,
@@ -25,19 +25,16 @@
       removeIssue() {
         const { issue } = this;
         const lists = issue.getLists();
-        const listLabelIds = lists.map(list => list.label.id);
-
-        let labelIds = issue.labels.map(label => label.id).filter(id => !listLabelIds.includes(id));
-        if (labelIds.length === 0) {
-          labelIds = [''];
-        }
+        const req = this.buildPatchRequest(issue, lists);
 
         const data = {
-          issue: {
-            label_ids: labelIds,
-          },
+          issue: this.seedPatchRequest(issue, req),
         };
 
+        if (data.issue.label_ids.length === 0) {
+          data.issue.label_ids = [''];
+        }
+
         // Post the remove data
         Vue.http.patch(this.updateUrl, data).catch(() => {
           Flash(__('Failed to remove issue from board, please try again.'));
@@ -54,8 +51,30 @@
 
         Store.detail.issue = {};
       },
+      /**
+      * Build the default patch request.
+      */
+      buildPatchRequest(issue, lists) {
+        const listLabelIds = lists.map(list => list.label.id);
+
+        const labelIds = issue.labels
+          .map(label => label.id)
+          .filter(id => !listLabelIds.includes(id));
+
+        return {
+          label_ids: labelIds,
+        };
+      },
+      /**
+      * Seed the given patch request.
+      *
+      * (This is overridden in EE)
+      */
+      seedPatchRequest(issue, req) {
+        return req;
+      },
     },
-  };
+  });
 </script>
 <template>
   <div