From 28fe60f02b6f1bb0192df2b33d0a9cea8afad02d Mon Sep 17 00:00:00 2001
From: Jan-Philipp Benecke <jan-philipp@bnck.me>
Date: Mon, 26 May 2025 10:45:22 +0200
Subject: [PATCH] Improve broken cards on dashboards (#25557)

---
 src/panels/calendar/ha-full-calendar.ts       |  17 +--
 .../hui-energy-carbon-consumed-gauge-card.ts  |   2 +-
 .../lovelace/cards/hui-alarm-panel-card.ts    |   2 +-
 src/panels/lovelace/cards/hui-area-card.ts    |   2 +-
 src/panels/lovelace/cards/hui-button-card.ts  |   2 +-
 .../lovelace/cards/hui-calendar-card.ts       |  11 +-
 src/panels/lovelace/cards/hui-card.ts         |  13 ++-
 src/panels/lovelace/cards/hui-entity-card.ts  |   2 +-
 src/panels/lovelace/cards/hui-error-card.ts   | 104 +++++++++++++-----
 src/panels/lovelace/cards/hui-gauge-card.ts   |   2 +-
 .../lovelace/cards/hui-humidifier-card.ts     |   2 +-
 src/panels/lovelace/cards/hui-light-card.ts   |   2 +-
 src/panels/lovelace/cards/hui-logbook-card.ts |   2 +-
 .../lovelace/cards/hui-media-control-card.ts  |   2 +-
 src/panels/lovelace/cards/hui-picture-card.ts |   2 +-
 .../lovelace/cards/hui-picture-entity-card.ts |   2 +-
 .../lovelace/cards/hui-plant-status-card.ts   |   2 +-
 .../lovelace/cards/hui-thermostat-card.ts     |   2 +-
 src/panels/lovelace/cards/hui-tile-card.ts    |  19 +---
 .../lovelace/cards/hui-todo-list-card.ts      |   2 +-
 .../cards/hui-weather-forecast-card.ts        |   2 +-
 src/panels/lovelace/cards/types.ts            |   5 +-
 .../components/hui-generic-entity-row.ts      |   2 +-
 src/panels/lovelace/components/hui-warning.ts |  16 ++-
 .../create-element/create-element-base.ts     |  20 ++--
 .../entity-rows/hui-button-entity-row.ts      |   2 +-
 .../entity-rows/hui-climate-entity-row.ts     |   2 +-
 .../entity-rows/hui-cover-entity-row.ts       |   2 +-
 .../entity-rows/hui-date-entity-row.ts        |   2 +-
 .../entity-rows/hui-datetime-entity-row.ts    |   2 +-
 .../entity-rows/hui-event-entity-row.ts       |   2 +-
 .../entity-rows/hui-group-entity-row.ts       |   2 +-
 .../entity-rows/hui-humidifier-entity-row.ts  |   2 +-
 .../hui-input-button-entity-row.ts            |   2 +-
 .../hui-input-datetime-entity-row.ts          |   2 +-
 .../hui-input-number-entity-row.ts            |   2 +-
 .../hui-input-select-entity-row.ts            |   2 +-
 .../entity-rows/hui-input-text-entity-row.ts  |   2 +-
 .../entity-rows/hui-lock-entity-row.ts        |   2 +-
 .../hui-media-player-entity-row.ts            |   2 +-
 .../entity-rows/hui-number-entity-row.ts      |   2 +-
 .../entity-rows/hui-scene-entity-row.ts       |   2 +-
 .../entity-rows/hui-script-entity-row.ts      |   2 +-
 .../entity-rows/hui-select-entity-row.ts      |   2 +-
 .../entity-rows/hui-sensor-entity-row.ts      |   2 +-
 .../entity-rows/hui-simple-entity-row.ts      |   2 +-
 .../entity-rows/hui-text-entity-row.ts        |   2 +-
 .../entity-rows/hui-time-entity-row.ts        |   2 +-
 .../entity-rows/hui-timer-entity-row.ts       |   2 +-
 .../entity-rows/hui-toggle-entity-row.ts      |   2 +-
 .../entity-rows/hui-update-entity-row.ts      |   2 +-
 .../entity-rows/hui-valve-entity-row.ts       |   2 +-
 .../entity-rows/hui-weather-entity-row.ts     |   2 +-
 .../special-rows/hui-attribute-row.ts         |   2 +-
 src/panels/lovelace/views/hui-panel-view.ts   |   2 +-
 src/translations/en.json                      |  10 +-
 56 files changed, 170 insertions(+), 139 deletions(-)

diff --git a/src/panels/calendar/ha-full-calendar.ts b/src/panels/calendar/ha-full-calendar.ts
index 4d9973f86b..410aa4bdfd 100644
--- a/src/panels/calendar/ha-full-calendar.ts
+++ b/src/panels/calendar/ha-full-calendar.ts
@@ -41,6 +41,7 @@ import type {
 } from "../../types";
 import { showCalendarEventDetailDialog } from "./show-dialog-calendar-event-detail";
 import { showCalendarEventEditDialog } from "./show-dialog-calendar-event-editor";
+import "../lovelace/components/hui-warning";
 
 declare global {
   interface HTMLElementTagNameMap {
@@ -126,11 +127,8 @@ export class HAFullCalendar extends LitElement {
       ${this.calendar
         ? html`
             ${this.error
-              ? html`<ha-alert
-                  alert-type="error"
-                  dismissable
-                  @alert-dismissed-clicked=${this._clearError}
-                  >${this.error}</ha-alert
+              ? html`<hui-warning .hass=${this.hass} severity="warning"
+                  >${this.error}</hui-warning
                 >`
               : ""}
             <div class="header">
@@ -420,10 +418,6 @@ export class HAFullCalendar extends LitElement {
     );
   });
 
-  private _clearError() {
-    this.error = undefined;
-  }
-
   static get styles(): CSSResultGroup {
     return [
       haStyle,
@@ -510,11 +504,6 @@ export class HAFullCalendar extends LitElement {
           z-index: 1;
         }
 
-        ha-alert {
-          display: block;
-          margin: 4px 0;
-        }
-
         #calendar {
           flex-grow: 1;
           background-color: var(
diff --git a/src/panels/lovelace/cards/energy/hui-energy-carbon-consumed-gauge-card.ts b/src/panels/lovelace/cards/energy/hui-energy-carbon-consumed-gauge-card.ts
index f7a22b9ae2..a3aa11576d 100644
--- a/src/panels/lovelace/cards/energy/hui-energy-carbon-consumed-gauge-card.ts
+++ b/src/panels/lovelace/cards/energy/hui-energy-carbon-consumed-gauge-card.ts
@@ -86,7 +86,7 @@ class HuiEnergyCarbonGaugeCard
     const co2State = this.hass.states[this._data.co2SignalEntity];
 
     if (!co2State) {
-      return html`<hui-warning>
+      return html`<hui-warning .hass=${this.hass}>
         ${createEntityNotFoundWarning(this.hass, this._data.co2SignalEntity)}
       </hui-warning>`;
     }
diff --git a/src/panels/lovelace/cards/hui-alarm-panel-card.ts b/src/panels/lovelace/cards/hui-alarm-panel-card.ts
index 01b980aebc..0a6cd85976 100644
--- a/src/panels/lovelace/cards/hui-alarm-panel-card.ts
+++ b/src/panels/lovelace/cards/hui-alarm-panel-card.ts
@@ -220,7 +220,7 @@ class HuiAlarmPanelCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-area-card.ts b/src/panels/lovelace/cards/hui-area-card.ts
index fc06ebd0ac..44c60b6fce 100644
--- a/src/panels/lovelace/cards/hui-area-card.ts
+++ b/src/panels/lovelace/cards/hui-area-card.ts
@@ -363,7 +363,7 @@ export class HuiAreaCard
 
     if (area === null) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${this.hass.localize("ui.card.area.area_not_found")}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-button-card.ts b/src/panels/lovelace/cards/hui-button-card.ts
index 9b6dfcc812..f6cc9b0bcd 100644
--- a/src/panels/lovelace/cards/hui-button-card.ts
+++ b/src/panels/lovelace/cards/hui-button-card.ts
@@ -179,7 +179,7 @@ export class HuiButtonCard extends LitElement implements LovelaceCard {
 
     if (this._config.entity && !stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-calendar-card.ts b/src/panels/lovelace/cards/hui-calendar-card.ts
index b549c05596..3ccadf743d 100644
--- a/src/panels/lovelace/cards/hui-calendar-card.ts
+++ b/src/panels/lovelace/cards/hui-calendar-card.ts
@@ -4,7 +4,6 @@ import { customElement, property, state } from "lit/decorators";
 import { getColorByIndex } from "../../../common/color/colors";
 import { applyThemesOnElement } from "../../../common/dom/apply_themes_on_element";
 import type { HASSDomEvent } from "../../../common/dom/fire_event";
-import { computeStateName } from "../../../common/entity/compute_state_name";
 import { debounce } from "../../../common/util/debounce";
 import "../../../components/ha-card";
 import type { Calendar, CalendarEvent } from "../../../data/calendar";
@@ -176,17 +175,9 @@ export class HuiCalendarCard extends LitElement implements LovelaceCard {
     this._events = result.events;
 
     if (result.errors.length > 0) {
-      const nameList = result.errors
-        .map((error_entity_id) =>
-          this.hass!.states[error_entity_id]
-            ? computeStateName(this.hass!.states[error_entity_id])
-            : error_entity_id
-        )
-        .join(", ");
-
       this._error = `${this.hass!.localize(
         "ui.components.calendar.event_retrieval_error"
-      )} ${nameList}`;
+      )}`;
     }
   }
 
diff --git a/src/panels/lovelace/cards/hui-card.ts b/src/panels/lovelace/cards/hui-card.ts
index 9f6ec0b9c7..dd3bcbeb30 100644
--- a/src/panels/lovelace/cards/hui-card.ts
+++ b/src/panels/lovelace/cards/hui-card.ts
@@ -13,7 +13,6 @@ import {
   checkConditionsMet,
 } from "../common/validate-condition";
 import { createCardElement } from "../create-element/create-card-element";
-import { createErrorCardConfig } from "../create-element/create-element-base";
 import type { LovelaceCard, LovelaceGridOptions } from "../types";
 
 declare global {
@@ -191,7 +190,9 @@ export class HuiCard extends ReactiveElement {
             this._element.hass = this.hass;
           }
         } catch (e: any) {
-          this._loadElement(createErrorCardConfig(e.message, null));
+          // eslint-disable-next-line no-console
+          console.error(this.config?.type, e);
+          this._loadElement({ type: "error" });
         }
       }
       if (changedProps.has("preview")) {
@@ -200,7 +201,9 @@ export class HuiCard extends ReactiveElement {
           // For backwards compatibility
           (this._element as any).editMode = this.preview;
         } catch (e: any) {
-          this._loadElement(createErrorCardConfig(e.message, null));
+          // eslint-disable-next-line no-console
+          console.error(this.config?.type, e);
+          this._loadElement({ type: "error" });
         }
       }
       if (changedProps.has("layout")) {
@@ -209,7 +212,9 @@ export class HuiCard extends ReactiveElement {
           // For backwards compatibility
           (this._element as any).isPanel = this.layout === "panel";
         } catch (e: any) {
-          this._loadElement(createErrorCardConfig(e.message, null));
+          // eslint-disable-next-line no-console
+          console.error(this.config?.type, e);
+          this._loadElement({ type: "error" });
         }
       }
     }
diff --git a/src/panels/lovelace/cards/hui-entity-card.ts b/src/panels/lovelace/cards/hui-entity-card.ts
index 826520a080..ae51480f36 100644
--- a/src/panels/lovelace/cards/hui-entity-card.ts
+++ b/src/panels/lovelace/cards/hui-entity-card.ts
@@ -114,7 +114,7 @@ export class HuiEntityCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-error-card.ts b/src/panels/lovelace/cards/hui-error-card.ts
index d2b0ae05b8..837f78e367 100644
--- a/src/panels/lovelace/cards/hui-error-card.ts
+++ b/src/panels/lovelace/cards/hui-error-card.ts
@@ -1,52 +1,106 @@
-import { dump } from "js-yaml";
 import { css, html, LitElement, nothing } from "lit";
 import { customElement, property, state } from "lit/decorators";
-import "../../../components/ha-alert";
+import { mdiAlertCircleOutline, mdiAlertOutline } from "@mdi/js";
 import type { HomeAssistant } from "../../../types";
-import type { LovelaceCard } from "../types";
+import type { LovelaceCard, LovelaceGridOptions } from "../types";
 import type { ErrorCardConfig } from "./types";
+import "../../../components/ha-card";
+import "../../../components/ha-svg-icon";
+
+const ERROR_ICONS = {
+  warning: mdiAlertOutline,
+  error: mdiAlertCircleOutline,
+};
 
 @customElement("hui-error-card")
 export class HuiErrorCard extends LitElement implements LovelaceCard {
-  public hass?: HomeAssistant;
+  @property({ attribute: false }) public hass?: HomeAssistant;
 
   @property({ attribute: false }) public preview = false;
 
+  @property({ attribute: "severity" }) public severity: "warning" | "error" =
+    "error";
+
   @state() private _config?: ErrorCardConfig;
 
   public getCardSize(): number {
-    return 4;
+    return 1;
+  }
+
+  public getGridOptions(): LovelaceGridOptions {
+    return {
+      columns: 6,
+      rows: 1,
+      min_rows: 1,
+      min_columns: 6,
+    };
   }
 
   public setConfig(config: ErrorCardConfig): void {
     this._config = config;
+    this.severity = config.severity || "error";
   }
 
   protected render() {
-    if (!this._config) {
-      return nothing;
-    }
+    const error =
+      this._config?.error ||
+      this.hass?.localize("ui.errors.config.configuration_error");
+    const showTitle = this.hass === undefined || this.hass?.user?.is_admin;
 
-    let dumped: string | undefined;
-
-    if (this._config.origConfig) {
-      try {
-        dumped = dump(this._config.origConfig);
-      } catch (_err: any) {
-        dumped = `[Error dumping ${this._config.origConfig}]`;
-      }
-    }
-
-    return html`<ha-alert alert-type="error" .title=${this._config.error}>
-      ${dumped ? html`<pre>${dumped}</pre>` : ""}
-    </ha-alert>`;
+    return html`
+      <ha-card class="${this.severity} ${showTitle ? "" : "no-title"}">
+        <div class="icon">
+          <slot name="icon">
+            <ha-svg-icon .path=${ERROR_ICONS[this.severity]}></ha-svg-icon>
+          </slot>
+        </div>
+        ${showTitle
+          ? html`<div class="title"><slot>${error}</slot></div>`
+          : nothing}
+      </ha-card>
+    `;
   }
 
   static styles = css`
-    pre {
-      font-family: var(--ha-font-family-code);
-      white-space: break-spaces;
-      user-select: text;
+    ha-card {
+      height: 100%;
+      border-width: 0;
+      display: flex;
+      align-items: center;
+      column-gap: 16px;
+      padding: 16px;
+    }
+    ha-card::after {
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      opacity: 0.12;
+      pointer-events: none;
+      content: "";
+      border-radius: var(--ha-card-border-radius, 12px);
+    }
+    .no-title {
+      justify-content: center;
+    }
+    .title {
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      font-weight: var(--ha-font-weight-bold);
+    }
+    ha-card.warning > .icon {
+      color: var(--warning-color);
+    }
+    ha-card.warning::after {
+      background-color: var(--warning-color);
+    }
+    ha-card.error > .icon {
+      color: var(--error-color);
+    }
+    ha-card.error::after {
+      background-color: var(--error-color);
     }
   `;
 }
diff --git a/src/panels/lovelace/cards/hui-gauge-card.ts b/src/panels/lovelace/cards/hui-gauge-card.ts
index acaf2519b2..bd21942d1d 100644
--- a/src/panels/lovelace/cards/hui-gauge-card.ts
+++ b/src/panels/lovelace/cards/hui-gauge-card.ts
@@ -90,7 +90,7 @@ class HuiGaugeCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-humidifier-card.ts b/src/panels/lovelace/cards/hui-humidifier-card.ts
index 39df5b5e8d..5ed6ad3e3a 100644
--- a/src/panels/lovelace/cards/hui-humidifier-card.ts
+++ b/src/panels/lovelace/cards/hui-humidifier-card.ts
@@ -121,7 +121,7 @@ export class HuiHumidifierCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-light-card.ts b/src/panels/lovelace/cards/hui-light-card.ts
index 6e9bae3b06..263d92faaf 100644
--- a/src/panels/lovelace/cards/hui-light-card.ts
+++ b/src/panels/lovelace/cards/hui-light-card.ts
@@ -82,7 +82,7 @@ export class HuiLightCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-logbook-card.ts b/src/panels/lovelace/cards/hui-logbook-card.ts
index 12ee971d1f..65d5adb6a2 100644
--- a/src/panels/lovelace/cards/hui-logbook-card.ts
+++ b/src/panels/lovelace/cards/hui-logbook-card.ts
@@ -174,7 +174,7 @@ export class HuiLogbookCard extends LitElement implements LovelaceCard {
 
     if (!isComponentLoaded(this.hass, "logbook")) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${this.hass.localize("ui.components.logbook.not_loaded", {
             platform: "logbook",
           })}</hui-warning
diff --git a/src/panels/lovelace/cards/hui-media-control-card.ts b/src/panels/lovelace/cards/hui-media-control-card.ts
index 7b3c3df6c7..4d0128ace5 100644
--- a/src/panels/lovelace/cards/hui-media-control-card.ts
+++ b/src/panels/lovelace/cards/hui-media-control-card.ts
@@ -145,7 +145,7 @@ export class HuiMediaControlCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-picture-card.ts b/src/panels/lovelace/cards/hui-picture-card.ts
index 8bc3afb40a..ffcb51f84e 100644
--- a/src/panels/lovelace/cards/hui-picture-card.ts
+++ b/src/panels/lovelace/cards/hui-picture-card.ts
@@ -100,7 +100,7 @@ export class HuiPictureCard extends LitElement implements LovelaceCard {
     if (this._config.image_entity) {
       stateObj = this.hass.states[this._config.image_entity];
       if (!stateObj) {
-        return html`<hui-warning>
+        return html`<hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.image_entity)}
         </hui-warning>`;
       }
diff --git a/src/panels/lovelace/cards/hui-picture-entity-card.ts b/src/panels/lovelace/cards/hui-picture-entity-card.ts
index fb7abab346..6960b4def4 100644
--- a/src/panels/lovelace/cards/hui-picture-entity-card.ts
+++ b/src/panels/lovelace/cards/hui-picture-entity-card.ts
@@ -119,7 +119,7 @@ class HuiPictureEntityCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-plant-status-card.ts b/src/panels/lovelace/cards/hui-plant-status-card.ts
index e9f5fa7abf..5c52a6c839 100644
--- a/src/panels/lovelace/cards/hui-plant-status-card.ts
+++ b/src/panels/lovelace/cards/hui-plant-status-card.ts
@@ -104,7 +104,7 @@ class HuiPlantStatusCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-thermostat-card.ts b/src/panels/lovelace/cards/hui-thermostat-card.ts
index 8bd478e90e..3e6853e405 100644
--- a/src/panels/lovelace/cards/hui-thermostat-card.ts
+++ b/src/panels/lovelace/cards/hui-thermostat-card.ts
@@ -113,7 +113,7 @@ export class HuiThermostatCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-tile-card.ts b/src/panels/lovelace/cards/hui-tile-card.ts
index ee294c8227..d0c48dc8b4 100644
--- a/src/panels/lovelace/cards/hui-tile-card.ts
+++ b/src/panels/lovelace/cards/hui-tile-card.ts
@@ -1,4 +1,3 @@
-import { mdiExclamationThick, mdiHelp } from "@mdi/js";
 import type { HassEntity } from "home-assistant-js-websocket";
 import { LitElement, css, html, nothing } from "lit";
 import { customElement, property, state } from "lit/decorators";
@@ -37,6 +36,7 @@ import type {
 } from "../types";
 import { renderTileBadge } from "./tile/badges/tile-badge";
 import type { TileCardConfig } from "./types";
+import { createEntityNotFoundWarning } from "../components/hui-warning";
 
 export const getEntityDefaultTileIconAction = (entityId: string) => {
   const domain = computeDomain(entityId);
@@ -249,20 +249,9 @@ export class HuiTileCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <ha-card>
-          <div class="content ${classMap(contentClasses)}">
-            <ha-tile-icon>
-              <ha-svg-icon slot="icon" .path=${mdiHelp}></ha-svg-icon>
-              <ha-tile-badge class="not-found">
-                <ha-svg-icon .path=${mdiExclamationThick}></ha-svg-icon>
-              </ha-tile-badge>
-            </ha-tile-icon>
-            <ha-tile-info
-              .primary=${entityId}
-              secondary=${this.hass.localize("ui.card.tile.not_found")}
-            ></ha-tile-info>
-          </div>
-        </ha-card>
+        <hui-warning .hass=${this.hass}>
+          ${createEntityNotFoundWarning(this.hass, this._config.entity)}
+        </hui-warning>
       `;
     }
 
diff --git a/src/panels/lovelace/cards/hui-todo-list-card.ts b/src/panels/lovelace/cards/hui-todo-list-card.ts
index c483c7c5e1..0815821847 100644
--- a/src/panels/lovelace/cards/hui-todo-list-card.ts
+++ b/src/panels/lovelace/cards/hui-todo-list-card.ts
@@ -241,7 +241,7 @@ export class HuiTodoListCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._entityId)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/hui-weather-forecast-card.ts b/src/panels/lovelace/cards/hui-weather-forecast-card.ts
index 4400c0539c..4b9d49c809 100644
--- a/src/panels/lovelace/cards/hui-weather-forecast-card.ts
+++ b/src/panels/lovelace/cards/hui-weather-forecast-card.ts
@@ -210,7 +210,7 @@ class HuiWeatherForecastCard extends LitElement implements LovelaceCard {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/cards/types.ts b/src/panels/lovelace/cards/types.ts
index 8e7dffe417..39e7ca7d55 100644
--- a/src/panels/lovelace/cards/types.ts
+++ b/src/panels/lovelace/cards/types.ts
@@ -215,8 +215,9 @@ export interface EntityFilterCardConfig extends LovelaceCardConfig {
 }
 
 export interface ErrorCardConfig extends LovelaceCardConfig {
-  error: string;
-  origConfig: LovelaceCardConfig;
+  error?: string;
+  origConfig?: LovelaceCardConfig;
+  severity?: "warning" | "error";
 }
 
 export interface SeverityConfig {
diff --git a/src/panels/lovelace/components/hui-generic-entity-row.ts b/src/panels/lovelace/components/hui-generic-entity-row.ts
index 26c51b773b..1e762dea67 100644
--- a/src/panels/lovelace/components/hui-generic-entity-row.ts
+++ b/src/panels/lovelace/components/hui-generic-entity-row.ts
@@ -46,7 +46,7 @@ export class HuiGenericEntityRow extends LitElement {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this.config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/components/hui-warning.ts b/src/panels/lovelace/components/hui-warning.ts
index 3d464a0e6d..2f4cd498ad 100644
--- a/src/panels/lovelace/components/hui-warning.ts
+++ b/src/panels/lovelace/components/hui-warning.ts
@@ -1,24 +1,28 @@
 import { STATE_NOT_RUNNING } from "home-assistant-js-websocket";
 import type { TemplateResult } from "lit";
 import { html, LitElement } from "lit";
-import { customElement } from "lit/decorators";
+import { customElement, property } from "lit/decorators";
 import "../../../components/ha-alert";
 import type { HomeAssistant } from "../../../types";
+import "../cards/hui-error-card";
 
 export const createEntityNotFoundWarning = (
   hass: HomeAssistant,
-  entityId: string
+  // left for backwards compatibility for custom cards
+  _entityId: string
 ) =>
   hass.config.state !== STATE_NOT_RUNNING
-    ? hass.localize("ui.panel.lovelace.warning.entity_not_found", {
-        entity: entityId || "[empty]",
-      })
+    ? hass.localize("ui.card.common.entity_not_found")
     : hass.localize("ui.panel.lovelace.warning.starting");
 
 @customElement("hui-warning")
 export class HuiWarning extends LitElement {
+  @property({ attribute: false }) public hass?: HomeAssistant;
+
   protected render(): TemplateResult {
-    return html`<ha-alert alert-type="warning"><slot></slot></ha-alert> `;
+    return html`<hui-error-card .hass=${this.hass} severity="warning"
+      ><slot></slot
+    ></hui-error-card>`;
   }
 }
 
diff --git a/src/panels/lovelace/create-element/create-element-base.ts b/src/panels/lovelace/create-element/create-element-base.ts
index d509c18a85..07c73fffe6 100644
--- a/src/panels/lovelace/create-element/create-element-base.ts
+++ b/src/panels/lovelace/create-element/create-element-base.ts
@@ -16,7 +16,10 @@ import type { ErrorCardConfig } from "../cards/types";
 import type { LovelaceElement, LovelaceElementConfig } from "../elements/types";
 import type { LovelaceRow, LovelaceRowConfig } from "../entity-rows/types";
 import type { LovelaceHeaderFooterConfig } from "../header-footer/types";
-import type { LovelaceHeadingBadgeConfig } from "../heading-badges/types";
+import type {
+  ErrorBadgeConfig as ErrorHeadingBadgeConfig,
+  LovelaceHeadingBadgeConfig,
+} from "../heading-badges/types";
 import type {
   LovelaceBadge,
   LovelaceBadgeConstructor,
@@ -31,6 +34,7 @@ import type {
   LovelaceHeadingBadgeConstructor,
   LovelaceRowConstructor,
 } from "../types";
+import type { ErrorBadgeConfig } from "../badges/types";
 
 const TIMEOUT = 2000;
 
@@ -96,7 +100,7 @@ export const createErrorCardElement = (config: ErrorCardConfig) => {
   return el;
 };
 
-export const createErrorBadgeElement = (config: ErrorCardConfig) => {
+export const createErrorBadgeElement = (config: ErrorBadgeConfig) => {
   const el = document.createElement("hui-error-badge");
   if (customElements.get("hui-error-badge")) {
     el.setConfig(config);
@@ -110,7 +114,9 @@ export const createErrorBadgeElement = (config: ErrorCardConfig) => {
   return el;
 };
 
-export const createErrorHeadingBadgeElement = (config: ErrorCardConfig) => {
+export const createErrorHeadingBadgeElement = (
+  config: ErrorHeadingBadgeConfig
+) => {
   const el = document.createElement("hui-error-heading-badge");
   if (customElements.get("hui-error-heading-badge")) {
     el.setConfig(config);
@@ -124,12 +130,6 @@ export const createErrorHeadingBadgeElement = (config: ErrorCardConfig) => {
   return el;
 };
 
-export const createErrorCardConfig = (error, origConfig) => ({
-  type: "error",
-  error,
-  origConfig,
-});
-
 export const createErrorBadgeConfig = (error, origConfig) => ({
   type: "error",
   error,
@@ -167,7 +167,7 @@ const _createErrorElement = <T extends keyof CreateElementConfigTypes>(
       createErrorHeadingBadgeConfig(error, config)
     );
   }
-  return createErrorCardElement(createErrorCardConfig(error, config));
+  return createErrorCardElement({ type: "error" });
 };
 
 const _customCreate = <T extends keyof CreateElementConfigTypes>(
diff --git a/src/panels/lovelace/entity-rows/hui-button-entity-row.ts b/src/panels/lovelace/entity-rows/hui-button-entity-row.ts
index e41c4de02d..d79edc4abd 100644
--- a/src/panels/lovelace/entity-rows/hui-button-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-button-entity-row.ts
@@ -36,7 +36,7 @@ class HuiButtonEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-climate-entity-row.ts b/src/panels/lovelace/entity-rows/hui-climate-entity-row.ts
index 82b1a3a25f..dd655b2633 100644
--- a/src/panels/lovelace/entity-rows/hui-climate-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-climate-entity-row.ts
@@ -35,7 +35,7 @@ class HuiClimateEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-cover-entity-row.ts b/src/panels/lovelace/entity-rows/hui-cover-entity-row.ts
index 7658be502e..ba6a598e4c 100644
--- a/src/panels/lovelace/entity-rows/hui-cover-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-cover-entity-row.ts
@@ -37,7 +37,7 @@ class HuiCoverEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-date-entity-row.ts b/src/panels/lovelace/entity-rows/hui-date-entity-row.ts
index 473d06bbb9..6f964fb320 100644
--- a/src/panels/lovelace/entity-rows/hui-date-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-date-entity-row.ts
@@ -36,7 +36,7 @@ class HuiDateEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts b/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts
index f2de95979a..20581cd63e 100644
--- a/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts
@@ -39,7 +39,7 @@ class HuiInputDatetimeEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-event-entity-row.ts b/src/panels/lovelace/entity-rows/hui-event-entity-row.ts
index 8e73f757cf..370ebda972 100644
--- a/src/panels/lovelace/entity-rows/hui-event-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-event-entity-row.ts
@@ -45,7 +45,7 @@ class HuiEventEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-group-entity-row.ts b/src/panels/lovelace/entity-rows/hui-group-entity-row.ts
index a51bcc8d93..091d0aa62e 100644
--- a/src/panels/lovelace/entity-rows/hui-group-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-group-entity-row.ts
@@ -49,7 +49,7 @@ class HuiGroupEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-humidifier-entity-row.ts b/src/panels/lovelace/entity-rows/hui-humidifier-entity-row.ts
index b8c14a8d64..551ef6bd1b 100644
--- a/src/panels/lovelace/entity-rows/hui-humidifier-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-humidifier-entity-row.ts
@@ -37,7 +37,7 @@ class HuiHumidifierEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-input-button-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-button-entity-row.ts
index d869d98abd..f7bb6b01ff 100644
--- a/src/panels/lovelace/entity-rows/hui-input-button-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-input-button-entity-row.ts
@@ -36,7 +36,7 @@ class HuiInputButtonEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-input-datetime-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-datetime-entity-row.ts
index 623f07a7b0..b234f79cab 100644
--- a/src/panels/lovelace/entity-rows/hui-input-datetime-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-input-datetime-entity-row.ts
@@ -41,7 +41,7 @@ class HuiInputDatetimeEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-input-number-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-number-entity-row.ts
index 2508d5efd9..ca093dd208 100644
--- a/src/panels/lovelace/entity-rows/hui-input-number-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-input-number-entity-row.ts
@@ -65,7 +65,7 @@ class HuiInputNumberEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts
index 99fa0a443d..30d0f1c0ae 100644
--- a/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts
@@ -45,7 +45,7 @@ class HuiInputSelectEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts
index 73f00a7a11..a490abac23 100644
--- a/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts
@@ -37,7 +37,7 @@ class HuiInputTextEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-lock-entity-row.ts b/src/panels/lovelace/entity-rows/hui-lock-entity-row.ts
index 6832139051..ab15001ea4 100644
--- a/src/panels/lovelace/entity-rows/hui-lock-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-lock-entity-row.ts
@@ -37,7 +37,7 @@ class HuiLockEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-media-player-entity-row.ts b/src/panels/lovelace/entity-rows/hui-media-player-entity-row.ts
index b08504c470..8a2b2c3835 100644
--- a/src/panels/lovelace/entity-rows/hui-media-player-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-media-player-entity-row.ts
@@ -92,7 +92,7 @@ class HuiMediaPlayerEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-number-entity-row.ts b/src/panels/lovelace/entity-rows/hui-number-entity-row.ts
index 311f4493f7..3b95ef8c9e 100644
--- a/src/panels/lovelace/entity-rows/hui-number-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-number-entity-row.ts
@@ -65,7 +65,7 @@ class HuiNumberEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-scene-entity-row.ts b/src/panels/lovelace/entity-rows/hui-scene-entity-row.ts
index 55b8e62b86..15c25fd7df 100644
--- a/src/panels/lovelace/entity-rows/hui-scene-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-scene-entity-row.ts
@@ -38,7 +38,7 @@ class HuiSceneEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-script-entity-row.ts b/src/panels/lovelace/entity-rows/hui-script-entity-row.ts
index bbf1fba097..1a965fa44a 100644
--- a/src/panels/lovelace/entity-rows/hui-script-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-script-entity-row.ts
@@ -39,7 +39,7 @@ class HuiScriptEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-select-entity-row.ts b/src/panels/lovelace/entity-rows/hui-select-entity-row.ts
index fa7fb03ca2..53a6eb3a55 100644
--- a/src/panels/lovelace/entity-rows/hui-select-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-select-entity-row.ts
@@ -45,7 +45,7 @@ class HuiSelectEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-sensor-entity-row.ts b/src/panels/lovelace/entity-rows/hui-sensor-entity-row.ts
index df47cd3690..8fb50ac831 100644
--- a/src/panels/lovelace/entity-rows/hui-sensor-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-sensor-entity-row.ts
@@ -42,7 +42,7 @@ class HuiSensorEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-simple-entity-row.ts b/src/panels/lovelace/entity-rows/hui-simple-entity-row.ts
index 00c8f2910e..2741a2519c 100644
--- a/src/panels/lovelace/entity-rows/hui-simple-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-simple-entity-row.ts
@@ -34,7 +34,7 @@ class HuiSimpleEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-text-entity-row.ts b/src/panels/lovelace/entity-rows/hui-text-entity-row.ts
index d593225ad3..e801543857 100644
--- a/src/panels/lovelace/entity-rows/hui-text-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-text-entity-row.ts
@@ -40,7 +40,7 @@ class HuiTextEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-time-entity-row.ts b/src/panels/lovelace/entity-rows/hui-time-entity-row.ts
index 6650b0a21e..b5050badf0 100644
--- a/src/panels/lovelace/entity-rows/hui-time-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-time-entity-row.ts
@@ -37,7 +37,7 @@ class HuiTimeEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-timer-entity-row.ts b/src/panels/lovelace/entity-rows/hui-timer-entity-row.ts
index 514ce69a9a..1f48a00fa4 100644
--- a/src/panels/lovelace/entity-rows/hui-timer-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-timer-entity-row.ts
@@ -30,7 +30,7 @@ class HuiTimerEntityRow extends LitElement {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-toggle-entity-row.ts b/src/panels/lovelace/entity-rows/hui-toggle-entity-row.ts
index 1df87198d4..63ccda2389 100644
--- a/src/panels/lovelace/entity-rows/hui-toggle-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-toggle-entity-row.ts
@@ -35,7 +35,7 @@ class HuiToggleEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-update-entity-row.ts b/src/panels/lovelace/entity-rows/hui-update-entity-row.ts
index 2ad19e2274..17eb6818d3 100644
--- a/src/panels/lovelace/entity-rows/hui-update-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-update-entity-row.ts
@@ -38,7 +38,7 @@ class HuiUpdateEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-valve-entity-row.ts b/src/panels/lovelace/entity-rows/hui-valve-entity-row.ts
index 69c0e42883..d291fa2090 100644
--- a/src/panels/lovelace/entity-rows/hui-valve-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-valve-entity-row.ts
@@ -35,7 +35,7 @@ class HuiValveEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/entity-rows/hui-weather-entity-row.ts b/src/panels/lovelace/entity-rows/hui-weather-entity-row.ts
index 856d9d6990..e8cdacd5d2 100644
--- a/src/panels/lovelace/entity-rows/hui-weather-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-weather-entity-row.ts
@@ -105,7 +105,7 @@ class HuiWeatherEntityRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/special-rows/hui-attribute-row.ts b/src/panels/lovelace/special-rows/hui-attribute-row.ts
index 6ad3e3d75a..77b4411271 100644
--- a/src/panels/lovelace/special-rows/hui-attribute-row.ts
+++ b/src/panels/lovelace/special-rows/hui-attribute-row.ts
@@ -42,7 +42,7 @@ class HuiAttributeRow extends LitElement implements LovelaceRow {
 
     if (!stateObj) {
       return html`
-        <hui-warning>
+        <hui-warning .hass=${this.hass}>
           ${createEntityNotFoundWarning(this.hass, this._config.entity)}
         </hui-warning>
       `;
diff --git a/src/panels/lovelace/views/hui-panel-view.ts b/src/panels/lovelace/views/hui-panel-view.ts
index 72ddb347d7..83715e9a95 100644
--- a/src/panels/lovelace/views/hui-panel-view.ts
+++ b/src/panels/lovelace/views/hui-panel-view.ts
@@ -63,7 +63,7 @@ export class PanelView extends LitElement implements LovelaceViewElement {
   protected render(): TemplateResult {
     return html`
       ${this.cards!.length > 1
-        ? html`<hui-warning>
+        ? html`<hui-warning .hass=${this.hass}>
             ${this.hass!.localize(
               "ui.panel.lovelace.editor.view.panel_mode.warning_multiple_cards"
             )}
diff --git a/src/translations/en.json b/src/translations/en.json
index 488c2f82a9..24ababb65d 100644
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -72,14 +72,15 @@
     },
     "badge": {
       "entity": {
-        "not_found": "[%key:ui::card::tile::not_found%]"
+        "not_found": "[%key:ui::card::common::entity_not_found%]"
       }
     },
     "card": {
       "common": {
         "turn_on": "Turn on",
         "turn_off": "Turn off",
-        "toggle": "Toggle"
+        "toggle": "Toggle",
+        "entity_not_found": "Entity not found"
       },
       "alarm_control_panel": {
         "code": "Code",
@@ -257,9 +258,6 @@
           "finish": "finish"
         }
       },
-      "tile": {
-        "not_found": "Entity not found"
-      },
       "vacuum": {
         "actions": {
           "resume_cleaning": "Resume cleaning",
@@ -1010,7 +1008,7 @@
         "my_calendars": "My calendars",
         "create_calendar": "Create calendar",
         "today": "Today",
-        "event_retrieval_error": "Could not retrieve events for calendars:",
+        "event_retrieval_error": "Could not retrieve events for calendars",
         "event": {
           "add": "Add event",
           "delete": "Delete event",