diff --git a/src/panels/lovelace/cards/hui-entity-button-card.ts b/src/panels/lovelace/cards/hui-entity-button-card.ts index 451562d563..a591a7dc4e 100644 --- a/src/panels/lovelace/cards/hui-entity-button-card.ts +++ b/src/panels/lovelace/cards/hui-entity-button-card.ts @@ -12,6 +12,7 @@ import { styleMap } from "lit-html/directives/style-map"; import "@material/mwc-ripple"; import "../../../components/ha-card"; +import "../components/hui-warning"; import isValidEntityId from "../../../common/entity/valid_entity_id"; import stateIcon from "../../../common/entity/state_icon"; @@ -91,9 +92,13 @@ class HuiEntityButtonCard extends LitElement implements LovelaceCard { if (!stateObj) { return html` -
- Entity not available: ${this._config.entity} -
+ ${this.hass.localize( + "ui.panel.lovelace.warning.entity_not_found", + "entity", + this._config.entity + )} `; } @@ -157,11 +162,6 @@ class HuiEntityButtonCard extends LitElement implements LovelaceCard { ha-icon[data-state="unavailable"] { color: var(--state-icon-unavailable-color); } - .not-found { - flex: 1; - background-color: yellow; - padding: 8px; - } `; } diff --git a/src/panels/lovelace/cards/hui-gauge-card.ts b/src/panels/lovelace/cards/hui-gauge-card.ts index 79ffa484f5..020356fc8c 100644 --- a/src/panels/lovelace/cards/hui-gauge-card.ts +++ b/src/panels/lovelace/cards/hui-gauge-card.ts @@ -297,11 +297,6 @@ class HuiGaugeCard extends LitElement implements LovelaceCard { padding-top: calc(var(--base-unit) * 0.15); font-size: calc(var(--base-unit) * 0.3); } - .not-found { - flex: 1; - background-color: yellow; - padding: 8px; - } `; } } diff --git a/src/panels/lovelace/cards/hui-glance-card.ts b/src/panels/lovelace/cards/hui-glance-card.ts index 81e448d056..820ca06f48 100644 --- a/src/panels/lovelace/cards/hui-glance-card.ts +++ b/src/panels/lovelace/cards/hui-glance-card.ts @@ -13,6 +13,7 @@ import { LovelaceCardConfig, ActionConfig } from "../../../data/lovelace"; import { longPress } from "../common/directives/long-press-directive"; import { EntityConfig } from "../entity-rows/types"; import { processConfigEntities } from "../common/process-config-entities"; +import { handleClick } from "../common/handle-click"; import computeStateDisplay from "../../../common/entity/compute_state_display"; import computeStateName from "../../../common/entity/compute_state_name"; @@ -21,7 +22,7 @@ import applyThemesOnElement from "../../../common/dom/apply_themes_on_element"; import "../../../components/entity/state-badge"; import "../../../components/ha-card"; import "../../../components/ha-icon"; -import { handleClick } from "../common/handle-click"; +import "../components/hui-warning"; export interface ConfigEntity extends EntityConfig { tap_action?: ActionConfig; @@ -176,10 +177,6 @@ export class HuiGlanceCard extends LitElement implements LovelaceCard { state-badge { margin: 8px 0; } - .not-found { - background-color: yellow; - text-align: center; - } `; } @@ -189,10 +186,13 @@ export class HuiGlanceCard extends LitElement implements LovelaceCard { if (!stateObj) { return html` -
-
${entityConf.entity}
- Entity Not Available -
+ ${this.hass!.localize( + "ui.panel.lovelace.warning.entity_not_found", + "entity", + entityConf.entity + )} `; } diff --git a/src/panels/lovelace/cards/hui-sensor-card.ts b/src/panels/lovelace/cards/hui-sensor-card.ts index 6bc8630dcf..8dbdab4fea 100644 --- a/src/panels/lovelace/cards/hui-sensor-card.ts +++ b/src/panels/lovelace/cards/hui-sensor-card.ts @@ -12,6 +12,7 @@ import { LovelaceCard, LovelaceCardEditor } from "../types"; import { LovelaceCardConfig } from "../../../data/lovelace"; import { HomeAssistant } from "../../../types"; import { fireEvent } from "../../../common/dom/fire_event"; +import { fetchRecent } from "../../../data/history"; import applyThemesOnElement from "../../../common/dom/apply_themes_on_element"; import computeStateName from "../../../common/entity/compute_state_name"; @@ -19,7 +20,7 @@ import stateIcon from "../../../common/entity/state_icon"; import "../../../components/ha-card"; import "../../../components/ha-icon"; -import { fetchRecent } from "../../../data/history"; +import "../components/hui-warning"; const midPoint = ( _Ax: number, @@ -199,15 +200,27 @@ class HuiSensorCard extends LitElement implements LovelaceCard { const stateObj = this.hass.states[this._config.entity]; + if (!stateObj) { + return html` + ${this.hass.localize( + "ui.panel.lovelace.warning.entity_not_found", + "entity", + this._config.entity + )} + `; + } + let graph; if (stateObj && this._config.graph === "line") { if (!stateObj.attributes.unit_of_measurement) { - graph = html` -
- Entity: ${this._config.entity} - Has no Unit of Measurement and - therefore can not display a line graph. -
+ return html` + Entity: ${this._config.entity} - Has no Unit of Measurement and + therefore can not display a line graph. `; } else if (!this._history) { graph = svg` @@ -233,34 +246,26 @@ class HuiSensorCard extends LitElement implements LovelaceCard { return html` ${this.renderStyle()} - ${!stateObj - ? html` -
- Entity not available: ${this._config.entity} -
- ` - : html` -
-
- -
-
- ${this._config.name || computeStateName(stateObj)} -
-
-
- ${stateObj.state} - ${this._config.unit || - stateObj.attributes.unit_of_measurement} -
-
${graph}
- `} +
+
+ +
+
+ ${this._config.name || computeStateName(stateObj)} +
+
+
+ ${stateObj.state} + ${this._config.unit || + stateObj.attributes.unit_of_measurement} +
+
${graph}
`; } @@ -399,11 +404,6 @@ class HuiSensorCard extends LitElement implements LovelaceCard { align-self: flex-end; margin: auto 8px; } - .not-found { - flex: 1; - background-color: yellow; - padding: 8px; - } `; } diff --git a/src/panels/lovelace/components/hui-generic-entity-row.ts b/src/panels/lovelace/components/hui-generic-entity-row.ts index d9916ffe69..03ecc5ef08 100644 --- a/src/panels/lovelace/components/hui-generic-entity-row.ts +++ b/src/panels/lovelace/components/hui-generic-entity-row.ts @@ -1,7 +1,3 @@ -import "../../../components/entity/state-badge"; -import "../../../components/ha-relative-time"; -import "../../../components/ha-icon"; - import computeStateName from "../../../common/entity/compute_state_name"; import { LitElement, @@ -11,10 +7,16 @@ import { PropertyValues, property, } from "lit-element"; + import { HomeAssistant } from "../../../types"; import { EntitiesCardEntityConfig } from "../cards/hui-entities-card"; import { computeRTL } from "../../../common/util/compute_rtl"; +import "../../../components/entity/state-badge"; +import "../../../components/ha-relative-time"; +import "../../../components/ha-icon"; +import "../components/hui-warning"; + class HuiGenericEntityRow extends LitElement { @property() public hass?: HomeAssistant; @property() public config?: EntitiesCardEntityConfig; @@ -30,7 +32,13 @@ class HuiGenericEntityRow extends LitElement { if (!stateObj) { return html` -
Entity not available: [[config.entity]]
+ ${this.hass.localize( + "ui.panel.lovelace.warning.entity_not_found", + "entity", + this.config.entity + )} `; } @@ -107,11 +115,6 @@ class HuiGenericEntityRow extends LitElement { display: block; color: var(--secondary-text-color); } - .not-found { - flex: 1; - background-color: yellow; - padding: 8px; - } state-badge { flex: 0 0 40px; }