Allow changing LLM Task preferences (#25779)

* Allow changing LLM Task preferences

* value-changed

src/data/ai_task.ts

@@ -0,0 +1,43 @@
+import type { HomeAssistant } from "../types";
+
+export interface AITaskPreferences {
+  gen_text_entity_id: string | null;
+}
+
+export interface GenTextTaskResult {
+  conversation_id: string;
+  text: string;
+}
+
+export const fetchAITaskPreferences = (hass: HomeAssistant) =>
+  hass.callWS<AITaskPreferences>({
+    type: "ai_task/preferences/get",
+  });
+
+export const saveAITaskPreferences = (
+  hass: HomeAssistant,
+  preferences: Partial<AITaskPreferences>
+) =>
+  hass.callWS<AITaskPreferences>({
+    type: "ai_task/preferences/set",
+    ...preferences,
+  });
+
+export const generateTextAITask = async (
+  hass: HomeAssistant,
+  task: {
+    task_name: string;
+    entity_id?: string;
+    instructions: string;
+  }
+): Promise<GenTextTaskResult> => {
+  const result = await hass.callService<GenTextTaskResult>(
+    "ai_task",
+    "generate_text",
+    task,
+    undefined,
+    true,
+    true
+  );
+  return result.response!;
+};

src/data/icons.ts

@@ -37,6 +37,7 @@ import {
   mdiRoomService,
   mdiScriptText,
   mdiSpeakerMessage,
+  mdiStarFourPoints,
   mdiThermostat,
   mdiTimerOutline,
   mdiToggleSwitch,
@@ -66,6 +67,7 @@ export const DEFAULT_DOMAIN_ICON = mdiBookmark;
 
 /** Fallback icons for each domain */
 export const FALLBACK_DOMAIN_ICONS = {
+  ai_task: mdiStarFourPoints,
   air_quality: mdiAirFilter,
   alert: mdiAlert,
   automation: mdiRobot,

src/panels/config/voice-assistants/ai-task-pref.ts

@@ -0,0 +1,159 @@
+import "@material/mwc-button";
+import { mdiHelpCircle, mdiStarFourPoints } from "@mdi/js";
+import { css, html, LitElement, nothing } from "lit";
+import { customElement, property, state } from "lit/decorators";
+import "../../../components/ha-card";
+import "../../../components/ha-settings-row";
+import "../../../components/entity/ha-entity-picker";
+import type { HaEntityPicker } from "../../../components/entity/ha-entity-picker";
+import type { HomeAssistant } from "../../../types";
+import { brandsUrl } from "../../../util/brands-url";
+import {
+  fetchAITaskPreferences,
+  saveAITaskPreferences,
+  type AITaskPreferences,
+} from "../../../data/ai_task";
+import { documentationUrl } from "../../../util/documentation-url";
+
+@customElement("ai-task-pref")
+export class AITaskPref extends LitElement {
+  @property({ type: Boolean, reflect: true }) public narrow = false;
+
+  @property({ attribute: false }) public hass!: HomeAssistant;
+
+  @state() private _prefs?: AITaskPreferences;
+
+  protected firstUpdated(changedProps) {
+    super.firstUpdated(changedProps);
+    fetchAITaskPreferences(this.hass).then((prefs) => {
+      this._prefs = prefs;
+    });
+  }
+
+  protected render() {
+    if (!this._prefs) {
+      return nothing;
+    }
+
+    return html`
+      <ha-card outlined>
+        <h1 class="card-header">
+          <img
+            alt=""
+            src=${brandsUrl({
+              domain: "ai_task",
+              type: "icon",
+              darkOptimized: this.hass.themes?.darkMode,
+            })}
+            crossorigin="anonymous"
+            referrerpolicy="no-referrer"
+          />${this.hass.localize(
+            "ui.panel.config.voice_assistants.ai_task.header"
+          )}
+        </h1>
+        <div class="header-actions">
+          <a
+            href=${documentationUrl(this.hass, "/integrations/ai_task/")}
+            target="_blank"
+            rel="noreferrer"
+            class="icon-link"
+          >
+            <ha-icon-button
+              .label=${this.hass.localize(
+                "ui.panel.config.cloud.account.alexa.link_learn_how_it_works"
+              )}
+              .path=${mdiHelpCircle}
+            ></ha-icon-button>
+          </a>
+        </div>
+        <div class="card-content">
+          <p>
+            ${this.hass!.localize(
+              "ui.panel.config.voice_assistants.ai_task.description",
+              {
+                button: html`<ha-svg-icon
+                  .path=${mdiStarFourPoints}
+                ></ha-svg-icon>`,
+              }
+            )}
+          </p>
+          <ha-settings-row .narrow=${this.narrow}>
+            <span slot="heading">
+              ${this.hass!.localize(
+                "ui.panel.config.voice_assistants.ai_task.gen_text_header"
+              )}
+            </span>
+            <span slot="description">
+              ${this.hass!.localize(
+                "ui.panel.config.voice_assistants.ai_task.gen_text_description"
+              )}
+            </span>
+            <ha-entity-picker
+              data-name="gen_text_entity_id"
+              .hass=${this.hass}
+              .value=${this._prefs.gen_text_entity_id}
+              .includeDomains=${["ai_task"]}
+              @value-changed=${this._handlePrefChange}
+            ></ha-entity-picker>
+          </ha-settings-row>
+        </div>
+      </ha-card>
+    `;
+  }
+
+  private async _handlePrefChange(
+    ev: CustomEvent<{ value: string | undefined }>
+  ) {
+    const input = ev.target as HaEntityPicker;
+    const key = input.getAttribute("data-name") as keyof AITaskPreferences;
+    const entityId = ev.detail.value || null;
+    const oldPrefs = this._prefs;
+    this._prefs = { ...this._prefs!, [key]: entityId };
+    try {
+      this._prefs = await saveAITaskPreferences(this.hass, {
+        [key]: entityId,
+      });
+    } catch (_err: any) {
+      this._prefs = oldPrefs;
+    }
+  }
+
+  static styles = css`
+    a {
+      color: var(--primary-color);
+    }
+    ha-settings-row {
+      padding: 0;
+    }
+    .header-actions {
+      position: absolute;
+      right: 0px;
+      inset-inline-end: 0px;
+      inset-inline-start: initial;
+      top: 24px;
+      display: flex;
+      flex-direction: row;
+    }
+    .header-actions .icon-link {
+      margin-top: -16px;
+      margin-right: 8px;
+      margin-inline-end: 8px;
+      margin-inline-start: initial;
+      direction: var(--direction);
+      color: var(--secondary-text-color);
+    }
+    ha-entity-picker {
+      flex: 1;
+      margin-left: 16px;
+    }
+    :host([narrow]) ha-entity-picker {
+      margin-left: 0;
+    }
+  `;
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "ai-task-pref": AITaskPref;
+  }
+}

src/panels/config/voice-assistants/ha-config-voice-assistants-assistants.ts

@@ -8,6 +8,7 @@ import "../../../layouts/hass-loading-screen";
 import "../../../layouts/hass-tabs-subpage";
 import type { HomeAssistant, Route } from "../../../types";
 import "./assist-pref";
+import "./ai-task-pref";
 import "./cloud-alexa-pref";
 import "./cloud-discover";
 import "./cloud-google-pref";
@@ -53,6 +54,12 @@ export class HaConfigVoiceAssistantsAssistants extends LitElement {
                 ></assist-pref>
               `
             : nothing}
+          ${isComponentLoaded(this.hass, "ai_task")
+            ? html`<ai-task-pref
+                .hass=${this.hass}
+                .narrow=${this.narrow}
+              ></ai-task-pref>`
+            : nothing}
           ${this.cloudStatus?.logged_in
             ? html`
                 <cloud-alexa-pref

src/translations/en.json

@@ -3441,6 +3441,12 @@
               "sign_in": "Sign in"
             }
           },
+          "ai_task": {
+            "header": "AI suggestions",
+            "description": "Home Assistant can use generative AI to help you with tasks like writing automations, creating scripts, and more. Look for the button with the {button} icon throughout Home Assistant to get suggestions.",
+            "gen_text_header": "Text generation tasks",
+            "gen_text_description": "Used to create summaries and names."
+          },
           "debug": {
             "header": "Debug assistant",
             "no_runs_found": "No runs found",

src/types.ts

@@ -198,9 +198,9 @@ export interface Context {
   user_id?: string | null;
 }
 
-export interface ServiceCallResponse {
+export interface ServiceCallResponse<T = any> {
   context: Context;
-  response?: any;
+  response?: T;
 }
 
 export interface ServiceCallRequest {
@@ -248,14 +248,14 @@ export interface HomeAssistant {
   user?: CurrentUser;
   userData?: CoreFrontendUserData | null;
   hassUrl(path?): string;
-  callService(
+  callService<T = any>(
     domain: ServiceCallRequest["domain"],
     service: ServiceCallRequest["service"],
     serviceData?: ServiceCallRequest["serviceData"],
     target?: ServiceCallRequest["target"],
     notifyOnError?: boolean,
     returnResponse?: boolean
-  ): Promise<ServiceCallResponse>;
+  ): Promise<ServiceCallResponse<T>>;
   callApi<T>(
     method: "GET" | "POST" | "PUT" | "DELETE",
     path: string,