diff --git a/src/panels/config/developer-tools/statistics/developer-tools-statistics.ts b/src/panels/config/developer-tools/statistics/developer-tools-statistics.ts index b57b868bb4..c7d4b1ef2a 100644 --- a/src/panels/config/developer-tools/statistics/developer-tools-statistics.ts +++ b/src/panels/config/developer-tools/statistics/developer-tools-statistics.ts @@ -29,7 +29,6 @@ import type { } from "../../../../components/data-table/ha-data-table"; import { showDataTableSettingsDialog } from "../../../../components/data-table/show-dialog-data-table-settings"; import "../../../../components/ha-button"; -import "../../../../components/ha-dialog"; import "../../../../components/ha-dropdown"; import type { HaDropdownSelectEvent } from "../../../../components/ha-dropdown"; import "../../../../components/ha-dropdown-item"; diff --git a/src/panels/config/developer-tools/statistics/dialog-statistics-adjust-sum.ts b/src/panels/config/developer-tools/statistics/dialog-statistics-adjust-sum.ts index bbc65b7402..9b443f5603 100644 --- a/src/panels/config/developer-tools/statistics/dialog-statistics-adjust-sum.ts +++ b/src/panels/config/developer-tools/statistics/dialog-statistics-adjust-sum.ts @@ -6,7 +6,8 @@ import memoizeOne from "memoize-one"; import { formatDateTime } from "../../../../common/datetime/format_date_time"; import { fireEvent } from "../../../../common/dom/fire_event"; import "../../../../components/ha-spinner"; -import "../../../../components/ha-dialog"; +import "../../../../components/ha-dialog-footer"; +import "../../../../components/ha-wa-dialog"; import "../../../../components/ha-button"; import "../../../../components/ha-form/ha-form"; import "../../../../components/ha-icon-next"; @@ -41,6 +42,8 @@ export class DialogStatisticsFixUnsupportedUnitMetadata extends LitElement { @state() private _params?: DialogStatisticsAdjustSumParams; + @state() private _open = false; + @state() private _busy = false; @state() private _moment?: string; @@ -71,6 +74,7 @@ export class DialogStatisticsFixUnsupportedUnitMetadata extends LitElement { public showDialog(params: DialogStatisticsAdjustSumParams): void { this._params = params; + this._open = true; // moment is in format YYYY-MM-DD HH:mm:ss because of selector // Here we create a date with minutes set to %5 const now = new Date(); @@ -80,6 +84,11 @@ export class DialogStatisticsFixUnsupportedUnitMetadata extends LitElement { } public closeDialog(): void { + this._open = false; + } + + private _dialogClosed(): void { + this._open = false; this._params = undefined; this._moment = undefined; this._stats5min = undefined; @@ -97,25 +106,59 @@ export class DialogStatisticsFixUnsupportedUnitMetadata extends LitElement { } let content: TemplateResult; + let footer: TemplateResult; if (!this._chosenStat) { content = this._renderPickStatistic(); + footer = html` + + ${this.hass.localize( + "ui.panel.config.developer-tools.tabs.statistics.fix_issue.adjust_sum.outliers" + )} + + + ${this.hass.localize("ui.common.close")} + + `; } else { content = this._renderAdjustStat(); + footer = html` + + ${this.hass.localize("ui.common.back")} + + ${this.hass.localize( + "ui.panel.config.developer-tools.tabs.statistics.fix_issue.adjust_sum.adjust" + )} + `; } return html` - ${content} - + ${footer} + `; } @@ -196,18 +239,6 @@ export class DialogStatisticsFixUnsupportedUnitMetadata extends LitElement { @value-changed=${this._dateTimeSelectorChanged} >
${stats}
- - ${this.hass.localize( - "ui.panel.config.developer-tools.tabs.statistics.fix_issue.adjust_sum.outliers" - )} - - - ${this.hass.localize("ui.common.close")} - `; } @@ -285,24 +316,6 @@ export class DialogStatisticsFixUnsupportedUnitMetadata extends LitElement { .disabled=${this._busy} @value-changed=${this._amountChanged} > - - - ${this.hass.localize("ui.common.back")} - - ${this.hass.localize( - "ui.panel.config.developer-tools.tabs.statistics.fix_issue.adjust_sum.adjust" - )} `; } @@ -492,27 +505,6 @@ export class DialogStatisticsFixUnsupportedUnitMetadata extends LitElement { haStyle, haStyleDialog, css` - @media all and (max-width: 450px), all and (max-height: 500px) { - /* overrule the ha-style-dialog max-height on small screens */ - ha-dialog { - --mdc-dialog-max-height: 100%; - height: 100%; - } - } - - @media all and (min-width: 850px) { - ha-dialog { - --mdc-dialog-max-height: 80%; - --mdc-dialog-max-height: 80%; - } - } - - @media all and (min-width: 451px) and (min-height: 501px) { - ha-dialog { - --mdc-dialog-max-width: 480px; - } - } - .text-content, ha-selector-datetime, ha-selector-number { @@ -528,6 +520,7 @@ export class DialogStatisticsFixUnsupportedUnitMetadata extends LitElement { margin-bottom: var(--ha-space-5); } .stat-list { + margin-top: var(--ha-space-2); min-height: 360px; display: flex; flex-direction: column; diff --git a/src/panels/config/developer-tools/statistics/dialog-statistics-fix-units-changed.ts b/src/panels/config/developer-tools/statistics/dialog-statistics-fix-units-changed.ts index 0979aa803c..e42fdc42f4 100644 --- a/src/panels/config/developer-tools/statistics/dialog-statistics-fix-units-changed.ts +++ b/src/panels/config/developer-tools/statistics/dialog-statistics-fix-units-changed.ts @@ -2,7 +2,8 @@ import type { CSSResultGroup } from "lit"; import { html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import { fireEvent } from "../../../../common/dom/fire_event"; -import "../../../../components/ha-dialog"; +import "../../../../components/ha-dialog-footer"; +import "../../../../components/ha-wa-dialog"; import "../../../../components/ha-button"; import "../../../../components/ha-formfield"; import "../../../../components/ha-radio"; @@ -21,20 +22,24 @@ export class DialogStatisticsFixUnitsChanged extends LitElement { @state() private _params?: DialogStatisticsUnitsChangedParams; + @state() private _open = false; + @state() private _action?: "update" | "clear" | "change"; public showDialog(params: DialogStatisticsUnitsChangedParams): void { this._params = params; this._action = "update"; + this._open = true; } public closeDialog(): void { - this._cancel(); + this._open = false; } - private _closeDialog(): void { + private _dialogClosed(): void { this._params = undefined; this._action = undefined; + this._open = false; fireEvent(this, "dialog-closed", { dialog: this.localName }); } @@ -44,14 +49,13 @@ export class DialogStatisticsFixUnitsChanged extends LitElement { } return html` -

${this.hass.localize( @@ -91,7 +95,7 @@ export class DialogStatisticsFixUnitsChanged extends LitElement { name="action" .checked=${this._action === "update"} @change=${this._handleActionChanged} - dialogInitialFocus + autofocus > - - ${this.hass.localize("ui.common.close")} - - - ${this.hass.localize( - "ui.panel.config.developer-tools.tabs.statistics.fix_issue.fix" - )} - - + + + ${this.hass.localize("ui.common.close")} + + + ${this.hass.localize( + "ui.panel.config.developer-tools.tabs.statistics.fix_issue.fix" + )} + + + `; } @@ -129,7 +135,7 @@ export class DialogStatisticsFixUnitsChanged extends LitElement { private _cancel(): void { this._params?.cancelCallback!(); - this._closeDialog(); + this.closeDialog(); } private async _fixIssue(): Promise { @@ -144,7 +150,7 @@ export class DialogStatisticsFixUnitsChanged extends LitElement { ); } this._params?.fixedCallback!(); - this._closeDialog(); + this.closeDialog(); } static get styles(): CSSResultGroup { diff --git a/src/panels/config/developer-tools/statistics/dialog-statistics-fix.ts b/src/panels/config/developer-tools/statistics/dialog-statistics-fix.ts index d20ca1f474..93c5af1feb 100644 --- a/src/panels/config/developer-tools/statistics/dialog-statistics-fix.ts +++ b/src/panels/config/developer-tools/statistics/dialog-statistics-fix.ts @@ -3,7 +3,8 @@ import { html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import { fireEvent } from "../../../../common/dom/fire_event"; import "../../../../components/ha-button"; -import "../../../../components/ha-dialog"; +import "../../../../components/ha-dialog-footer"; +import "../../../../components/ha-wa-dialog"; import "../../../../components/ha-spinner"; import { clearStatistics, getStatisticLabel } from "../../../../data/recorder"; import { haStyle, haStyleDialog } from "../../../../resources/styles"; @@ -18,19 +19,23 @@ export class DialogStatisticsFix extends LitElement { @state() private _params?: DialogStatisticsFixParams; + @state() private _open = false; + @state() private _clearing = false; public showDialog(params: DialogStatisticsFixParams): void { this._params = params; + this._open = true; } public closeDialog(): void { - this._cancel(); + this._open = false; } - private _closeDialog(): void { + private _dialogClosed(): void { this._params = undefined; this._clearing = false; + this._open = false; fireEvent(this, "dialog-closed", { dialog: this.localName }); } @@ -42,14 +47,13 @@ export class DialogStatisticsFix extends LitElement { const issue = this._params.issue; return html` -

${this.hass.localize( @@ -147,33 +151,36 @@ export class DialogStatisticsFix extends LitElement { : nothing}

- ${issue.type !== "entity_not_recorded" - ? html` - ${this.hass.localize("ui.common.close")} - - - ${this.hass.localize("ui.common.delete")} - ` - : html` - ${this.hass.localize("ui.common.ok")} - `} -
+ + ${issue.type !== "entity_not_recorded" + ? html` + ${this.hass.localize("ui.common.close")} + + + ${this.hass.localize("ui.common.delete")} + ` + : html` + ${this.hass.localize("ui.common.ok")} + `} + + `; } private _cancel(): void { this._params?.cancelCallback!(); - this._closeDialog(); + this.closeDialog(); } private async _clearStatistics(): Promise { @@ -200,7 +207,7 @@ export class DialogStatisticsFix extends LitElement { } finally { this._clearing = false; this._params?.fixedCallback!(); - this._closeDialog(); + this.closeDialog(); } }