Show add devices fab on devices page for ZJS (#10771)

This commit is contained in:
Paulus Schoutsen 2021-12-02 23:42:39 -08:00 committed by GitHub
parent 5bc2468cbc
commit 7c78fb314e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -17,6 +17,7 @@ import {
} from "../../../components/data-table/ha-data-table"; } from "../../../components/data-table/ha-data-table";
import "../../../components/entity/ha-battery-icon"; import "../../../components/entity/ha-battery-icon";
import "../../../components/ha-button-menu"; import "../../../components/ha-button-menu";
import "../../../components/ha-fab";
import "../../../components/ha-icon-button"; import "../../../components/ha-icon-button";
import { AreaRegistryEntry } from "../../../data/area_registry"; import { AreaRegistryEntry } from "../../../data/area_registry";
import { ConfigEntry } from "../../../data/config_entries"; import { ConfigEntry } from "../../../data/config_entries";
@ -35,6 +36,7 @@ import "../../../layouts/hass-tabs-subpage-data-table";
import { haStyle } from "../../../resources/styles"; import { haStyle } from "../../../resources/styles";
import { HomeAssistant, Route } from "../../../types"; import { HomeAssistant, Route } from "../../../types";
import { configSections } from "../ha-panel-config"; import { configSections } from "../ha-panel-config";
import { showZWaveJSAddNodeDialog } from "../integrations/integration-panels/zwave_js/show-dialog-zwave_js-add-node";
interface DeviceRowData extends DeviceRegistryEntry { interface DeviceRowData extends DeviceRegistryEntry {
device?: DeviceRowData; device?: DeviceRowData;
@ -170,7 +172,7 @@ export class HaConfigDeviceDashboard extends LitElement {
areaLookup[area.area_id] = area; areaLookup[area.area_id] = area;
} }
const filterDomains: string[] = []; let filterConfigEntry: ConfigEntry | undefined;
filters.forEach((value, key) => { filters.forEach((value, key) => {
if (key === "config_entry") { if (key === "config_entry") {
@ -178,10 +180,7 @@ export class HaConfigDeviceDashboard extends LitElement {
device.config_entries.includes(value) device.config_entries.includes(value)
); );
startLength = outputDevices.length; startLength = outputDevices.length;
const configEntry = entries.find((entry) => entry.entry_id === value); filterConfigEntry = entries.find((entry) => entry.entry_id === value);
if (configEntry) {
filterDomains.push(configEntry.domain);
}
} }
}); });
@ -220,7 +219,10 @@ export class HaConfigDeviceDashboard extends LitElement {
})); }));
this._numHiddenDevices = startLength - outputDevices.length; this._numHiddenDevices = startLength - outputDevices.length;
return { devicesOutput: outputDevices, filteredDomains: filterDomains }; return {
devicesOutput: outputDevices,
filteredConfigEntry: filterConfigEntry,
};
} }
); );
@ -352,16 +354,16 @@ export class HaConfigDeviceDashboard extends LitElement {
} }
protected render(): TemplateResult { protected render(): TemplateResult {
const { devicesOutput, filteredDomains } = this._devicesAndFilterDomains( const { devicesOutput, filteredConfigEntry } =
this.devices, this._devicesAndFilterDomains(
this.entries, this.devices,
this.entities, this.entries,
this.areas, this.entities,
this._searchParms, this.areas,
this._showDisabled, this._searchParms,
this.hass.localize this._showDisabled,
); this.hass.localize
const includeZHAFab = filteredDomains.includes("zha"); );
const activeFilters = this._activeFilters( const activeFilters = this._activeFilters(
this.entries, this.entries,
this._searchParms, this._searchParms,
@ -394,9 +396,25 @@ export class HaConfigDeviceDashboard extends LitElement {
@search-changed=${this._handleSearchChange} @search-changed=${this._handleSearchChange}
@row-click=${this._handleRowClicked} @row-click=${this._handleRowClicked}
clickable clickable
.hasFab=${includeZHAFab} .hasFab=${filteredConfigEntry &&
(filteredConfigEntry.domain === "zha" ||
filteredConfigEntry.domain === "zwave_js")}
> >
${includeZHAFab ${!filteredConfigEntry
? ""
: filteredConfigEntry.domain === "zwave_js"
? html`
<ha-fab
slot="fab"
.label=${this.hass.localize("ui.panel.config.zha.add_device")}
extended
?rtl=${computeRTL(this.hass)}
@click=${this._showZJSAddDeviceDialog}
>
<ha-svg-icon slot="icon" .path=${mdiPlus}></ha-svg-icon>
</ha-fab>
`
: filteredConfigEntry.domain === "zha"
? html`<a href="/config/zha/add" slot="fab"> ? html`<a href="/config/zha/add" slot="fab">
<ha-fab <ha-fab
.label=${this.hass.localize("ui.panel.config.zha.add_device")} .label=${this.hass.localize("ui.panel.config.zha.add_device")}
@ -481,6 +499,22 @@ export class HaConfigDeviceDashboard extends LitElement {
this._showDisabled = true; this._showDisabled = true;
} }
private _showZJSAddDeviceDialog() {
const { filteredConfigEntry } = this._devicesAndFilterDomains(
this.devices,
this.entries,
this.entities,
this.areas,
this._searchParms,
this._showDisabled,
this.hass.localize
);
showZWaveJSAddNodeDialog(this, {
entry_id: filteredConfigEntry!.entry_id,
});
}
static get styles(): CSSResultGroup { static get styles(): CSSResultGroup {
return [ return [
css` css`