From c54f2b66dad37e9aa24633b5b9408a8a8afc3a1f Mon Sep 17 00:00:00 2001 From: Erik Montnemery Date: Fri, 20 Mar 2020 15:53:36 +0100 Subject: [PATCH] Add delete button to MQTT devices' config page (#5117) * Add delete button to MQTT devices' config page * Move delete button to its own card * Fix review comments * Fix review comments * Fix review comments * Use haStyle instead of haStyleDialog --- src/data/mqtt.ts | 9 ++++ .../device-detail/ha-device-card-mqtt.ts | 43 +++++++++++++++++++ .../config/devices/ha-config-device-page.ts | 19 ++++++++ src/translations/en.json | 16 ++++--- 4 files changed, 80 insertions(+), 7 deletions(-) create mode 100644 src/panels/config/devices/device-detail/ha-device-card-mqtt.ts diff --git a/src/data/mqtt.ts b/src/data/mqtt.ts index c90fc05fc3..d91b32ce13 100644 --- a/src/data/mqtt.ts +++ b/src/data/mqtt.ts @@ -17,3 +17,12 @@ export const subscribeMQTTTopic = ( topic, }); }; + +export const removeMQTTDeviceEntry = ( + hass: HomeAssistant, + deviceId: string +): Promise => + hass.callWS({ + type: "mqtt/device/remove", + device_id: deviceId, + }); diff --git a/src/panels/config/devices/device-detail/ha-device-card-mqtt.ts b/src/panels/config/devices/device-detail/ha-device-card-mqtt.ts new file mode 100644 index 0000000000..a4233b7c8a --- /dev/null +++ b/src/panels/config/devices/device-detail/ha-device-card-mqtt.ts @@ -0,0 +1,43 @@ +import { DeviceRegistryEntry } from "../../../../data/device_registry"; +import { removeMQTTDeviceEntry } from "../../../../data/mqtt"; +import { + LitElement, + html, + customElement, + property, + TemplateResult, + CSSResult, +} from "lit-element"; +import { showConfirmationDialog } from "../../../../dialogs/generic/show-dialog-box"; +import { HomeAssistant } from "../../../../types"; +import { haStyle } from "../../../../resources/styles"; + +@customElement("ha-device-card-mqtt") +export class HaDeviceCardMqtt extends LitElement { + @property() public hass!: HomeAssistant; + @property() public device!: DeviceRegistryEntry; + + protected render(): TemplateResult { + return html` + + ${this.hass.localize("ui.panel.config.devices.delete")} + + `; + } + + private async _confirmDeleteEntry(): Promise { + const confirmed = await showConfirmationDialog(this, { + text: this.hass.localize("ui.panel.config.devices.confirm_delete"), + }); + + if (!confirmed) { + return; + } + + await removeMQTTDeviceEntry(this.hass!, this.device.id); + } + + static get styles(): CSSResult { + return haStyle; + } +} diff --git a/src/panels/config/devices/ha-config-device-page.ts b/src/panels/config/devices/ha-config-device-page.ts index 4f09548bc3..af89408ad5 100644 --- a/src/panels/config/devices/ha-config-device-page.ts +++ b/src/panels/config/devices/ha-config-device-page.ts @@ -16,6 +16,7 @@ import "../../../layouts/hass-error-screen"; import "../ha-config-section"; import "./device-detail/ha-device-card"; +import "./device-detail/ha-device-card-mqtt"; import "./device-detail/ha-device-entities-card"; import { HomeAssistant, Route } from "../../../types"; import { ConfigEntry } from "../../../data/config_entries"; @@ -70,6 +71,13 @@ export class HaConfigDevicePage extends LitElement { devices ? devices.find((device) => device.id === deviceId) : undefined ); + private _integrations = memoizeOne( + (device: DeviceRegistryEntry, entries: ConfigEntry[]): string[] => + entries + .filter((entry) => device.config_entries.includes(entry.entry_id)) + .map((entry) => entry.domain) + ); + private _entities = memoizeOne( ( deviceId: string, @@ -113,6 +121,7 @@ export class HaConfigDevicePage extends LitElement { `; } + const integrations = this._integrations(device, this.entries); const entities = this._entities(this.deviceId, this.entities); return html` @@ -154,6 +163,16 @@ export class HaConfigDevicePage extends LitElement { .devices=${this.devices} .device=${device} > + ${ + integrations.includes("mqtt") + ? html` + + ` + : html`` + } ${ diff --git a/src/translations/en.json b/src/translations/en.json index 6528af6d3a..5d0c6b5443 100755 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -652,9 +652,9 @@ "enabled_label": "Enable entity", "enabled_cause": "Disabled by {cause}.", "enabled_description": "Disabled entities will not be added to Home Assistant.", - "delete": "DELETE", + "delete": "Delete", "confirm_delete": "Are you sure you want to delete this entry?", - "update": "UPDATE", + "update": "Update", "note": "Note: this might not work yet with all integrations." } }, @@ -789,13 +789,13 @@ "introduction2": "To place devices in an area, use the link below to navigate to the integrations page and then click on a configured integration to get to the device cards.", "integrations_page": "Integrations page", "no_areas": "Looks like you have no areas yet!", - "create_area": "CREATE AREA" + "create_area": "Create Area" }, "editor": { "default_name": "New Area", - "delete": "DELETE", - "update": "UPDATE", - "create": "CREATE" + "delete": "Delete", + "update": "Update", + "create": "Create" }, "delete": { "confirmation_title": "Are you sure you want to delete this area?", @@ -1483,7 +1483,9 @@ "integration": "Integration", "battery": "Battery", "no_devices": "No devices" - } + }, + "delete": "Delete", + "confirm_delete": "Are you sure you want to delete this device?" }, "entities": { "caption": "Entities",