diff --git a/hassio/src/addon-view/documentation/hassio-addon-documentation-tab.ts b/hassio/src/addon-view/documentation/hassio-addon-documentation-tab.ts index db64cb1622..98cd11b276 100644 --- a/hassio/src/addon-view/documentation/hassio-addon-documentation-tab.ts +++ b/hassio/src/addon-view/documentation/hassio-addon-documentation-tab.ts @@ -44,7 +44,10 @@ class HassioAddonDocumentationDashboard extends LitElement { : ""}
${this._content - ? html`` + ? html`` : html``}
diff --git a/hassio/src/addon-view/info/hassio-addon-info.ts b/hassio/src/addon-view/info/hassio-addon-info.ts index 356eb64c2b..986090e53f 100644 --- a/hassio/src/addon-view/info/hassio-addon-info.ts +++ b/hassio/src/addon-view/info/hassio-addon-info.ts @@ -659,6 +659,7 @@ class HassioAddonInfo extends LitElement {
diff --git a/package.json b/package.json index ba851c2530..f246bed9d4 100644 --- a/package.json +++ b/package.json @@ -48,7 +48,7 @@ "@fullcalendar/list": "6.1.8", "@fullcalendar/timegrid": "6.1.8", "@lezer/highlight": "1.1.6", - "@lit-labs/context": "0.3.1", + "@lit-labs/context": "0.3.2", "@lit-labs/motion": "1.0.3", "@lit-labs/virtualizer": "2.0.2", "@lrnwebcomponents/simple-tooltip": "7.0.0", @@ -118,7 +118,7 @@ "js-yaml": "4.1.0", "leaflet": "1.9.4", "leaflet-draw": "1.0.4", - "lit": "2.7.4", + "lit": "2.7.5", "marked": "4.3.0", "memoize-one": "6.0.0", "node-vibrant": "3.2.1-alpha.1", @@ -156,13 +156,13 @@ "@babel/preset-typescript": "7.21.5", "@koa/cors": "4.0.0", "@octokit/auth-oauth-device": "4.0.4", - "@octokit/plugin-retry": "4.1.3", + "@octokit/plugin-retry": "4.1.5", "@octokit/rest": "19.0.11", "@open-wc/dev-server-hmr": "0.1.4", "@rollup/plugin-babel": "6.0.3", "@rollup/plugin-commonjs": "25.0.0", "@rollup/plugin-json": "6.0.0", - "@rollup/plugin-node-resolve": "15.0.2", + "@rollup/plugin-node-resolve": "15.1.0", "@rollup/plugin-replace": "5.0.2", "@types/babel__plugin-transform-runtime": "7.9.2", "@types/chromecast-caf-receiver": "6.0.9", @@ -180,8 +180,8 @@ "@types/sortablejs": "1.15.1", "@types/tar": "6.1.5", "@types/webspeechapi": "0.0.29", - "@typescript-eslint/eslint-plugin": "5.59.7", - "@typescript-eslint/parser": "5.59.7", + "@typescript-eslint/eslint-plugin": "5.59.8", + "@typescript-eslint/parser": "5.59.8", "@web/dev-server": "0.1.38", "@web/dev-server-rollup": "0.4.1", "babel-loader": "9.1.2", diff --git a/pyproject.toml b/pyproject.toml index 8a0190bd63..bfaaa029d6 100644 --- a/pyproject.toml +++ b/pyproject.toml @@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta" [project] name = "home-assistant-frontend" -version = "20230601.1" +version = "20230605.0" license = {text = "Apache-2.0"} description = "The Home Assistant frontend" readme = "README.md" diff --git a/src/common/integrations/protocolIntegrationPicked.ts b/src/common/integrations/protocolIntegrationPicked.ts index 558bee552d..d6125b172b 100644 --- a/src/common/integrations/protocolIntegrationPicked.ts +++ b/src/common/integrations/protocolIntegrationPicked.ts @@ -17,7 +17,7 @@ export const protocolIntegrationPicked = async ( element: HTMLElement, hass: HomeAssistant, domain: string, - options?: { brand?: string; domain?: string } + options?: { brand?: string; domain?: string; config_entry?: string } ) => { if (options?.domain) { const localize = await hass.loadBackendTranslation("title", options.domain); @@ -32,11 +32,16 @@ export const protocolIntegrationPicked = async ( } if (domain === "zwave_js") { - const entries = await getConfigEntries(hass, { - domain, - }); + const entries = options?.config_entry + ? undefined + : await getConfigEntries(hass, { + domain, + }); - if (!isComponentLoaded(hass, "zwave_js") || !entries.length) { + if ( + !isComponentLoaded(hass, "zwave_js") || + (!options?.config_entry && !entries?.length) + ) { // If the component isn't loaded, ask them to load the integration first showConfirmationDialog(element, { title: hass.localize( @@ -71,14 +76,19 @@ export const protocolIntegrationPicked = async ( } showZWaveJSAddNodeDialog(element, { - entry_id: entries[0].entry_id, + entry_id: options?.config_entry || entries![0].entry_id, }); } else if (domain === "zha") { - const entries = await getConfigEntries(hass, { - domain, - }); + const entries = options?.config_entry + ? undefined + : await getConfigEntries(hass, { + domain, + }); - if (!isComponentLoaded(hass, "zha") || !entries.length) { + if ( + !isComponentLoaded(hass, "zha") || + (!options?.config_entry && !entries?.length) + ) { // If the component isn't loaded, ask them to load the integration first showConfirmationDialog(element, { title: hass.localize( @@ -117,10 +127,15 @@ export const protocolIntegrationPicked = async ( navigate("/config/zha/add"); } else if (domain === "matter") { - const entries = await getConfigEntries(hass, { - domain, - }); - if (!isComponentLoaded(hass, domain) || !entries.length) { + const entries = options?.config_entry + ? undefined + : await getConfigEntries(hass, { + domain, + }); + if ( + !isComponentLoaded(hass, domain) || + (!options?.config_entry && !entries?.length) + ) { // If the component isn't loaded, ask them to load the integration first showConfirmationDialog(element, { title: hass.localize( diff --git a/src/components/ha-hs-color-picker.ts b/src/components/ha-hs-color-picker.ts index 76bd2a4c6c..ad739818df 100644 --- a/src/components/ha-hs-color-picker.ts +++ b/src/components/ha-hs-color-picker.ts @@ -176,7 +176,7 @@ class HaHsColorPicker extends LitElement { super.updated(changedProps); if ( changedProps.has("colorBrightness") || - changedProps.has("vw") || + changedProps.has("wv") || changedProps.has("ww") || changedProps.has("cw") || changedProps.has("minKelvin") || diff --git a/src/components/ha-markdown-element.ts b/src/components/ha-markdown-element.ts index 09b29a6ecc..1a4691c917 100644 --- a/src/components/ha-markdown-element.ts +++ b/src/components/ha-markdown-element.ts @@ -11,6 +11,9 @@ class HaMarkdownElement extends ReactiveElement { @property({ type: Boolean }) public breaks = false; + @property({ type: Boolean, attribute: "lazy-images" }) public lazyImages = + false; + protected createRenderRoot() { return this; } @@ -58,6 +61,9 @@ class HaMarkdownElement extends ReactiveElement { // Fire a resize event when images loaded to notify content resized } else if (node instanceof HTMLImageElement) { + if (this.lazyImages) { + node.loading = "lazy"; + } node.addEventListener("load", this._resize); } } diff --git a/src/components/ha-markdown.ts b/src/components/ha-markdown.ts index 795349d256..c248a320e8 100644 --- a/src/components/ha-markdown.ts +++ b/src/components/ha-markdown.ts @@ -15,6 +15,9 @@ export class HaMarkdown extends LitElement { @property({ type: Boolean }) public breaks = false; + @property({ type: Boolean, attribute: "lazy-images" }) public lazyImages = + false; + protected render() { if (!this.content) { return nothing; @@ -24,6 +27,7 @@ export class HaMarkdown extends LitElement { .content=${this.content} .allowSvg=${this.allowSvg} .breaks=${this.breaks} + .lazyImages=${this.lazyImages} >`; } diff --git a/src/components/ha-selector/ha-selector-device.ts b/src/components/ha-selector/ha-selector-device.ts index 741a8712bd..0af1b288a1 100644 --- a/src/components/ha-selector/ha-selector-device.ts +++ b/src/components/ha-selector/ha-selector-device.ts @@ -77,7 +77,9 @@ export class HaDeviceSelector extends LitElement { .label=${this.label} .helper=${this.helper} .deviceFilter=${this._filterDevices} - .entityFilter=${this._filterEntities} + .entityFilter=${this.selector.device?.entity + ? this._filterEntities + : undefined} .disabled=${this.disabled} .required=${this.required} allow-custom-entity @@ -92,7 +94,9 @@ export class HaDeviceSelector extends LitElement { .value=${this.value} .helper=${this.helper} .deviceFilter=${this._filterDevices} - .entityFilter=${this._filterEntities} + .entityFilter=${this.selector.device?.entity + ? this._filterEntities + : undefined} .disabled=${this.disabled} .required=${this.required} > @@ -115,14 +119,10 @@ export class HaDeviceSelector extends LitElement { ); }; - private _filterEntities = (entity: HassEntity): boolean => { - if (!this.selector.device?.entity) { - return true; - } - return ensureArray(this.selector.device.entity).some((filter) => + private _filterEntities = (entity: HassEntity): boolean => + ensureArray(this.selector.device!.entity).some((filter) => filterSelectorEntities(filter, entity, this._entitySources) ); - }; } declare global { diff --git a/src/data/light.ts b/src/data/light.ts index 64a9af075f..42a2507731 100644 --- a/src/data/light.ts +++ b/src/data/light.ts @@ -58,6 +58,10 @@ export const lightSupportsBrightness = (entity: LightEntity) => modesSupportingBrightness.includes(mode) ) || false; +export const lightSupportsFavoriteColors = (entity: LightEntity) => + lightSupportsColor(entity) || + lightSupportsColorMode(entity, LightColorMode.COLOR_TEMP); + export const getLightCurrentModeRgbColor = ( entity: LightEntity ): number[] | undefined => diff --git a/src/data/zha.ts b/src/data/zha.ts index c0382b00db..b3f7b084a7 100644 --- a/src/data/zha.ts +++ b/src/data/zha.ts @@ -169,9 +169,16 @@ export interface ZHANetworkBackup { node_info: ZHANetworkBackupNodeInfo; } +export interface ZHADeviceSettings { + path: string; + baudrate?: number; + flow_control?: string; +} + export interface ZHANetworkSettings { settings: ZHANetworkBackup; radio_type: "ezsp" | "znp" | "deconz" | "zigate" | "xbee"; + device: ZHADeviceSettings; } export interface ZHANetworkBackupAndMetadata { diff --git a/src/dialogs/more-info/components/lights/light-color-picker.ts b/src/dialogs/more-info/components/lights/light-color-picker.ts index 20959181b7..720cd2a5bb 100644 --- a/src/dialogs/more-info/components/lights/light-color-picker.ts +++ b/src/dialogs/more-info/components/lights/light-color-picker.ts @@ -603,6 +603,7 @@ class LightColorPicker extends LitElement { input[type="color"] { appearance: none; -webkit-appearance: none; + -moz-appearance: none; border: none; outline: none; display: block; @@ -628,6 +629,10 @@ class LightColorPicker extends LitElement { background: none; } + input[type="color"]::-moz-color-swatch { + display: none; + } + input[type="color"]::-webkit-color-swatch { border: none; } diff --git a/src/dialogs/more-info/const.ts b/src/dialogs/more-info/const.ts index e9304a55fc..8675c499e1 100644 --- a/src/dialogs/more-info/const.ts +++ b/src/dialogs/more-info/const.ts @@ -34,6 +34,8 @@ export const DOMAINS_WITH_MORE_INFO = [ "configurator", "counter", "cover", + "date", + "datetime", "fan", "group", "humidifier", @@ -49,6 +51,7 @@ export const DOMAINS_WITH_MORE_INFO = [ "siren", "sun", "switch", + "time", "timer", "update", "vacuum", diff --git a/src/dialogs/more-info/controls/more-info-date.ts b/src/dialogs/more-info/controls/more-info-date.ts new file mode 100644 index 0000000000..b53829b557 --- /dev/null +++ b/src/dialogs/more-info/controls/more-info-date.ts @@ -0,0 +1,51 @@ +import { HassEntity } from "home-assistant-js-websocket"; +import { css, CSSResultGroup, html, LitElement, nothing } from "lit"; +import { customElement, property } from "lit/decorators"; +import "../../../components/ha-date-input"; +import "../../../components/ha-time-input"; +import { setDateValue } from "../../../data/date"; +import { isUnavailableState } from "../../../data/entity"; +import type { HomeAssistant } from "../../../types"; + +@customElement("more-info-date") +class MoreInfoDate extends LitElement { + @property({ attribute: false }) public hass!: HomeAssistant; + + @property({ attribute: false }) public stateObj?: HassEntity; + + protected render() { + if (!this.stateObj || isUnavailableState(this.stateObj.state)) { + return nothing; + } + + return html` + + + `; + } + + private _dateChanged(ev: CustomEvent<{ value: string }>): void { + setDateValue(this.hass!, this.stateObj!.entity_id, ev.detail.value); + } + + static get styles(): CSSResultGroup { + return css` + :host { + display: flex; + align-items: center; + justify-content: flex-end; + } + `; + } +} + +declare global { + interface HTMLElementTagNameMap { + "more-info-date": MoreInfoDate; + } +} diff --git a/src/dialogs/more-info/controls/more-info-datetime.ts b/src/dialogs/more-info/controls/more-info-datetime.ts new file mode 100644 index 0000000000..b0b25f9bc9 --- /dev/null +++ b/src/dialogs/more-info/controls/more-info-datetime.ts @@ -0,0 +1,80 @@ +import { format } from "date-fns"; +import { HassEntity } from "home-assistant-js-websocket"; +import { css, CSSResultGroup, html, LitElement, nothing } from "lit"; +import { customElement, property } from "lit/decorators"; +import "../../../components/ha-date-input"; +import "../../../components/ha-time-input"; +import { setDateTimeValue } from "../../../data/datetime"; +import { isUnavailableState } from "../../../data/entity"; +import type { HomeAssistant } from "../../../types"; + +@customElement("more-info-datetime") +class MoreInfoDatetime extends LitElement { + @property({ attribute: false }) public hass!: HomeAssistant; + + @property({ attribute: false }) public stateObj?: HassEntity; + + protected render() { + if (!this.stateObj || isUnavailableState(this.stateObj.state)) { + return nothing; + } + + const dateObj = new Date(this.stateObj.state); + const time = format(dateObj, "HH:mm:ss"); + const date = format(dateObj, "yyyy-MM-dd"); + + return html` + + `; + } + + private _stopEventPropagation(ev: Event): void { + ev.stopPropagation(); + } + + private _timeChanged(ev: CustomEvent<{ value: string }>): void { + const dateObj = new Date(this.stateObj!.state); + const newTime = ev.detail.value.split(":").map(Number); + dateObj.setHours(newTime[0], newTime[1], newTime[2]); + + setDateTimeValue(this.hass!, this.stateObj!.entity_id, dateObj); + } + + private _dateChanged(ev: CustomEvent<{ value: string }>): void { + const dateObj = new Date(this.stateObj!.state); + const newDate = ev.detail.value.split("-").map(Number); + dateObj.setFullYear(newDate[0], newDate[1] - 1, newDate[2]); + + setDateTimeValue(this.hass!, this.stateObj!.entity_id, dateObj); + } + + static get styles(): CSSResultGroup { + return css` + :host { + display: flex; + align-items: center; + justify-content: flex-end; + } + ha-date-input + ha-time-input { + margin-left: 4px; + } + `; + } +} + +declare global { + interface HTMLElementTagNameMap { + "more-info-datetime": MoreInfoDatetime; + } +} diff --git a/src/dialogs/more-info/controls/more-info-input_datetime.ts b/src/dialogs/more-info/controls/more-info-input_datetime.ts index 4ced398678..68926174d8 100644 --- a/src/dialogs/more-info/controls/more-info-input_datetime.ts +++ b/src/dialogs/more-info/controls/more-info-input_datetime.ts @@ -22,37 +22,32 @@ class MoreInfoInputDatetime extends LitElement { } return html` - ${ - this.stateObj.attributes.has_date - ? html` - - - ` - : `` - } - ${ - this.stateObj.attributes.has_time - ? html` - - ` - : `` - } - + ${this.stateObj.attributes.has_date + ? html` + + + ` + : ``} + ${this.stateObj.attributes.has_time + ? html` + + ` + : ``} `; } diff --git a/src/dialogs/more-info/controls/more-info-light.ts b/src/dialogs/more-info/controls/more-info-light.ts index 1614eaeb3b..f40b41977b 100644 --- a/src/dialogs/more-info/controls/more-info-light.ts +++ b/src/dialogs/more-info/controls/more-info-light.ts @@ -37,6 +37,7 @@ import { lightSupportsBrightness, lightSupportsColor, lightSupportsColorMode, + lightSupportsFavoriteColors, } from "../../../data/light"; import type { HomeAssistant } from "../../../types"; import { moreInfoControlStyle } from "../components/ha-more-info-control-style"; @@ -206,7 +207,9 @@ class MoreInfoLight extends LitElement { ` : nothing} - ${this.entry && (this.editMode || hasFavoriteColors) + ${this.entry && + lightSupportsFavoriteColors(this.stateObj) && + (this.editMode || hasFavoriteColors) ? html` + `; + } + + private _stopEventPropagation(ev: Event): void { + ev.stopPropagation(); + } + + private _timeChanged(ev: CustomEvent<{ value: string }>): void { + setTimeValue(this.hass!, this.stateObj!.entity_id, ev.detail.value); + } + + static get styles(): CSSResultGroup { + return css` + :host { + display: flex; + align-items: center; + justify-content: flex-end; + } + `; + } +} + +declare global { + interface HTMLElementTagNameMap { + "more-info-time": MoreInfoTime; + } +} diff --git a/src/dialogs/more-info/ha-more-info-dialog.ts b/src/dialogs/more-info/ha-more-info-dialog.ts index 5338208c12..748d51d1c0 100644 --- a/src/dialogs/more-info/ha-more-info-dialog.ts +++ b/src/dialogs/more-info/ha-more-info-dialog.ts @@ -32,6 +32,7 @@ import { ExtEntityRegistryEntry, getExtendedEntityRegistryEntry, } from "../../data/entity_registry"; +import { lightSupportsFavoriteColors } from "../../data/light"; import { SearchableDomains } from "../../data/search"; import { haStyleDialog } from "../../resources/styles"; import "../../state-summary/state-card-content"; @@ -359,7 +360,10 @@ export class MoreInfoDialog extends LitElement { ` : nothing} - ${this._entry && domain === "light" + ${this._entry && + stateObj && + domain === "light" && + lightSupportsFavoriteColors(stateObj) ? html` import("./controls/more-info-configurator"), counter: () => import("./controls/more-info-counter"), cover: () => import("./controls/more-info-cover"), + date: () => import("./controls/more-info-date"), + datetime: () => import("./controls/more-info-datetime"), fan: () => import("./controls/more-info-fan"), group: () => import("./controls/more-info-group"), humidifier: () => import("./controls/more-info-humidifier"), @@ -27,6 +29,7 @@ const LAZY_LOADED_MORE_INFO_CONTROL = { siren: () => import("./controls/more-info-siren"), sun: () => import("./controls/more-info-sun"), switch: () => import("./controls/more-info-switch"), + time: () => import("./controls/more-info-time"), timer: () => import("./controls/more-info-timer"), update: () => import("./controls/more-info-update"), vacuum: () => import("./controls/more-info-vacuum"), diff --git a/src/dialogs/notifications/notification-drawer.ts b/src/dialogs/notifications/notification-drawer.ts index ccbb0b2533..5b4eacb27e 100644 --- a/src/dialogs/notifications/notification-drawer.ts +++ b/src/dialogs/notifications/notification-drawer.ts @@ -1,7 +1,7 @@ import "@material/mwc-button"; import { UnsubscribeFunc } from "home-assistant-js-websocket"; import { LitElement, html, css, nothing } from "lit"; -import { customElement, property, state } from "lit/decorators"; +import { customElement, property, query, state } from "lit/decorators"; import { fireEvent } from "../../common/dom/fire_event"; import { computeDomain } from "../../common/entity/compute_domain"; import "../../components/ha-icon-button-prev"; @@ -13,6 +13,7 @@ import { HomeAssistant } from "../../types"; import "./notification-item"; import "../../components/ha-header-bar"; import "../../components/ha-drawer"; +import type { HaDrawer } from "../../components/ha-drawer"; @customElement("notification-drawer") export class HuiNotificationDrawer extends LitElement { @@ -22,6 +23,8 @@ export class HuiNotificationDrawer extends LitElement { @state() private _open = false; + @query("ha-drawer") private _drawer?: HaDrawer; + private _unsubNotifications?: UnsubscribeFunc; connectedCallback() { @@ -53,12 +56,14 @@ export class HuiNotificationDrawer extends LitElement { } closeDialog = () => { + if (this._drawer) { + this._drawer.open = false; + } if (this._unsubNotifications) { this._unsubNotifications(); this._unsubNotifications = undefined; } this._notifications = []; - this._open = false; fireEvent(this, "dialog-closed", { dialog: this.localName }); }; @@ -87,11 +92,7 @@ export class HuiNotificationDrawer extends LitElement { }); return html` - +
${this.hass.localize("ui.notification_drawer.title")} @@ -99,7 +100,7 @@ export class HuiNotificationDrawer extends LitElement { @@ -132,9 +133,9 @@ export class HuiNotificationDrawer extends LitElement { `; } - private _closeDrawer(ev) { + private _dialogClosed(ev: Event) { ev.stopPropagation(); - this.closeDialog(); + this._open = false; } private _dismissAll() { diff --git a/src/onboarding/onboarding-core-config.ts b/src/onboarding/onboarding-core-config.ts index eef93d1b54..46621294f4 100644 --- a/src/onboarding/onboarding-core-config.ts +++ b/src/onboarding/onboarding-core-config.ts @@ -128,9 +128,9 @@ class OnboardingCoreConfig extends LitElement {
- ) { + const target = ev.currentTarget as HTMLElement; this[`_${target.getAttribute("name")}`] = ev.detail.value; } - private _handleChange(ev: ValueChangedEvent) { + private _handleChange(ev: Event) { const target = ev.currentTarget as HaTextField; this[`_${target.name}`] = target.value; } diff --git a/src/panels/config/core/ha-config-section-general.ts b/src/panels/config/core/ha-config-section-general.ts index 59899d0984..1d9e3794c0 100644 --- a/src/panels/config/core/ha-config-section-general.ts +++ b/src/panels/config/core/ha-config-section-general.ts @@ -27,7 +27,8 @@ import { ConfigUpdateValues, saveCoreConfig } from "../../../data/core"; import { showConfirmationDialog } from "../../../dialogs/generic/show-dialog-box"; import "../../../layouts/hass-subpage"; import { haStyle } from "../../../resources/styles"; -import type { HomeAssistant } from "../../../types"; +import type { HomeAssistant, ValueChangedEvent } from "../../../types"; +import type { HaTextField } from "../../../components/ha-textfield"; @customElement("ha-config-section-general") class HaConfigSectionGeneral extends LitElement { @@ -301,13 +302,13 @@ class HaConfigSectionGeneral extends LitElement { this._updateUnits = true; } - private _handleValueChanged(ev) { - const target = ev.currentTarget; - this[`_${target.name}`] = ev.detail.value; + private _handleValueChanged(ev: ValueChangedEvent) { + const target = ev.currentTarget as HTMLElement; + this[`_${target.getAttribute("name")}`] = ev.detail.value; } - private _handleChange(ev) { - const target = ev.currentTarget; + private _handleChange(ev: Event) { + const target = ev.currentTarget as HaTextField; this[`_${target.name}`] = target.value; } diff --git a/src/panels/config/devices/ha-config-devices-dashboard.ts b/src/panels/config/devices/ha-config-devices-dashboard.ts index bd1402d0e1..0a2a027e30 100644 --- a/src/panels/config/devices/ha-config-devices-dashboard.ts +++ b/src/panels/config/devices/ha-config-devices-dashboard.ts @@ -1,11 +1,15 @@ +import "@lrnwebcomponents/simple-tooltip/simple-tooltip"; import type { RequestSelectedDetail } from "@material/mwc-list/mwc-list-item"; import { mdiCancel, mdiFilterVariant, mdiPlus } from "@mdi/js"; -import "@lrnwebcomponents/simple-tooltip/simple-tooltip"; import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit"; import { customElement, property, state } from "lit/decorators"; import memoizeOne from "memoize-one"; import { HASSDomEvent } from "../../../common/dom/fire_event"; import { computeStateDomain } from "../../../common/entity/compute_state_domain"; +import { + protocolIntegrationPicked, + PROTOCOL_INTEGRATIONS, +} from "../../../common/integrations/protocolIntegrationPicked"; import { navigate } from "../../../common/navigate"; import { blankBeforePercent } from "../../../common/translations/blank_before_percent"; import { LocalizeFunc } from "../../../common/translations/localize"; @@ -39,8 +43,6 @@ import { HomeAssistant, Route } from "../../../types"; import { brandsUrl } from "../../../util/brands-url"; import { configSections } from "../ha-panel-config"; import "../integrations/ha-integration-overflow-menu"; -import { showMatterAddDeviceDialog } from "../integrations/integration-panels/matter/show-dialog-add-matter-device"; -import { showZWaveJSAddNodeDialog } from "../integrations/integration-panels/zwave_js/show-dialog-zwave_js-add-node"; import { showAddIntegrationDialog } from "../integrations/show-add-integration-dialog"; interface DeviceRowData extends DeviceRegistryEntry { @@ -186,6 +188,8 @@ export class HaConfigDeviceDashboard extends LitElement { let filterConfigEntry: ConfigEntry | undefined; + const filteredDomains = new Set(); + filters.forEach((value, key) => { if (key === "config_entry") { outputDevices = outputDevices.filter((device) => @@ -193,6 +197,9 @@ export class HaConfigDeviceDashboard extends LitElement { ); startLength = outputDevices.length; filterConfigEntry = entries.find((entry) => entry.entry_id === value); + if (filterConfigEntry) { + filteredDomains.add(filterConfigEntry.domain); + } } if (key === "domain") { const entryIds = entries @@ -202,6 +209,7 @@ export class HaConfigDeviceDashboard extends LitElement { device.config_entries.some((entryId) => entryIds.includes(entryId)) ); startLength = outputDevices.length; + filteredDomains.add(value); } }); @@ -251,6 +259,7 @@ export class HaConfigDeviceDashboard extends LitElement { return { devicesOutput: outputDevices, filteredConfigEntry: filterConfigEntry, + filteredDomains, }; } ); @@ -546,25 +555,25 @@ export class HaConfigDeviceDashboard extends LitElement { } private _addDevice() { - const { filteredConfigEntry } = this._devicesAndFilterDomains( - this.devices, - this.entries, - this.entities, - this.areas, - this._searchParms, - this._showDisabled, - this.hass.localize - ); - if (filteredConfigEntry?.domain === "zha") { - navigate(`/config/zha/add`); - return; - } - if (filteredConfigEntry?.domain === "zwave_js") { - this._showZJSAddDeviceDialog(filteredConfigEntry); - return; - } - if (filteredConfigEntry?.domain === "matter") { - showMatterAddDeviceDialog(this); + const { filteredConfigEntry, filteredDomains } = + this._devicesAndFilterDomains( + this.devices, + this.entries, + this.entities, + this.areas, + this._searchParms, + this._showDisabled, + this.hass.localize + ); + if ( + filteredDomains.size === 1 && + (PROTOCOL_INTEGRATIONS as ReadonlyArray).includes( + [...filteredDomains][0] + ) + ) { + protocolIntegrationPicked(this, this.hass, [...filteredDomains][0], { + config_entry: filteredConfigEntry?.entry_id, + }); return; } showAddIntegrationDialog(this, { @@ -572,12 +581,6 @@ export class HaConfigDeviceDashboard extends LitElement { }); } - private _showZJSAddDeviceDialog(filteredConfigEntry: ConfigEntry) { - showZWaveJSAddNodeDialog(this, { - entry_id: filteredConfigEntry!.entry_id, - }); - } - static get styles(): CSSResultGroup { return [ css` diff --git a/src/panels/config/entities/ha-config-entities.ts b/src/panels/config/entities/ha-config-entities.ts index 2afab3ca2c..fb4673059b 100644 --- a/src/panels/config/entities/ha-config-entities.ts +++ b/src/panels/config/entities/ha-config-entities.ts @@ -67,6 +67,11 @@ import { haStyle } from "../../../resources/styles"; import type { HomeAssistant, Route } from "../../../types"; import { configSections } from "../ha-panel-config"; import "../integrations/ha-integration-overflow-menu"; +import { + protocolIntegrationPicked, + PROTOCOL_INTEGRATIONS, +} from "../../../common/integrations/protocolIntegrationPicked"; +import { showAddIntegrationDialog } from "../integrations/show-add-integration-dialog"; export interface StateEntity extends Omit { @@ -348,7 +353,8 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { ? entities.concat(stateEntities) : entities; - const filteredDomains: string[] = []; + let filteredConfigEntry: ConfigEntry | undefined; + const filteredDomains = new Set(); filters.forEach((value, key) => { if (key === "config_entry") { @@ -373,7 +379,8 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { const configEntry = entries.find((entry) => entry.entry_id === value); if (configEntry) { - filteredDomains.push(configEntry.domain); + filteredDomains.add(configEntry.domain); + filteredConfigEntry = configEntry; } } if (key === "domain") { @@ -389,7 +396,7 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { entity.config_entry_id && entryIds.includes(entity.config_entry_id) ); - filteredDomains.push(value); + filteredDomains.add(value); startLength = filteredEntities.length; } }); @@ -444,7 +451,7 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { } this._numHiddenEntities = startLength - result.length; - return { filteredEntities: result, filteredDomains: filteredDomains }; + return { filteredEntities: result, filteredConfigEntry, filteredDomains }; } ); @@ -509,7 +516,11 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { this._entries ); - const includeZHAFab = filteredDomains.includes("zha"); + const includeAddDeviceFab = + filteredDomains.size === 1 && + (PROTOCOL_INTEGRATIONS as ReadonlyArray).includes( + [...filteredDomains][0] + ); return html` `} - ${includeZHAFab - ? html` - - - - ` + ${includeAddDeviceFab + ? html` + + ` : nothing} `; @@ -959,6 +970,36 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { this._showHidden = true; } + private _addDevice() { + const { filteredConfigEntry, filteredDomains } = + this._filteredEntitiesAndDomains( + this._entities!, + this._devices, + this._areas, + this._stateEntities, + this._searchParms, + this._showDisabled, + this._showUnavailable, + this._showReadOnly, + this._showHidden, + this._entries + ); + if ( + filteredDomains.size === 1 && + (PROTOCOL_INTEGRATIONS as ReadonlyArray).includes( + [...filteredDomains][0] + ) + ) { + protocolIntegrationPicked(this, this.hass, [...filteredDomains][0], { + config_entry: filteredConfigEntry?.entry_id, + }); + return; + } + showAddIntegrationDialog(this, { + domain: this._searchParms.get("domain") || undefined, + }); + } + static get styles(): CSSResultGroup { return [ haStyle, diff --git a/src/panels/config/integrations/ha-config-integration-page.ts b/src/panels/config/integrations/ha-config-integration-page.ts index b5ecc21f75..1f1e13b0cd 100644 --- a/src/panels/config/integrations/ha-config-integration-page.ts +++ b/src/panels/config/integrations/ha-config-integration-page.ts @@ -10,16 +10,18 @@ import { mdiCloud, mdiCog, mdiDelete, + mdiDevices, mdiDotsVertical, mdiDownload, + mdiHandExtendedOutline, mdiOpenInNew, mdiPackageVariant, mdiPlayCircleOutline, - mdiPlus, mdiProgressHelper, mdiReload, mdiReloadAlert, mdiRenameBox, + mdiShapeOutline, mdiStopCircleOutline, } from "@mdi/js"; import { UnsubscribeFunc } from "home-assistant-js-websocket"; @@ -213,6 +215,27 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) { ERROR_STATES.includes(entry.state) ); + const normalEntries = configEntries + .filter( + (entry) => + entry.source !== "ignore" && !ERROR_STATES.includes(entry.state) + ) + .sort((a, b) => { + if (Boolean(a.disabled_by) !== Boolean(b.disabled_by)) { + return a.disabled_by ? 1 : -1; + } + return caseInsensitiveStringCompare( + a.title, + b.title, + this.hass.locale.language + ); + }); + + const devices = this._getDevices(configEntries, this.hass.devices); + const entities = this._getEntities(configEntries, this._entities); + + const services = !devices.some((device) => device.entry_type !== "service"); + return html`
- +
- ${this._logInfo - ? html` 0 + ? html` - ${this._logInfo.level === LogSeverity.DEBUG - ? this.hass.localize( - "ui.panel.config.integrations.config_entry.disable_debug_logging" - ) - : this.hass.localize( - "ui.panel.config.integrations.config_entry.enable_debug_logging" - )} - - ` + + + ${this.hass.localize( + `ui.panel.config.integrations.config_entry.${ + services ? "services" : "devices" + }`, + "count", + devices.length + )} + + + ` + : ""} + ${entities.length > 0 + ? html` + + + ${this.hass.localize( + `ui.panel.config.integrations.config_entry.entities`, + "count", + entities.length + )} + + + ` : ""} ${this._manifest ? html` ` : ""} + ${this._logInfo + ? html` + ${this._logInfo.level === LogSeverity.DEBUG + ? this.hass.localize( + "ui.panel.config.integrations.config_entry.disable_debug_logging" + ) + : this.hass.localize( + "ui.panel.config.integrations.config_entry.enable_debug_logging" + )} + + ` + : ""}
@@ -410,43 +478,38 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {

- ${this.hass.localize( - `ui.panel.config.integrations.integration_page.entries` - )} + ${this._manifest?.integration_type + ? this.hass.localize( + `ui.panel.config.integrations.integration_page.entries_${this._manifest?.integration_type}` + ) + : this.hass.localize( + `ui.panel.config.integrations.integration_page.entries` + )}

- ${configEntries.length === 0 + ${normalEntries.length === 0 ? html`
${this.hass.localize( - `ui.panel.config.integrations.integration_page.no_entries` + "ui.panel.config.integrations.integration_page.no_entries" )}
` : nothing} - ${configEntries - .filter((entry) => !ERROR_STATES.includes(entry.state)) - .sort((a, b) => { - if (Boolean(a.disabled_by) !== Boolean(b.disabled_by)) { - return a.disabled_by ? 1 : -1; - } - return caseInsensitiveStringCompare( - a.title, - b.title, - this.hass.locale.language - ); - }) - .map((item) => this._renderConfigEntry(item))} + ${normalEntries.map((item) => this._renderConfigEntry(item))} +
+ + ${this._manifest?.integration_type + ? this.hass.localize( + `ui.panel.config.integrations.integration_page.add_${this._manifest?.integration_type}` + ) + : this.hass.localize( + `ui.panel.config.integrations.integration_page.add_entry` + )} + +
- - - `; } @@ -464,21 +527,7 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) { let stateTextExtra: TemplateResult | string | undefined; let icon: string = mdiAlertCircle; - if (item.disabled_by) { - stateText = [ - "ui.panel.config.integrations.config_entry.disable.disabled_cause", - "cause", - this.hass.localize( - `ui.panel.config.integrations.config_entry.disable.disabled_by.${item.disabled_by}` - ) || item.disabled_by, - ]; - if (item.state === "failed_unload") { - stateTextExtra = html`. - ${this.hass.localize( - "ui.panel.config.integrations.config_entry.disable_restart_confirm" - )}.`; - } - } else if (item.state === "not_loaded") { + if (!item.disabled_by && item.state === "not_loaded") { stateText = ["ui.panel.config.integrations.config_entry.not_loaded"]; } else if (item.state === "setup_in_progress") { icon = mdiProgressHelper; @@ -508,66 +557,87 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) { } } - const devices = this._getDevices(item, this.hass.devices); - const services = this._getServices(item, this.hass.devices); - const entities = this._getEntities(item, this._entities); + const devices = this._getConfigEntryDevices(item); + const services = this._getConfigEntryServices(item); + const entities = this._getConfigEntryEntities(item); let devicesLine: (TemplateResult | string)[] = []; - for (const [items, localizeKey] of [ - [devices, "devices"], - [services, "services"], - ] as const) { - if (items.length === 0) { - continue; + if (item.disabled_by) { + devicesLine.push( + this.hass.localize( + "ui.panel.config.integrations.config_entry.disable.disabled_cause", + { + cause: + this.hass.localize( + `ui.panel.config.integrations.config_entry.disable.disabled_by.${item.disabled_by}` + ) || item.disabled_by, + } + ) + ); + if (item.state === "failed_unload") { + devicesLine.push(`. + ${this.hass.localize( + "ui.panel.config.integrations.config_entry.disable_restart_confirm" + )}.`); + } + } else { + for (const [items, localizeKey] of [ + [devices, "devices"], + [services, "services"], + ] as const) { + if (items.length === 0) { + continue; + } + const url = + items.length === 1 + ? `/config/devices/device/${items[0].id}` + : `/config/devices/dashboard?historyBack=1&config_entry=${item.entry_id}`; + devicesLine.push( + // no white space before/after template on purpose + html`${this.hass.localize( + `ui.panel.config.integrations.config_entry.${localizeKey}`, + "count", + items.length + )}` + ); + } + + if (entities.length) { + devicesLine.push( + // no white space before/after template on purpose + html`${this.hass.localize( + "ui.panel.config.integrations.config_entry.entities", + "count", + entities.length + )}` + ); + } + + if (devicesLine.length === 0) { + devicesLine = ["No devices or entities"]; + } else if (devicesLine.length === 2) { + devicesLine = [ + devicesLine[0], + ` ${this.hass.localize("ui.common.and")} `, + devicesLine[1], + ]; + } else if (devicesLine.length === 3) { + devicesLine = [ + devicesLine[0], + ", ", + devicesLine[1], + ` ${this.hass.localize("ui.common.and")} `, + devicesLine[2], + ]; } - const url = - items.length === 1 - ? `/config/devices/device/${items[0].id}` - : `/config/devices/dashboard?historyBack=1&config_entry=${item.entry_id}`; - devicesLine.push( - // no white space before/after template on purpose - html`${this.hass.localize( - `ui.panel.config.integrations.config_entry.${localizeKey}`, - "count", - items.length - )}` - ); } - if (entities.length) { - devicesLine.push( - // no white space before/after template on purpose - html`${this.hass.localize( - "ui.panel.config.integrations.config_entry.entities", - "count", - entities.length - )}` - ); - } - - if (devicesLine.length === 0) { - devicesLine = ["No devices or entities"]; - } else if (devicesLine.length === 2) { - devicesLine = [ - devicesLine[0], - ` ${this.hass.localize("ui.common.and")} `, - devicesLine[1], - ]; - } else if (devicesLine.length === 3) { - devicesLine = [ - devicesLine[0], - ", ", - devicesLine[1], - ` ${this.hass.localize("ui.common.and")} `, - devicesLine[2], - ]; - } return html`` : ""} + ${item.disabled_by && devices.length + ? html` + + + ${this.hass.localize( + `ui.panel.config.integrations.config_entry.devices`, + "count", + devices.length + )} + + + ` + : ""} + ${item.disabled_by && services.length + ? html` + + + ${this.hass.localize( + `ui.panel.config.integrations.config_entry.services`, + "count", + services.length + )} + + + ` + : ""} + ${item.disabled_by && entities.length + ? html` + + + ${this.hass.localize( + `ui.panel.config.integrations.config_entry.entities`, + "count", + entities.length + )} + + + ` + : ""} ${!item.disabled_by && RECOVERABLE_STATES.includes(item.state) && item.supports_unload && @@ -807,49 +933,77 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) { private _getEntities = memoizeOne( ( - configEntry: ConfigEntry, + configEntry: ConfigEntry[], entityRegistryEntries: EntityRegistryEntry[] ): EntityRegistryEntry[] => { if (!entityRegistryEntries) { return []; } + const entryIds = configEntry.map((entry) => entry.entry_id); return entityRegistryEntries.filter( - (entity) => entity.config_entry_id === configEntry.entry_id + (entity) => + entity.config_entry_id && entryIds.includes(entity.config_entry_id) ); } ); private _getDevices = memoizeOne( ( - configEntry: ConfigEntry, + configEntry: ConfigEntry[], deviceRegistryEntries: HomeAssistant["devices"] ): DeviceRegistryEntry[] => { if (!deviceRegistryEntries) { return []; } - return Object.values(deviceRegistryEntries).filter( - (device) => - device.config_entries.includes(configEntry.entry_id) && - device.entry_type !== "service" + const entryIds = configEntry.map((entry) => entry.entry_id); + return Object.values(deviceRegistryEntries).filter((device) => + device.config_entries.some((entryId) => entryIds.includes(entryId)) ); } ); - private _getServices = memoizeOne( - ( - configEntry: ConfigEntry, - deviceRegistryEntries: HomeAssistant["devices"] - ): DeviceRegistryEntry[] => { - if (!deviceRegistryEntries) { - return []; - } - return Object.values(deviceRegistryEntries).filter( - (device) => - device.config_entries.includes(configEntry.entry_id) && - device.entry_type === "service" - ); - } - ); + private _getConfigEntryEntities = ( + configEntry: ConfigEntry + ): EntityRegistryEntry[] => { + const entries = this._domainConfigEntries( + this.domain, + this._extraConfigEntries || this.configEntries + ); + const entityRegistryEntries = this._getEntities(entries, this._entities); + return entityRegistryEntries.filter( + (entity) => entity.config_entry_id === configEntry.entry_id + ); + }; + + private _getConfigEntryDevices = ( + configEntry: ConfigEntry + ): DeviceRegistryEntry[] => { + const entries = this._domainConfigEntries( + this.domain, + this._extraConfigEntries || this.configEntries + ); + const deviceRegistryEntries = this._getDevices(entries, this.hass.devices); + return Object.values(deviceRegistryEntries).filter( + (device) => + device.config_entries.includes(configEntry.entry_id) && + device.entry_type !== "service" + ); + }; + + private _getConfigEntryServices = ( + configEntry: ConfigEntry + ): DeviceRegistryEntry[] => { + const entries = this._domainConfigEntries( + this.domain, + this._extraConfigEntries || this.configEntries + ); + const deviceRegistryEntries = this._getDevices(entries, this.hass.devices); + return Object.values(deviceRegistryEntries).filter( + (device) => + device.config_entries.includes(configEntry.entry_id) && + device.entry_type === "service" + ); + }; private _showOptions(ev) { showOptionsFlowDialog( @@ -1175,7 +1329,7 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) { display: flex; justify-content: center; } - .card-actions { + .overview .card-actions { padding: 0; } img { @@ -1199,6 +1353,9 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) { --mdc-list-item-meta-size: auto; --mdc-list-item-meta-display: flex; } + ha-button-menu ha-list-item { + --mdc-list-item-meta-size: 24px; + } ha-list-item.config_entry::after { position: absolute; top: 0; @@ -1221,6 +1378,9 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) { .attention { primary-color: var(--error-color); } + .warning { + color: var(--error-color); + } .state-error { --state-message-color: var(--error-color); --text-on-state-color: var(--text-primary-color); diff --git a/src/panels/config/integrations/ha-integration-card.ts b/src/panels/config/integrations/ha-integration-card.ts index 2d4a39b486..a0e1aae130 100644 --- a/src/panels/config/integrations/ha-integration-card.ts +++ b/src/panels/config/integrations/ha-integration-card.ts @@ -5,6 +5,7 @@ import { mdiCogOutline, mdiDevices, mdiHandExtendedOutline, + mdiPuzzleOutline, mdiShapeOutline, } from "@mdi/js"; import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit"; @@ -94,7 +95,9 @@ export class HaIntegrationCard extends LitElement { private _renderSingleEntry(): TemplateResult { const devices = this._getDevices(this.items, this.hass.devices); - const entities = this._getEntities(this.items, this.entityRegistryEntries); + const entities = devices.length + ? [] + : this._getEntities(this.items, this.entityRegistryEntries); const services = !devices.some((device) => device.entry_type !== "service"); @@ -121,8 +124,7 @@ export class HaIntegrationCard extends LitElement { ` - : ""} - ${entities.length > 0 + : entities.length > 0 ? html` @@ -139,7 +141,20 @@ export class HaIntegrationCard extends LitElement { ` - : ""} + : html` + + + ${this.hass.localize( + `ui.panel.config.integrations.config_entry.entries`, + "count", + this.items.length + )} + + + `}
`; } diff --git a/src/panels/config/integrations/ha-integration-header.ts b/src/panels/config/integrations/ha-integration-header.ts index fbc2217a3c..9aa8db3003 100644 --- a/src/panels/config/integrations/ha-integration-header.ts +++ b/src/panels/config/integrations/ha-integration-header.ts @@ -3,6 +3,7 @@ import { mdiCloud, mdiPackageVariant } from "@mdi/js"; import { css, html, LitElement, TemplateResult } from "lit"; import { customElement, property } from "lit/decorators"; import { classMap } from "lit/directives/class-map"; +import { computeRTL } from "../../../common/util/compute_rtl"; import "../../../components/ha-svg-icon"; import { domainToName, IntegrationManifest } from "../../../data/integration"; import { HomeAssistant } from "../../../types"; @@ -94,7 +95,10 @@ export class HaIntegrationHeader extends LitElement { ([icon, description]) => html` - ${description} @@ -184,6 +188,9 @@ export class HaIntegrationHeader extends LitElement { left: 40px; top: 40px; display: flex; + padding: 4px; + inset-inline-start: 40px; + inset-inline-end: initial; } .icons.cloud { background: var(--info-color); @@ -191,14 +198,18 @@ export class HaIntegrationHeader extends LitElement { .icons.double { background: var(--warning-color); left: 28px; + inset-inline-start: 28px; + inset-inline-end: initial; } .icons ha-svg-icon { width: 16px; height: 16px; - margin: 4px; + display: block; } .icons span:not(:first-child) ha-svg-icon { - margin-left: 0; + margin-left: 4px; + margin-inline-start: 4px; + margin-inline-end: inherit; } simple-tooltip { white-space: nowrap; diff --git a/src/panels/config/integrations/integration-panels/thread/thread-config-panel.ts b/src/panels/config/integrations/integration-panels/thread/thread-config-panel.ts index c51a84b241..27defda51a 100644 --- a/src/panels/config/integrations/integration-panels/thread/thread-config-panel.ts +++ b/src/panels/config/integrations/integration-panels/thread/thread-config-panel.ts @@ -501,7 +501,7 @@ export class ThreadConfigPanel extends SubscribeMixin(LitElement) { haStyle, css` .content { - padding: 24px 0 32px; + padding: 24px 8px 32px; max-width: 600px; margin: 0 auto; direction: ltr; diff --git a/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard.ts b/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard.ts index 7176894b84..0518935fca 100644 --- a/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard.ts +++ b/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard.ts @@ -46,6 +46,8 @@ import { } from "../../../../../data/zha"; import { showAlertDialog } from "../../../../../dialogs/generic/show-dialog-box"; +const MULTIPROTOCOL_ADDON_URL = "socket://core-silabs-multiprotocol:9999"; + export const zhaTabs: PageNavigation[] = [ { translationKey: "ui.panel.config.zha.network.caption", @@ -181,6 +183,25 @@ class ZHAConfigDashboard extends LitElement { >${this._networkSettings.radio_type} + + + Serial port + ${this._networkSettings.device.path} + + + ${this._networkSettings.device.baudrate && + !this._networkSettings.device.path.startsWith("socket://") + ? html` + + Baudrate + ${this._networkSettings.device.baudrate} + + ` + : ""}
` : ""}
@@ -255,6 +276,19 @@ class ZHAConfigDashboard extends LitElement { } private async _showChannelMigrationDialog(): Promise { + if (this._networkSettings!.device.path === MULTIPROTOCOL_ADDON_URL) { + showAlertDialog(this, { + title: this.hass.localize( + "ui.panel.config.zha.configuration_page.channel_dialog.title" + ), + text: this.hass.localize( + "ui.panel.config.zha.configuration_page.channel_dialog.text" + ), + warning: true, + }); + return; + } + showZHAChangeChannelDialog(this, { currentChannel: this._networkSettings!.settings.network_info.channel, }); diff --git a/src/panels/lovelace/cards/hui-map-card.ts b/src/panels/lovelace/cards/hui-map-card.ts index 7f1e2fc200..d84694d048 100644 --- a/src/panels/lovelace/cards/hui-map-card.ts +++ b/src/panels/lovelace/cards/hui-map-card.ts @@ -34,7 +34,10 @@ import { HistoryStates, subscribeHistoryStatesTimeWindow, } from "../../../data/history"; -import { hasConfigOrEntitiesChanged } from "../common/has-changed"; +import { + hasConfigChanged, + hasConfigOrEntitiesChanged, +} from "../common/has-changed"; import { HomeAssistant } from "../../../types"; import { findEntities } from "../common/find-entities"; import { processConfigEntities } from "../common/process-config-entities"; @@ -194,7 +197,15 @@ class HuiMapCard extends LitElement implements LovelaceCard { return true; } - return hasConfigOrEntitiesChanged(this, changedProps); + if (this._config?.geo_location_sources) { + if (oldHass.states !== this.hass.states) { + return true; + } + } + + return this._config?.entities + ? hasConfigOrEntitiesChanged(this, changedProps) + : hasConfigChanged(this, changedProps); } public connectedCallback() { diff --git a/src/panels/lovelace/common/has-changed.ts b/src/panels/lovelace/common/has-changed.ts index 36d2cfabda..1abf9d11ff 100644 --- a/src/panels/lovelace/common/has-changed.ts +++ b/src/panels/lovelace/common/has-changed.ts @@ -4,7 +4,10 @@ import { EntityRegistryDisplayEntry } from "../../../data/entity_registry"; import { HomeAssistant } from "../../../types"; import { processConfigEntities } from "./process-config-entities"; -function hasConfigChanged(element: any, changedProps: PropertyValues): boolean { +export function hasConfigChanged( + element: any, + changedProps: PropertyValues +): boolean { if (changedProps.has("_config")) { return true; } diff --git a/src/panels/lovelace/components/hui-generic-entity-row.ts b/src/panels/lovelace/components/hui-generic-entity-row.ts index 3d1c1e0d0c..347457cb3a 100644 --- a/src/panels/lovelace/components/hui-generic-entity-row.ts +++ b/src/panels/lovelace/components/hui-generic-entity-row.ts @@ -85,7 +85,7 @@ class HuiGenericEntityRow extends LitElement { tabindex=${ifDefined(pointer ? "0" : undefined)} > ${!this.hideName - ? html`
+ @@ -59,9 +57,7 @@ class HuiDateEntityRow extends LitElement implements LovelaceRow { } private _dateChanged(ev: CustomEvent<{ value: string }>): void { - const stateObj = this.hass!.states[this._config!.entity]; - - setDateValue(this.hass!, stateObj.entity_id, ev.detail.value); + setDateValue(this.hass!, this._config!.entity, ev.detail.value); } } diff --git a/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts b/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts index bf6b2845e8..e4aecd4cbf 100644 --- a/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts @@ -18,6 +18,7 @@ import "../components/hui-generic-entity-row"; import { createEntityNotFoundWarning } from "../components/hui-warning"; import type { EntityConfig, LovelaceRow } from "./types"; import "../../../components/ha-time-input"; +import { computeStateName } from "../../../common/entity/compute_state_name"; @customElement("hui-datetime-entity-row") class HuiInputDatetimeEntityRow extends LitElement implements LovelaceRow { @@ -51,30 +52,35 @@ class HuiInputDatetimeEntityRow extends LitElement implements LovelaceRow { `; } - const dateObj = new Date(stateObj.state); - const time = format(dateObj, "HH:mm:ss"); - const date = format(dateObj, "yyyy-MM-dd"); + const unavailable = isUnavailableState(stateObj.state); + + const dateObj = unavailable ? undefined : new Date(stateObj.state); + const time = dateObj ? format(dateObj, "HH:mm:ss") : ""; + const date = dateObj ? format(dateObj, "yyyy-MM-dd") : ""; return html` - - - +
+ + + +
`; } @@ -103,12 +109,17 @@ class HuiInputDatetimeEntityRow extends LitElement implements LovelaceRow { static get styles(): CSSResultGroup { return css` - ha-date-input + ha-time-input { + ha-time-input { margin-left: 4px; margin-inline-start: 4px; margin-inline-end: initial; direction: var(--direction); } + div { + display: flex; + justify-content: flex-end; + width: 100%; + } `; } } diff --git a/src/panels/lovelace/entity-rows/hui-input-datetime-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-datetime-entity-row.ts index bd595bd4f7..287ea60886 100644 --- a/src/panels/lovelace/entity-rows/hui-input-datetime-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-input-datetime-entity-row.ts @@ -62,33 +62,39 @@ class HuiInputDatetimeEntityRow extends LitElement implements LovelaceRow { .hideName=${stateObj.attributes.has_date && stateObj.attributes.has_time} > - ${stateObj.attributes.has_date - ? html` - - - ` - : ``} - ${stateObj.attributes.has_time - ? html` - - ` - : ``} +
+ ${stateObj.attributes.has_date + ? html` + + + ` + : ``} + ${stateObj.attributes.has_time + ? html` + + ` + : ``} +
`; } @@ -126,6 +132,11 @@ class HuiInputDatetimeEntityRow extends LitElement implements LovelaceRow { margin-inline-end: initial; direction: var(--direction); } + div.both { + display: flex; + justify-content: flex-end; + width: 100%; + } `; } } diff --git a/src/panels/lovelace/entity-rows/hui-time-entity-row.ts b/src/panels/lovelace/entity-rows/hui-time-entity-row.ts index f6fceb3829..66cf5c68b1 100644 --- a/src/panels/lovelace/entity-rows/hui-time-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-time-entity-row.ts @@ -42,16 +42,14 @@ class HuiTimeEntityRow extends LitElement implements LovelaceRow { `; } + const unavailable = isUnavailableState(stateObj.state); + return html` - + diff --git a/src/panels/lovelace/views/hui-masonry-view.ts b/src/panels/lovelace/views/hui-masonry-view.ts index 60d4154099..20cf91f640 100644 --- a/src/panels/lovelace/views/hui-masonry-view.ts +++ b/src/panels/lovelace/views/hui-masonry-view.ts @@ -320,6 +320,11 @@ export class MasonryView extends LitElement implements LovelaceViewElement { min-width: 0; } + /* Fix for safari */ + .column:has(> *) { + flex-grow: 1; + } + .column:not(:has(> *:not([hidden]))) { flex-grow: 0; } diff --git a/src/translations/en.json b/src/translations/en.json index c8fb2ba4fe..2f11673fe8 100755 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -3251,8 +3251,19 @@ }, "integration_page": { "entries": "Integration entries", + "entries_device": "Devices", + "entries_hub": "Hubs", + "entries_service": "Services", + "entries_helper": "Helpers", + "entries_hardware": "Hardware", "no_entries": "No entries", - "attention_entries": "Needs attention" + "attention_entries": "Needs attention", + "add_entry": "Add entry", + "add_device": "Add device", + "add_hub": "Add hub", + "add_service": "Add service", + "add_helper": "Add helper", + "add_hardware": "Add hardware" }, "config_entry": { "application_credentials": { @@ -3266,6 +3277,7 @@ "devices": "{count} {count, plural,\n one {device}\n other {devices}\n}", "entities": "{count} {count, plural,\n one {entity}\n other {entities}\n}", "services": "{count} {count, plural,\n one {service}\n other {services}\n}", + "entries": "{count} {count, plural,\n one {entry}\n other {entries}\n}", "rename": "Rename", "configure": "Configure", "system_options": "System options", @@ -3509,7 +3521,11 @@ "download_backup": "Download Backup", "migrate_radio": "Migrate Radio", "network_settings_title": "Network Settings", - "change_channel": "Change channel" + "change_channel": "Change channel", + "channel_dialog": { + "title": "Multiprotocol addon in use", + "text": "Zigbee and Thread share the same radio and must use the same channel. Change the channel of both networks by reconfiguring multiprotocol from the hardware menu." + } }, "add_device_page": { "spinner": "Searching for Zigbee devices…", diff --git a/yarn.lock b/yarn.lock index 8ef8a1b6c5..31b67fa444 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2063,13 +2063,13 @@ __metadata: languageName: node linkType: hard -"@lit-labs/context@npm:0.3.1": - version: 0.3.1 - resolution: "@lit-labs/context@npm:0.3.1" +"@lit-labs/context@npm:0.3.2": + version: 0.3.2 + resolution: "@lit-labs/context@npm:0.3.2" dependencies: "@lit/reactive-element": ^1.5.0 lit: ^2.7.0 - checksum: eca24343bf63a092662a45c0483a77191348514c84aa7fa1a497d45c5741c16e8e61fb294ed8e56d73536b4e7fe96c49beb416417a2c879e670e553e19f5a3f5 + checksum: 55920366798a3337a455c627c0b6911c7b78dee94a783ad77edb9a9e237a2e48201d6cf869f3d0b805316e5c8e8fb817f52f663bc556dd40ca6e8b3168662daf languageName: node linkType: hard @@ -3349,15 +3349,15 @@ __metadata: languageName: node linkType: hard -"@octokit/plugin-retry@npm:4.1.3": - version: 4.1.3 - resolution: "@octokit/plugin-retry@npm:4.1.3" +"@octokit/plugin-retry@npm:4.1.5": + version: 4.1.5 + resolution: "@octokit/plugin-retry@npm:4.1.5" dependencies: "@octokit/types": ^9.0.0 bottleneck: ^2.15.3 peerDependencies: "@octokit/core": ">=3" - checksum: f9ed5869be23dddcf1ee896ce996e46a412a586259b55612ba44c82cdeed91436102e6e3ec57db879bd91a4446dcafbaa94632e4e059c6af56d9cca9b163eacb + checksum: 37272a0dd2fea5025797bb0f6812899c048468b3ef35c0413154230ef0d5c3e323a76bb9eb971ea5ba498f68407711507336852783443397a185a9a75b28b06c languageName: node linkType: hard @@ -3898,9 +3898,9 @@ __metadata: languageName: node linkType: hard -"@rollup/plugin-node-resolve@npm:15.0.2": - version: 15.0.2 - resolution: "@rollup/plugin-node-resolve@npm:15.0.2" +"@rollup/plugin-node-resolve@npm:15.1.0": + version: 15.1.0 + resolution: "@rollup/plugin-node-resolve@npm:15.1.0" dependencies: "@rollup/pluginutils": ^5.0.1 "@types/resolve": 1.20.2 @@ -3913,7 +3913,7 @@ __metadata: peerDependenciesMeta: rollup: optional: true - checksum: 328eafee06ff967a36441b55e77fbd0d4f599d256e5d1977800ee71915846c46bc1b6185df35c7b512ad2b4023b05b65a332be77b8b00b9d8a20f87d056b8166 + checksum: 83617cdbb90cb780251e8b16dc1671e35bde90b8d4d30e008aefe706b5b643057f6299bdd3226b2a30bf5e4f807a880169de3faa47b9f2ba38d39f294f85f951 languageName: node linkType: hard @@ -4658,14 +4658,14 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/eslint-plugin@npm:5.59.7": - version: 5.59.7 - resolution: "@typescript-eslint/eslint-plugin@npm:5.59.7" +"@typescript-eslint/eslint-plugin@npm:5.59.8": + version: 5.59.8 + resolution: "@typescript-eslint/eslint-plugin@npm:5.59.8" dependencies: "@eslint-community/regexpp": ^4.4.0 - "@typescript-eslint/scope-manager": 5.59.7 - "@typescript-eslint/type-utils": 5.59.7 - "@typescript-eslint/utils": 5.59.7 + "@typescript-eslint/scope-manager": 5.59.8 + "@typescript-eslint/type-utils": 5.59.8 + "@typescript-eslint/utils": 5.59.8 debug: ^4.3.4 grapheme-splitter: ^1.0.4 ignore: ^5.2.0 @@ -4678,43 +4678,43 @@ __metadata: peerDependenciesMeta: typescript: optional: true - checksum: 10d28bac7a5af9e41767be0bb9c270ee3dcdfeaa38d1b036c6822e7260b88821c460699ba943664eb1ef272d00de6a81b99d7d955332044ea87b624e7ead84a1 + checksum: 3e05cd06149ec3741c3c2fb638e2d19a55687b4614a5c8820433db82997687650297e51c17828d320162ccf4241798cf5712c405561e7605cb17e984a6967f7b languageName: node linkType: hard -"@typescript-eslint/parser@npm:5.59.7": - version: 5.59.7 - resolution: "@typescript-eslint/parser@npm:5.59.7" +"@typescript-eslint/parser@npm:5.59.8": + version: 5.59.8 + resolution: "@typescript-eslint/parser@npm:5.59.8" dependencies: - "@typescript-eslint/scope-manager": 5.59.7 - "@typescript-eslint/types": 5.59.7 - "@typescript-eslint/typescript-estree": 5.59.7 + "@typescript-eslint/scope-manager": 5.59.8 + "@typescript-eslint/types": 5.59.8 + "@typescript-eslint/typescript-estree": 5.59.8 debug: ^4.3.4 peerDependencies: eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 peerDependenciesMeta: typescript: optional: true - checksum: bc44f37a11a44f84ae5f0156213f3e2e49aef2ecac94d9e161a0c721acd29462e288f306ad4648095ac1c0e5a5f62b78280c1735883cf39f79ee3afcba312119 + checksum: bac9f09d8552086ceb882a7b87ce4d98dfaa41579249216c75d97e3fc07af33cddc4cbbd07a127a5823c826a258882643aaf658bec19cb2a434002b55c5f0d12 languageName: node linkType: hard -"@typescript-eslint/scope-manager@npm:5.59.7": - version: 5.59.7 - resolution: "@typescript-eslint/scope-manager@npm:5.59.7" +"@typescript-eslint/scope-manager@npm:5.59.8": + version: 5.59.8 + resolution: "@typescript-eslint/scope-manager@npm:5.59.8" dependencies: - "@typescript-eslint/types": 5.59.7 - "@typescript-eslint/visitor-keys": 5.59.7 - checksum: 43f7ea93fddbe2902122a41050677fe3eff2ea468f435b981592510cfc6136e8c28ac7d3a3e05fb332c0b3078a29bd0c91c35b2b1f4e788b4eb9aaeb70e21583 + "@typescript-eslint/types": 5.59.8 + "@typescript-eslint/visitor-keys": 5.59.8 + checksum: e1e810ee991cfeb433330b04ee949bb6784abe4dbdb7d9480aa7a7536671b4fec914b7803edf662516c8ecb1b31dcff126797f9923270a529c26e2b00b0ea96f languageName: node linkType: hard -"@typescript-eslint/type-utils@npm:5.59.7": - version: 5.59.7 - resolution: "@typescript-eslint/type-utils@npm:5.59.7" +"@typescript-eslint/type-utils@npm:5.59.8": + version: 5.59.8 + resolution: "@typescript-eslint/type-utils@npm:5.59.8" dependencies: - "@typescript-eslint/typescript-estree": 5.59.7 - "@typescript-eslint/utils": 5.59.7 + "@typescript-eslint/typescript-estree": 5.59.8 + "@typescript-eslint/utils": 5.59.8 debug: ^4.3.4 tsutils: ^3.21.0 peerDependencies: @@ -4722,23 +4722,23 @@ __metadata: peerDependenciesMeta: typescript: optional: true - checksum: 9cbeffad27b145b478e4cbbab2b44c5b246a9b922f01fd06d401ea4c41a4fa6dc8ba75d13a6409b3b4474ccaf2018770a4c6c599172e22ec2004110e00f4e721 + checksum: d9fde31397da0f0e62a5568f64bad99d06bcd324b7e3aac7fd997a3d045a0fe4c084b2e85d440e0a39645acd2269ad6593f196399c2c0f880d293417fec894e3 languageName: node linkType: hard -"@typescript-eslint/types@npm:5.59.7": - version: 5.59.7 - resolution: "@typescript-eslint/types@npm:5.59.7" - checksum: 52eccec9e2d631eb2808e48b5dc33a837b5e242fa9eddace89fc707c9f2283b5364f1d38b33d418a08d64f45f6c22f051800898e1881a912f8aac0c3ae300d0a +"@typescript-eslint/types@npm:5.59.8": + version: 5.59.8 + resolution: "@typescript-eslint/types@npm:5.59.8" + checksum: 559473d5601c849eb0da1874a2ac67c753480beed484ad6f6cda62fa6023273f2c3005c7f2864d9c2afb7c6356412d0d304b57db10c53597207f18a7f6cd4f18 languageName: node linkType: hard -"@typescript-eslint/typescript-estree@npm:5.59.7": - version: 5.59.7 - resolution: "@typescript-eslint/typescript-estree@npm:5.59.7" +"@typescript-eslint/typescript-estree@npm:5.59.8": + version: 5.59.8 + resolution: "@typescript-eslint/typescript-estree@npm:5.59.8" dependencies: - "@typescript-eslint/types": 5.59.7 - "@typescript-eslint/visitor-keys": 5.59.7 + "@typescript-eslint/types": 5.59.8 + "@typescript-eslint/visitor-keys": 5.59.8 debug: ^4.3.4 globby: ^11.1.0 is-glob: ^4.0.3 @@ -4747,35 +4747,35 @@ __metadata: peerDependenciesMeta: typescript: optional: true - checksum: eefe82eedf9ee2e14463c3f2b5b18df084c1328a859b245ee897a9a7075acce7cca0216a21fd7968b75aa64189daa008bfde1e2f9afbcc336f3dfe856e7f342e + checksum: d93371cc866f573a6a1ddc0eb10d498a8e59f36763a99ce21da0737fff2b4c942eef1587216aad273f8d896ebc0b19003677cba63a27d2646aa2c087638963eb languageName: node linkType: hard -"@typescript-eslint/utils@npm:5.59.7": - version: 5.59.7 - resolution: "@typescript-eslint/utils@npm:5.59.7" +"@typescript-eslint/utils@npm:5.59.8": + version: 5.59.8 + resolution: "@typescript-eslint/utils@npm:5.59.8" dependencies: "@eslint-community/eslint-utils": ^4.2.0 "@types/json-schema": ^7.0.9 "@types/semver": ^7.3.12 - "@typescript-eslint/scope-manager": 5.59.7 - "@typescript-eslint/types": 5.59.7 - "@typescript-eslint/typescript-estree": 5.59.7 + "@typescript-eslint/scope-manager": 5.59.8 + "@typescript-eslint/types": 5.59.8 + "@typescript-eslint/typescript-estree": 5.59.8 eslint-scope: ^5.1.1 semver: ^7.3.7 peerDependencies: eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 - checksum: d8682700187ca94cc6441480cb6b87d0514a9748103c15dd93206c5b1c6fefa59063662f27a4103e16abbcfb654a61d479bc55af8f23d96f342431b87f31bb4e + checksum: cbaa057485c7f52c45d0dfb4f5a8e9273abccb1c52dcb4426a79f9e71d2c1062cf2525bad6d4aca5ec42db3fe723d749843bcade5a323bde7fbe4b5d5b5d5c3b languageName: node linkType: hard -"@typescript-eslint/visitor-keys@npm:5.59.7": - version: 5.59.7 - resolution: "@typescript-eslint/visitor-keys@npm:5.59.7" +"@typescript-eslint/visitor-keys@npm:5.59.8": + version: 5.59.8 + resolution: "@typescript-eslint/visitor-keys@npm:5.59.8" dependencies: - "@typescript-eslint/types": 5.59.7 + "@typescript-eslint/types": 5.59.8 eslint-visitor-keys: ^3.3.0 - checksum: 4367f2ea68dd96a0520485434ad11e1bd26239eeeb3a2150bee7478a0f1df3c2099a39f96486722932be0456bcb7a47a483b452876d1d30bdeb9b81d354eef3d + checksum: 6bfa7918dbb0e08d8a7404aeeef7bcd1a85736dc8d01614d267c0c5ec10f94d2746b50a945bf5c82c54fda67926e8deaeba8565c919da17f725fc11209ef8987 languageName: node linkType: hard @@ -9636,7 +9636,7 @@ __metadata: "@fullcalendar/timegrid": 6.1.8 "@koa/cors": 4.0.0 "@lezer/highlight": 1.1.6 - "@lit-labs/context": 0.3.1 + "@lit-labs/context": 0.3.2 "@lit-labs/motion": 1.0.3 "@lit-labs/virtualizer": 2.0.2 "@lrnwebcomponents/simple-tooltip": 7.0.0 @@ -9669,7 +9669,7 @@ __metadata: "@mdi/js": 7.2.96 "@mdi/svg": 7.2.96 "@octokit/auth-oauth-device": 4.0.4 - "@octokit/plugin-retry": 4.1.3 + "@octokit/plugin-retry": 4.1.5 "@octokit/rest": 19.0.11 "@open-wc/dev-server-hmr": 0.1.4 "@polymer/app-layout": 3.1.0 @@ -9686,7 +9686,7 @@ __metadata: "@rollup/plugin-babel": 6.0.3 "@rollup/plugin-commonjs": 25.0.0 "@rollup/plugin-json": 6.0.0 - "@rollup/plugin-node-resolve": 15.0.2 + "@rollup/plugin-node-resolve": 15.1.0 "@rollup/plugin-replace": 5.0.2 "@thomasloven/round-slider": 0.6.0 "@types/babel__plugin-transform-runtime": 7.9.2 @@ -9705,8 +9705,8 @@ __metadata: "@types/sortablejs": 1.15.1 "@types/tar": 6.1.5 "@types/webspeechapi": 0.0.29 - "@typescript-eslint/eslint-plugin": 5.59.7 - "@typescript-eslint/parser": 5.59.7 + "@typescript-eslint/eslint-plugin": 5.59.8 + "@typescript-eslint/parser": 5.59.8 "@vaadin/combo-box": 24.0.7 "@vaadin/vaadin-themable-mixin": 24.0.7 "@vibrant/color": 3.2.1-alpha.1 @@ -9765,7 +9765,7 @@ __metadata: leaflet: 1.9.4 leaflet-draw: 1.0.4 lint-staged: 13.2.2 - lit: 2.7.4 + lit: 2.7.5 lit-analyzer: 1.2.1 lodash.template: 4.5.0 magic-string: 0.30.0 @@ -11474,14 +11474,14 @@ __metadata: languageName: node linkType: hard -"lit@npm:2.7.4, lit@npm:^2.0.0, lit@npm:^2.0.0-rc.2, lit@npm:^2.2.1, lit@npm:^2.7.0, lit@npm:^2.7.2, lit@npm:^2.7.4": - version: 2.7.4 - resolution: "lit@npm:2.7.4" +"lit@npm:2.7.5, lit@npm:^2.0.0, lit@npm:^2.0.0-rc.2, lit@npm:^2.2.1, lit@npm:^2.7.0, lit@npm:^2.7.2, lit@npm:^2.7.4": + version: 2.7.5 + resolution: "lit@npm:2.7.5" dependencies: "@lit/reactive-element": ^1.6.0 lit-element: ^3.3.0 lit-html: ^2.7.0 - checksum: 7494f4e814fca0ebf7a73923c85454531aac26ff83f0d4d5afe62ebbc6225363c9df41f88147d79d5d3ab518925ceb9b27a557bee610bbb414ae0339c513f5a3 + checksum: 61a3f87c57136618f47a30b36cdfb592fcba42dcfbdb104d2b5ca291148c2d9a32fcb713bb91090bd08d6897a00e73f8425da6e3626aa080eaf410a32397ae69 languageName: node linkType: hard