mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-22 08:46:35 +00:00
🕶 convert hui-notification-item to TypeScript/LitElement (#3028)
This commit is contained in:
parent
7f8f99a414
commit
eac37af18c
@ -1,35 +0,0 @@
|
||||
import { PolymerElement } from "@polymer/polymer/polymer-element";
|
||||
import computeDomain from "../../../../common/entity/compute_domain";
|
||||
|
||||
import "./hui-configurator-notification-item";
|
||||
import "./hui-persistent-notification-item";
|
||||
|
||||
export class HuiNotificationItem extends PolymerElement {
|
||||
static get properties() {
|
||||
return {
|
||||
hass: Object,
|
||||
notification: {
|
||||
type: Object,
|
||||
observer: "_stateChanged",
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
_stateChanged(notification) {
|
||||
if (this.lastChild) {
|
||||
this.removeChild(this.lastChild);
|
||||
}
|
||||
|
||||
if (!notification) return;
|
||||
|
||||
const domain = notification.entity_id
|
||||
? computeDomain(notification.entity_id)
|
||||
: "persistent_notification";
|
||||
const tag = `hui-${domain}-notification-item`;
|
||||
const el = document.createElement(tag);
|
||||
el.hass = this.hass;
|
||||
el.notification = notification;
|
||||
this.appendChild(el);
|
||||
}
|
||||
}
|
||||
customElements.define("hui-notification-item", HuiNotificationItem);
|
@ -0,0 +1,55 @@
|
||||
import {
|
||||
LitElement,
|
||||
property,
|
||||
customElement,
|
||||
PropertyValues,
|
||||
TemplateResult,
|
||||
html,
|
||||
} from "lit-element";
|
||||
|
||||
import "./hui-configurator-notification-item";
|
||||
import "./hui-persistent-notification-item";
|
||||
|
||||
import { HassEntity } from "home-assistant-js-websocket";
|
||||
import { HomeAssistant } from "../../../../types";
|
||||
|
||||
@customElement("hui-notification-item")
|
||||
export class HuiNotificationItem extends LitElement {
|
||||
@property() public hass?: HomeAssistant;
|
||||
|
||||
@property() public notification?: HassEntity;
|
||||
|
||||
protected shouldUpdate(changedProps: PropertyValues): boolean {
|
||||
if (!this.hass || !this.notification || changedProps.has("notification")) {
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
protected render(): TemplateResult | void {
|
||||
if (!this.hass || !this.notification) {
|
||||
return html``;
|
||||
}
|
||||
|
||||
return this.notification.entity_id
|
||||
? html`
|
||||
<hui-configurator-notification-item
|
||||
.hass="${this.hass}"
|
||||
.notification="${this.notification}"
|
||||
></hui-configurator-notification-item>
|
||||
`
|
||||
: html`
|
||||
<hui-persistent-notification-item
|
||||
.hass="${this.hass}"
|
||||
.notification="${this.notification}"
|
||||
></hui-persistent-notification-item>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
"hui-notification-item": HuiNotificationItem;
|
||||
}
|
||||
}
|
@ -87,6 +87,6 @@ export class HuiPersistentNotificationItem extends LocalizeMixin(
|
||||
}
|
||||
}
|
||||
customElements.define(
|
||||
"hui-persistent_notification-notification-item",
|
||||
"hui-persistent-notification-item",
|
||||
HuiPersistentNotificationItem
|
||||
);
|
||||
|
Loading…
x
Reference in New Issue
Block a user