From 97c69e620c96e79e3ed307696f3f8e3562b3011e Mon Sep 17 00:00:00 2001 From: Paul Bottein Date: Thu, 17 Oct 2024 20:16:49 +0200 Subject: [PATCH] Fix notifications --- src/managers/notification-manager.ts | 32 ++++++++++------------ src/panels/lovelace/editor/delete-badge.ts | 7 +++-- src/panels/lovelace/editor/delete-card.ts | 7 +++-- src/panels/lovelace/ha-panel-lovelace.ts | 5 ++++ src/panels/lovelace/types.ts | 2 ++ src/util/toast-deleted-success.ts | 20 -------------- 6 files changed, 32 insertions(+), 41 deletions(-) delete mode 100644 src/util/toast-deleted-success.ts diff --git a/src/managers/notification-manager.ts b/src/managers/notification-manager.ts index f7d4a16f85..1ac7537415 100644 --- a/src/managers/notification-manager.ts +++ b/src/managers/notification-manager.ts @@ -1,11 +1,11 @@ -import { html, LitElement, nothing } from "lit"; -import { property, state, query } from "lit/decorators"; import { mdiClose } from "@mdi/js"; +import { html, LitElement, nothing } from "lit"; +import { property, query, state } from "lit/decorators"; import { computeRTL } from "../common/util/compute_rtl"; +import "../components/ha-button"; import "../components/ha-toast"; import type { HaToast } from "../components/ha-toast"; import type { HomeAssistant } from "../types"; -import "../components/ha-button"; export interface ShowToastParams { message: string; @@ -27,12 +27,10 @@ class NotificationManager extends LitElement { @query("ha-toast") private _toast!: HaToast | undefined; public async showDialog(parameters: ShowToastParams) { - if (this._parameters && this._parameters.message !== parameters.message) { - this._parameters = undefined; - await this.updateComplete; - } + this._toast?.close(); if (!parameters || parameters.duration === 0) { + this._parameters = undefined; return; } @@ -44,10 +42,9 @@ class NotificationManager extends LitElement { ) { this._parameters.duration = 4000; } - } - public shouldUpdate(changedProperties) { - return !this._toast || changedProperties.has("_parameters"); + await this.updateComplete; + this._toast?.show(); } private _toastClosed() { @@ -61,7 +58,6 @@ class NotificationManager extends LitElement { return html` ` + ? html` + + ` : nothing} `; diff --git a/src/panels/lovelace/editor/delete-badge.ts b/src/panels/lovelace/editor/delete-badge.ts index 8431202337..496da4c787 100644 --- a/src/panels/lovelace/editor/delete-badge.ts +++ b/src/panels/lovelace/editor/delete-badge.ts @@ -1,6 +1,5 @@ import { showAlertDialog } from "../../../dialogs/generic/show-dialog-box"; import { HomeAssistant } from "../../../types"; -import { showDeletedToastWithUndo } from "../../../util/toast-deleted-success"; import { Lovelace } from "../types"; import { deleteBadge } from "./config-util"; import { LovelaceCardPath } from "./lovelace-path"; @@ -18,7 +17,11 @@ export async function deleteBadgeWithUndo( lovelace.saveConfig(oldConfig); }; await lovelace.saveConfig(newConfig); - showDeletedToastWithUndo(element, hass, action); + lovelace.showToast({ + message: hass.localize("ui.common.successfully_deleted"), + duration: 8000, + action: { action, text: hass.localize("ui.common.undo") }, + }); } catch (err: any) { showAlertDialog(element, { text: `Deleting failed: ${err.message}`, diff --git a/src/panels/lovelace/editor/delete-card.ts b/src/panels/lovelace/editor/delete-card.ts index 9cc179b7a4..cec502938f 100644 --- a/src/panels/lovelace/editor/delete-card.ts +++ b/src/panels/lovelace/editor/delete-card.ts @@ -1,6 +1,5 @@ import { showAlertDialog } from "../../../dialogs/generic/show-dialog-box"; import { HomeAssistant } from "../../../types"; -import { showDeletedToastWithUndo } from "../../../util/toast-deleted-success"; import { Lovelace } from "../types"; import { deleteCard } from "./config-util"; import { LovelaceCardPath } from "./lovelace-path"; @@ -18,7 +17,11 @@ export async function deleteCardWithUndo( await lovelace.saveConfig(oldConfig); }; await lovelace.saveConfig(newConfig); - showDeletedToastWithUndo(element, hass, action); + lovelace.showToast({ + message: hass.localize("ui.common.successfully_deleted"), + duration: 8000, + action: { action, text: hass.localize("ui.common.undo") }, + }); } catch (err: any) { showAlertDialog(element, { text: `Deleting failed: ${err.message}`, diff --git a/src/panels/lovelace/ha-panel-lovelace.ts b/src/panels/lovelace/ha-panel-lovelace.ts index 7d8e53cf09..58f400abd5 100644 --- a/src/panels/lovelace/ha-panel-lovelace.ts +++ b/src/panels/lovelace/ha-panel-lovelace.ts @@ -31,6 +31,8 @@ import { showSaveDialog } from "./editor/show-save-config-dialog"; import "./hui-root"; import { generateLovelaceDashboardStrategy } from "./strategies/get-strategy"; import { Lovelace } from "./types"; +import { fireEvent } from "../../common/dom/fire_event"; +import { ShowToastParams } from "../../managers/notification-manager"; (window as any).loadCardHelpers = () => import("./custom-card-helpers"); @@ -434,6 +436,9 @@ export class LovelacePanel extends LitElement { throw err; } }, + showToast: (params: ShowToastParams) => { + fireEvent(this, "hass-notification", params); + }, }; } diff --git a/src/panels/lovelace/types.ts b/src/panels/lovelace/types.ts index 7a30f3e1f8..c85731aa2a 100644 --- a/src/panels/lovelace/types.ts +++ b/src/panels/lovelace/types.ts @@ -14,6 +14,7 @@ import { LovelaceHeaderFooterConfig } from "./header-footer/types"; import { LovelaceCardFeatureConfig } from "./card-features/types"; import { LovelaceElement, LovelaceElementConfig } from "./elements/types"; import { LovelaceHeadingBadgeConfig } from "./heading-badges/types"; +import { ShowToastParams } from "../../managers/notification-manager"; declare global { // eslint-disable-next-line @@ -35,6 +36,7 @@ export interface Lovelace { setEditMode: (editMode: boolean) => void; saveConfig: (newConfig: LovelaceRawConfig) => Promise; deleteConfig: () => Promise; + showToast: (params: ShowToastParams) => void; } export interface LovelaceBadge extends HTMLElement { diff --git a/src/util/toast-deleted-success.ts b/src/util/toast-deleted-success.ts deleted file mode 100644 index 312c003dae..0000000000 --- a/src/util/toast-deleted-success.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { ShowToastParams } from "../managers/notification-manager"; -import { HomeAssistant } from "../types"; -import { showToast } from "./toast"; - -export const showDeletedToastWithUndo = ( - el: HTMLElement, - hass: HomeAssistant, - action?: () => void -) => { - const toastParams: ShowToastParams = { - message: hass!.localize("ui.common.successfully_deleted"), - duration: 8000, - }; - - if (action) { - toastParams.action = { action, text: hass!.localize("ui.common.undo") }; - } - - showToast(el, toastParams); -};