Differentiate between assigned and targeting scene/automations/script (#10781)

This commit is contained in:
Bram Kragten 2021-12-03 17:21:26 +01:00 committed by GitHub
parent a54a2a54f8
commit db4aa05bf4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 191 additions and 117 deletions

View File

@ -35,6 +35,10 @@ import {
loadAreaRegistryDetailDialog,
showAreaRegistryDetailDialog,
} from "./show-dialog-area-registry-detail";
import { computeDomain } from "../../../common/entity/compute_domain";
import { SceneEntity } from "../../../data/scene";
import { ScriptEntity } from "../../../data/script";
import { AutomationEntity } from "../../../data/automation";
@customElement("ha-config-area-page")
class HaConfigAreaPage extends LitElement {
@ -131,6 +135,16 @@ class HaConfigAreaPage extends LitElement {
this.entities
);
const sceneEntities = entities.filter(
(entity) => computeDomain(entity.entity_id) === "scene"
);
const scriptEntities = entities.filter(
(entity) => computeDomain(entity.entity_id) === "script"
);
const automationEntities = entities.filter(
(entity) => computeDomain(entity.entity_id) === "automation"
);
return html`
<hass-tabs-subpage
.hass=${this.hass}
@ -221,19 +235,22 @@ class HaConfigAreaPage extends LitElement {
)}
>
${entities.length
? entities.map(
(entity) =>
html`
<paper-item
@click=${this._openEntity}
.entity=${entity}
>
<paper-item-body>
${computeEntityRegistryName(this.hass, entity)}
</paper-item-body>
<ha-icon-next></ha-icon-next>
</paper-item>
`
? entities.map((entity) =>
["scene", "script", "automation"].includes(
computeDomain(entity.entity_id)
)
? ""
: html`
<paper-item
@click=${this._openEntity}
.entity=${entity}
>
<paper-item-body>
${computeEntityRegistryName(this.hass, entity)}
</paper-item-body>
<ha-icon-next></ha-icon-next>
</paper-item>
`
)
: html`
<paper-item class="no-link"
@ -251,48 +268,44 @@ class HaConfigAreaPage extends LitElement {
.header=${this.hass.localize(
"ui.panel.config.devices.automation.automations"
)}
>${this._related?.automation?.length
? this._related.automation.map((automation) => {
const entityState = this.hass.states[automation];
return entityState
? html`
<div>
<a
href=${ifDefined(
entityState.attributes.id
? `/config/automation/edit/${entityState.attributes.id}`
: undefined
)}
>
<paper-item
.disabled=${!entityState.attributes.id}
>
<paper-item-body>
${computeStateName(entityState)}
</paper-item-body>
<ha-icon-next></ha-icon-next>
</paper-item>
</a>
${!entityState.attributes.id
? html`
<paper-tooltip animation-delay="0">
${this.hass.localize(
"ui.panel.config.devices.cant_edit"
)}
</paper-tooltip>
`
: ""}
</div>
`
: "";
})
: html`
>
${automationEntities.length
? html`<h3>Assigned to this area:</h3>
${automationEntities.map((entity) => {
const entityState = this.hass.states[
entity.entity_id
] as AutomationEntity | undefined;
return entityState
? this._renderAutomation(entityState)
: "";
})}`
: ""}
${this._related?.automation?.filter(
(entityId) =>
!automationEntities.find(
(entity) => entity.entity_id === entityId
)
).length
? html`<h3>Targeting this area:</h3>
${this._related.automation.map((scene) => {
const entityState = this.hass.states[scene] as
| AutomationEntity
| undefined;
return entityState
? this._renderAutomation(entityState)
: "";
})}`
: ""}
${!automationEntities.length &&
!this._related?.automation?.length
? html`
<paper-item class="no-link"
>${this.hass.localize(
"ui.panel.config.devices.automation.no_automations"
)}</paper-item
>
`}
`
: ""}
</ha-card>
`
: ""}
@ -304,48 +317,40 @@ class HaConfigAreaPage extends LitElement {
.header=${this.hass.localize(
"ui.panel.config.devices.scene.scenes"
)}
>${this._related?.scene?.length
? this._related.scene.map((scene) => {
const entityState = this.hass.states[scene];
return entityState
? html`
<div>
<a
href=${ifDefined(
entityState.attributes.id
? `/config/scene/edit/${entityState.attributes.id}`
: undefined
)}
>
<paper-item
.disabled=${!entityState.attributes.id}
>
<paper-item-body>
${computeStateName(entityState)}
</paper-item-body>
<ha-icon-next></ha-icon-next>
</paper-item>
</a>
${!entityState.attributes.id
? html`
<paper-tooltip animation-delay="0">
${this.hass.localize(
"ui.panel.config.devices.cant_edit"
)}
</paper-tooltip>
`
: ""}
</div>
`
: "";
})
: html`
>
${sceneEntities.length
? html`<h3>Assigned to this area:</h3>
${sceneEntities.map((entity) => {
const entityState =
this.hass.states[entity.entity_id];
return entityState
? this._renderScene(entityState)
: "";
})}`
: ""}
${this._related?.scene?.filter(
(entityId) =>
!sceneEntities.find(
(entity) => entity.entity_id === entityId
)
).length
? html`<h3>Targeting this area:</h3>
${this._related.scene.map((scene) => {
const entityState = this.hass.states[scene];
return entityState
? this._renderScene(entityState)
: "";
})}`
: ""}
${!sceneEntities.length && !this._related?.scene?.length
? html`
<paper-item class="no-link"
>${this.hass.localize(
"ui.panel.config.devices.scene.no_scenes"
)}</paper-item
>
`}
`
: ""}
</ha-card>
`
: ""}
@ -355,31 +360,43 @@ class HaConfigAreaPage extends LitElement {
.header=${this.hass.localize(
"ui.panel.config.devices.script.scripts"
)}
>${this._related?.script?.length
? this._related.script.map((script) => {
const entityState = this.hass.states[script];
return entityState
? html`
<a
href=${`/config/script/edit/${entityState.entity_id}`}
>
<paper-item>
<paper-item-body>
${computeStateName(entityState)}
</paper-item-body>
<ha-icon-next></ha-icon-next>
</paper-item>
</a>
`
: "";
})
: html`
<paper-item class="no-link">
${this.hass.localize(
>
${scriptEntities.length
? html`<h3>Assigned to this area:</h3>
${scriptEntities.map((entity) => {
const entityState = this.hass.states[
entity.entity_id
] as ScriptEntity | undefined;
return entityState
? this._renderScript(entityState)
: "";
})}`
: ""}
${this._related?.script?.filter(
(entityId) =>
!scriptEntities.find(
(entity) => entity.entity_id === entityId
)
).length
? html`<h3>Targeting this area:</h3>
${this._related.script.map((scene) => {
const entityState = this.hass.states[scene] as
| ScriptEntity
| undefined;
return entityState
? this._renderScript(entityState)
: "";
})}`
: ""}
${!scriptEntities.length && !this._related?.script?.length
? html`
<paper-item class="no-link"
>${this.hass.localize(
"ui.panel.config.devices.script.no_scripts"
)}</paper-item
>
`}
`
: ""}
</ha-card>
`
: ""}
@ -389,6 +406,63 @@ class HaConfigAreaPage extends LitElement {
`;
}
private _renderScene(entityState: SceneEntity) {
return html`<div>
<a
href=${ifDefined(
entityState.attributes.id
? `/config/scene/edit/${entityState.attributes.id}`
: undefined
)}
>
<paper-item .disabled=${!entityState.attributes.id}>
<paper-item-body> ${computeStateName(entityState)} </paper-item-body>
<ha-icon-next></ha-icon-next>
</paper-item>
</a>
${!entityState.attributes.id
? html`
<paper-tooltip animation-delay="0">
${this.hass.localize("ui.panel.config.devices.cant_edit")}
</paper-tooltip>
`
: ""}
</div>`;
}
private _renderAutomation(entityState: AutomationEntity) {
return html`<div>
<a
href=${ifDefined(
entityState.attributes.id
? `/config/automation/edit/${entityState.attributes.id}`
: undefined
)}
>
<paper-item .disabled=${!entityState.attributes.id}>
<paper-item-body> ${computeStateName(entityState)} </paper-item-body>
<ha-icon-next></ha-icon-next>
</paper-item>
</a>
${!entityState.attributes.id
? html`
<paper-tooltip animation-delay="0">
${this.hass.localize("ui.panel.config.devices.cant_edit")}
</paper-tooltip>
`
: ""}
</div>`;
}
private _renderScript(entityState: ScriptEntity) {
return html`<a href=${`/config/script/edit/${entityState.entity_id}`}>
<paper-item>
<paper-item-body> ${computeStateName(entityState)} </paper-item-body>
<ha-icon-next></ha-icon-next>
</paper-item>
</a>`;
}
private async _findRelated() {
this._related = await findRelated(this.hass, "area", this.areaId);
}
@ -457,6 +531,13 @@ class HaConfigAreaPage extends LitElement {
align-items: center;
}
h3 {
margin: 0;
padding: 0 16px;
font-weight: 500;
color: var(--secondary-text-color);
}
img {
border-radius: var(--ha-card-border-radius, 4px);
width: 100%;

View File

@ -50,11 +50,8 @@ export class HaConfigAreasDashboard extends LitElement {
let noServicesInArea = 0;
let noEntitiesInArea = 0;
const devicesInArea = new Set();
for (const device of devices) {
if (device.area_id === area.area_id) {
devicesInArea.add(device.id);
if (device.entry_type === "service") {
noServicesInArea++;
} else {
@ -64,11 +61,7 @@ export class HaConfigAreasDashboard extends LitElement {
}
for (const entity of entities) {
if (
entity.area_id
? entity.area_id === area.area_id
: devicesInArea.has(entity.device_id)
) {
if (entity.area_id === area.area_id) {
noEntitiesInArea++;
}
}