TSK-1431: Sort workbasket access items by accessId

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

@@ -150,6 +150,21 @@ describe('WorkbasketAccessItemsComponent', () => {
     expect(component.initialized).toBe(false);
   });
 
+  it('should call access items sorting when access items are obtained from store', () => {
+    const sortSpy = jest.spyOn(component, 'sortAccessItems');
+    component.ngOnInit();
+    expect(sortSpy).toHaveBeenCalled();
+  });
+
+  it('should sort access items by given value', () => {
+    const accessItems = component.accessItemsRepresentation.accessItems;
+    expect(accessItems[0].accessId).toBe('user-b-1');
+    expect(accessItems[1].accessId).toBe('user-b-0');
+    component.sortAccessItems(accessItems, 'accessId');
+    expect(accessItems[0].accessId).toBe('user-b-0');
+    expect(accessItems[1].accessId).toBe('user-b-1');
+  });
+
   it('should add accessItems when add access item button is clicked', () => {
     fixture.detectChanges();
     const addAccessItemButton = debugElement.nativeElement.querySelector(

web/src/app/administration/components/workbasket-access-items/workbasket-access-items.component.ts

@@ -106,10 +106,13 @@ export class WorkbasketAccessItemsComponent implements OnInit, OnChanges, OnDest
     });
     this.accessItemsRepresentation$.pipe(takeUntil(this.destroy$)).subscribe((accessItemsRepresentation) => {
       if (typeof accessItemsRepresentation !== 'undefined') {
-        this.accessItemsRepresentation = { ...accessItemsRepresentation };
-        this.setAccessItemsGroups(accessItemsRepresentation.accessItems);
-        this.accessItemsClone = this.cloneAccessItems(accessItemsRepresentation.accessItems);
-        this.accessItemsResetClone = this.cloneAccessItems(accessItemsRepresentation.accessItems);
+        let accessItems = [...accessItemsRepresentation.accessItems];
+        accessItems = this.sortAccessItems(accessItems, 'accessId');
+
+        this.accessItemsRepresentation = { accessItems: accessItems, _links: accessItemsRepresentation._links };
+        this.setAccessItemsGroups(accessItems);
+        this.accessItemsClone = this.cloneAccessItems(accessItems);
+        this.accessItemsResetClone = this.cloneAccessItems(accessItems);
       }
     });
 
@@ -195,7 +198,20 @@ export class WorkbasketAccessItemsComponent implements OnInit, OnChanges, OnDest
     this.initialized = true;
   }
 
-  setAccessItemsGroups(accessItems: Array<WorkbasketAccessItems>) {
+  sortAccessItems(accessItems: WorkbasketAccessItems[], sortBy: string): WorkbasketAccessItems[] {
+    return accessItems.sort((a, b) => {
+      if (a[sortBy] < b[sortBy]) {
+        return -1;
+      }
+      if (a[sortBy] > b[sortBy]) {
+        return 1;
+      }
+
+      return 0;
+    });
+  }
+
+  setAccessItemsGroups(accessItems: WorkbasketAccessItems[]) {
     const AccessItemsFormGroups = accessItems.map((accessItem) => this.formBuilder.group(accessItem));
     AccessItemsFormGroups.forEach((accessItemGroup) => {
       accessItemGroup.controls.accessId.setValidators(Validators.required);

web/src/app/shared/store/mock-data/mock-store.ts

@@ -154,6 +154,30 @@ export const workbasketAccessItemsMock: WorkbasketAccessItemsRepresentation = {
       permCustom10: true,
       permCustom11: true,
       permCustom12: true
+    },
+    {
+      accessItemId: 'WBI:000000000000000000000000000000000901',
+      workbasketId: 'WBI:000000000000000000000000000000000901',
+      workbasketKey: 'Sort002',
+      accessId: 'user-b-0',
+      accessName: 'Braun, Oliver',
+      permRead: true,
+      permOpen: true,
+      permAppend: true,
+      permTransfer: true,
+      permDistribute: false,
+      permCustom1: true,
+      permCustom2: true,
+      permCustom3: true,
+      permCustom4: true,
+      permCustom5: true,
+      permCustom6: true,
+      permCustom7: true,
+      permCustom8: true,
+      permCustom9: true,
+      permCustom10: true,
+      permCustom11: true,
+      permCustom12: true
     }
   ],
   _links: {