From fce9bdd07b6666a9f62d15ad92b4b65901f16548 Mon Sep 17 00:00:00 2001
From: Mindfreeze <mindfreeze@abv.bg>
Date: Fri, 20 Oct 2023 09:15:12 +0300
Subject: [PATCH] fix(#143): add `sort_group_by_parent` option so default
 sorting behavior is reverted

---
 README.md    | 1 +
 src/chart.ts | 2 +-
 src/types.ts | 2 ++
 3 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index fa9edde..c693e5a 100644
--- a/README.md
+++ b/README.md
@@ -44,6 +44,7 @@ This card is intended to display connections between entities with numeric state
 | entities          | list    | **Required** |                     | Entities to show in this section. Could be just the entity_id as a string or an object, see [entities object](#entities-object) for additional options. Note that the order of this list matters
 | sort_by           | string  | **Optional** |                     | Sort the entities in this section. Valid options are: 'state'. If your values change often, you may want to use the `throttle` option to limit update frequency
 | sort_dir          | string  | **Optional** | desc                | Sorting direction. Valid options are: 'asc' for smallest first & 'desc' for biggest first
+| sort_group_by_parent | boolean | **Optional** | false            | Group entities by parent before sorting. See #135
 | min_width         | string  | **Optional** |                     | Minimum section width. Any CSS value is OK. Examples: 75px, 50%, 1em
 
 ### Entities object
diff --git a/src/chart.ts b/src/chart.ts
index 54a205f..26e462e 100644
--- a/src/chart.ts
+++ b/src/chart.ts
@@ -277,7 +277,7 @@ export class Chart extends LitElement {
       const availableHeight = this.config.height - (boxes.length - 1) * this.config.min_box_distance;
       // calc sizes to determine statePerPixelY ratio and find the best one
       const calcResults = this._calcBoxHeights(boxes, availableHeight, total);
-      const parentBoxes = this.sections[this.sections.length - 1]?.boxes || [];
+      const parentBoxes = section.sort_group_by_parent ? this.sections[this.sections.length - 1]?.boxes || [] : [];
       const sectionState = {
         boxes: this._sortBoxes(parentBoxes, calcResults.boxes, section.sort_by, section.sort_dir),
         total,
diff --git a/src/types.ts b/src/types.ts
index 5b98587..1e20879 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -85,6 +85,7 @@ export interface SectionConfig {
   entities: EntityConfigOrStr[];
   sort_by?: 'state';
   sort_dir?: 'asc' | 'desc';
+  sort_group_by_parent?: boolean;
   min_width?: string;
 }
 
@@ -114,6 +115,7 @@ export interface Section {
   entities: EntityConfigInternal[];
   sort_by?: 'state';
   sort_dir?: 'asc' | 'desc';
+  sort_group_by_parent?: boolean;
   min_width?: string;
 }