jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-14 12:56:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

Sort groups if same as sort column (#26010)

Browse Source 
* fix(grouping): if sorted by column sort group

* chore: use props to group for memoization
This commit is contained in:
Kevin Lakotko 2025-07-07 12:23:27 -04:00 committed by GitHub
parent b60f2e3201
commit 2e8203f666
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 34 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
src/components/data-table/ha-data-table.ts
View File

@ -507,7 +507,9 @@ export class HaDataTable extends LitElement {
this.hasFab, this.hasFab,
this.groupColumn, this.groupColumn,
this.groupOrder, this.groupOrder,
this._collapsedGroups this._collapsedGroups,
this.sortColumn,
this.sortDirection
)} )}
.keyFunction=${this._keyFunction} .keyFunction=${this._keyFunction}
.renderItem=${renderRow} .renderItem=${renderRow}
@ -702,22 +704,37 @@ export class HaDataTable extends LitElement {
hasFab: boolean, hasFab: boolean,
groupColumn: string | undefined, groupColumn: string | undefined,
groupOrder: string[] | undefined, groupOrder: string[] | undefined,
collapsedGroups: string[] collapsedGroups: string[],
sortColumn: string | undefined,
sortDirection: SortingDirection
) => { ) => {
if (appendRow || hasFab || groupColumn) { if (appendRow || hasFab || groupColumn) {
let items = [...data]; let items = [...data];
if (groupColumn) { if (groupColumn) {
const isGroupSortColumn = sortColumn === groupColumn;
const grouped = groupBy(items, (item) => item[groupColumn]); const grouped = groupBy(items, (item) => item[groupColumn]);
if (grouped.undefined) { if (grouped.undefined) {
// make sure ungrouped items are at the bottom // make sure ungrouped items are at the bottom
grouped[UNDEFINED_GROUP_KEY] = grouped.undefined; grouped[UNDEFINED_GROUP_KEY] = grouped.undefined;
delete grouped.undefined; delete grouped.undefined;
} }
const sorted: Record<string, DataTableRowData[]> = Object.keys( const sortedEntries: [string, DataTableRowData[]][] = Object.keys(
grouped grouped
) )
.sort((a, b) => { .sort((a, b) => {
if (!groupOrder && isGroupSortColumn) {
const comparison = stringCompare(
a,
b,
this.hass.locale.language
);
if (sortDirection === "asc") {
return comparison;
}
return comparison * -1;
}
const orderA = groupOrder?.indexOf(a) ?? -1; const orderA = groupOrder?.indexOf(a) ?? -1;
const orderB = groupOrder?.indexOf(b) ?? -1; const orderB = groupOrder?.indexOf(b) ?? -1;
if (orderA !== orderB) { if (orderA !== orderB) {
@ -735,12 +752,18 @@ export class HaDataTable extends LitElement {
this.hass.locale.language this.hass.locale.language
); );
}) })
.reduce((obj, key) => { .reduce(
obj[key] = grouped[key]; (entries, key) => {
return obj; const entry: [string, DataTableRowData[]] = [key, grouped[key]];
}, {});
entries.push(entry);
return entries;
},
[] as [string, DataTableRowData[]][]
);
const groupedItems: DataTableRowData[] = []; const groupedItems: DataTableRowData[] = [];
Object.entries(sorted).forEach(([groupName, rows]) => { sortedEntries.forEach(([groupName, rows]) => {
const collapsed = collapsedGroups.includes(groupName); const collapsed = collapsedGroups.includes(groupName);
groupedItems.push({ groupedItems.push({
append: true, append: true,
@ -836,7 +859,9 @@ export class HaDataTable extends LitElement {
this.hasFab, this.hasFab,
this.groupColumn, this.groupColumn,
this.groupOrder, this.groupOrder,
this._collapsedGroups this._collapsedGroups,
this.sortColumn,
this.sortDirection
); );
if ( if (