Initial support for entity category (#10266)

gallery/src/demos/demo-integration-card.ts

@@ -187,6 +187,7 @@ const createEntityRegistryEntries = (
     device_id: "mock-device-id",
     area_id: null,
     disabled_by: null,
+    entity_category: null,
     entity_id: "binary_sensor.updater",
     name: null,
     icon: null,

src/data/entity_registry.ts

@@ -13,6 +13,7 @@ export interface EntityRegistryEntry {
   device_id: string | null;
   area_id: string | null;
   disabled_by: string | null;
+  entity_category: "config" | "diagnostic" | null;
 }
 
 export interface ExtEntityRegistryEntry extends EntityRegistryEntry {

src/panels/config/devices/device-detail/ha-device-entities-card.ts

@@ -25,6 +25,8 @@ import { EntityRegistryStateEntry } from "../ha-config-device-page";
 
 @customElement("ha-device-entities-card")
 export class HaDeviceEntitiesCard extends LitElement {
+  @property() public header!: string;
+
   @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property() public entities!: EntityRegistryStateEntry[];
@@ -47,11 +49,7 @@ export class HaDeviceEntitiesCard extends LitElement {
     const disabledEntities: EntityRegistryStateEntry[] = [];
     this._entityRows = [];
     return html`
-      <ha-card
+      <ha-card .header=${this.header}>
-        .header=${this.hass.localize(
-          "ui.panel.config.devices.entities.entities"
-        )}
-      >
         ${this.entities.length
           ? html`
               <div id="entities" @hass-more-info=${this._overrideMoreInfo}>

src/panels/config/devices/ha-config-device-page.ts

@@ -8,6 +8,7 @@ import { isComponentLoaded } from "../../../common/config/is_component_loaded";
 import { computeStateDomain } from "../../../common/entity/compute_state_domain";
 import { computeStateName } from "../../../common/entity/compute_state_name";
 import { stringCompare } from "../../../common/string/compare";
+import { groupBy } from "../../../common/util/group-by";
 import { slugify } from "../../../common/string/slugify";
 import "../../../components/entity/ha-battery-icon";
 import "../../../components/ha-icon-button";
@@ -112,6 +113,25 @@ export class HaConfigDevicePage extends LitElement {
         )
   );
 
+  private _entitiesByCategory = memoizeOne(
+    (entities: EntityRegistryEntry[]) => {
+      const result = groupBy(
+        entities,
+        (entry) => entry.entity_category || "state"
+      ) as Record<
+        "state" | NonNullable<EntityRegistryEntry["entity_category"]>,
+        EntityRegistryStateEntry[]
+      >;
+      for (const key of ["state", "diagnostic", "config"]) {
+        if (!(key in result)) {
+          result[key] = [];
+        }
+      }
+
+      return result;
+    }
+  );
+
   private _computeArea = memoizeOne(
     (areas, device): AreaRegistryEntry | undefined => {
       if (!areas || !device || !device.area_id) {
@@ -159,6 +179,7 @@ export class HaConfigDevicePage extends LitElement {
 
     const integrations = this._integrations(device, this.entries);
     const entities = this._entities(this.deviceId, this.entities);
+    const entitiesByCategory = this._entitiesByCategory(entities);
     const batteryEntity = this._batteryEntity(entities);
     const batteryChargingEntity = this._batteryChargingEntity(entities);
     const batteryState = batteryEntity
@@ -298,18 +319,22 @@ export class HaConfigDevicePage extends LitElement {
               ${this._renderIntegrationInfo(device, integrations)}
               </ha-device-info-card>
 
-            ${
+            ${["state", "config", "diagnostic"].map((category) =>
-              entities.length
+              !entitiesByCategory[category].length
-                ? html`
+                ? ""
+                : html`
                     <ha-device-entities-card
                       .hass=${this.hass}
-                      .entities=${entities}
+                      .header=${this.hass.localize(
+                        `ui.panel.config.devices.entities.${category}`
+                      )}
+                      .entities=${entitiesByCategory[category]}
                       .showDisabled=${device.disabled_by !== null}
                     >
                     </ha-device-entities-card>
                   `
-                : html``
+            )}
-            }
+
           </div>
             <div class="column">
             ${

src/panels/config/entities/ha-config-entities.ts

@@ -679,6 +679,7 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) {
           icon: null,
           readonly: true,
           selectable: false,
+          entity_category: null,
         });
       }
       if (changed) {

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

@@ -189,6 +189,7 @@ const adjustName = (name: string): string =>
   hasUpperCase(name.substr(0, name.indexOf(" ")))
     ? name
     : name[0].toUpperCase() + name.slice(1);
+
 const computeDefaultViewStates = (
   entities: HassEntities,
   entityEntries: EntityRegistryEntry[]
@@ -196,7 +197,9 @@ const computeDefaultViewStates = (
   const states = {};
   const hiddenEntities = new Set(
     entityEntries
-      .filter((entry) => HIDE_PLATFORM.has(entry.platform))
+      .filter(
+        (entry) => entry.entity_category || HIDE_PLATFORM.has(entry.platform)
+      )
       .map((entry) => entry.entity_id)
   );
 

src/translations/en.json

@@ -2170,6 +2170,9 @@
           "device_not_found": "Device not found.",
           "entities": {
             "entities": "Entities",
+            "state": "State",
+            "diagnostic": "Diagnostic",
+            "config": "Config",
             "add_entities_lovelace": "Add to Lovelace",
             "none": "This device has no entities",
             "hide_disabled": "Hide disabled",