diff --git a/src/panels/developer-tools/action/developer-tools-action.ts b/src/panels/developer-tools/action/developer-tools-action.ts index 3259882897..3facd08246 100644 --- a/src/panels/developer-tools/action/developer-tools-action.ts +++ b/src/panels/developer-tools/action/developer-tools-action.ts @@ -2,9 +2,10 @@ import { mdiHelpCircle } from "@mdi/js"; import type { HassService } from "home-assistant-js-websocket"; import { ERR_CONNECTION_LOST } from "home-assistant-js-websocket"; import { load } from "js-yaml"; -import type { CSSResultGroup } from "lit"; +import type { CSSResultGroup, TemplateResult } from "lit"; import { css, html, LitElement, nothing } from "lit"; import { customElement, property, query, state } from "lit/decorators"; +import { until } from "lit/directives/until"; import memoizeOne from "memoize-one"; import { storage } from "../../../common/decorators/storage"; import { computeDomain } from "../../../common/entity/compute_domain"; @@ -37,6 +38,7 @@ import { import { haStyle } from "../../../resources/styles"; import type { HomeAssistant } from "../../../types"; import { documentationUrl } from "../../../util/documentation-url"; +import { resolveMediaSource } from "../../../data/media_source"; @customElement("developer-tools-action") class HaPanelDevAction extends LitElement { @@ -46,7 +48,12 @@ class HaPanelDevAction extends LitElement { @state() private _uiAvailable = true; - @state() private _response?: Record; + @state() private _response?: { + domain: string; + service: string; + result: Record; + media?: Promise; + }; @state() private _error?: string; @@ -199,7 +206,7 @@ class HaPanelDevAction extends LitElement { ${this._response - ? html`
+ ? html`
+ ${until(this._response.media)}
` @@ -328,7 +336,7 @@ class HaPanelDevAction extends LitElement { private async _copyTemplate(): Promise { await copyToClipboard( - `{% set ${this._serviceData?.response_variable || "action_response"} = ${JSON.stringify(this._response)} %}` + `{% set ${this._serviceData?.response_variable || "action_response"} = ${JSON.stringify(this._response!.result)} %}` ); showToast(this, { message: this.hass.localize("ui.common.copied_clipboard"), @@ -478,7 +486,48 @@ class HaPanelDevAction extends LitElement { } button.progress = true; try { - this._response = (await callExecuteScript(this.hass, script)).response; + const result = (await callExecuteScript(this.hass, script)).response; + this._response = { + domain, + service, + result, + media: + "media_source_id" in result + ? resolveMediaSource(this.hass, result.media_source_id).then( + (resolved) => + resolved.mime_type.startsWith("image/") + ? html`Media content` + : resolved.mime_type.startsWith("video/") + ? html` + + ` + : resolved.mime_type.startsWith("audio/") + ? html` + + ` + : html` + + ${this.hass.localize( + "ui.panel.developer-tools.tabs.actions.open_media" + )} + + ` + ) + : undefined, + }; } catch (err: any) { if ( err.error?.code === ERR_CONNECTION_LOST && @@ -682,6 +731,12 @@ class HaPanelDevAction extends LitElement { display: flex; align-items: center; } + + .response img { + max-width: 100%; + height: auto; + margin-top: 24px; + } `, ]; } diff --git a/src/translations/en.json b/src/translations/en.json index 1dd2d0dc05..a22700ff19 100644 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -8797,6 +8797,7 @@ "accepts_target": "This action accepts a target, for example: `entity_id: light.bed_light`", "no_template_ui_support": "The UI does not support templates, you can still use the YAML editor.", "copy_clipboard_template": "Copy to clipboard as template", + "open_media": "Open media", "errors": { "ui": { "no_action": "No action selected, please select an action",