Skip to content

Commit

Permalink
Dev tools events: Add a clear events button (#21353)
Browse files Browse the repository at this point in the history 
Clear events
  • Loading branch information
@silamon
silamon authored Jul 10, 2024
1 parent cd4937b commit 11b490d
Show file tree
Hide file tree
Showing 3 changed files with 108 additions and 73 deletions.
101 changes: 57 additions & 44 deletions src/panels/developer-tools/event/developer-tools-event.ts
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import { CSSResultGroup, LitElement, TemplateResult, css, html } from "lit";
import { customElement, property, state } from "lit/decorators";
import "@material/mwc-button";
import "../../../components/ha-yaml-editor";
import "../../../components/ha-textfield";
import "../../../components/ha-button";
import "../../../components/ha-card";
import { showAlertDialog } from "../../../dialogs/generic/show-dialog-box";
import { documentationUrl } from "../../../util/documentation-url";
import "./event-subscribe-card";
Expand Down Expand Up @@ -31,49 +32,61 @@ class HaPanelDevEvent extends LitElement {
: "content layout horizontal"}
>
<div class="flex">
<p>
${this.hass.localize(
"ui.panel.developer-tools.tabs.events.description"
)}
<a
href=${documentationUrl(this.hass, "/docs/configuration/events/")}
target="_blank"
rel="noreferrer"
>
${this.hass.localize(
"ui.panel.developer-tools.tabs.events.documentation"
)}
</a>
</p>
<div class="inputs">
<ha-textfield
.label=${this.hass.localize(
"ui.panel.developer-tools.tabs.events.type"
)}
autofocus
required
.value=${this._eventType}
@change=${this._eventTypeChanged}
></ha-textfield>
<p>
${this.hass.localize("ui.panel.developer-tools.tabs.events.data")}
</p>
</div>
<div class="code-editor">
<ha-yaml-editor
.value=${this._eventData}
.error=${!this._isValid}
@value-changed=${this._yamlChanged}
></ha-yaml-editor>
</div>
<mwc-button
@click=${this._fireEvent}
raised
.disabled=${!this._isValid}
>${this.hass.localize(
"ui.panel.developer-tools.tabs.events.fire_event"
)}</mwc-button
>
<ha-card>
<div class="card-content">
<p>
${this.hass.localize(
"ui.panel.developer-tools.tabs.events.description"
)}
<a
href=${documentationUrl(
this.hass,
"/docs/configuration/events/"
)}
target="_blank"
rel="noreferrer"
>
${this.hass.localize(
"ui.panel.developer-tools.tabs.events.documentation"
)}
</a>
</p>
<div class="inputs">
<ha-textfield
.label=${this.hass.localize(
"ui.panel.developer-tools.tabs.events.type"
)}
autofocus
required
.value=${this._eventType}
@change=${this._eventTypeChanged}
></ha-textfield>
<p>
${this.hass.localize(
"ui.panel.developer-tools.tabs.events.data"
)}
</p>
</div>
<div class="code-editor">
<ha-yaml-editor
.value=${this._eventData}
.error=${!this._isValid}
@value-changed=${this._yamlChanged}
></ha-yaml-editor>
</div>
</div>
<div class="card-actions">
<ha-button
@click=${this._fireEvent}
raised
.disabled=${!this._isValid}
>${this.hass.localize(
"ui.panel.developer-tools.tabs.events.fire_event"
)}</ha-button
>
</div>
</ha-card>
<event-subscribe-card .hass=${this.hass}></event-subscribe-card>
</div>
Expand Down
79 changes: 50 additions & 29 deletions src/panels/developer-tools/event/event-subscribe-card.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import "@material/mwc-button";
import { HassEvent } from "home-assistant-js-websocket";
import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
import { customElement, property, state } from "lit/decorators";
Expand All @@ -7,6 +6,7 @@ import { formatTime } from "../../../common/datetime/format_time";
import "../../../components/ha-card";
import "../../../components/ha-textfield";
import "../../../components/ha-yaml-editor";
import "../../../components/ha-button";
import { HomeAssistant } from "../../../types";

@customElement("event-subscribe-card")
Expand Down Expand Up @@ -40,33 +40,46 @@ class EventSubscribeCard extends LitElement {
)}
>
<div class="card-content">
<form>
<ha-textfield
.label=${this._subscribed
? this.hass!.localize(
"ui.panel.developer-tools.tabs.events.listening_to"
)
: this.hass!.localize(
"ui.panel.developer-tools.tabs.events.subscribe_to"
)}
.disabled=${this._subscribed !== undefined}
.value=${this._eventType}
@input=${this._valueChanged}
></ha-textfield>
<mwc-button
.disabled=${this._eventType === ""}
@click=${this._handleSubmit}
type="submit"
>
${this._subscribed
? this.hass!.localize(
"ui.panel.developer-tools.tabs.events.stop_listening"
)
: this.hass!.localize(
"ui.panel.developer-tools.tabs.events.start_listening"
)}
</mwc-button>
</form>
<ha-textfield
.label=${this._subscribed
? this.hass!.localize(
"ui.panel.developer-tools.tabs.events.listening_to"
)
: this.hass!.localize(
"ui.panel.developer-tools.tabs.events.subscribe_to"
)}
.disabled=${this._subscribed !== undefined}
.value=${this._eventType}
@input=${this._valueChanged}
></ha-textfield>
</div>
<div class="card-actions">
<ha-button
raised
.disabled=${this._eventType === ""}
@click=${this._startOrStopListening}
>
${this._subscribed
? this.hass!.localize(
"ui.panel.developer-tools.tabs.events.stop_listening"
)
: this.hass!.localize(
"ui.panel.developer-tools.tabs.events.start_listening"
)}
</ha-button>
<ha-button
raised
.disabled=${this._eventType === ""}
@click=${this._clearEvents}
>
${this.hass!.localize(
"ui.panel.developer-tools.tabs.events.clear_events"
)}
</ha-button>
</div>
</ha-card>
<ha-card>
<div class="card-content">
<div class="events">
${repeat(
this._events,
Expand Down Expand Up @@ -99,7 +112,7 @@ class EventSubscribeCard extends LitElement {
this._eventType = ev.target.value;
}

private async _handleSubmit(): Promise<void> {
private async _startOrStopListening(): Promise<void> {
if (this._subscribed) {
this._subscribed();
this._subscribed = undefined;
Expand All @@ -121,6 +134,11 @@ class EventSubscribeCard extends LitElement {
}
}

private _clearEvents(): void {
this._events = [];
this._eventCount = 0;
}

static get styles(): CSSResultGroup {
return css`
ha-textfield {
Expand All @@ -140,6 +158,9 @@ class EventSubscribeCard extends LitElement {
pre {
font-family: var(--code-font-family, monospace);
}
ha-card {
margin-bottom: 5px;
}
`;
}
}
Expand Down
1 change: 1 addition & 0 deletions src/translations/en.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6686,6 +6686,7 @@
"subscribe_to": "Event to subscribe to",
"start_listening": "Start listening",
"stop_listening": "Stop listening",
"clear_events": "Clear events",
"alert_event_type": "Event type is a mandatory field",
"notification_event_fired": "Event {type} successfully fired!"
},
Expand Down

0 comments on commit 11b490d

Please sign in to comment.