Preserve device elements in automation when device is missing (#22521)

* Preserve device elements in automation when device is missing

* lint

src/panels/config/automation/action/types/ha-automation-action-device_id.ts

@@ -1,5 +1,5 @@
 import { consume } from "@lit-labs/context";
-import { css, html, LitElement } from "lit";
+import { css, html, LitElement, PropertyValues } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import memoizeOne from "memoize-one";
 import { fireEvent } from "../../../../../common/dom/fire_event";
@@ -56,6 +56,28 @@ export class HaDeviceAction extends LitElement {
     }
   );
 
+  public shouldUpdate(changedProperties: PropertyValues) {
+    if (!changedProperties.has("action")) {
+      return true;
+    }
+    if (
+      this.action.device_id &&
+      !(this.action.device_id in this.hass.devices)
+    ) {
+      fireEvent(
+        this,
+        "ui-mode-not-available",
+        Error(
+          this.hass.localize(
+            "ui.panel.config.automation.editor.edit_unknown_device"
+          )
+        )
+      );
+      return false;
+    }
+    return true;
+  }
+
   protected render() {
     const deviceId = this._deviceId || this.action.device_id;
 

src/panels/config/automation/condition/types/ha-automation-condition-device.ts

@@ -1,5 +1,5 @@
 import { consume } from "@lit-labs/context";
-import { css, html, LitElement } from "lit";
+import { css, html, LitElement, PropertyValues } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import memoizeOne from "memoize-one";
 import { fireEvent } from "../../../../../common/dom/fire_event";
@@ -57,6 +57,28 @@ export class HaDeviceCondition extends LitElement {
     }
   );
 
+  public shouldUpdate(changedProperties: PropertyValues) {
+    if (!changedProperties.has("condition")) {
+      return true;
+    }
+    if (
+      this.condition.device_id &&
+      !(this.condition.device_id in this.hass.devices)
+    ) {
+      fireEvent(
+        this,
+        "ui-mode-not-available",
+        Error(
+          this.hass.localize(
+            "ui.panel.config.automation.editor.edit_unknown_device"
+          )
+        )
+      );
+      return false;
+    }
+    return true;
+  }
+
   protected render() {
     const deviceId = this._deviceId || this.condition.device_id;
 

src/panels/config/automation/trigger/types/ha-automation-trigger-device.ts

@@ -1,5 +1,5 @@
 import { consume } from "@lit-labs/context";
-import { css, html, LitElement } from "lit";
+import { css, html, LitElement, PropertyValues } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import memoizeOne from "memoize-one";
 import { fireEvent } from "../../../../../common/dom/fire_event";
@@ -61,6 +61,28 @@ export class HaDeviceTrigger extends LitElement {
     }
   );
 
+  public shouldUpdate(changedProperties: PropertyValues) {
+    if (!changedProperties.has("trigger")) {
+      return true;
+    }
+    if (
+      this.trigger.device_id &&
+      !(this.trigger.device_id in this.hass.devices)
+    ) {
+      fireEvent(
+        this,
+        "ui-mode-not-available",
+        Error(
+          this.hass.localize(
+            "ui.panel.config.automation.editor.edit_unknown_device"
+          )
+        )
+      );
+      return false;
+    }
+    return true;
+  }
+
   protected render() {
     const deviceId = this._deviceId || this.trigger.device_id;
 

src/translations/en.json

@@ -2864,6 +2864,7 @@
             "copy_to_clipboard": "Copy to clipboard",
             "search_in": "Search · {group}",
             "unknown_entity": "unknown entity",
+            "edit_unknown_device": "Editor not available for unknown device",
             "triggers": {
               "name": "Triggers",
               "header": "When",