Optimise data table and device dashboard (#9217)

This commit is contained in:
Bram Kragten 2021-05-25 13:12:44 +02:00 committed by GitHub
parent 0a478ee1da
commit 8af05e2726
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 55 additions and 22 deletions

View File

@ -173,8 +173,8 @@ export class HaDataTable extends LitElement {
this.updateComplete.then(() => this._calcTableHeight());
}
protected updated(properties: PropertyValues) {
super.updated(properties);
public willUpdate(properties: PropertyValues) {
super.willUpdate(properties);
if (properties.has("columns")) {
this._filterable = Object.values(this.columns).some(
@ -342,6 +342,10 @@ export class HaDataTable extends LitElement {
layout: Layout1d,
// @ts-expect-error
renderItem: (row: DataTableRowData, index) => {
// not sure how this happens...
if (!row) {
return "";
}
if (row.append) {
return html`
<div class="mdc-data-table__row">${row.content}</div>
@ -474,15 +478,16 @@ export class HaDataTable extends LitElement {
}
if (this.appendRow || this.hasFab) {
this._items = [...data];
const items = [...data];
if (this.appendRow) {
this._items.push({ append: true, content: this.appendRow });
items.push({ append: true, content: this.appendRow });
}
if (this.hasFab) {
this._items.push({ empty: true });
items.push({ empty: true });
}
this._items = items;
} else {
this._items = data;
}

View File

@ -68,6 +68,30 @@ export class HaConfigDeviceDashboard extends LitElement {
@state() private _numHiddenDevices = 0;
private _ignoreLocationChange = false;
public constructor() {
super();
window.addEventListener("location-changed", () => {
if (this._ignoreLocationChange) {
this._ignoreLocationChange = false;
return;
}
if (
window.location.search.substring(1) !== this._searchParms.toString()
) {
this._searchParms = new URLSearchParams(window.location.search);
}
});
window.addEventListener("popstate", () => {
if (
window.location.search.substring(1) !== this._searchParms.toString()
) {
this._searchParms = new URLSearchParams(window.location.search);
}
});
}
private _activeFilters = memoizeOne(
(
entries: ConfigEntry[],
@ -78,10 +102,6 @@ export class HaConfigDeviceDashboard extends LitElement {
filters.forEach((value, key) => {
switch (key) {
case "config_entry": {
// If we are requested to show the devices for a given config entry,
// also show the disabled ones by default.
this._showDisabled = true;
const configEntry = entries.find(
(entry) => entry.entry_id === value
);
@ -118,7 +138,6 @@ export class HaConfigDeviceDashboard extends LitElement {
) => {
// Some older installations might have devices pointing at invalid entryIDs
// So we guard for that.
let outputDevices: DeviceRowData[] = devices;
const deviceLookup: { [deviceId: string]: DeviceRegistryEntry } = {};
@ -315,14 +334,14 @@ export class HaConfigDeviceDashboard extends LitElement {
}
);
public constructor() {
super();
window.addEventListener("location-changed", () => {
this._searchParms = new URLSearchParams(window.location.search);
});
window.addEventListener("popstate", () => {
this._searchParms = new URLSearchParams(window.location.search);
});
public willUpdate(changedProps) {
if (changedProps.has("_searchParms")) {
if (this._searchParms.get("config_entry")) {
// If we are requested to show the devices for a given config entry,
// also show the disabled ones by default.
this._showDisabled = true;
}
}
}
protected render(): TemplateResult {
@ -435,6 +454,7 @@ export class HaConfigDeviceDashboard extends LitElement {
private _handleRowClicked(ev: HASSDomEvent<RowClickedEvent>) {
const deviceId = ev.detail.id;
this._ignoreLocationChange = true;
navigate(this, `/config/devices/device/${deviceId}`);
}

View File

@ -391,10 +391,18 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) {
public constructor() {
super();
window.addEventListener("location-changed", () => {
this._searchParms = new URLSearchParams(window.location.search);
if (
window.location.search.substring(1) !== this._searchParms.toString()
) {
this._searchParms = new URLSearchParams(window.location.search);
}
});
window.addEventListener("popstate", () => {
this._searchParms = new URLSearchParams(window.location.search);
if (
window.location.search.substring(1) !== this._searchParms.toString()
) {
this._searchParms = new URLSearchParams(window.location.search);
}
});
}
@ -623,8 +631,8 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) {
loadEntityEditorDialog();
}
protected updated(changedProps): void {
super.updated(changedProps);
public willUpdate(changedProps): void {
super.willUpdate(changedProps);
const oldHass = changedProps.get("hass");
let changed = false;
if (!this.hass || !this._entities) {