Port of EE refactoring to extract EE lines from boardsce-5787-extract-ee-boards

6 files changed, 89 insertions, 35 deletions

diff --git a/app/assets/javascripts/boards/components/issue_card_inner.js b/app/assets/javascripts/boards/components/issue_card_inner.js
index f7d7b910e2f..8bce041a2f2 100644
--- a/app/assets/javascripts/boards/components/issue_card_inner.js
+++ b/app/assets/javascripts/boards/components/issue_card_inner.js
@@ -1,5 +1,6 @@
 import $ from 'jquery';
 import Vue from 'vue';
+import '~/boards/stores/boards_store';
 import UserAvatarLink from '../../vue_shared/components/user_avatar/user_avatar_link.vue';
 import eventHub from '../eventhub';
 
diff --git a/app/assets/javascripts/boards/components/modal/footer.js b/app/assets/javascripts/boards/components/modal/footer.js
index 2745ca219ad..f7f65aff558 100644
--- a/app/assets/javascripts/boards/components/modal/footer.js
+++ b/app/assets/javascripts/boards/components/modal/footer.js
@@ -28,23 +28,29 @@ gl.issueBoards.ModalFooter = Vue.extend({
     },
   },
   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/sidebar/remove_issue.js b/app/assets/javascripts/boards/components/sidebar/remove_issue.js
index 0a0820ec5fd..23cba12e7a7 100644
--- a/app/assets/javascripts/boards/components/sidebar/remove_issue.js
+++ b/app/assets/javascripts/boards/components/sidebar/remove_issue.js
@@ -27,21 +27,16 @@ gl.issueBoards.RemoveIssueBtn = Vue.extend({
     removeIssue() {
       const issue = this.issue;
       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.'));
@@ -58,6 +53,28 @@ gl.issueBoards.RemoveIssueBtn = Vue.extend({
 
       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;
+    },
   },
   template: `
     <div
diff --git a/app/assets/javascripts/boards/models/issue.js b/app/assets/javascripts/boards/models/issue.js
index b381d48d625..5a242aeb23e 100644
--- a/app/assets/javascripts/boards/models/issue.js
+++ b/app/assets/javascripts/boards/models/issue.js
@@ -4,6 +4,7 @@
 /* global ListAssignee */
 
 import Vue from 'vue';
+import '~/vue_shared/models/label';
 import IssueProject from './project';
 
 class ListIssue {
diff --git a/app/assets/javascripts/boards/models/list.js b/app/assets/javascripts/boards/models/list.js
index 1f0fe7f9e85..e2f150f96be 100644
--- a/app/assets/javascripts/boards/models/list.js
+++ b/app/assets/javascripts/boards/models/list.js
@@ -7,6 +7,24 @@ import queryData from '../utils/query_data';
 
 const PER_PAGE = 20;
 
+const TYPES = {
+  backlog: {
+    isPreset: true,
+    isExpandable: true,
+    isBlank: false,
+  },
+  closed: {
+    isPreset: true,
+    isExpandable: true,
+    isBlank: false,
+  },
+  blank: {
+    isPreset: true,
+    isExpandable: false,
+    isBlank: true,
+  },
+};
+
 class List {
   constructor(obj, defaultAvatar) {
     this.id = obj.id;
@@ -14,8 +32,10 @@ class List {
     this.position = obj.position;
     this.title = obj.title;
     this.type = obj.list_type;
-    this.preset = ['backlog', 'closed', 'blank'].indexOf(this.type) > -1;
-    this.isExpandable = ['backlog', 'closed'].indexOf(this.type) > -1;
+
+    const typeInfo = this.getTypeInfo(this.type);
+    this.preset = !!typeInfo.isPreset;
+    this.isExpandable = !!typeInfo.isExpandable;
     this.isExpanded = true;
     this.page = 1;
     this.loading = true;
@@ -31,7 +51,7 @@ class List {
       this.title = this.assignee.name;
     }
 
-    if (this.type !== 'blank' && this.id) {
+    if (!typeInfo.isBlank && this.id) {
       this.getIssues().catch(() => {
         // TODO: handle request error
       });
@@ -107,7 +127,7 @@ class List {
     return gl.boardService
       .getIssuesForList(this.id, data)
       .then(res => res.data)
-      .then((data) => {
+      .then(data => {
         this.loading = false;
         this.issuesSize = data.size;
 
@@ -126,18 +146,7 @@ class List {
     return gl.boardService
       .newIssue(this.id, issue)
       .then(res => res.data)
-      .then((data) => {
-        issue.id = data.id;
-        issue.iid = data.iid;
-        issue.project = data.project;
-        issue.path = data.real_path;
-        issue.referencePath = data.reference_path;
-
-        if (this.issuesSize > 1) {
-          const moveBeforeId = this.issues[1].id;
-          gl.boardService.moveIssue(issue.id, null, null, null, moveBeforeId);
-        }
-      });
+      .then((data) => this.onNewIssueResponse(issue, data));
   }
 
   createIssues(data) {
@@ -217,6 +226,25 @@ class List {
       return !matchesRemove;
     });
   }
+
+  getTypeInfo (type) {
+    return TYPES[type] || {};
+  }
+
+  onNewIssueResponse (issue, data) {
+    issue.id = data.id;
+    issue.iid = data.iid;
+    issue.project = data.project;
+    issue.path = data.real_path;
+    issue.referencePath = data.reference_path;
+
+    if (this.issuesSize > 1) {
+      const moveBeforeId = this.issues[1].id;
+      gl.boardService.moveIssue(issue.id, null, null, null, moveBeforeId);
+    }
+  }
 }
 
 window.List = List;
+
+export default List;
diff --git a/app/assets/javascripts/milestone_select.js b/app/assets/javascripts/milestone_select.js
index d269c45203a..4d5e31cbd1d 100644
--- a/app/assets/javascripts/milestone_select.js
+++ b/app/assets/javascripts/milestone_select.js
@@ -5,6 +5,7 @@
 import $ from 'jquery';
 import _ from 'underscore';
 import { __ } from '~/locale';
+import '~/gl_dropdown';
 import axios from './lib/utils/axios_utils';
 import { timeFor } from './lib/utils/datetime_utility';
 import ModalStore from './boards/stores/modal_store';