Move automation help icons from sections to dialogs (#29584)

Co-authored-by: Claude Sonnet 4.5 (1M context) <noreply@anthropic.com>
Co-authored-by: Wendelin <w@pe8.at>

src/panels/config/automation/add-automation-element-dialog.ts

@@ -4,6 +4,7 @@ import {
   mdiAppleKeyboardCommand,
   mdiClose,
   mdiContentPaste,
+  mdiHelpCircle,
   mdiPlus,
 } from "@mdi/js";
 import type {
@@ -115,6 +116,7 @@ import {
 import type { HassDialog } from "../../../dialogs/make-dialog-manager";
 import { KeyboardShortcutMixin } from "../../../mixins/keyboard-shortcut-mixin";
 import type { HomeAssistant, ValueChangedEvent } from "../../../types";
+import { documentationUrl } from "../../../util/documentation-url";
 import { isMac } from "../../../util/is_mac";
 import { showToast } from "../../../util/toast";
 import "./add-automation-element/ha-automation-add-from-target";
@@ -745,11 +747,30 @@ class DialogAddAutomationElement
   }
 
   private _renderHeader() {
+    const docUrl = this._getDocumentationUrl(this._params!.type);
+
     return html`
       <ha-dialog-header subtitle-position="above">
         <span slot="title">${this._getDialogTitle()}</span>
 
         ${this._renderDialogSubtitle()}
+        ${!this._narrow || (!this._selectedGroup && !this._selectedTarget)
+          ? html`
+              <a
+                slot="actionItems"
+                href=${docUrl}
+                target="_blank"
+                rel="noreferrer"
+              >
+                <ha-icon-button
+                  .path=${mdiHelpCircle}
+                  .label=${this.hass.localize(
+                    `ui.panel.config.automation.editor.${this._params!.type}s.learn_more`
+                  )}
+                ></ha-icon-button>
+              </a>
+            `
+          : nothing}
         ${this._narrow && (this._selectedGroup || this._selectedTarget)
           ? html`<ha-icon-button-prev
               slot="navigationIcon"
@@ -1720,6 +1741,18 @@ class DialogAddAutomationElement
     mainWindow.history.back();
   }
 
+  private _getDocumentationUrl = memoizeOne(
+    (type: "trigger" | "condition" | "action") =>
+      documentationUrl(
+        this.hass,
+        type === "trigger"
+          ? "/docs/automation/trigger/"
+          : type === "condition"
+            ? "/docs/automation/condition/"
+            : "/docs/automation/action/"
+      )
+  );
+
   private _groupSelected(ev) {
     const group = ev.currentTarget;
     if (this._selectedGroup === group.value) {
@@ -2067,6 +2100,10 @@ class DialogAddAutomationElement
           --ha-dialog-max-height: var(--ha-dialog-min-height);
         }
 
+        ha-wa-dialog a[slot="actionItems"] {
+          color: var(--secondary-text-color);
+        }
+
         search-input {
           display: block;
           margin: 0 var(--ha-space-4);

src/panels/config/automation/manual-automation-editor.ts

@@ -1,5 +1,5 @@
 import { ContextProvider } from "@lit/context";
-import { mdiContentSave, mdiHelpCircle } from "@mdi/js";
+import { mdiContentSave } from "@mdi/js";
 import type { HassEntity, UnsubscribeFunc } from "home-assistant-js-websocket";
 import { load } from "js-yaml";
 import type { CSSResultGroup, PropertyValues } from "lit";
@@ -55,7 +55,6 @@ import { configEntriesContext } from "../../../data/context";
 import { getActionType, type Action } from "../../../data/script";
 import { SubscribeMixin } from "../../../mixins/subscribe-mixin";
 import type { HomeAssistant, ValueChangedEvent } from "../../../types";
-import { documentationUrl } from "../../../util/documentation-url";
 import { showToast } from "../../../util/toast";
 import "./action/ha-automation-action";
 import type HaAutomationAction from "./action/ha-automation-action";
@@ -168,18 +167,6 @@ export class HaManualAutomationEditor extends SubscribeMixin(LitElement) {
             "ui.panel.config.automation.editor.triggers.header"
           )}
         </h2>
-        <a
-          href=${documentationUrl(this.hass, "/docs/automation/trigger/")}
-          target="_blank"
-          rel="noreferrer"
-        >
-          <ha-icon-button
-            .path=${mdiHelpCircle}
-            .label=${this.hass.localize(
-              "ui.panel.config.automation.editor.triggers.learn_more"
-            )}
-          ></ha-icon-button>
-        </a>
       </div>
       ${!ensureArray(this.config.triggers)?.length
         ? html`<p>
@@ -214,18 +201,6 @@ export class HaManualAutomationEditor extends SubscribeMixin(LitElement) {
             >(${this.hass.localize("ui.common.optional")})</span
           >
         </h2>
-        <a
-          href=${documentationUrl(this.hass, "/docs/automation/condition/")}
-          target="_blank"
-          rel="noreferrer"
-        >
-          <ha-icon-button
-            .path=${mdiHelpCircle}
-            .label=${this.hass.localize(
-              "ui.panel.config.automation.editor.conditions.learn_more"
-            )}
-          ></ha-icon-button>
-        </a>
       </div>
       ${!ensureArray(this.config.conditions)?.length
         ? html`<p>
@@ -258,20 +233,6 @@ export class HaManualAutomationEditor extends SubscribeMixin(LitElement) {
             "ui.panel.config.automation.editor.actions.header"
           )}
         </h2>
-        <div>
-          <a
-            href=${documentationUrl(this.hass, "/docs/automation/action/")}
-            target="_blank"
-            rel="noreferrer"
-          >
-            <ha-icon-button
-              .path=${mdiHelpCircle}
-              .label=${this.hass.localize(
-                "ui.panel.config.automation.editor.actions.learn_more"
-              )}
-            ></ha-icon-button>
-          </a>
-        </div>
       </div>
       ${!ensureArray(this.config.actions)?.length
         ? html`<p>