Add missing voice assistant select action logic (#22139)

src/dialogs/voice-assistant-setup/voice-assistant-setup-step-success.ts

@@ -14,6 +14,7 @@ import {
 import {
   assistSatelliteAnnounce,
   AssistSatelliteConfiguration,
+  setWakeWords,
 } from "../../data/assist_satellite";
 import { fetchCloudStatus } from "../../data/cloud";
 import { showVoiceAssistantPipelineDetailDialog } from "../../panels/config/voice-assistants/show-dialog-voice-assistant-pipeline-detail";
@@ -21,6 +22,8 @@ import "../../panels/lovelace/entity-rows/hui-select-entity-row";
 import { HomeAssistant } from "../../types";
 import { AssistantSetupStyles } from "./styles";
 import { STEP } from "./voice-assistant-setup-dialog";
+import { setSelectOption } from "../../data/select";
+import { InputSelectEntity } from "../../data/input_select";
 
 @customElement("ha-voice-assistant-setup-step-success")
 export class HaVoiceAssistantSetupStepSuccess extends LitElement {
@@ -58,7 +61,9 @@ export class HaVoiceAssistantSetupStepSuccess extends LitElement {
 
   protected override render() {
     const pipelineEntity = this.assistConfiguration
-      ? this.hass.states[this.assistConfiguration.pipeline_entity_id]
+      ? (this.hass.states[
+          this.assistConfiguration.pipeline_entity_id
+        ] as InputSelectEntity)
       : undefined;
 
     return html`<div class="content">
@@ -69,46 +74,53 @@ export class HaVoiceAssistantSetupStepSuccess extends LitElement {
           settings, you can change that below.
         </p>
         <div class="rows">
-          <div class="row">
+          ${this.assistConfiguration &&
-            <ha-select
+          this.assistConfiguration.available_wake_words.length > 1
-              .label=${"Wake word"}
+            ? html` <div class="row">
-              @closed=${stopPropagation}
+                <ha-select
-              fixedMenuPosition
+                  .label=${"Wake word"}
-              naturalMenuWidth
+                  @closed=${stopPropagation}
-              .value=${this.assistConfiguration?.active_wake_words[0]}
+                  fixedMenuPosition
-            >
+                  naturalMenuWidth
-              ${this.assistConfiguration?.available_wake_words.map(
+                  .value=${this.assistConfiguration.active_wake_words[0]}
-                (wakeword) =>
+                  @selected=${this._wakeWordPicked}
-                  html`<ha-list-item .value=${wakeword.id}>
+                >
-                    ${wakeword.wake_word}
+                  ${this.assistConfiguration.available_wake_words.map(
-                  </ha-list-item>`
+                    (wakeword) =>
-              )}
+                      html`<ha-list-item .value=${wakeword.id}>
-            </ha-select>
+                        ${wakeword.wake_word}
-            <ha-button @click=${this._testWakeWord}>
+                      </ha-list-item>`
-              <ha-svg-icon slot="icon" .path=${mdiMicrophone}></ha-svg-icon>
+                  )}
-              Test
+                </ha-select>
-            </ha-button>
+                <ha-button @click=${this._testWakeWord}>
-          </div>
+                  <ha-svg-icon slot="icon" .path=${mdiMicrophone}></ha-svg-icon>
-          <div class="row">
+                  Test
-            <ha-select
+                </ha-button>
-              .label=${"Assistant"}
+              </div>`
-              @closed=${stopPropagation}
+            : nothing}
-              .value=${pipelineEntity?.state}
+          ${pipelineEntity
-              fixedMenuPosition
+            ? html`<div class="row">
-              naturalMenuWidth
+                <ha-select
-            >
+                  .label=${"Assistant"}
-              ${pipelineEntity?.attributes.options.map(
+                  @closed=${stopPropagation}
-                (pipeline) =>
+                  .value=${pipelineEntity?.state}
-                  html`<ha-list-item .value=${pipeline}>
+                  fixedMenuPosition
-                    ${this.hass.formatEntityState(pipelineEntity, pipeline)}
+                  naturalMenuWidth
-                  </ha-list-item>`
+                  @selected=${this._pipelinePicked}
-              )}
+                >
-            </ha-select>
+                  ${pipelineEntity?.attributes.options.map(
-            <ha-button @click=${this._openPipeline}>
+                    (pipeline) =>
-              <ha-svg-icon slot="icon" .path=${mdiCog}></ha-svg-icon>
+                      html`<ha-list-item .value=${pipeline}>
-              Edit
+                        ${this.hass.formatEntityState(pipelineEntity, pipeline)}
-            </ha-button>
+                      </ha-list-item>`
-          </div>
+                  )}
+                </ha-select>
+                <ha-button @click=${this._openPipeline}>
+                  <ha-svg-icon slot="icon" .path=${mdiCog}></ha-svg-icon>
+                  Edit
+                </ha-button>
+              </div>`
+            : nothing}
           ${this._ttsSettings
             ? html`<div class="row">
                 <ha-tts-voice-picker
@@ -156,6 +168,25 @@ export class HaVoiceAssistantSetupStepSuccess extends LitElement {
     return [pipeline, pipelines.preferred_pipeline];
   }
 
+  private async _wakeWordPicked(ev) {
+    const option = ev.target.value;
+    await setWakeWords(this.hass, this.assistEntityId!, [option]);
+  }
+
+  private _pipelinePicked(ev) {
+    const stateObj = this.hass!.states[
+      this.assistConfiguration!.pipeline_entity_id
+    ] as InputSelectEntity;
+    const option = ev.target.value;
+    if (
+      option === stateObj.state ||
+      !stateObj.attributes.options.includes(option)
+    ) {
+      return;
+    }
+    setSelectOption(this.hass!, stateObj.entity_id, option);
+  }
+
   private async _setTtsSettings() {
     const [pipeline] = await this._getPipeline();
     if (!pipeline) {