TSK-1460: Display ID in path when workbasket component is selected (#1335)

web/src/app/administration/components/workbasket-overview/workbasket-overview.component.spec.ts

@@ -16,6 +16,7 @@ import { CreateWorkbasket, SelectWorkbasket } from '../../../shared/store/workba
 import { StartupService } from '../../../shared/services/startup/startup.service';
 import { TaskanaEngineService } from '../../../shared/services/taskana-engine/taskana-engine.service';
 import { WindowRefService } from '../../../shared/services/window/window.service';
+import { workbasketReadStateMock } from '../../../shared/store/mock-data/mock-store';
 
 const showDialogFn = jest.fn().mockReturnValue(true);
 const NotificationServiceSpy = jest.fn().mockImplementation(
@@ -41,7 +42,9 @@ const mockActivatedRouteAlternative = {
   }
 };
 
-const mockActivatedRouteNoParams = {};
+const mockActivatedRouteNoParams = {
+  url: of([{ path: 'workbaskets' }])
+};
 
 @Component({ selector: 'taskana-administration-workbasket-list', template: '' })
 class WorkbasketListStub {}
@@ -102,7 +105,7 @@ describe('WorkbasketOverviewComponent', () => {
     expect(debugElement.nativeElement.querySelector('taskana-administration-workbasket-details')).toBeTruthy();
   });
 
-  it('should display details when params id exists', async((done) => {
+  it('should display details when params id exists', async(() => {
     let actionDispatched = false;
     actions$.pipe(ofActionDispatched(CreateWorkbasket)).subscribe(() => (actionDispatched = true));
     component.ngOnInit();
@@ -142,7 +145,7 @@ describe('WorkbasketOverviewComponent Alternative Params ID', () => {
     fixture.detectChanges();
   }));
 
-  it('should display details when params id exists', async((done) => {
+  it('should display details when params id exists', async(() => {
     expect(component.routerParams.id).toBeTruthy();
     let actionDispatched = false;
     actions$.pipe(ofActionDispatched(SelectWorkbasket)).subscribe(() => (actionDispatched = true));
@@ -154,6 +157,8 @@ describe('WorkbasketOverviewComponent Alternative Params ID', () => {
 describe('WorkbasketOverviewComponent No Params', () => {
   let fixture: ComponentFixture<WorkbasketOverviewComponent>;
   let component: WorkbasketOverviewComponent;
+  let store: Store;
+  let actions$: Observable<any>;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
@@ -174,9 +179,23 @@ describe('WorkbasketOverviewComponent No Params', () => {
     fixture = TestBed.createComponent(WorkbasketOverviewComponent);
     component = fixture.debugElement.componentInstance;
     fixture.detectChanges();
+    store = TestBed.inject(Store);
+    actions$ = TestBed.inject(Actions);
+
+    store.reset({
+      ...store.snapshot(),
+      workbasket: workbasketReadStateMock
+    });
   }));
 
   it('should create the component', () => {
     expect(component).toBeTruthy();
   });
+
+  it('should dispatch SelectWorkbasket action when route contains workbasket', async () => {
+    let actionDispatched = false;
+    actions$.pipe(ofActionDispatched(SelectWorkbasket)).subscribe(() => (actionDispatched = true));
+    component.ngOnInit();
+    expect(actionDispatched).toBe(true);
+  });
 });

web/src/app/administration/components/workbasket-overview/workbasket-overview.component.ts

@@ -2,14 +2,11 @@ import { Component, OnInit } from '@angular/core';
 import { Select, Store } from '@ngxs/store';
 import { Observable, Subject } from 'rxjs';
 import { ActivatedRoute } from '@angular/router';
-import { takeUntil } from 'rxjs/operators';
+import { take, takeUntil } from 'rxjs/operators';
 import { WorkbasketSelectors } from '../../../shared/store/workbasket-store/workbasket.selectors';
 
-import {
-  CreateWorkbasket,
-  SelectWorkbasket,
-  SetActiveAction
-} from '../../../shared/store/workbasket-store/workbasket.actions';
+import { CreateWorkbasket, SelectWorkbasket } from '../../../shared/store/workbasket-store/workbasket.actions';
+import { Workbasket } from '../../../shared/models/workbasket';
 
 @Component({
   selector: 'taskana-administration-workbasket-overview',
@@ -19,12 +16,24 @@ import {
 export class WorkbasketOverviewComponent implements OnInit {
   showDetail = false;
   @Select(WorkbasketSelectors.selectedWorkbasketAndAction) selectedWorkbasketAndAction$: Observable<any>;
+  @Select(WorkbasketSelectors.selectedWorkbasket) selectedWorkbasket$: Observable<Workbasket>;
   destroy$ = new Subject<void>();
   routerParams: any;
 
   constructor(private route: ActivatedRoute, private store: Store) {}
 
   ngOnInit() {
+    if (this.route.url) {
+      this.route.url.subscribe((params) => {
+        if (params[0].path === 'workbaskets') {
+          this.selectedWorkbasket$.pipe(take(1)).subscribe((workbasket) => {
+            if (typeof workbasket.workbasketId !== 'undefined') {
+              this.store.dispatch(new SelectWorkbasket(workbasket.workbasketId));
+            }
+          });
+        }
+      });
+    }
     if (this.route.firstChild) {
       this.route.firstChild.params.subscribe((params) => {
         this.routerParams = params;