Device page: sort related automations, scenes, scripts (#24742)

* sort related items

* use memoize for sorted _related

* fix for "_entities" & "_getEntitiesSorted"
This commit is contained in:
ildar170975 2025-06-24 07:25:09 +03:00 committed by GitHub
parent c73122d7ee
commit a5005c0840
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -15,6 +15,7 @@ import { LitElement, css, html, nothing } from "lit";
import { customElement, property, state } from "lit/decorators"; import { customElement, property, state } from "lit/decorators";
import { ifDefined } from "lit/directives/if-defined"; import { ifDefined } from "lit/directives/if-defined";
import memoizeOne from "memoize-one"; import memoizeOne from "memoize-one";
import type { HassEntity } from "home-assistant-js-websocket";
import { isComponentLoaded } from "../../../common/config/is_component_loaded"; import { isComponentLoaded } from "../../../common/config/is_component_loaded";
import { ASSIST_ENTITIES, SENSOR_ENTITIES } from "../../../common/const"; import { ASSIST_ENTITIES, SENSOR_ENTITIES } from "../../../common/const";
import { computeDeviceNameDisplay } from "../../../common/entity/compute_device_name"; import { computeDeviceNameDisplay } from "../../../common/entity/compute_device_name";
@ -185,6 +186,27 @@ export class HaConfigDevicePage extends LitElement {
) )
); );
private _getEntitiesSorted = (entities: HassEntity[]) =>
entities.sort((ent1, ent2) =>
stringCompare(
ent1.attributes.friendly_name || `zzz${ent1.entity_id}`,
ent2.attributes.friendly_name || `zzz${ent2.entity_id}`,
this.hass.locale.language
)
);
private _getRelated = memoizeOne((related?: RelatedResult) => ({
automation: this._getEntitiesSorted(
(related?.automation ?? []).map((entityId) => this.hass.states[entityId])
),
scene: this._getEntitiesSorted(
(related?.scene ?? []).map((entityId) => this.hass.states[entityId])
),
script: this._getEntitiesSorted(
(related?.script ?? []).map((entityId) => this.hass.states[entityId])
),
}));
private _deviceIdInList = memoizeOne((deviceId: string) => [deviceId]); private _deviceIdInList = memoizeOne((deviceId: string) => [deviceId]);
private _entityIds = memoizeOne( private _entityIds = memoizeOne(
@ -433,8 +455,9 @@ export class HaConfigDevicePage extends LitElement {
${this._related?.automation?.length ${this._related?.automation?.length
? html` ? html`
<div class="items"> <div class="items">
${this._related.automation.map((automation) => { ${this._getRelated(this._related).automation.map(
const entityState = this.hass.states[automation]; (automation) => {
const entityState = automation;
return entityState return entityState
? html`<a ? html`<a
href=${ifDefined( href=${ifDefined(
@ -449,7 +472,8 @@ export class HaConfigDevicePage extends LitElement {
</ha-list-item> </ha-list-item>
</a>` </a>`
: nothing; : nothing;
})} }
)}
</div> </div>
` `
: html` : html`
@ -510,8 +534,8 @@ export class HaConfigDevicePage extends LitElement {
${this._related?.scene?.length ${this._related?.scene?.length
? html` ? html`
<div class="items"> <div class="items">
${this._related.scene.map((scene) => { ${this._getRelated(this._related).scene.map((scene) => {
const entityState = this.hass.states[scene]; const entityState = scene;
return entityState && entityState.attributes.id return entityState && entityState.attributes.id
? html` ? html`
<a <a
@ -598,10 +622,10 @@ export class HaConfigDevicePage extends LitElement {
${this._related?.script?.length ${this._related?.script?.length
? html` ? html`
<div class="items"> <div class="items">
${this._related.script.map((script) => { ${this._getRelated(this._related).script.map((script) => {
const entityState = this.hass.states[script]; const entityState = script;
const entry = this._entityReg.find( const entry = this._entityReg.find(
(e) => e.entity_id === script (e) => e.entity_id === script.entity_id
); );
let url = `/config/script/show/${entityState.entity_id}`; let url = `/config/script/show/${entityState.entity_id}`;
if (entry) { if (entry) {