diff --git a/src/views/group_monitor.ts b/src/views/group_monitor.ts index 025bd22..72b066a 100644 --- a/src/views/group_monitor.ts +++ b/src/views/group_monitor.ts @@ -1,6 +1,7 @@ import { html, CSSResultGroup, LitElement, TemplateResult, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; +import { mdiPause, mdiAutorenew } from "@mdi/js"; import memoize from "memoize-one"; import "@ha/layouts/hass-loading-screen"; @@ -13,6 +14,7 @@ import type { DataTableRowData, RowClickedEvent, } from "@ha/components/data-table/ha-data-table"; +import "@ha/components/ha-icon-button"; import { haStyle } from "@ha/resources/styles"; import { HomeAssistant, Route } from "@ha/types"; import type { PageNavigation } from "@ha/layouts/hass-tabs-subpage"; @@ -47,6 +49,8 @@ export class KNXGroupMonitor extends LitElement { @state() private _dialogIndex: number | null = null; + @state() private _pause: boolean = false; + public disconnectedCallback() { super.disconnectedCallback(); if (this.subscribed) { @@ -99,6 +103,7 @@ export class KNXGroupMonitor extends LitElement { sortable: true, title: this.knx.localize("group_monitor_source"), flex: 2, + minWidth: "0", // prevent horizontal scroll on very narrow screens template: (row) => projectLoaded ? html`
${row.sourceAddress}
@@ -117,6 +122,7 @@ export class KNXGroupMonitor extends LitElement { filterable: true, title: this.knx.localize("group_monitor_destination"), flex: 2, + minWidth: "0", // prevent horizontal scroll on very narrow screens template: (row) => projectLoaded ? html`
${row.destinationAddress}
@@ -155,12 +161,14 @@ export class KNXGroupMonitor extends LitElement { title: this.knx.localize("group_monitor_value"), filterable: true, flex: 1, + minWidth: "0", // prevent horizontal scroll on very narrow screens }, }), ); protected telegram_callback(telegram: TelegramDict): void { this.telegrams.push(telegram); + if (this._pause) return; const rows = [...this.rows]; rows.push(this._telegramToRow(telegram, rows.length)); this.rows = rows; @@ -208,11 +216,31 @@ export class KNXGroupMonitor extends LitElement { id="index" .clickable=${true} @row-click=${this._rowClicked} - > + > + + ${this._dialogIndex !== null ? this._renderTelegramInfoDialog(this._dialogIndex) : nothing} `; } + private _togglePause(): void { + this._pause = !this._pause; + if (!this._pause) { + const currentRowCount = this.rows.length; + const pauseTelegrams = this.telegrams.slice(currentRowCount); + this.rows = this.rows.concat( + pauseTelegrams.map((telegram, index) => + this._telegramToRow(telegram, currentRowCount + index), + ), + ); + } + } + private _renderTelegramInfoDialog(index: number): TemplateResult { return html`