[ADF-3802] Default ascending order fix (#4070)

lib/content-services/search/components/search-sorting-picker/search-sorting-picker.component.html

@@ -2,5 +2,6 @@
     [options]="options"
     [selected]="value"
     [ascending]="ascending"
-    (change)="onChanged($event)">
+    (valueChange)="onValueChanged($event)"
+    (sortingChange)="onSortingChanged($event)">
 </adf-sorting-picker>

lib/content-services/search/components/search-sorting-picker/search-sorting-picker.component.spec.ts

@@ -71,11 +71,23 @@ describe('SearchSortingPickerComponent', () => {
         spyOn(queryBuilder, 'update').and.stub();
 
         component.ngOnInit();
-        component.onChanged({ key: 'description', ascending: false });
+        component.onValueChanged('description');
 
         expect(queryBuilder.update).toHaveBeenCalled();
         expect(queryBuilder.sorting.length).toBe(1);
         expect(queryBuilder.sorting[0].key).toEqual('description');
+        expect(queryBuilder.sorting[0].ascending).toBeTruthy();
+    });
+
+    it('should update query builder each time sorting is changed', () => {
+        spyOn(queryBuilder, 'update').and.stub();
+
+        component.ngOnInit();
+        component.onSortingChanged(false);
+
+        expect(queryBuilder.update).toHaveBeenCalled();
+        expect(queryBuilder.sorting.length).toBe(1);
+        expect(queryBuilder.sorting[0].key).toEqual('name');
         expect(queryBuilder.sorting[0].ascending).toBeFalsy();
     });
 });

lib/content-services/search/components/search-sorting-picker/search-sorting-picker.component.ts

@@ -39,13 +39,18 @@ export class SearchSortingPickerComponent implements OnInit {
         const primary = this.queryBuilder.getPrimarySorting();
         if (primary) {
             this.value = primary.key;
-            this.ascending = primary.ascending;
+            this.ascending = this.getSortingOrder();
         }
     }
 
-    onChanged(sorting: { key: string, ascending: boolean }) {
-        this.value = sorting.key;
-        this.ascending = sorting.ascending;
+    onValueChanged(key: string) {
+        this.value = key;
+        this.ascending = this.getSortingOrder();
+        this.applySorting();
+    }
+
+    onSortingChanged(ascending: boolean) {
+        this.ascending = ascending;
         this.applySorting();
     }
 
@@ -67,4 +72,13 @@ export class SearchSortingPickerComponent implements OnInit {
         }
     }
 
+    private getSortingOrder(): boolean {
+        const option = this.findOptionByKey(this.value);
+        if (option) {
+            return option.ascending;
+        }
+
+        return this.queryBuilder.getPrimarySorting().ascending;
+    }
+
 }

lib/core/sorting-picker/sorting-picker.component.html

@@ -1,5 +1,5 @@
 <mat-form-field>
-    <mat-select [(value)]="selected" (selectionChange)="onChanged($event)">
+    <mat-select [(value)]="selected" (selectionChange)="onOptionChanged($event)">
         <mat-option *ngFor="let option of options" [value]="option.key">
             {{ option.label | translate }}
         </mat-option>

lib/core/sorting-picker/sorting-picker.component.spec.ts

@@ -27,23 +27,19 @@ describe('SortingPickerComponent', () => {
 
     it('should raise changed event on changing value', (done) => {
         component.selected = 'key1';
-        component.ascending = false;
 
-        component.change.subscribe((event: { key: string, ascending: boolean }) =>  {
-            expect(event.key).toBe('key2');
-            expect(event.ascending).toBeFalsy();
+        component.valueChange.subscribe((key: string) =>  {
+            expect(key).toBe('key2');
             done();
         });
-        component.onChanged(<any> { value: 'key2' });
+        component.onOptionChanged(<any> { value: 'key2' });
     });
 
     it('should raise changed event on changing direction', (done) => {
-        component.selected = 'key1';
         component.ascending = false;
 
-        component.change.subscribe((event: { key: string, ascending: boolean }) =>  {
-            expect(event.key).toBe('key1');
-            expect(event.ascending).toBeTruthy();
+        component.sortingChange.subscribe((ascending: boolean) =>  {
+            expect(ascending).toBeTruthy();
             done();
         });
         component.toggleSortDirection();

lib/core/sorting-picker/sorting-picker.component.ts

@@ -38,24 +38,21 @@ export class SortingPickerComponent {
     @Input()
     ascending = true;
 
-    /** Raised each time sorting key or direction gets changed. */
+    /** Raised each time sorting key gets changed. */
     @Output()
-    change = new EventEmitter<{ key: string, ascending: boolean }>();
+    valueChange = new EventEmitter<string>();
 
-    onChanged(event: MatSelectChange) {
+    /** Raised each time direction gets changed. */
+    @Output()
+    sortingChange = new EventEmitter<boolean>();
+
+    onOptionChanged(event: MatSelectChange) {
         this.selected = event.value;
-        this.raiseChangedEvent();
+        this.valueChange.emit(this.selected);
     }
 
     toggleSortDirection() {
         this.ascending = !this.ascending;
-        this.raiseChangedEvent();
-    }
-
-    private raiseChangedEvent() {
-        this.change.emit({
-            key: this.selected,
-            ascending: this.ascending
-        });
+        this.sortingChange.emit(this.ascending);
     }
 }