diff --git a/src/data/zha.ts b/src/data/zha.ts
index f2e1d6363f..3cd291e22d 100644
--- a/src/data/zha.ts
+++ b/src/data/zha.ts
@@ -36,6 +36,8 @@ export interface Neighbor {
ieee: string;
nwk: string;
lqi: string;
+ depth: string;
+ relationship: string;
}
export interface ZHADeviceEndpoint {
diff --git a/src/panels/config/integrations/integration-panels/zha/dialog-zha-manage-zigbee-device.ts b/src/panels/config/integrations/integration-panels/zha/dialog-zha-manage-zigbee-device.ts
index 4104f9edda..1be029cfe9 100644
--- a/src/panels/config/integrations/integration-panels/zha/dialog-zha-manage-zigbee-device.ts
+++ b/src/panels/config/integrations/integration-panels/zha/dialog-zha-manage-zigbee-device.ts
@@ -27,7 +27,7 @@ import "./zha-cluster-commands";
import "./zha-manage-clusters";
import "./zha-device-binding";
import "./zha-group-binding";
-import "./zha-device-children";
+import "./zha-device-neighbors";
import "./zha-device-signature";
import {
Tab,
@@ -179,10 +179,11 @@ class DialogZHAManageZigbeeDevice extends LitElement {
>
`
: html`
-
+ .narrow=${!this.large}
+ >
`
)}
@@ -221,7 +222,7 @@ class DialogZHAManageZigbeeDevice extends LitElement {
device &&
(device.device_type === "Router" || device.device_type === "Coordinator")
) {
- tabs.push("children");
+ tabs.push("neighbors");
}
return tabs;
diff --git a/src/panels/config/integrations/integration-panels/zha/show-dialog-zha-manage-zigbee-device.ts b/src/panels/config/integrations/integration-panels/zha/show-dialog-zha-manage-zigbee-device.ts
index a2854748ff..259e41dbdb 100644
--- a/src/panels/config/integrations/integration-panels/zha/show-dialog-zha-manage-zigbee-device.ts
+++ b/src/panels/config/integrations/integration-panels/zha/show-dialog-zha-manage-zigbee-device.ts
@@ -1,7 +1,7 @@
import { fireEvent } from "../../../../../common/dom/fire_event";
import { ZHADevice } from "../../../../../data/zha";
-export type Tab = "clusters" | "bindings" | "signature" | "children";
+export type Tab = "clusters" | "bindings" | "signature" | "neighbors";
export interface ZHAManageZigbeeDeviceDialogParams {
device: ZHADevice;
diff --git a/src/panels/config/integrations/integration-panels/zha/zha-device-children.ts b/src/panels/config/integrations/integration-panels/zha/zha-device-neighbors.ts
similarity index 53%
rename from src/panels/config/integrations/integration-panels/zha/zha-device-children.ts
rename to src/panels/config/integrations/integration-panels/zha/zha-device-neighbors.ts
index 52a1bdf1b3..e292f403f5 100644
--- a/src/panels/config/integrations/integration-panels/zha/zha-device-children.ts
+++ b/src/panels/config/integrations/integration-panels/zha/zha-device-neighbors.ts
@@ -16,12 +16,16 @@ export interface DeviceRowData extends DataTableRowData {
id: string;
name: string;
lqi: number;
+ depth: number;
+ relationship: string;
}
-@customElement("zha-device-children")
-class ZHADeviceChildren extends LitElement {
+@customElement("zha-device-neighbors")
+class ZHADeviceNeighbors extends LitElement {
@property({ attribute: false }) public hass!: HomeAssistant;
+ @property({ type: Boolean }) public narrow!: boolean;
+
@property() public device: ZHADevice | undefined;
@state() private _devices: Map | undefined;
@@ -33,20 +37,22 @@ class ZHADeviceChildren extends LitElement {
}
}
- private _deviceChildren = memoizeOne(
+ private _deviceNeighbors = memoizeOne(
(
device: ZHADevice | undefined,
devices: Map | undefined
) => {
const outputDevices: DeviceRowData[] = [];
if (device && devices) {
- device.neighbors.forEach((child) => {
- const zhaDevice: ZHADevice | undefined = devices.get(child.ieee);
+ device.neighbors.forEach((neighbor) => {
+ const zhaDevice: ZHADevice | undefined = devices.get(neighbor.ieee);
if (zhaDevice) {
outputDevices.push({
name: zhaDevice.user_given_name || zhaDevice.name,
id: zhaDevice.device_reg_id,
- lqi: parseInt(child.lqi),
+ lqi: parseInt(neighbor.lqi),
+ depth: parseInt(neighbor.depth),
+ relationship: neighbor.relationship,
});
}
});
@@ -55,22 +61,57 @@ class ZHADeviceChildren extends LitElement {
}
);
- private _columns: DataTableColumnContainer = {
- name: {
- title: "Name",
- sortable: true,
- filterable: true,
- direction: "asc",
- grows: true,
- },
- lqi: {
- title: "LQI",
- sortable: true,
- filterable: true,
- type: "numeric",
- width: "75px",
- },
- };
+ private _columns = memoizeOne(
+ (narrow: boolean): DataTableColumnContainer =>
+ narrow
+ ? {
+ name: {
+ title: this.hass.localize("ui.panel.config.zha.neighbors.name"),
+ sortable: true,
+ filterable: true,
+ direction: "asc",
+ grows: true,
+ },
+ lqi: {
+ title: this.hass.localize("ui.panel.config.zha.neighbors.lqi"),
+ sortable: true,
+ filterable: true,
+ type: "numeric",
+ width: "75px",
+ },
+ }
+ : {
+ name: {
+ title: this.hass.localize("ui.panel.config.zha.neighbors.name"),
+ sortable: true,
+ filterable: true,
+ direction: "asc",
+ grows: true,
+ },
+ lqi: {
+ title: this.hass.localize("ui.panel.config.zha.neighbors.lqi"),
+ sortable: true,
+ filterable: true,
+ type: "numeric",
+ width: "75px",
+ },
+ relationship: {
+ title: this.hass.localize(
+ "ui.panel.config.zha.neighbors.relationship"
+ ),
+ sortable: true,
+ filterable: true,
+ width: "150px",
+ },
+ depth: {
+ title: this.hass.localize("ui.panel.config.zha.neighbors.depth"),
+ sortable: true,
+ filterable: true,
+ type: "numeric",
+ width: "75px",
+ },
+ }
+ );
protected render(): TemplateResult {
if (!this.device) {
@@ -85,8 +126,8 @@ class ZHADeviceChildren extends LitElement {
>`
: html`