Optimize helpers filtering (#22080)

This commit is contained in:
Bram Kragten 2024-09-25 16:41:12 +02:00 committed by GitHub
parent 254ee8568b
commit dd88d8633f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -44,7 +44,6 @@ import {
SortingChangedEvent, SortingChangedEvent,
} from "../../../components/data-table/ha-data-table"; } from "../../../components/data-table/ha-data-table";
import "../../../components/data-table/ha-data-table-labels"; import "../../../components/data-table/ha-data-table-labels";
import "../../../components/ha-md-divider";
import "../../../components/ha-fab"; import "../../../components/ha-fab";
import "../../../components/ha-filter-categories"; import "../../../components/ha-filter-categories";
import "../../../components/ha-filter-devices"; import "../../../components/ha-filter-devices";
@ -53,6 +52,7 @@ import "../../../components/ha-filter-floor-areas";
import "../../../components/ha-filter-labels"; import "../../../components/ha-filter-labels";
import "../../../components/ha-icon"; import "../../../components/ha-icon";
import "../../../components/ha-icon-overflow-menu"; import "../../../components/ha-icon-overflow-menu";
import "../../../components/ha-md-divider";
import "../../../components/ha-state-icon"; import "../../../components/ha-state-icon";
import "../../../components/ha-svg-icon"; import "../../../components/ha-svg-icon";
import { import {
@ -67,9 +67,8 @@ import {
import { getConfigFlowHandlers } from "../../../data/config_flow"; import { getConfigFlowHandlers } from "../../../data/config_flow";
import { fullEntitiesContext } from "../../../data/context"; import { fullEntitiesContext } from "../../../data/context";
import { import {
DataTableFilters, DataTableFiltersItems,
deserializeFilters, DataTableFiltersValues,
serializeFilters,
} from "../../../data/data_table_filters"; } from "../../../data/data_table_filters";
import { import {
EntityRegistryEntry, EntityRegistryEntry,
@ -202,13 +201,13 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
@storage({ @storage({
storage: "sessionStorage", storage: "sessionStorage",
key: "helpers-table-filters-full", key: "helpers-table-filters",
state: true, state: true,
subscribe: false, subscribe: false,
serializer: serializeFilters,
deserializer: deserializeFilters,
}) })
private _filters: DataTableFilters = {}; private _filters: DataTableFiltersValues = {};
@state() private _filteredItems: DataTableFiltersItems = {};
@state() private _expandedFilter?: string; @state() private _expandedFilter?: string;
@ -567,10 +566,10 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
@selection-changed=${this._handleSelectionChanged} @selection-changed=${this._handleSelectionChanged}
hasFilters hasFilters
.filters=${Object.values(this._filters).filter((filter) => .filters=${Object.values(this._filters).filter((filter) =>
Array.isArray(filter.value) Array.isArray(filter)
? filter.value.length ? filter.length
: filter.value && : filter &&
Object.values(filter.value).some((val) => Object.values(filter).some((val) =>
Array.isArray(val) ? val.length : val Array.isArray(val) ? val.length : val
) )
).length} ).length}
@ -600,7 +599,7 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
<ha-filter-floor-areas <ha-filter-floor-areas
.hass=${this.hass} .hass=${this.hass}
.type=${"entity"} .type=${"entity"}
.value=${this._filters["ha-filter-floor-areas"]?.value} .value=${this._filters["ha-filter-floor-areas"]}
@data-table-filter-changed=${this._filterChanged} @data-table-filter-changed=${this._filterChanged}
slot="filter-pane" slot="filter-pane"
.expanded=${this._expandedFilter === "ha-filter-floor-areas"} .expanded=${this._expandedFilter === "ha-filter-floor-areas"}
@ -610,7 +609,7 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
<ha-filter-devices <ha-filter-devices
.hass=${this.hass} .hass=${this.hass}
.type=${"entity"} .type=${"entity"}
.value=${this._filters["ha-filter-devices"]?.value} .value=${this._filters["ha-filter-devices"]}
@data-table-filter-changed=${this._filterChanged} @data-table-filter-changed=${this._filterChanged}
slot="filter-pane" slot="filter-pane"
.expanded=${this._expandedFilter === "ha-filter-devices"} .expanded=${this._expandedFilter === "ha-filter-devices"}
@ -619,7 +618,7 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
></ha-filter-devices> ></ha-filter-devices>
<ha-filter-labels <ha-filter-labels
.hass=${this.hass} .hass=${this.hass}
.value=${this._filters["ha-filter-labels"]?.value} .value=${this._filters["ha-filter-labels"]}
@data-table-filter-changed=${this._filterChanged} @data-table-filter-changed=${this._filterChanged}
slot="filter-pane" slot="filter-pane"
.expanded=${this._expandedFilter === "ha-filter-labels"} .expanded=${this._expandedFilter === "ha-filter-labels"}
@ -629,7 +628,7 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
<ha-filter-categories <ha-filter-categories
.hass=${this.hass} .hass=${this.hass}
scope="helpers" scope="helpers"
.value=${this._filters["ha-filter-categories"]?.value} .value=${this._filters["ha-filter-categories"]}
@data-table-filter-changed=${this._filterChanged} @data-table-filter-changed=${this._filterChanged}
slot="filter-pane" slot="filter-pane"
.expanded=${this._expandedFilter === "ha-filter-categories"} .expanded=${this._expandedFilter === "ha-filter-categories"}
@ -763,36 +762,44 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
private _filterChanged(ev) { private _filterChanged(ev) {
const type = ev.target.localName; const type = ev.target.localName;
this._filters = { ...this._filters, [type]: ev.detail };
this._filters = { ...this._filters, [type]: ev.detail.value };
this._filteredItems = { ...this._filteredItems, [type]: ev.detail.items };
this._applyFilters(); this._applyFilters();
} }
private _applyFilters() { private _applyFilters() {
const filters = Object.entries(this._filters); const filters = Object.entries(this._filters);
let items: Set<string> | undefined; let items: Set<string> | undefined;
for (const [key, filter] of filters) {
if (filter.items) { Object.values(this._filteredItems).forEach((itms) => {
if (!items) { if (!itms) {
items = filter.items; return;
continue;
}
items =
"intersection" in items
? // @ts-ignore
items.intersection(filter.items)
: new Set([...items].filter((x) => filter.items!.has(x)));
} }
if (!items) {
items = itms;
return;
}
items =
"intersection" in items
? // @ts-ignore
items.intersection(itms)
: new Set([...items].filter((x) => itms!.has(x)));
});
for (const [key, filter] of filters) {
if ( if (
key === "ha-filter-labels" && key === "ha-filter-labels" &&
Array.isArray(filter.value) && Array.isArray(filter) &&
filter.value.length filter.length
) { ) {
const labelItems: Set<string> = new Set(); const labelItems: Set<string> = new Set();
this._stateItems this._stateItems
.filter((stateItem) => .filter((stateItem) =>
this._entityReg this._entityReg
.find((reg) => reg.entity_id === stateItem.entity_id) .find((reg) => reg.entity_id === stateItem.entity_id)
?.labels.some((lbl) => (filter.value as string[]).includes(lbl)) ?.labels.some((lbl) => filter.includes(lbl))
) )
.forEach((stateItem) => labelItems.add(stateItem.entity_id)); .forEach((stateItem) => labelItems.add(stateItem.entity_id));
if (!items) { if (!items) {
@ -807,14 +814,14 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
} }
if ( if (
key === "ha-filter-categories" && key === "ha-filter-categories" &&
Array.isArray(filter.value) && Array.isArray(filter) &&
filter.value.length filter.length
) { ) {
const categoryItems: Set<string> = new Set(); const categoryItems: Set<string> = new Set();
this._stateItems this._stateItems
.filter( .filter(
(stateItem) => (stateItem) =>
filter.value![0] === filter[0] ===
this._entityReg.find( this._entityReg.find(
(reg) => reg.entity_id === stateItem.entity_id (reg) => reg.entity_id === stateItem.entity_id
)?.categories.helpers )?.categories.helpers
@ -831,11 +838,13 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
: new Set([...items].filter((x) => categoryItems!.has(x))); : new Set([...items].filter((x) => categoryItems!.has(x)));
} }
} }
this._filteredStateItems = items ? [...items] : undefined; this._filteredStateItems = items ? [...items] : undefined;
} }
private _clearFilter() { private _clearFilter() {
this._filters = {}; this._filters = {};
this._filteredItems = {};
this._applyFilters(); this._applyFilters();
} }