The data-query groupBy sort "dir" is being ignored and is always in descending order

[James]

I have a flat list of objects that I am grouping for a dropdown list.  The issue is that no matter what, the order of the groups is always in descending order, even if I provide the "dir" sort descriptor.  Please see the following code

//Group departments by user departments and other for easier access on UI
this.departments.forEach(department => {
  department["subCategory"] = this.isMyDept(department.id) ? "My Departments": "Others";
});
this.departmentGrouping = groupBy(this.departments, [
  { field: "subCategory", dir: "asc" },
]) as GroupResult[];

<kendo-dropdownlist
            [(ngModel)]="deptID"
            [data]="departmentGrouping"
            [filterable]="true"
            [showStickyHeader]="false"
            textField="name"
            valueField="id"
            [valuePrimitive]="true"
          >
</kendo-dropdownlist>

When my dropdown is displayed, the "Others" group is always on top.  It doesn't matter if I change the "dir" descriptor to "asc" or "desc" in the groupBy function, nothing changes.  How do I sort the group order so I can have "My Departments" as the top group?

[Martin Bechev]

Hello James,

Thank you for the provided feedback.

This is an issue with the data query package which has been logged here:

https://github.com/telerik/kendo-angular/issues/2529

As a workaround, the developer can use the orderBy method to sort the groups in the desired order.

  public data: Array<any> = [
    { name: 'Pork', category: 'Food', subcategory: 'Meat' },
    { name: 'Pepper', category: 'Food', subcategory: 'Vegetables' },
    { name: 'Beef', category: 'Food', subcategory: 'Meat' },
  ];
  public groupedData: GroupResult[] = groupBy(this.data, [
    { field: 'subcategory', dir: 'asc' },
  ]);

  public groupedDataDesc: GroupResult[] = orderBy(
    groupBy(this.data, [{ field: 'subcategory', dir: 'asc' }]),
    [{ field: 'value', dir: 'desc' }]
  );

Please check this demo:

https://stackblitz.com/edit/angular-7qwmk87r

I noticed the issue was logged years ago, which is why I brought it to the attention of our development team. However we still cannot commit to an exact timeline when the issue will be fixed, as we would not like to make promises we are not able to hold. Please subscribe for the issue to be notified when there are any updates on it.

Accept our apologies for the caused inconvenience.

Regards,
Martin Bechev
Progress Telerik

[James]

HI Martin,

  Thanks, this does work but can you explain why?  I am not sure I understand how this works:

[{ field: 'value', dir: 'desc' }]

 

In your example, those objects do not have a property called `value` so how is this making the sort work?

[Martin Bechev]

Hi James,

I am glad to hear that the suggestion worked for you.

The workaround is to manually order the data using the orderBy method. The orderBy method accepts two arguments

1. the first one is a data array - in the above code snippet this is the equivalent of the grouped data:

groupBy(this.data, [{ field: 'subcategory', dir: 'asc' }])

2. second argument is an array of SortDescriptor objects.

    [{ field: 'value', dir: 'desc' }]

The dir is directions while the field tells the function the value of which field to be taken into consideration. 

I hope this helps.