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

Move BoardService logic to boardsStore

Closes #61620

See merge request gitlab-org/gitlab-ce!29204

app/assets/javascripts/boards/index.js

@@ -79,13 +79,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);

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 = [