diff --git a/src/panels/config/entities/ha-config-entities.ts b/src/panels/config/entities/ha-config-entities.ts index 434c85014d..80adf624d5 100644 --- a/src/panels/config/entities/ha-config-entities.ts +++ b/src/panels/config/entities/ha-config-entities.ts @@ -3,12 +3,17 @@ import "@lrnwebcomponents/simple-tooltip/simple-tooltip"; import { mdiAlertCircle, mdiCancel, + mdiChevronRight, mdiDelete, + mdiDotsVertical, + mdiEye, mdiEyeOff, + mdiMenuDown, mdiPencilOff, mdiPlus, mdiRestoreAlert, - mdiUndo, + mdiToggleSwitch, + mdiToggleSwitchOffOutline, } from "@mdi/js"; import { HassEntity, UnsubscribeFunc } from "home-assistant-js-websocket"; import { @@ -24,6 +29,7 @@ import { ifDefined } from "lit/directives/if-defined"; import { styleMap } from "lit/directives/style-map"; import { until } from "lit/directives/until"; import memoize from "memoize-one"; +import { computeCssColor } from "../../../common/color/compute-color"; import type { HASSDomEvent } from "../../../common/dom/fire_event"; import { computeDomain } from "../../../common/entity/compute_domain"; import { computeStateName } from "../../../common/entity/compute_state_name"; @@ -44,16 +50,19 @@ import "../../../components/ha-check-list-item"; import "../../../components/ha-filter-devices"; import "../../../components/ha-filter-floor-areas"; import "../../../components/ha-filter-integrations"; -import "../../../components/ha-filter-states"; import "../../../components/ha-filter-labels"; +import "../../../components/ha-filter-states"; import "../../../components/ha-icon"; import "../../../components/ha-icon-button"; +import "../../../components/ha-menu-item"; +import "../../../components/ha-sub-menu"; import "../../../components/ha-svg-icon"; import { ConfigEntry, getConfigEntries } from "../../../data/config_entries"; import { fullEntitiesContext } from "../../../data/context"; import { UNAVAILABLE } from "../../../data/entity"; import { EntityRegistryEntry, + UpdateEntityRegistryEntryResult, computeEntityRegistryName, removeEntityRegistryEntry, updateEntityRegistryEntry, @@ -505,13 +514,28 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { [...filteredDomains][0] ); + const labelItems = html` ${this._labels?.map((label) => { + const color = label.color ? computeCssColor(label.color) : undefined; + return html` + + ${label.icon + ? html`` + : nothing} + ${label.name} + + `; + })}`; + return html` filter.value?.length - ).length} + .filters=${ + Object.values(this._filters).filter((filter) => filter.value?.length) + .length + } .filter=${this._filter} selectable .selected=${this._selectedEntities.length} @@ -543,100 +568,131 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { .hass=${this.hass} slot="toolbar-icon" > -
- ${!this.narrow - ? html` - ${this.hass.localize( - "ui.panel.config.entities.picker.enable_selected.button" - )} - ${this.hass.localize( - "ui.panel.config.entities.picker.disable_selected.button" - )} - ${this.hass.localize( - "ui.panel.config.entities.picker.hide_selected.button" - )} - ${this.hass.localize( - "ui.panel.config.entities.picker.remove_selected.button" - )} - ` - : html` - - - ${this.hass.localize( - "ui.panel.config.entities.picker.enable_selected.button" - )} - - - - ${this.hass.localize( - "ui.panel.config.entities.picker.disable_selected.button" - )} - - - - ${this.hass.localize( - "ui.panel.config.entities.picker.hide_selected.button" - )} - - - - ${this.hass.localize( - "ui.panel.config.entities.picker.remove_selected.button" - )} - - `} -
- ${this._filters.config_entry?.value?.length - ? html` - Filtering by config entry - ${this._entries?.find( - (entry) => - entry.entry_id === this._filters.config_entry!.value![0] - )?.title || this._filters.config_entry.value[0]} - ` - : nothing} + + +${ + !this.narrow + ? html` + + + + ${labelItems} + ` + : nothing +} + + ${ + this.narrow + ? html` + + ` + : html`` + } + + ${ + this.narrow + ? html` + +
+ ${this.hass.localize( + "ui.panel.config.automation.picker.bulk_actions.add_label" + )} +
+ + + ${labelItems} + + ` + : nothing + } + + + +
+ ${this.hass.localize( + "ui.panel.config.entities.picker.enable_selected.button" + )} +
+ + + +
+ ${this.hass.localize( + "ui.panel.config.entities.picker.disable_selected.button" + )} +
+ + + + + +
+ ${this.hass.localize( + "ui.panel.config.entities.picker.unhide_selected.button" + )} +
+ + + +
+ ${this.hass.localize( + "ui.panel.config.entities.picker.hide_selected.button" + )} +
+ + + + + +
+ ${this.hass.localize( + "ui.panel.config.entities.picker.remove_selected.button" + )} +
+ + + + ${ + this._filters.config_entry?.value?.length + ? html` + Filtering by config entry + ${this._entries?.find( + (entry) => + entry.entry_id === this._filters.config_entry!.value![0] + )?.title || this._filters.config_entry.value[0]} + ` + : nothing + } - ${includeAddDeviceFab - ? html` - - ` - : nothing} + ${ + includeAddDeviceFab + ? html` + + ` + : nothing + } `; } @@ -931,6 +991,28 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { }); } + private _unhideSelected() { + this._selectedEntities.forEach((entity) => + updateEntityRegistryEntry(this.hass, entity, { + hidden_by: null, + }) + ); + this._clearSelection(); + } + + private async _handleBulkLabel(ev) { + const label = ev.currentTarget.value; + const promises: Promise[] = []; + this._selectedEntities.forEach((entityId) => { + promises.push( + updateEntityRegistryEntry(this.hass, entityId, { + labels: this.hass.entities[entityId].labels.concat(label), + }) + ); + }); + await Promise.all(promises); + } + private _removeSelected() { const removeableEntities = this._selectedEntities.filter((entity) => { const stateObj = this.hass.states[entity]; @@ -1080,6 +1162,17 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { text-transform: uppercase; direction: var(--direction); } + + ha-assist-chip { + --ha-assist-chip-container-shape: 10px; + } + ha-button-menu-new ha-assist-chip { + --md-assist-chip-trailing-space: 8px; + } + ha-label { + --ha-label-background-color: var(--color, var(--grey-color)); + --ha-label-background-opacity: 0.5; + } `, ]; } diff --git a/src/translations/en.json b/src/translations/en.json index 3f1e2570e5..2f0ed5d46c 100644 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -4052,6 +4052,9 @@ "button": "Hide selected", "confirm_title": "Do you want to hide {number} {number, plural,\n one {entity}\n other {entities}\n}?", "confirm_text": "Hidden entities will not be shown on your dashboard. Their history is still tracked and you can still interact with them with services." + }, + "unhide_selected": { + "button": "Unhide selected" } } },