From f3f948a62fcf608e09fd3637c2ff141d87d4574e Mon Sep 17 00:00:00 2001
From: Jan-Philipp Benecke <jan-philipp@bnck.me>
Date: Tue, 14 Jan 2025 20:34:55 +0100
Subject: [PATCH] Add shortcut hint to assist dialog

---
 .../voice-command-dialog/ha-voice-command-dialog.ts  | 12 +++++++++++-
 .../show-ha-voice-command-dialog.ts                  |  2 ++
 src/panels/lovelace/hui-root.ts                      |  7 ++++++-
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/dialogs/voice-command-dialog/ha-voice-command-dialog.ts b/src/dialogs/voice-command-dialog/ha-voice-command-dialog.ts
index f6c4f0a18786..110bfef0b31c 100644
--- a/src/dialogs/voice-command-dialog/ha-voice-command-dialog.ts
+++ b/src/dialogs/voice-command-dialog/ha-voice-command-dialog.ts
@@ -29,6 +29,7 @@ import { haStyleDialog } from "../../resources/styles";
 import type { HomeAssistant } from "../../types";
 import { documentationUrl } from "../../util/documentation-url";
 import type { VoiceCommandDialogParams } from "./show-ha-voice-command-dialog";
+import "../../components/ha-tip";
 
 @customElement("ha-voice-command-dialog")
 export class HaVoiceCommandDialog extends LitElement {
@@ -51,6 +52,8 @@ export class HaVoiceCommandDialog extends LitElement {
 
   @state() private _errorLoadAssist?: "not_found" | "unknown";
 
+  @state() private _hint?: string;
+
   private _startListening = false;
 
   public async showDialog(
@@ -68,6 +71,7 @@ export class HaVoiceCommandDialog extends LitElement {
 
     this._startListening = params.start_listening;
     this._opened = true;
+    this._hint = params.hint;
   }
 
   public async closeDialog(): Promise<void> {
@@ -185,6 +189,9 @@ export class HaVoiceCommandDialog extends LitElement {
                   size="large"
                 ></ha-circular-progress>
               </div>`}
+        ${this._hint
+          ? html`<ha-tip .hass=${this.hass}>${this._hint}</ha-tip>`
+          : ""}
       </ha-dialog>
     `;
   }
@@ -247,7 +254,7 @@ export class HaVoiceCommandDialog extends LitElement {
       css`
         ha-dialog {
           --mdc-dialog-max-width: 500px;
-          --mdc-dialog-max-height: 500px;
+          --mdc-dialog-max-height: 550px;
           --dialog-content-padding: 0;
         }
         ha-dialog-header a {
@@ -308,6 +315,9 @@ export class HaVoiceCommandDialog extends LitElement {
           display: flex;
           justify-content: center;
         }
+        ha-tip {
+          padding-bottom: 14px;
+        }
       `,
     ];
   }
diff --git a/src/dialogs/voice-command-dialog/show-ha-voice-command-dialog.ts b/src/dialogs/voice-command-dialog/show-ha-voice-command-dialog.ts
index 2ac41a5d9a73..e027839d7ef9 100644
--- a/src/dialogs/voice-command-dialog/show-ha-voice-command-dialog.ts
+++ b/src/dialogs/voice-command-dialog/show-ha-voice-command-dialog.ts
@@ -6,6 +6,7 @@ const loadVoiceCommandDialog = () => import("./ha-voice-command-dialog");
 export interface VoiceCommandDialogParams {
   pipeline_id: "last_used" | "preferred" | string;
   start_listening?: boolean;
+  hint?: string;
 }
 
 export const showVoiceCommandDialog = (
@@ -31,6 +32,7 @@ export const showVoiceCommandDialog = (
       pipeline_id: dialogParams.pipeline_id,
       // Don't start listening by default for web
       start_listening: dialogParams.start_listening ?? false,
+      hint: dialogParams.hint,
     },
   });
 };
diff --git a/src/panels/lovelace/hui-root.ts b/src/panels/lovelace/hui-root.ts
index 8a56f7a9cfe3..eb621a9648fb 100644
--- a/src/panels/lovelace/hui-root.ts
+++ b/src/panels/lovelace/hui-root.ts
@@ -730,7 +730,12 @@ class HUIRoot extends LitElement {
   }
 
   private _showVoiceCommandDialog(): void {
-    showVoiceCommandDialog(this, this.hass, { pipeline_id: "last_used" });
+    showVoiceCommandDialog(this, this.hass, {
+      pipeline_id: "last_used",
+      hint: this.hass.enableShortcuts
+        ? this.hass.localize("ui.tips.key_a_hint")
+        : undefined,
+    });
   }
 
   private _handleEnableEditMode(ev: CustomEvent<RequestSelectedDetail>): void {