Merge branch 'winh-move-BoardService-to-boardsStore-ee' into 'master'

Move BoardService logic to boardsStore (EE-port)

See merge request gitlab-org/gitlab-ee!13945

app/assets/javascripts/boards/index.js

@@ -85,13 +85,14 @@ export default () => {
       },
     },
     created() {
-      gl.boardService = new BoardService({
+      boardsStore.setEndpoints({
         boardsEndpoint: this.boardsEndpoint,
         recentBoardsEndpoint: this.recentBoardsEndpoint,
         listsEndpoint: this.listsEndpoint,
         bulkUpdatePath: this.bulkUpdatePath,
         boardId: this.boardId,
       });
+      gl.boardService = new BoardService();
       boardsStore.rootPath = this.boardsEndpoint;
 
       eventHub.$on('updateTokens', this.updateTokens);

app/assets/javascripts/boards/services/board_service.js

-import axios from '../../lib/utils/axios_utils';
-import { mergeUrlParams } from '../../lib/utils/url_utility';
+/* eslint-disable class-methods-use-this */
 
-export default class BoardService {
-  constructor({ boardsEndpoint, listsEndpoint, bulkUpdatePath, boardId, recentBoardsEndpoint }) {
-    this.boardsEndpoint = boardsEndpoint;
-    this.boardId = boardId;
-    this.listsEndpoint = listsEndpoint;
-    this.listsEndpointGenerate = `${listsEndpoint}/generate.json`;
-    this.bulkUpdatePath = bulkUpdatePath;
-    this.recentBoardsEndpoint = `${recentBoardsEndpoint}.json`;
-  }
+import boardsStore from '~/boards/stores/boards_store';
 
+export default class BoardService {
   generateBoardsPath(id) {
-    return `${this.boardsEndpoint}${id ? `/${id}` : ''}.json`;
+    return boardsStore.generateBoardsPath(id);
   }
 
   generateIssuesPath(id) {
-    return `${this.listsEndpoint}${id ? `/${id}` : ''}/issues`;
+    return boardsStore.generateIssuesPath(id);
   }
 
   static generateIssuePath(boardId, id) {
-    return `${gon.relative_url_root}/-/boards/${boardId ? `${boardId}` : ''}/issues${
-      id ? `/${id}` : ''
-    }`;
+    return boardsStore.generateIssuePath(boardId, id);
   }
 
   all() {
-    return axios.get(this.listsEndpoint);
+    return boardsStore.all();
   }
 
   generateDefaultLists() {
-    return axios.post(this.listsEndpointGenerate, {});
+    return boardsStore.generateDefaultLists();
   }
 
   createList(entityId, entityType) {
-    const list = {
-      [entityType]: entityId,
-    };
-
-    return axios.post(this.listsEndpoint, {
-      list,
-    });
+    return boardsStore.createList(entityId, entityType);
   }
 
   updateList(id, position) {
-    return axios.put(`${this.listsEndpoint}/${id}`, {
-      list: {
-        position,
-      },
-    });
+    return boardsStore.updateList(id, position);
   }
 
   destroyList(id) {
-    return axios.delete(`${this.listsEndpoint}/${id}`);
+    return boardsStore.destroyList(id);
   }
 
   getIssuesForList(id, filter = {}) {
-    const data = { id };
-    Object.keys(filter).forEach(key => {
-      data[key] = filter[key];
-    });
-
-    return axios.get(mergeUrlParams(data, this.generateIssuesPath(id)));
+    return boardsStore.getIssuesForList(id, filter);
   }
 
   moveIssue(id, fromListId = null, toListId = null, moveBeforeId = null, moveAfterId = null) {
-    return axios.put(BoardService.generateIssuePath(this.boardId, id), {
-      from_list_id: fromListId,
-      to_list_id: toListId,
-      move_before_id: moveBeforeId,
-      move_after_id: moveAfterId,
-    });
+    return boardsStore.moveIssue(id, fromListId, toListId, moveBeforeId, moveAfterId);
   }
 
   newIssue(id, issue) {
-    return axios.post(this.generateIssuesPath(id), {
-      issue,
-    });
+    return boardsStore.newIssue(id, issue);
   }
 
   getBacklog(data) {
-    return axios.get(
-      mergeUrlParams(data, `${gon.relative_url_root}/-/boards/${this.boardId}/issues.json`),
-    );
+    return boardsStore.getBacklog(data);
   }
 
   bulkUpdate(issueIds, extraData = {}) {
-    const data = {
-      update: Object.assign(extraData, {
-        issuable_ids: issueIds.join(','),
-      }),
-    };
-
-    return axios.post(this.bulkUpdatePath, data);
+    return boardsStore.bulkUpdate(issueIds, extraData);
   }
 
   static getIssueInfo(endpoint) {
-    return axios.get(endpoint);
+    return boardsStore.getIssueInfo(endpoint);
   }
 
   static toggleIssueSubscription(endpoint) {
-    return axios.post(endpoint);
+    return boardsStore.toggleIssueSubscription(endpoint);
   }
 }
 

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

@@ -8,6 +8,8 @@ import Cookies from 'js-cookie';
 import BoardsStoreEE from 'ee_else_ce/boards/stores/boards_store_ee';
 import { getUrlParamsArray, parseBoolean } from '~/lib/utils/common_utils';
 import { __ } from '~/locale';
+import axios from '~/lib/utils/axios_utils';
+import { mergeUrlParams } from '~/lib/utils/url_utility';
 import eventHub from '../eventhub';
 
 const boardsStore = {
@@ -28,6 +30,7 @@ const boardsStore = {
     },
     currentPage: '',
     reload: false,
+    endpoints: {},
   },
   detail: {
     issue: {},
@@ -36,6 +39,19 @@ const boardsStore = {
     issue: {},
     list: {},
   },
+
+  setEndpoints({ boardsEndpoint, listsEndpoint, bulkUpdatePath, boardId, recentBoardsEndpoint }) {
+    const listsEndpointGenerate = `${listsEndpoint}/generate.json`;
+    this.state.endpoints = {
+      boardsEndpoint,
+      boardId,
+      listsEndpoint,
+      listsEndpointGenerate,
+      bulkUpdatePath,
+      recentBoardsEndpoint: `${recentBoardsEndpoint}.json`,
+    };
+  },
+
   create() {
     this.state.lists = [];
     this.filter.path = getUrlParamsArray().join('&');
@@ -229,6 +245,101 @@ const boardsStore = {
   setTimeTrackingLimitToHours(limitToHours) {
     this.timeTracking.limitToHours = parseBoolean(limitToHours);
   },
+
+  generateBoardsPath(id) {
+    return `${this.state.endpoints.boardsEndpoint}${id ? `/${id}` : ''}.json`;
+  },
+
+  generateIssuesPath(id) {
+    return `${this.state.endpoints.listsEndpoint}${id ? `/${id}` : ''}/issues`;
+  },
+
+  generateIssuePath(boardId, id) {
+    return `${gon.relative_url_root}/-/boards/${boardId ? `${boardId}` : ''}/issues${
+      id ? `/${id}` : ''
+    }`;
+  },
+
+  all() {
+    return axios.get(this.state.endpoints.listsEndpoint);
+  },
+
+  generateDefaultLists() {
+    return axios.post(this.state.endpoints.listsEndpointGenerate, {});
+  },
+
+  createList(entityId, entityType) {
+    const list = {
+      [entityType]: entityId,
+    };
+
+    return axios.post(this.state.endpoints.listsEndpoint, {
+      list,
+    });
+  },
+
+  updateList(id, position) {
+    return axios.put(`${this.state.endpoints.listsEndpoint}/${id}`, {
+      list: {
+        position,
+      },
+    });
+  },
+
+  destroyList(id) {
+    return axios.delete(`${this.state.endpoints.listsEndpoint}/${id}`);
+  },
+
+  getIssuesForList(id, filter = {}) {
+    const data = { id };
+    Object.keys(filter).forEach(key => {
+      data[key] = filter[key];
+    });
+
+    return axios.get(mergeUrlParams(data, this.generateIssuesPath(id)));
+  },
+
+  moveIssue(id, fromListId = null, toListId = null, moveBeforeId = null, moveAfterId = null) {
+    return axios.put(this.generateIssuePath(this.state.endpoints.boardId, id), {
+      from_list_id: fromListId,
+      to_list_id: toListId,
+      move_before_id: moveBeforeId,
+      move_after_id: moveAfterId,
+    });
+  },
+
+  newIssue(id, issue) {
+    return axios.post(this.generateIssuesPath(id), {
+      issue,
+    });
+  },
+
+  getBacklog(data) {
+    return axios.get(
+      mergeUrlParams(
+        data,
+        `${gon.relative_url_root}/-/boards/${this.state.endpoints.boardId}/issues.json`,
+      ),
+    );
+  },
+
+  bulkUpdate(issueIds, extraData = {}) {
+    const data = {
+      update: Object.assign(extraData, {
+        issuable_ids: issueIds.join(','),
+      }),
+    };
+
+    return axios.post(this.state.endpoints.bulkUpdatePath, data);
+  },
+
+  getIssueInfo(endpoint) {
+    return axios.get(endpoint);
+  },
+
+  toggleIssueSubscription(endpoint) {
+    return axios.post(endpoint);
+  },
 };
 
 BoardsStoreEE.initEESpecific(boardsStore);

ee/app/assets/javascripts/boards/services/board_service.js

-import axios from '~/lib/utils/axios_utils';
+/* eslint-disable class-methods-use-this */
+
 import BoardService from '~/boards/services/board_service';
+import boardsStore from '~/boards/stores/boards_store';
 
 export default class BoardServiceEE extends BoardService {
   allBoards() {
-    return axios.get(this.generateBoardsPath());
+    return boardsStore.allBoards();
   }
 
   recentBoards() {
-    return axios.get(this.recentBoardsEndpoint);
+    return boardsStore.recentBoards();
   }
 
   createBoard(board) {
-    const boardPayload = { ...board };
-    boardPayload.label_ids = (board.labels || []).map(b => b.id);
-
-    if (boardPayload.label_ids.length === 0) {
-      boardPayload.label_ids = [''];
-    }
-
-    if (boardPayload.assignee) {
-      boardPayload.assignee_id = boardPayload.assignee.id;
-    }
-
-    if (boardPayload.milestone) {
-      boardPayload.milestone_id = boardPayload.milestone.id;
-    }
-
-    if (boardPayload.id) {
-      return axios.put(this.generateBoardsPath(boardPayload.id), { board: boardPayload });
-    }
-    return axios.post(this.generateBoardsPath(), { board: boardPayload });
+    return boardsStore.createBoard(board);
   }
 
   deleteBoard({ id }) {
-    return axios.delete(this.generateBoardsPath(id));
+    return boardsStore.deleteBoard({ id });
   }
 
   static updateWeight(endpoint, weight = null) {
-    return axios.put(endpoint, {
-      weight,
-    });
+    return boardsStore.updateWeight(endpoint, weight);
   }
 }

ee/app/assets/javascripts/boards/stores/boards_store_ee.js

@@ -2,7 +2,6 @@
 import _ from 'underscore';
 import Cookies from 'js-cookie';
 import { __, sprintf } from '~/locale';
-import BoardService from 'ee/boards/services/board_service';
 import sidebarEventHub from '~/sidebar/event_hub';
 import createFlash from '~/flash';
 import { parseBoolean } from '~/lib/utils/common_utils';
@@ -66,6 +65,48 @@ class BoardsStoreEE {
     };
 
     sidebarEventHub.$on('updateWeight', this.updateWeight.bind(this));
+
+    Object.assign(this.store, {
+      allBoards() {
+        return axios.get(this.generateBoardsPath());
+      },
+
+      recentBoards() {
+        return axios.get(this.state.endpoints.recentBoardsEndpoint);
+      },
+
+      createBoard(board) {
+        const boardPayload = { ...board };
+        boardPayload.label_ids = (board.labels || []).map(b => b.id);
+
+        if (boardPayload.label_ids.length === 0) {
+          boardPayload.label_ids = [''];
+        }
+
+        if (boardPayload.assignee) {
+          boardPayload.assignee_id = boardPayload.assignee.id;
+        }
+
+        if (boardPayload.milestone) {
+          boardPayload.milestone_id = boardPayload.milestone.id;
+        }
+
+        if (boardPayload.id) {
+          return axios.put(this.generateBoardsPath(boardPayload.id), { board: boardPayload });
+        }
+        return axios.post(this.generateBoardsPath(), { board: boardPayload });
+      },
+
+      deleteBoard({ id }) {
+        return axios.delete(this.generateBoardsPath(id));
+      },
+
+      updateWeight(endpoint, weight = null) {
+        return axios.put(endpoint, {
+          weight,
+        });
+      },
+    });
   }
 
   initBoardFilters() {
@@ -170,7 +211,8 @@ class BoardsStoreEE {
     const { issue } = this.store.detail;
     if (issue.id === id && issue.sidebarInfoEndpoint) {
       issue.setLoadingState('weight', true);
-      BoardService.updateWeight(issue.sidebarInfoEndpoint, newWeight)
+      this.store
+        .updateWeight(issue.sidebarInfoEndpoint, newWeight)
         .then(res => res.data)
         .then(data => {
           const lists = issue.getLists();

ee/spec/frontend/boards/services/board_service_spec.js

@@ -5,6 +5,7 @@ import { TEST_HOST } from 'helpers/test_constants';
 import AxiosMockAdapter from 'axios-mock-adapter';
 
 import axios from '~/lib/utils/axios_utils';
+import boardsStore from '~/boards/stores/boards_store';
 
 describe('BoardService', () => {
   const dummyResponse = 'just another response in the network';
@@ -24,10 +25,12 @@ describe('BoardService', () => {
   beforeEach(() => {
     axiosMock = new AxiosMockAdapter(axios);
 
-    service = new BoardServiceEE({
+    boardsStore.setEndpoints({
       ...endpoints,
       boardId,
     });
+
+    service = new BoardServiceEE();
   });
 
   describe('allBoards', () => {

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

@@ -3,6 +3,7 @@ import BoardService from 'ee/boards/services/board_service';
 import BoardsSelector from 'ee/boards/components/boards_selector.vue';
 import mountComponent from 'spec/helpers/vue_mount_component_helper';
 import { TEST_HOST } from 'spec/test_constants';
+import boardsStore from '~/boards/stores/boards_store';
 
 const throttleDuration = 1;
 
@@ -29,13 +30,14 @@ describe('BoardsSelector', () => {
     setFixtures('<div class="js-boards-selector"></div>');
     window.gl = window.gl || {};
 
-    window.gl.boardService = new BoardService({
+    boardsStore.setEndpoints({
       boardsEndpoint: '',
       recentBoardsEndpoint: '',
       listsEndpoint: '',
       bulkUpdatePath: '',
       boardId: '',
     });
+    window.gl.boardService = new BoardService();
 
     allBoardsResponse = Promise.resolve({
       data: boards,

spec/frontend/boards/services/board_service_spec.js

@@ -2,6 +2,7 @@ import BoardService from '~/boards/services/board_service';
 import { TEST_HOST } from 'helpers/test_constants';
 import AxiosMockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
+import boardsStore from '~/boards/stores/boards_store';
 
 describe('BoardService', () => {
   const dummyResponse = "without type checking this doesn't matter";
@@ -18,10 +19,11 @@ describe('BoardService', () => {
 
   beforeEach(() => {
     axiosMock = new AxiosMockAdapter(axios);
-    service = new BoardService({
+    boardsStore.setEndpoints({
       ...endpoints,
       boardId,
     });
+    service = new BoardService();
   });
 
   describe('all', () => {

spec/javascripts/boards/mock_data.js

 import BoardService from '~/boards/services/board_service';
+import boardsStore from '~/boards/stores/boards_store';
 
 export const boardObj = {
   id: 1,
@@ -76,12 +77,14 @@ export const mockBoardService = (opts = {}) => {
   const bulkUpdatePath = opts.bulkUpdatePath || '';
   const boardId = opts.boardId || '1';
 
-  return new BoardService({
+  boardsStore.setEndpoints({
     boardsEndpoint,
     listsEndpoint,
     bulkUpdatePath,
     boardId,
   });
+
+  return new BoardService();
 };
 
 export const mockAssigneesList = [