Improve deletion functions

src/panels/lovelace/components/hui-badge-edit-mode.ts

@@ -199,14 +199,14 @@ export class HuiBadgeEditMode extends LitElement {
         this._cutBadge();
         break;
       case 4:
-        this._deleteBadge(true);
+        this._deleteBadge({ silent: false });
         break;
     }
   }
 
   private _cutBadge(): void {
     this._copyBadge();
-    this._deleteBadge(false);
+    this._deleteBadge({ silent: true });
   }
 
   private _copyBadge(): void {
@@ -231,8 +231,8 @@ export class HuiBadgeEditMode extends LitElement {
     fireEvent(this, "ll-edit-badge", { path: this.path! });
   }
 
-  private _deleteBadge(confirm: boolean): void {
-    fireEvent(this, "ll-delete-badge", { path: this.path!, confirm });
+  private _deleteBadge({ silent }: { silent: boolean }): void {
+    fireEvent(this, "ll-delete-badge", { path: this.path!, silent });
   }
 
   static get styles(): CSSResultGroup {

src/panels/lovelace/components/hui-card-edit-mode.ts

@@ -199,7 +199,7 @@ export class HuiCardEditMode extends LitElement {
         this._cutCard();
         break;
       case 4:
-        this._deleteCard(true);
+        this._deleteCard({ silent: false });
         break;
     }
   }
@@ -222,7 +222,7 @@ export class HuiCardEditMode extends LitElement {
 
   private _cutCard(): void {
     this._copyCard();
-    this._deleteCard(false);
+    this._deleteCard({ silent: true });
   }
 
   private _copyCard(): void {
@@ -231,8 +231,8 @@ export class HuiCardEditMode extends LitElement {
     this._clipboard = deepClone(cardConfig);
   }
 
-  private _deleteCard(confirm: boolean): void {
-    fireEvent(this, "ll-delete-card", { path: this.path!, confirm });
+  private _deleteCard({ silent }: { silent: boolean }): void {
+    fireEvent(this, "ll-delete-card", { path: this.path!, silent });
   }
 
   static get styles(): CSSResultGroup {

src/panels/lovelace/editor/delete-badge.ts

@@ -1,30 +1,37 @@
-import { showAlertDialog } from "../../../dialogs/generic/show-dialog-box";
 import { HomeAssistant } from "../../../types";
 import { Lovelace } from "../types";
 import { deleteBadge } from "./config-util";
 import { LovelaceCardPath } from "./lovelace-path";
 
-export async function deleteBadgeWithUndo(
-  element: HTMLElement,
+export type DeleteBadgeParams = { path: LovelaceCardPath; silent: boolean };
+
+export async function performDeleteBadge(
   hass: HomeAssistant,
   lovelace: Lovelace,
-  path: LovelaceCardPath
+  params: DeleteBadgeParams
 ): Promise<void> {
   try {
+    const { path, silent } = params;
     const oldConfig = lovelace.config;
     const newConfig = deleteBadge(oldConfig, path);
+    await lovelace.saveConfig(newConfig);
+
+    if (silent) {
+      return;
+    }
+
     const action = async () => {
       lovelace.saveConfig(oldConfig);
     };
-    await lovelace.saveConfig(newConfig);
+
     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}`,
+    lovelace.showToast({
+      message: `Deleting failed: ${err.message}`,
     });
   }
 }

src/panels/lovelace/editor/delete-card.ts

@@ -1,30 +1,37 @@
-import { showAlertDialog } from "../../../dialogs/generic/show-dialog-box";
 import { HomeAssistant } from "../../../types";
 import { Lovelace } from "../types";
 import { deleteCard } from "./config-util";
 import { LovelaceCardPath } from "./lovelace-path";
 
-export async function deleteCardWithUndo(
-  element: HTMLElement,
+export type DeleteCardParams = { path: LovelaceCardPath; silent: boolean };
+
+export async function performDeleteCard(
   hass: HomeAssistant,
   lovelace: Lovelace,
-  path: LovelaceCardPath
+  params: DeleteCardParams
 ): Promise<void> {
   try {
+    const { path, silent } = params;
     const oldConfig = lovelace.config;
     const newConfig = deleteCard(oldConfig, path);
-    const action = async () => {
-      await lovelace.saveConfig(oldConfig);
-    };
     await lovelace.saveConfig(newConfig);
+
+    if (silent) {
+      return;
+    }
+
+    const action = async () => {
+      lovelace.saveConfig(oldConfig);
+    };
+
     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}`,
+    lovelace.showToast({
+      message: `Deleting failed: ${err.message}`,
     });
   }
 }

src/panels/lovelace/sections/hui-section.ts

@@ -20,8 +20,7 @@ import {
 import { createSectionElement } from "../create-element/create-section-element";
 import { showCreateCardDialog } from "../editor/card-editor/show-create-card-dialog";
 import { showEditCardDialog } from "../editor/card-editor/show-edit-card-dialog";
-import { deleteCard } from "../editor/config-util";
-import { deleteCardWithUndo } from "../editor/delete-card";
+import { performDeleteCard } from "../editor/delete-card";
 import { parseLovelaceCardPath } from "../editor/lovelace-path";
 import { generateLovelaceSectionStrategy } from "../strategies/get-strategy";
 import type { Lovelace } from "../types";
@@ -257,17 +256,7 @@ export class HuiSection extends ReactiveElement {
     this._layoutElement.addEventListener("ll-delete-card", (ev) => {
       ev.stopPropagation();
       if (!this.lovelace) return;
-      if (ev.detail.confirm) {
-        deleteCardWithUndo(
-          this._layoutElement!,
-          this.hass!,
-          this.lovelace,
-          ev.detail.path
-        );
-      } else {
-        const newLovelace = deleteCard(this.lovelace!.config, ev.detail.path);
-        this.lovelace.saveConfig(newLovelace);
-      }
+      performDeleteCard(this.hass, this.lovelace, ev.detail);
     });
   }
 

src/panels/lovelace/views/hui-view.ts

@@ -25,9 +25,8 @@ import { showCreateBadgeDialog } from "../editor/badge-editor/show-create-badge-
 import { showEditBadgeDialog } from "../editor/badge-editor/show-edit-badge-dialog";
 import { showCreateCardDialog } from "../editor/card-editor/show-create-card-dialog";
 import { showEditCardDialog } from "../editor/card-editor/show-edit-card-dialog";
-import { deleteBadge, deleteCard } from "../editor/config-util";
-import { deleteBadgeWithUndo } from "../editor/delete-badge";
-import { deleteCardWithUndo } from "../editor/delete-card";
+import { DeleteBadgeParams, performDeleteBadge } from "../editor/delete-badge";
+import { DeleteCardParams, performDeleteCard } from "../editor/delete-card";
 import {
   LovelaceCardPath,
   parseLovelaceCardPath,
@@ -44,10 +43,10 @@ declare global {
   interface HASSDomEvents {
     "ll-create-card": { suggested?: string[] } | undefined;
     "ll-edit-card": { path: LovelaceCardPath };
-    "ll-delete-card": { path: LovelaceCardPath; confirm: boolean };
+    "ll-delete-card": DeleteCardParams;
     "ll-create-badge": undefined;
     "ll-edit-badge": { path: LovelaceCardPath };
-    "ll-delete-badge": { path: LovelaceCardPath; confirm: boolean };
+    "ll-delete-badge": DeleteBadgeParams;
   }
   interface HTMLElementEventMap {
     "ll-create-card": HASSDomEvent<HASSDomEvents["ll-create-card"]>;
@@ -324,17 +323,7 @@ export class HUIView extends ReactiveElement {
     });
     this._layoutElement.addEventListener("ll-delete-card", (ev) => {
       if (!this.lovelace) return;
-      if (ev.detail.confirm) {
-        deleteCardWithUndo(
-          this._layoutElement!,
-          this.hass!,
-          this.lovelace!,
-          ev.detail.path
-        );
-      } else {
-        const newLovelace = deleteCard(this.lovelace!.config, ev.detail.path);
-        this.lovelace.saveConfig(newLovelace);
-      }
+      performDeleteCard(this.hass, this.lovelace, ev.detail);
     });
     this._layoutElement.addEventListener("ll-create-badge", async () => {
       showCreateBadgeDialog(this, {
@@ -352,19 +341,9 @@ export class HUIView extends ReactiveElement {
         badgeIndex: cardIndex,
       });
     });
-    this._layoutElement.addEventListener("ll-delete-badge", (ev) => {
+    this._layoutElement.addEventListener("ll-delete-badge", async (ev) => {
       if (!this.lovelace) return;
-      if (ev.detail.confirm) {
-        deleteBadgeWithUndo(
-          this._layoutElement!,
-          this.hass!,
-          this.lovelace!,
-          ev.detail.path
-        );
-      } else {
-        const newLovelace = deleteBadge(this.lovelace!.config, ev.detail.path);
-        this.lovelace.saveConfig(newLovelace);
-      }
+      performDeleteBadge(this.hass, this.lovelace, ev.detail);
     });
   }