Fix drag and drop when using action and trigger selector (#22291)

* Fix drag and drop when using action selector

* Fix drag and drop when using trigger selector

src/components/ha-selector/ha-selector-action.ts

@@ -4,7 +4,7 @@ import memoizeOne from "memoize-one";
 import { Action, migrateAutomationAction } from "../../data/script";
 import { ActionSelector } from "../../data/selector";
 import "../../panels/config/automation/action/ha-automation-action";
-import { HomeAssistant } from "../../types";
+import { HomeAssistant, ItemPath } from "../../types";
 
 @customElement("ha-selector-action")
 export class HaActionSelector extends LitElement {
@@ -18,19 +18,22 @@ export class HaActionSelector extends LitElement {
 
   @property({ type: Boolean, reflect: true }) public disabled = false;
 
-  private _actions = memoizeOne((action: Action | undefined) => {
-    if (!action) {
-      return [];
+  // Add path here to ignore memoize if the path changes
+  private _actions = memoizeOne(
+    (action: Action | undefined, _path?: ItemPath) => {
+      if (!action) {
+        return [];
+      }
+      return migrateAutomationAction(action);
     }
-    return migrateAutomationAction(action);
-  });
+  );
 
   protected render() {
     return html`
       ${this.label ? html`<label>${this.label}</label>` : nothing}
       <ha-automation-action
         .disabled=${this.disabled}
-        .actions=${this._actions(this.value)}
+        .actions=${this._actions(this.value, this.selector.action?.path)}
         .hass=${this.hass}
         .path=${this.selector.action?.path}
       ></ha-automation-action>

src/components/ha-selector/ha-selector-trigger.ts

@@ -4,7 +4,7 @@ import memoizeOne from "memoize-one";
 import { migrateAutomationTrigger, Trigger } from "../../data/automation";
 import { TriggerSelector } from "../../data/selector";
 import "../../panels/config/automation/trigger/ha-automation-trigger";
-import { HomeAssistant } from "../../types";
+import { HomeAssistant, ItemPath } from "../../types";
 
 @customElement("ha-selector-trigger")
 export class HaTriggerSelector extends LitElement {
@@ -18,19 +18,22 @@ export class HaTriggerSelector extends LitElement {
 
   @property({ type: Boolean, reflect: true }) public disabled = false;
 
-  private _triggers = memoizeOne((trigger: Trigger | undefined) => {
-    if (!trigger) {
-      return [];
+  // Add path here to ignore memoize if the path changes
+  private _triggers = memoizeOne(
+    (trigger: Trigger | undefined, _path?: ItemPath) => {
+      if (!trigger) {
+        return [];
+      }
+      return migrateAutomationTrigger(trigger);
     }
-    return migrateAutomationTrigger(trigger);
-  });
+  );
 
   protected render() {
     return html`
       ${this.label ? html`<label>${this.label}</label>` : nothing}
       <ha-automation-trigger
         .disabled=${this.disabled}
-        .triggers=${this._triggers(this.value)}
+        .triggers=${this._triggers(this.value, this.selector.trigger?.path)}
         .hass=${this.hass}
         .path=${this.selector.trigger?.path}
       ></ha-automation-trigger>