jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-22 00:36:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Handle unknown toggle state (#11522)

Browse Source
This commit is contained in:
Bram Kragten 2022-02-03 15:43:41 +01:00 committed by GitHub
parent 3aca67d511
commit 0c6f647f53
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/entity/ha-entity-toggle.ts
View File

@ -12,7 +12,7 @@ import { property, state } from "lit/decorators";
import { STATES_OFF } from "../../common/const"; import { STATES_OFF } from "../../common/const";
import { computeStateDomain } from "../../common/entity/compute_state_domain"; import { computeStateDomain } from "../../common/entity/compute_state_domain";
import { computeStateName } from "../../common/entity/compute_state_name"; import { computeStateName } from "../../common/entity/compute_state_name";
import { UNAVAILABLE, UNAVAILABLE_STATES } from "../../data/entity"; import { UNAVAILABLE, UNAVAILABLE_STATES, UNKNOWN } from "../../data/entity";
import { forwardHaptic } from "../../data/haptics"; import { forwardHaptic } from "../../data/haptics";
import { HomeAssistant } from "../../types"; import { HomeAssistant } from "../../types";
import "../ha-formfield"; import "../ha-formfield";
@ -39,21 +39,26 @@ export class HaEntityToggle extends LitElement {
return html` <ha-switch disabled></ha-switch> `; return html` <ha-switch disabled></ha-switch> `;
} }
if (this.stateObj.attributes.assumed_state) { if (
this.stateObj.attributes.assumed_state ||
this.stateObj.state === UNKNOWN
) {
return html` return html`
<ha-icon-button <ha-icon-button
.label=${`Turn ${computeStateName(this.stateObj)} off`} .label=${`Turn ${computeStateName(this.stateObj)} off`}
.path=${mdiFlashOff} .path=${mdiFlashOff}
.disabled=${this.stateObj.state === UNAVAILABLE} .disabled=${this.stateObj.state === UNAVAILABLE}
@click=${this._turnOff} @click=${this._turnOff}
?state-active=${!this._isOn} class=${!this._isOn && this.stateObj.state !== UNKNOWN
? "state-active"
: ""}
></ha-icon-button> ></ha-icon-button>
<ha-icon-button <ha-icon-button
.label=${`Turn ${computeStateName(this.stateObj)} on`} .label=${`Turn ${computeStateName(this.stateObj)} on`}
.path=${mdiFlash} .path=${mdiFlash}
.disabled=${this.stateObj.state === UNAVAILABLE} .disabled=${this.stateObj.state === UNAVAILABLE}
@click=${this._turnOn} @click=${this._turnOn}
?state-active=${this._isOn} class=${this._isOn ? "state-active" : ""}
></ha-icon-button> ></ha-icon-button>
`; `;
} }
@ -63,7 +68,7 @@ export class HaEntityToggle extends LitElement {
this._isOn ? "off" : "on" this._isOn ? "off" : "on"
}`} }`}
.checked=${this._isOn} .checked=${this._isOn}
.disabled=${UNAVAILABLE_STATES.includes(this.stateObj.state)} .disabled=${this.stateObj.state === UNAVAILABLE}
@change=${this._toggleChanged} @change=${this._toggleChanged}
></ha-switch>`; ></ha-switch>`;
@ -156,10 +161,11 @@ export class HaEntityToggle extends LitElement {
min-width: 38px; min-width: 38px;
} }
ha-icon-button { ha-icon-button {
--mdc-icon-button-size: 40px;
color: var(--ha-icon-button-inactive-color, var(--primary-text-color)); color: var(--ha-icon-button-inactive-color, var(--primary-text-color));
transition: color 0.5s; transition: color 0.5s;
} }
ha-icon-button[state-active] { ha-icon-button.state-active {
color: var(--ha-icon-button-active-color, var(--primary-color)); color: var(--ha-icon-button-active-color, var(--primary-color));
} }
ha-switch { ha-switch {