Add a destructive confirmation when deleting a picture-elements element (#21541)

This commit is contained in:
karwosts 2024-08-02 03:28:37 -07:00 committed by GitHub
parent 6dc80306e8
commit 5e75f6a6c2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 25 additions and 6 deletions

View File

@ -8,6 +8,7 @@ import "../../../components/ha-svg-icon";
import { HomeAssistant } from "../../../types";
import "../../../components/ha-select";
import type { HaSelect } from "../../../components/ha-select";
import { showConfirmationDialog } from "../../../dialogs/generic/show-dialog-box";
import {
ConditionalElementConfig,
IconElementConfig,
@ -77,7 +78,7 @@ export class HuiPictureElementsCardRowEditor extends LitElement {
`
: nothing}
<ha-icon-button
.label=${this.hass!.localize("ui.common.clear")}
.label=${this.hass!.localize("ui.common.delete")}
.path=${mdiClose}
class="remove-icon"
.index=${index}
@ -187,11 +188,28 @@ export class HuiPictureElementsCardRowEditor extends LitElement {
private _removeRow(ev: CustomEvent): void {
const index = (ev.currentTarget as any).index;
const newElements = this.elements!.concat();
newElements.splice(index, 1);
fireEvent(this, "elements-changed", { elements: newElements });
const element = this.elements?.[index];
if (!element) {
return;
}
showConfirmationDialog(this, {
text: this.hass!.localize(
"ui.panel.lovelace.editor.card.picture-elements.confirm_delete_element",
{
type:
this.hass!.localize(
`ui.panel.lovelace.editor.card.picture-elements.element_types.${element.type}`
) || element.type,
}
),
confirmText: this.hass!.localize("ui.common.delete"),
destructive: true,
confirm: () => {
const newElements = this.elements!.concat();
newElements.splice(index, 1);
fireEvent(this, "elements-changed", { elements: newElements });
},
});
}
private _editRow(ev: CustomEvent): void {

View File

@ -5990,6 +5990,7 @@
"card_options": "Card Options",
"elements": "Elements",
"new_element": "Add new element",
"confirm_delete_element": "Are you sure you want to delete the {type} element?",
"dark_mode_image": "Dark mode image path",
"state_filter": "State filter",
"dark_mode_filter": "Dark mode state filter",