Moved board store to namespaced gl object

app/assets/javascripts/boards/boards_bundle.js.es6

@@ -10,9 +10,7 @@
 $(() => {
   const $boardApp = $('#board-app');
-  if (!window.gl) {
-    window.gl = {};
-  }
+  window.gl = window.gl || {};
   if (gl.IssueBoardsApp) {
     gl.IssueBoardsApp.$destroy(true);
@@ -21,14 +19,14 @@ $(() => {
   gl.IssueBoardsApp = new Vue({
     el: $boardApp.get(0),
     data: {
-      state: BoardsStore.state,
+      state: gl.issueBoards.BoardsStore.state,
       loading: true,
       endpoint: $boardApp.data('endpoint'),
       disabled: $boardApp.data('disabled'),
       issueLinkBase: $boardApp.data('issue-link-base')
     },
     init () {
-      BoardsStore.create();
+      gl.issueBoards.BoardsStore.create();
     },
     created () {
       this.loading = true;
@@ -40,14 +38,14 @@ $(() => {
         .removeAttr('data-issue-link-base');
     },
     ready () {
-      BoardsStore.disabled = this.disabled;
+      gl.issueBoards.BoardsStore.disabled = this.disabled;
       gl.boardService.all()
         .then((resp) => {
           const boards = resp.json();
           for (let i = 0, boardsLength = boards.length; i < boardsLength; i++) {
             const board = boards[i],
-                  list = BoardsStore.addList(board);
+                  list = gl.issueBoards.BoardsStore.addList(board);
             if (list.type === 'done') {
               list.position = Infinity;
@@ -56,7 +54,7 @@ $(() => {
             }
           }
-          BoardsStore.addBlankState();
+          gl.issueBoards.BoardsStore.addBlankState();
           this.loading = false;
         });
     }

app/assets/javascripts/boards/components/board.js.es6

@@ -8,7 +8,7 @@
     data () {
       return {
         query: '',
-        filters: BoardsStore.state.filters
+        filters: gl.issueBoards.BoardsStore.state.filters
       };
     },
     watch: {
@@ -53,7 +53,7 @@
         draggable: '.is-draggable',
         handle: '.js-board-handle',
         onUpdate (e) {
-          BoardsStore.moveList(e.oldIndex, e.newIndex);
+          gl.issueBoards.BoardsStore.moveList(e.oldIndex, e.newIndex);
         }
       });

app/assets/javascripts/boards/components/board_blank_state.js.es6

@@ -12,12 +12,12 @@
     },
     methods: {
       addDefaultLists () {
-        BoardsStore.removeBlankState();
+        gl.issueBoards.BoardsStore.removeBlankState();
         for (let i = 0, labelsLength = this.predefinedLabels.length; i < labelsLength; i++) {
           const label = this.predefinedLabels[i];
-          BoardsStore.addList({
+          gl.issueBoards.BoardsStore.addList({
             title: label.title,
             position: i,
             list_type: 'label',
@@ -36,7 +36,7 @@
             for (let i = 0, dataLength = data.length; i < dataLength; i++) {
               const listObj = data[i],
-                    list = BoardsStore.findList('title', listObj.title);
+                    list = gl.issueBoards.BoardsStore.findList('title', listObj.title);
               list.id = listObj.id;
               list.label.id = listObj.label.id;
@@ -45,7 +45,7 @@
           });
       },
       clearBlankState () {
-        BoardsStore.removeBlankState();
+        gl.issueBoards.BoardsStore.removeBlankState();
       }
     }
   });

app/assets/javascripts/boards/components/board_card.js.es6

@@ -9,19 +9,19 @@
     methods: {
       filterByLabel (label, e) {
         let labelToggleText = label.title;
-        const labelIndex = BoardsStore.state.filters['label_name'].indexOf(label.title);
+        const labelIndex = gl.issueBoards.BoardsStore.state.filters['label_name'].indexOf(label.title);
         $(e.target).tooltip('hide');
         if (labelIndex === -1) {
-          BoardsStore.state.filters['label_name'].push(label.title);
+          gl.issueBoards.BoardsStore.state.filters['label_name'].push(label.title);
           $('.labels-filter').prepend(`<input type="hidden" name="label_name[]" value="${label.title}" />`);
         } else {
-          BoardsStore.state.filters['label_name'].splice(labelIndex, 1);
-          labelToggleText = BoardsStore.state.filters['label_name'][0];
+          gl.issueBoards.BoardsStore.state.filters['label_name'].splice(labelIndex, 1);
+          labelToggleText = gl.issueBoards.BoardsStore.state.filters['label_name'][0];
           $(`.labels-filter input[name="label_name[]"][value="${label.title}"]`).remove();
         }
-        const selectedLabels = BoardsStore.state.filters['label_name'];
+        const selectedLabels = gl.issueBoards.BoardsStore.state.filters['label_name'];
         if (selectedLabels.length === 0) {
           labelToggleText = 'Label';
         } else if (selectedLabels.length > 1) {
@@ -30,7 +30,7 @@
         $('.labels-filter .dropdown-toggle-text').text(labelToggleText);
-        BoardsStore.updateFiltersUrl();
+        gl.issueBoards.BoardsStore.updateFiltersUrl();
       }
     }
   });

app/assets/javascripts/boards/components/board_list.js.es6

@@ -10,7 +10,7 @@
     data () {
       return {
         scrollOffset: 250,
-        filters: BoardsStore.state.filters
+        filters: gl.issueBoards.BoardsStore.state.filters
       };
     },
     watch: {
@@ -57,7 +57,7 @@
             // Remove the new dom element & let vue add the element
             card.parentNode.removeChild(card);
-            BoardsStore.moveCardToList(fromListId, toListId, issueId);
+            gl.issueBoards.BoardsStore.moveCardToList(fromListId, toListId, issueId);
           }
         });

app/assets/javascripts/boards/components/new_list_dropdown.js.es6

@@ -13,7 +13,7 @@ $(() => {
         });
       },
       renderRow (label) {
-        const active = BoardsStore.findList('title', label.title),
+        const active = gl.issueBoards.BoardsStore.findList('title', label.title),
               $li = $('<li />',),
               $a = $('<a />', {
                 class: (active ? `is-active js-board-list-${active.id}` : ''),
@@ -35,10 +35,10 @@ $(() => {
       clicked (label, $el, e) {
         e.preventDefault();
-        if (!BoardsStore.findList('title', label.title)) {
-          BoardsStore.new({
+        if (!gl.issueBoards.BoardsStore.findList('title', label.title)) {
+          gl.issueBoards.BoardsStore.new({
             title: label.title,
-            position: BoardsStore.state.lists.length - 1,
+            position: gl.issueBoards.BoardsStore.state.lists.length - 1,
             list_type: 'label',
             label: {
               id: label.id,

app/assets/javascripts/boards/models/issue.js.es6

@@ -52,7 +52,7 @@ class ListIssue {
   }
   getLists () {
-    return BoardsStore.state.lists.filter((list) => {
+    return gl.issueBoards.BoardsStore.state.lists.filter((list) => {
       return list.findIssue(this.id);
     });
   }

app/assets/javascripts/boards/models/list.js.es6

@@ -4,7 +4,7 @@ class List {
     this.position = obj.position;
     this.title = obj.title;
     this.type = obj.list_type;
-    this.filters = BoardsStore.state.filters;
+    this.filters = gl.issueBoards.BoardsStore.state.filters;
     this.page = 1;
     this.loading = true;
     this.loadingMore = false;
@@ -34,10 +34,10 @@ class List {
   destroy () {
     if (this.type !== 'blank') {
-      BoardsStore.state.lists = BoardsStore.state.lists.filter((list) => {
+      gl.issueBoards.BoardsStore.state.lists = gl.issueBoards.BoardsStore.state.lists.filter((list) => {
         return list.id !== this.id;
       });
-      BoardsStore.updateNewListDropdown(this.id);
+      gl.issueBoards.BoardsStore.updateNewListDropdown(this.id);
       gl.boardService.destroyList(this.id);
     }

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

-((w) => {
-  w.BoardsStore = {
+(() => {
+  window.gl = window.gl || {};
+  window.gl.issueBoards = window.gl.issueBoards || {};
+
+  gl.issueBoards.BoardsStore = {
     disabled: false,
     state: {},
     create () {
@@ -126,4 +129,4 @@
       history.pushState(null, null, `?${$.param(this.state.filters)}`);
     }
   };
-}(window));
+})();

app/assets/javascripts/labels_select.js

@@ -246,18 +246,18 @@
             isMRIndex = page === 'projects:merge_requests:index';
             if (page === 'projects:boards:show') {
               if (label.isAny) {
-                BoardsStore.state.filters['label_name'] = [];
+                gl.issueBoards.BoardsStore.state.filters['label_name'] = [];
               } else if (label.title) {
-                BoardsStore.state.filters['label_name'].push(label.title);
+                gl.issueBoards.BoardsStore.state.filters['label_name'].push(label.title);
               } else {
-                var filters = BoardsStore.state.filters['label_name'];
+                var filters = gl.issueBoards.BoardsStore.state.filters['label_name'];
                 filters = filters.filter(function (label) {
                   return label !== $el.text().trim();
                 });
-                BoardsStore.state.filters['label_name'] = filters;
+                gl.issueBoards.BoardsStore.state.filters['label_name'] = filters;
               }
-              BoardsStore.updateFiltersUrl();
+              gl.issueBoards.BoardsStore.updateFiltersUrl();
               e.preventDefault();
               return;
             } else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {

app/assets/javascripts/milestone_select.js

@@ -103,8 +103,8 @@
               return;
             }
             if (page === 'projects:boards:show') {
-              BoardsStore.state.filters[$dropdown.data('field-name')] = selected.name;
-              BoardsStore.updateFiltersUrl();
+              gl.issueBoards.BoardsStore.state.filters[$dropdown.data('field-name')] = selected.name;
+              gl.issueBoards.BoardsStore.updateFiltersUrl();
               e.preventDefault();
             } else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
               if (selected.name != null) {

app/assets/javascripts/users_select.js

@@ -151,8 +151,8 @@
               }
               if (page === 'projects:boards:show') {
                 selectedId = user.id;
-                BoardsStore.state.filters[$dropdown.data('field-name')] = user.id;
-                BoardsStore.updateFiltersUrl();
+                gl.issueBoards.BoardsStore.state.filters[$dropdown.data('field-name')] = user.id;
+                gl.issueBoards.BoardsStore.updateFiltersUrl();
                 e.preventDefault();
               } else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
                 selectedId = user.id;

spec/javascripts/boards/boards_store_spec.js.es6

@@ -15,54 +15,54 @@
 (() => {
   beforeEach(() => {
     gl.boardService = new BoardService('/test/issue-boards/board');
-    BoardsStore.create();
+    gl.issueBoards.BoardsStore.create();
     $.cookie('issue_board_welcome_hidden', 'false');
   });
   describe('Store', () => {
     it('starts with a blank state', () => {
-      expect(BoardsStore.state.lists.length).toBe(0);
+      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(0);
     });
     describe('lists', () => {
       it('creates new list without persisting to DB', () => {
-        BoardsStore.addList(listObj);
-        expect(BoardsStore.state.lists.length).toBe(1);
+        gl.issueBoards.BoardsStore.addList(listObj);
+        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
       });
       it('finds list by ID', () => {
-        BoardsStore.addList(listObj);
-        const list = BoardsStore.findList('id', 1);
+        gl.issueBoards.BoardsStore.addList(listObj);
+        const list = gl.issueBoards.BoardsStore.findList('id', 1);
         expect(list.id).toBe(1);
       });
       it('finds list by type', () => {
-        BoardsStore.addList(listObj);
-        const list = BoardsStore.findList('type', 'label');
+        gl.issueBoards.BoardsStore.addList(listObj);
+        const list = gl.issueBoards.BoardsStore.findList('type', 'label');
         expect(list).toBeDefined();
       });
       it('finds list limited by type', () => {
-        BoardsStore.addList({
+        gl.issueBoards.BoardsStore.addList({
           id: 1,
           position: 0,
           title: 'Test',
           list_type: 'backlog'
         });
-        const list = BoardsStore.findList('id', 1, 'backlog');
+        const list = gl.issueBoards.BoardsStore.findList('id', 1, 'backlog');
         expect(list).toBeDefined();
       });
       it('gets issue when new list added', (done) => {
-        BoardsStore.addList(listObj);
-        const list = BoardsStore.findList('id', 1);
-        expect(BoardsStore.state.lists.length).toBe(1);
+        gl.issueBoards.BoardsStore.addList(listObj);
+        const list = gl.issueBoards.BoardsStore.findList('id', 1);
+        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
         setTimeout(() => {
           expect(list.issues.length).toBe(1);
@@ -72,7 +72,7 @@
       });
       it('persists new list', (done) => {
-        BoardsStore.new({
+        gl.issueBoards.BoardsStore.new({
           title: 'Test',
           type: 'label',
           label: {
@@ -82,10 +82,10 @@
             description: 'testing;'
           }
         });
-        expect(BoardsStore.state.lists.length).toBe(1);
+        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
         setTimeout(() => {
-          const list = BoardsStore.findList('id', 1);
+          const list = gl.issueBoards.BoardsStore.findList('id', 1);
           expect(list).toBeDefined();
           expect(list.id).toBe(1);
           expect(list.position).toBe(0);
@@ -94,68 +94,68 @@
       });
       it('check for blank state adding', () => {
-        expect(BoardsStore.shouldAddBlankState()).toBe(true);
+        expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(true);
       });
       it('check for blank state not adding', () => {
-        BoardsStore.addList(listObj);
-        expect(BoardsStore.shouldAddBlankState()).toBe(false);
+        gl.issueBoards.BoardsStore.addList(listObj);
+        expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(false);
       });
       it('check for blank state adding when backlog & done list exist', () => {
-        BoardsStore.addList({
+        gl.issueBoards.BoardsStore.addList({
           list_type: 'backlog'
         });
-        BoardsStore.addList({
+        gl.issueBoards.BoardsStore.addList({
           list_type: 'done'
         });
-        expect(BoardsStore.shouldAddBlankState()).toBe(true);
+        expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(true);
       });
       it('adds the blank state', () => {
-        BoardsStore.addBlankState();
-        const list = BoardsStore.findList('type', 'blank', 'blank');
+        gl.issueBoards.BoardsStore.addBlankState();
+        const list = gl.issueBoards.BoardsStore.findList('type', 'blank', 'blank');
         expect(list).toBeDefined();
       });
       it('removes list from state', () => {
-        BoardsStore.addList(listObj);
-        expect(BoardsStore.state.lists.length).toBe(1);
-        BoardsStore.removeList(1);
-        expect(BoardsStore.state.lists.length).toBe(0);
+        gl.issueBoards.BoardsStore.addList(listObj);
+        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
+        gl.issueBoards.BoardsStore.removeList(1);
+        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(0);
       });
       it('moves the position of lists', () => {
-        BoardsStore.addList(listObj);
-        BoardsStore.addList(listObjDuplicate);
-        expect(BoardsStore.state.lists.length).toBe(2);
-        BoardsStore.moveList(0, 1);
-        const list = BoardsStore.findList('id', 1);
+        gl.issueBoards.BoardsStore.addList(listObj);
+        gl.issueBoards.BoardsStore.addList(listObjDuplicate);
+        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(2);
+        gl.issueBoards.BoardsStore.moveList(0, 1);
+        const list = gl.issueBoards.BoardsStore.findList('id', 1);
         expect(list.position).toBe(1);
       });
       it('moves an issue from one list to another', (done) => {
-        BoardsStore.addList(listObj);
-        BoardsStore.addList(listObjDuplicate);
-        expect(BoardsStore.state.lists.length).toBe(2);
-        const list = BoardsStore.findList('id', 1),
-              listTwo = BoardsStore.findList('id', 2);
+        gl.issueBoards.BoardsStore.addList(listObj);
+        gl.issueBoards.BoardsStore.addList(listObjDuplicate);
+        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(2);
+        const list = gl.issueBoards.BoardsStore.findList('id', 1),
+              listTwo = gl.issueBoards.BoardsStore.findList('id', 2);
         setTimeout(() => {
           expect(list.issues.length).toBe(1);
           expect(listTwo.issues.length).toBe(1);
-          BoardsStore.moveCardToList(1, 2, 1);
+          gl.issueBoards.BoardsStore.moveCardToList(1, 2, 1);
           expect(list.issues.length).toBe(0);
           expect(listTwo.issues.length).toBe(1);

spec/javascripts/boards/issue_spec.js.es6

@@ -17,7 +17,7 @@ describe('Issue model', () => {
   beforeEach(() => {
     gl.boardService = new BoardService('/test/issue-boards/board');
-    BoardsStore.create();
+    gl.issueBoards.BoardsStore.create();
     issue = new ListIssue({
       title: 'Testing',

spec/javascripts/boards/list_spec.js.es6

@@ -17,7 +17,7 @@ describe('List model', () => {
   beforeEach(() => {
     gl.boardService = new BoardService('/test/issue-boards/board');
-    BoardsStore.create();
+    gl.issueBoards.BoardsStore.create();
     list = new List(listObj);
   });
@@ -49,13 +49,13 @@ describe('List model', () => {
   });
   it('destroys the list', (done) => {
-    BoardsStore.addList(listObj);
-    list = BoardsStore.findList('id', 1);
-    expect(BoardsStore.state.lists.length).toBe(1);
+    gl.issueBoards.BoardsStore.addList(listObj);
+    list = gl.issueBoards.BoardsStore.findList('id', 1);
+    expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
     list.destroy();
     setTimeout(() => {
-      expect(BoardsStore.state.lists.length).toBe(0);
+      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(0);
       done();
     }, 0);
   });