Add a smarter default value for entity card show header toggle (#4964)

src/panels/lovelace/cards/hui-entities-card.ts

@@ -25,6 +25,8 @@ import { EntitiesCardConfig, EntitiesCardEntityConfig } from "./types";
 import { applyThemesOnElement } from "../../../common/dom/apply_themes_on_element";
 import { createHeaderFooterElement } from "../create-element/create-header-footer-element";
 import { LovelaceHeaderFooterConfig } from "../header-footer/types";
+import { DOMAINS_TOGGLE } from "../../../common/const";
+import { computeDomain } from "../../../common/entity/compute_domain";
 
 @customElement("hui-entities-card")
 class HuiEntitiesCard extends LitElement implements LovelaceCard {
@@ -44,6 +46,7 @@ class HuiEntitiesCard extends LitElement implements LovelaceCard {
   private _hass?: HomeAssistant;
 
   private _configEntities?: EntitiesCardEntityConfig[];
+  private _showHeaderToggle?: boolean;
 
   set hass(hass: HomeAssistant) {
     this._hass = hass;
@@ -78,6 +81,22 @@ class HuiEntitiesCard extends LitElement implements LovelaceCard {
 
     this._config = { theme: "default", ...config };
     this._configEntities = entities;
+    if (config.show_header_toggle === undefined) {
+      // Default value is show toggle if we can at least toggle 2 entities.
+      let toggleable = 0;
+      for (const rowConf of entities) {
+        if (!rowConf.entity) {
+          continue;
+        }
+        toggleable += Number(DOMAINS_TOGGLE.has(computeDomain(rowConf.entity)));
+        if (toggleable === 2) {
+          break;
+        }
+      }
+      this._showHeaderToggle = toggleable === 2;
+    } else {
+      this._showHeaderToggle = config.show_header_toggle;
+    }
   }
 
   protected updated(changedProps: PropertyValues): void {
@@ -110,9 +129,7 @@ class HuiEntitiesCard extends LitElement implements LovelaceCard {
         ${this._config.header
           ? this.renderHeaderFooter(this._config.header, "header")
           : ""}
-        ${!this._config.title &&
+        ${!this._config.title && !this._showHeaderToggle && !this._config.icon
-        !this._config.show_header_toggle &&
-        !this._config.icon
           ? ""
           : html`
               <div class="card-header">
@@ -127,7 +144,7 @@ class HuiEntitiesCard extends LitElement implements LovelaceCard {
                     : ""}
                   ${this._config.title}
                 </div>
-                ${this._config.show_header_toggle === false
+                ${!this._showHeaderToggle
                   ? html``
                   : html`
                       <hui-entities-toggle

src/panels/lovelace/common/generate-lovelace-config.ts

@@ -273,7 +273,6 @@ export const generateDefaultViewConfig = (
         areaEntities.map((entity) => [entity.entity_id, entity]),
         {
           title: area.name,
-          show_header_toggle: true,
         }
       )
     );