fix(board): add board view For iterations

src/app/components_ngrx/group-types-panel/group-types-panel.component.html

@@ -26,7 +26,7 @@
         class="fab-planner-iteration"
         [takeFromInput]="false"
         [collection]="item.typeList"
-        [witGroup]="item.name"
+        [witGroup]="item"
         [showTree]="showTree"
         [showCompleted]="showCompleted"
         [sidePanelOpen]="sidePanelOpen"

src/app/components_ngrx/group-types-panel/group-types-panel.component.ts

@@ -98,10 +98,21 @@ export class GroupTypesComponent implements OnInit, OnDestroy {
     //reverse function jsonToQuery(second_join);
   }
 
+  fnBuildQueryParamForBoard(witGroup) {
+    const type_query = this.filterService.queryBuilder(
+      'boardContextId', this.filterService.equal_notation, witGroup.id
+    );
+    // join query with typeQuery
+    const second_join = this.filterService.queryJoiner(
+      {}, this.filterService.and_notation, type_query
+    );
+    return this.filterService.jsonToQuery(second_join);
+  }
+
   addRemoveQueryParams(witGroup) {
     // If it's a board view then quoery should only have the board id
     if (this.context === 'board') {
-      return {boardContextId: witGroup.id};
+      return {q: this.fnBuildQueryParamForBoard(witGroup)};
     }
 
     // For list view it works differently
@@ -134,11 +145,20 @@ export class GroupTypesComponent implements OnInit, OnDestroy {
       this.route.queryParams.subscribe(val => {
         if (val.hasOwnProperty('q')) {
           let selectedTypeGroup: GroupTypeUI;
-          const selectedTypeGroupName =
-            this.filterService.getConditionFromQuery(val.q, 'typegroup.name');
-          if (selectedTypeGroupName) {
-            selectedTypeGroup =
-              this.groupTypes.find(g => g.name === selectedTypeGroupName);
+          if (this.context === 'board') {
+            const selectedTypeGroupId =
+            this.filterService.queryToFlat(val.q)[0].value;
+            if (selectedTypeGroupId) {
+              selectedTypeGroup =
+                this.groupTypes.find(g => g.name === selectedTypeGroupId);
+            }
+          } else {
+            const selectedTypeGroupName =
+              this.filterService.getConditionFromQuery(val.q, 'typegroup.name');
+            if (selectedTypeGroupName) {
+              selectedTypeGroup =
+                this.groupTypes.find(g => g.name === selectedTypeGroupName);
+            }
           }
           if (selectedTypeGroup && !selectedTypeGroup.selected) {
             this.store.dispatch(new GroupTypeActions.SelectType(selectedTypeGroup));
@@ -156,13 +176,13 @@ export class GroupTypesComponent implements OnInit, OnDestroy {
         }
 
         // If it's a board view then check for board context ID
-        if (val.hasOwnProperty('boardContextId')) {
-          const selectedTypeGroup: GroupTypeUI =
-              this.groupTypes.find(g => g.id === val.boardContextId);
-          if (selectedTypeGroup) {
-            this.store.dispatch(new GroupTypeActions.SelectType(selectedTypeGroup));
-          }
-        }
+        // if (val.hasOwnProperty('boardContextId')) {
+        //   const selectedTypeGroup: GroupTypeUI =
+        //       this.groupTypes.find(g => g.id === val.boardContextId);
+        //   if (selectedTypeGroup) {
+        //     this.store.dispatch(new GroupTypeActions.SelectType(selectedTypeGroup));
+        //   }
+        // }
       })
     );
   }

src/app/components_ngrx/iteration-list-entry/iteration-list-entry.component.html

@@ -47,7 +47,7 @@
   </div>
   <a
     class="f8-itr__header"
-    [routerLink]="getRouterLink()"
+    [routerLink]="[]"
     [queryParams]="addRemoveQueryParams(iteration.id)"
     title="{{iteration.name}}">
     <div class="truncate padding-right-15">

src/app/components_ngrx/iteration-list-entry/iteration-list-entry.component.ts

@@ -25,6 +25,7 @@ import { AuthenticationService } from 'ngx-login-client';
 import { Dialog } from 'ngx-widgets';
 import { Subscription } from 'rxjs/Subscription';
 
+import { GroupTypeUI } from '../../models/group-types.model';
 import { IterationUI } from '../../models/iteration.model';
 import { FilterService } from '../../services/filter.service';
 import { GroupTypesService } from '../../services/group-types.service';
@@ -40,7 +41,7 @@ export class IterationListEntryComponent implements OnInit, OnDestroy {
   @Input() iteration: IterationUI;
   @Input() selected: boolean = false;
   @Input() collection = [];
-  @Input() witGroup: string = '';
+  @Input() witGroup: GroupTypeUI;
   @Input() showTree: string = '';
   @Input() showCompleted: string = '';
   @Input() context: 'list' | 'board'; // 'list' or 'board'
@@ -86,7 +87,7 @@ export class IterationListEntryComponent implements OnInit, OnDestroy {
 
   constructURL(iterationId: string) {
     //Query for work item type group
-    const type_query = this.filterService.queryBuilder('typegroup.name', this.filterService.equal_notation, this.witGroup);
+    const type_query = this.filterService.queryBuilder('typegroup.name', this.filterService.equal_notation, this.witGroup.name);
     //Query for space
     const space_query = this.filterService.queryBuilder('space', this.filterService.equal_notation, this.spaceId);
     //Query for iteration
@@ -100,7 +101,23 @@ export class IterationListEntryComponent implements OnInit, OnDestroy {
     return this.filterService.jsonToQuery(third_join);
   }
 
+  constructURLforBoard(iterationId: string) {
+    //Query for work item type group
+    const type_query = this.filterService.queryBuilder('boardContextId', this.filterService.equal_notation, this.witGroup.id);
+    //Query for iteration
+    const iteration_query = this.filterService.queryBuilder('iteration', this.filterService.equal_notation, iterationId);
+    // join type and iteration query
+    const first_join = this.filterService.queryJoiner({}, this.filterService.and_notation, type_query);
+    const second_join = this.filterService.queryJoiner(first_join, this.filterService.and_notation, iteration_query);
+    return this.filterService.jsonToQuery(second_join);
+  }
+
   addRemoveQueryParams(iterationId: string) {
+    if (this.context === 'board') {
+      return {
+        q: this.constructURLforBoard(iterationId)
+      };
+    }
     if (this.showCompleted && this.showTree) {
       return {
         q: this.constructURL(iterationId),
@@ -124,10 +141,6 @@ export class IterationListEntryComponent implements OnInit, OnDestroy {
     }
   }
 
-  getRouterLink() {
-    return this.context === 'board' ? ['..'] : [];
-  }
-
   toggleChildrenDisplay(iteration) {
     // TODO: Dispatch an action to this
     iteration.showChildren = !iteration.showChildren;

src/app/components_ngrx/iteration-tree/iteration-tree.component.ts

@@ -6,6 +6,7 @@ import {
   SimpleChange,
   SimpleChanges
 } from '@angular/core';
+import { GroupTypeUI } from '../../models/group-types.model';
 import { IterationUI } from '../../models/iteration.model';
 import { IterationListEntryComponent } from '../iteration-list-entry/iteration-list-entry.component';
 
@@ -18,7 +19,7 @@ export class IterationTreeComponent {
 
   @Input() iterationList: IterationUI[] = [];
   @Input() collection: any;
-  @Input() witGroup: string = '';
+  @Input() witGroup: GroupTypeUI;
   @Input() showTree: string = '';
   @Input() showCompleted: string = '';
   @Input() context: 'list' | 'board'; // 'list' or 'board'

src/app/components_ngrx/iterations-panel/iterations-panel.component.html

@@ -23,7 +23,7 @@
       [class.hide]="!sidePanelOpen">
       Iterations
   </p>
-    <infotip 
+    <infotip
       [infotipText]="infotipText"
       [class.dib]="sidePanelOpen"
       [class.hide]="!sidePanelOpen">
@@ -36,7 +36,7 @@
       *ngFor="let iteration of activeIterations | async">
       <a
         [routerLinkActive]="'f8-itr--selected'"
-        [routerLink]="getRouterLink()" [attr.data-id]="iteration.id"
+        [routerLink]="[]" [attr.data-id]="iteration.id"
         [queryParams]="addRemoveQueryParams(iteration.id)"
         title="{{ iteration.resolvedParentPath +
           '/' + iteration.name }}">

src/app/components_ngrx/iterations-panel/iterations-panel.component.ts

@@ -20,6 +20,7 @@ import { FilterService } from './../../services/filter.service';
 
 // ngrx stuff
 import { Store } from '@ngrx/store';
+import { GroupTypeUI } from '../../models/group-types.model';
 import * as IterationActions from './../../actions/iteration.actions';
 import { AppState } from './../../states/app.state';
 
@@ -35,7 +36,7 @@ export class IterationComponent implements OnInit, OnDestroy, OnChanges {
   @Input() iterations: IterationUI[] = [];
   @Input() collection = [];
   @Input() sidePanelOpen: boolean = true;
-  @Input() witGroup: string = '';
+  @Input() witGroup: GroupTypeUI;
   @Input() showTree: string = '';
   @Input() showCompleted: string = '';
   @Input() infotipText: string = '';
@@ -107,7 +108,7 @@ export class IterationComponent implements OnInit, OnDestroy, OnChanges {
 
   constructURL(iterationId: string) {
     //Query for work item type group
-    const type_query = this.filterService.queryBuilder('typegroup.name', this.filterService.equal_notation, this.witGroup);
+    const type_query = this.filterService.queryBuilder('typegroup.name', this.filterService.equal_notation, this.witGroup.name);
     //Query for space
     const space_query = this.filterService.queryBuilder('space', this.filterService.equal_notation, this.spaceId);
     //Query for iteration
@@ -121,7 +122,23 @@ export class IterationComponent implements OnInit, OnDestroy, OnChanges {
     return this.filterService.jsonToQuery(third_join);
   }
 
+  constructURLforBoard(iterationId: string) {
+    //Query for work item type group
+    const type_query = this.filterService.queryBuilder('boardContextId', this.filterService.equal_notation, this.witGroup.id);
+    //Query for iteration
+    const iteration_query = this.filterService.queryBuilder('iteration', this.filterService.equal_notation, iterationId);
+    // join type and iteration query
+    const first_join = this.filterService.queryJoiner({}, this.filterService.and_notation, type_query);
+    const second_join = this.filterService.queryJoiner(first_join, this.filterService.and_notation, iteration_query);
+    return this.filterService.jsonToQuery(second_join);
+  }
+
   addRemoveQueryParams(iterationId: string) {
+    if (this.context === 'board') {
+      return {
+        q: this.constructURLforBoard(iterationId)
+      };
+    }
     if (this.showCompleted && this.showTree) {
       return {
         q: this.constructURL(iterationId),
@@ -145,10 +162,6 @@ export class IterationComponent implements OnInit, OnDestroy, OnChanges {
     }
   }
 
-  getRouterLink() {
-    return this.context === 'board' ? ['..'] : [];
-  }
-
   kebabMenuClick(event: Event) {
     event.stopPropagation();
   }

src/app/components_ngrx/planner-board/planner-board.component.ts

@@ -11,10 +11,12 @@ import { ActivatedRoute, NavigationStart, Router } from '@angular/router';
 import { Store } from '@ngrx/store';
 import { sortBy } from 'lodash';
 import { DragulaService } from 'ng2-dragula';
+import { Observable } from 'rxjs';
 import { Subject } from 'rxjs';
 import { BoardQuery, BoardUIQuery } from '../../models/board.model';
 import { cleanObject } from '../../models/common.model';
 import { WorkItemQuery, WorkItemUI } from '../../models/work-item';
+import { FilterService } from '../../services/filter.service';
 import { AppState } from '../../states/app.state';
 import * as BoardUIActions from './../../actions/board-ui.actions';
 import * as ColumnWorkItemAction from './../../actions/column-workitem.action';
@@ -52,7 +54,8 @@ export class PlannerBoardComponent implements AfterViewChecked, OnInit, OnDestro
       private store: Store<AppState>,
       private router: Router,
       private workItemQuery: WorkItemQuery,
-      private boardUiQuery: BoardUIQuery
+      private boardUiQuery: BoardUIQuery,
+      private filterService: FilterService
     ) {
       const bag: any = this.dragulaService.find('board-column');
       if (bag !== undefined) {
@@ -85,19 +88,35 @@ export class PlannerBoardComponent implements AfterViewChecked, OnInit, OnDestro
     }
 
     setDefaultUrl(groupType: GroupTypeUI) {
+      const queryParams = this.constructUrl(groupType);
       this.router.navigate([], {
         relativeTo: this.route,
-        queryParams: { boardContextId: groupType.id }
+        queryParams: { q: queryParams }
       });
     }
 
+    constructUrl(witGroup: GroupTypeUI) {
+       //Query for work item type group
+      const type_query = this.filterService.queryBuilder(
+          'boardContextId', this.filterService.equal_notation, witGroup.id
+        );
+      //Query for space
+      //Join type and space query
+      const first_join = this.filterService.queryJoiner(
+        {}, this.filterService.and_notation, type_query
+      );
+      //second_join gives json object
+      return this.filterService.jsonToQuery(first_join);
+      //reverse function jsonToQuery(second_join);
+    }
+
     checkUrl(groupType) {
       this.eventListeners.push(
         this.router.events
           .filter(event => event instanceof NavigationStart)
           .map((e: NavigationStart) => e.url)
           .subscribe(url => {
-            if (url.indexOf('?boardContextId') === -1 &&
+            if (url.indexOf('?q') === -1 &&
               url.indexOf('/plan/board') > -1) {
               this.setDefaultUrl(groupType);
             }
@@ -106,10 +125,23 @@ export class PlannerBoardComponent implements AfterViewChecked, OnInit, OnDestro
 
       this.eventListeners.push(
         this.route.queryParams
-          .filter(params => params.hasOwnProperty('boardContextId'))
-          .map(params => params.boardContextId)
-          .subscribe(contextId => {
-            this.board$ = this.boardQuery.getBoardById(contextId);
+          .filter(params => params.hasOwnProperty('q'))
+          .map(params => {
+            let iterationId = this.filterService.getConditionFromQuery(params.q, 'iteration');
+            if (iterationId !== undefined) {
+              return [this.filterService.getConditionFromQuery(params.q, 'boardContextId'), iterationId];
+            } else {
+              const contextId = this.filterService.queryToFlat(params.q)[0].value;
+              return [contextId];
+            }
+          })
+          .subscribe(ids => {
+            // ids[0]: boardContextId, ids[1]: iteration
+            if (ids.length > 1) {
+              this.board$ = this.boardQuery.getBoardById(ids[0], ids[1]);
+            } else {
+              this.board$ = this.boardQuery.getBoardById(ids[0]);
+            }
             // Fetching work item
             // Dispatch action to fetch work items per lane for this context ID
           })
@@ -167,6 +199,7 @@ export class PlannerBoardComponent implements AfterViewChecked, OnInit, OnDestro
           workitem['link'] = workItem.link;
           workitem['id'] = workItem.id;
           workitem['type'] = workItem.type;
+          // Construct the payload for Reorder
           const payload = {
             workitem: workitem,
             destinationWorkitemID: destinationWorkItemID,

src/app/models/board.model.ts

@@ -136,7 +136,7 @@ export class BoardQuery {
         private spaceQuery: SpaceQuery,
         private filterService: FilterService) {}
 
-  getBoardById(id: string): Observable<BoardModelUI> {
+  getBoardById(id: string, iterationID: string = ''): Observable<BoardModelUI> {
     return this.boardSource.select(id)
       .filter(board => !!board)
 
@@ -155,9 +155,17 @@ export class BoardQuery {
         const boardQuery = this.filterService.queryBuilder(
           'board.id', this.filterService.equal_notation, board.id
         );
-        const finalQuery = this.filterService.queryJoiner(
+        let finalQuery = this.filterService.queryJoiner(
           initialQuery, this.filterService.and_notation, boardQuery
         );
+        if (iterationID !== '') {
+          const iterationQuery = this.filterService.queryBuilder(
+            'iteration', this.filterService.equal_notation, iterationID
+          );
+          finalQuery = this.filterService.queryJoiner(
+            finalQuery, this.filterService.and_notation, iterationQuery
+          );
+        }
         this.store.dispatch(new WorkItemActions.Get({
           pageSize: 200,
           filters: {expression: finalQuery},

src/app/reducers/column-workitem.reducer.ts

@@ -9,14 +9,12 @@ export type Action = WorkItemActions.All | ColumnWorkItemActions.All;
 export const ColumnWorkItemReducer: ActionReducer<ColumnWorkItemState> = (state = InitialColumnWorkItemState, action: Action) => {
   switch (action.type) {
     case WorkItemActions.GET_SUCCESS: {
-      let cwState = {...state};
+      let cwState = {};
       action.payload.forEach(item => {
         if (item.columnIds !== null) {
           item.columnIds.forEach(col => {
             if (cwState.hasOwnProperty(col)) {
-              if (cwState[col].findIndex(i => i === item.id) === -1) {
                 cwState[col] = [...cwState[col], item.id];
-              }
             } else {
               cwState[col] = [item.id];
             }
@@ -32,9 +30,7 @@ export const ColumnWorkItemReducer: ActionReducer<ColumnWorkItemState> = (state
           .filter(id => id !== action.payload.workItemId) ;
       action.payload.newColumnIds.forEach(col => {
         if (cwState.hasOwnProperty(col)) {
-          if (cwState[col].findIndex(i => i === action.payload.workItemId) === -1) {
             cwState[col] = [...cwState[col], action.payload.workItemId];
-          }
         } else {
           cwState[col] = [action.payload.workItemId];
         }