Allow individual item deletion in To-do list (#18464)

Co-authored-by: Bram Kragten <mail@bramkragten.nl>
This commit is contained in:
Duco Sebel 2023-10-30 15:21:29 +01:00 committed by GitHub
parent 37ab5cbdc3
commit abb5aa348f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 59 additions and 3 deletions

View File

@ -1,4 +1,10 @@
import { mdiDrag, mdiNotificationClearAll, mdiPlus, mdiSort } from "@mdi/js";
import {
mdiDelete,
mdiDrag,
mdiNotificationClearAll,
mdiPlus,
mdiSort,
} from "@mdi/js";
import { UnsubscribeFunc } from "home-assistant-js-websocket";
import {
CSSResultGroup,
@ -293,6 +299,23 @@ export class HuiTodoListCard
.itemId=${item.uid}
@change=${this._saveEdit}
></ha-textfield>
${this.todoListSupportsFeature(
TodoListEntityFeature.DELETE_TODO_ITEM
) &&
!this.todoListSupportsFeature(
TodoListEntityFeature.UPDATE_TODO_ITEM
)
? html`<ha-icon-button
.title=${this.hass!.localize(
"ui.panel.lovelace.cards.todo-list.delete_item"
)}
class="deleteItemButton"
.path=${mdiDelete}
.itemId=${item.uid}
@click=${this._deleteItem}
>
</ha-icon-button>`
: nothing}
</div>
`
)}
@ -341,7 +364,23 @@ export class HuiTodoListCard
>
</ha-svg-icon>
`
: ""}
: this.todoListSupportsFeature(
TodoListEntityFeature.DELETE_TODO_ITEM
) &&
!this.todoListSupportsFeature(
TodoListEntityFeature.UPDATE_TODO_ITEM
)
? html`<ha-icon-button
.title=${this.hass!.localize(
"ui.panel.lovelace.cards.todo-list.delete_item"
)}
class="deleteItemButton"
.path=${mdiDelete}
.itemId=${item.uid}
@click=${this._deleteItem}
>
</ha-icon-button>`
: nothing}
</div>
`
)}
@ -431,6 +470,16 @@ export class HuiTodoListCard
}
}
private _deleteItem(ev): void {
const item = this._getItem(ev.target.itemId);
if (!item) {
return;
}
deleteItem(this.hass!, this._entityId!, item.uid).finally(() =>
this._fetchData()
);
}
private _addKeyPress(ev): void {
if (ev.key === "Enter") {
this._addItem(null);
@ -541,6 +590,12 @@ export class HuiTodoListCard
direction: var(--direction);
}
.deleteItemButton {
margin-right: -12px;
margin-inline-end: -12px;
direction: var(--direction);
}
.reorderButton {
margin-right: -12px;
margin-inline-end: -12px;

View File

@ -4526,7 +4526,8 @@
"clear_items": "Clear checked items",
"add_item": "Add item",
"reorder_items": "Reorder items",
"drag_and_drop": "Drag and drop"
"drag_and_drop": "Drag and drop",
"delete_item": "Delete item"
},
"picture-elements": {
"hold": "Hold:",