diff --git a/src/data/ws-templates.ts b/src/data/ws-templates.ts index aec9903803..6a331e1b11 100644 --- a/src/data/ws-templates.ts +++ b/src/data/ws-templates.ts @@ -1,20 +1,27 @@ import { Connection, UnsubscribeFunc } from "home-assistant-js-websocket"; -interface RenderTemplateResult { +export interface RenderTemplateResult { result: string; + listeners: TemplateListeners; +} + +interface TemplateListeners { + all: boolean; + domains: string[]; + entities: string[]; } export const subscribeRenderTemplate = ( conn: Connection, - onChange: (result: string) => void, + onChange: (result: RenderTemplateResult) => void, params: { template: string; entity_ids?: string | string[]; variables?: object; } ): Promise => { - return conn.subscribeMessage( - (msg: RenderTemplateResult) => onChange(msg.result), - { type: "render_template", ...params } - ); + return conn.subscribeMessage((msg: RenderTemplateResult) => onChange(msg), { + type: "render_template", + ...params, + }); }; diff --git a/src/panels/developer-tools/template/developer-tools-template.ts b/src/panels/developer-tools/template/developer-tools-template.ts index fbc5e03b63..f2f011f098 100644 --- a/src/panels/developer-tools/template/developer-tools-template.ts +++ b/src/panels/developer-tools/template/developer-tools-template.ts @@ -13,7 +13,10 @@ import { classMap } from "lit-html/directives/class-map"; import { debounce } from "../../../common/util/debounce"; import "../../../components/ha-circular-progress"; import "../../../components/ha-code-editor"; -import { subscribeRenderTemplate } from "../../../data/ws-templates"; +import { + subscribeRenderTemplate, + RenderTemplateResult, +} from "../../../data/ws-templates"; import { haStyle } from "../../../resources/styles"; import { HomeAssistant } from "../../../types"; @@ -44,11 +47,11 @@ class HaPanelDevTemplate extends LitElement { @property() public narrow!: boolean; - @internalProperty() private _error = false; + @internalProperty() private _error?: string; @internalProperty() private _rendering = false; - @internalProperty() private _processed = ""; + @internalProperty() private _templateResult?: RenderTemplateResult; @internalProperty() private _unsubRenderTemplate?: Promise; @@ -139,9 +142,57 @@ class HaPanelDevTemplate extends LitElement { .active=${this._rendering} size="small" > -
-${this._processed}
+ +
${this._error}${this._templateResult
+            ?.result}
+ ${!this._templateResult?.listeners + ? "" + : this._templateResult.listeners.all + ? html` + + ${this.hass.localize( + "ui.panel.developer-tools.tabs.templates.all_listeners" + )} + + ` + : this._templateResult.listeners.domains.length || + this._templateResult.listeners.entities.length + ? html` + ${this.hass.localize( + "ui.panel.developer-tools.tabs.templates.listeners" + )} + + ` + : html` + ${this.hass.localize( + "ui.panel.developer-tools.tabs.templates.no_listeners" + )} + `} `; @@ -189,6 +240,11 @@ ${this._processed} { - this._processed = result; + this._templateResult = result; + this._error = undefined; }, { template: this._template, @@ -230,9 +287,10 @@ ${this._processed}; @@ -85,7 +88,7 @@ export class HuiMarkdownCard extends LitElement implements LovelaceCard { class=${classMap({ "no-header": !this._config.title, })} - .content="${this._content}" + .content="${this._templateResult?.result}" > `; @@ -127,7 +130,7 @@ export class HuiMarkdownCard extends LitElement implements LovelaceCard { this._unsubRenderTemplate = subscribeRenderTemplate( this.hass.connection, (result) => { - this._content = result; + this._templateResult = result; }, { template: this._config.content, @@ -139,7 +142,10 @@ export class HuiMarkdownCard extends LitElement implements LovelaceCard { } ); } catch (_err) { - this._content = this._config!.content; + this._templateResult = { + result: this._config!.content, + listeners: { all: false, domains: [], entities: [] }, + }; this._unsubRenderTemplate = undefined; } } diff --git a/src/translations/en.json b/src/translations/en.json index 29cc400560..02cd088e92 100755 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -2729,7 +2729,12 @@ "reset": "Reset to demo template", "jinja_documentation": "Jinja2 template documentation", "template_extensions": "Home Assistant template extensions", - "unknown_error_template": "Unknown error rendering template" + "unknown_error_template": "Unknown error rendering template", + "all_listeners": "This template listens for all state changed events.", + "no_listeners": "This template does not listen for any state changed events and will not update automatically.", + "listeners": "This template listens for the following state changed events:", + "entity": "Entity", + "domain": "Domain" } } },