mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-24 09:46:36 +00:00
Show Thread panel on thread config entry (#15150)
* Show Thread panel on thread config entry * Rename data file to use right domain * Make panel a bit more pleasant
This commit is contained in:
parent
b4cd4975c1
commit
8073555bf9
@ -1,11 +1,11 @@
|
||||
import { HomeAssistant } from "../types";
|
||||
|
||||
export interface ThreadInfo {
|
||||
export interface OTBRInfo {
|
||||
url: string;
|
||||
active_dataset_tlvs: string;
|
||||
}
|
||||
|
||||
export const threadGetInfo = (hass: HomeAssistant): Promise<ThreadInfo> =>
|
||||
export const getOTBRInfo = (hass: HomeAssistant): Promise<OTBRInfo> =>
|
||||
hass.callWS({
|
||||
type: "otbr/info",
|
||||
});
|
@ -75,11 +75,11 @@ import type { ConfigEntryExtended } from "./ha-config-integrations";
|
||||
import "./ha-integration-header";
|
||||
|
||||
const integrationsWithPanel = {
|
||||
matter: "/config/matter",
|
||||
mqtt: "/config/mqtt",
|
||||
thread: "/config/thread",
|
||||
zha: "/config/zha/dashboard",
|
||||
zwave_js: "/config/zwave_js/dashboard",
|
||||
matter: "/config/matter",
|
||||
otbr: "/config/thread",
|
||||
};
|
||||
|
||||
@customElement("ha-integration-card")
|
||||
|
@ -5,7 +5,9 @@ import "../../../../../components/ha-card";
|
||||
import "../../../../../layouts/hass-subpage";
|
||||
import { haStyle } from "../../../../../resources/styles";
|
||||
import { HomeAssistant } from "../../../../../types";
|
||||
import { threadGetInfo, ThreadInfo } from "../../../../../data/thread";
|
||||
import { getOTBRInfo, OTBRInfo } from "../../../../../data/otbr";
|
||||
import { isComponentLoaded } from "../../../../../common/config/is_component_loaded";
|
||||
import { showConfigFlowDialog } from "../../../../../dialogs/config-flow/show-dialog-config-flow";
|
||||
|
||||
@customElement("thread-config-panel")
|
||||
export class ThreadConfigPanel extends LitElement {
|
||||
@ -13,29 +15,43 @@ export class ThreadConfigPanel extends LitElement {
|
||||
|
||||
@property({ type: Boolean }) public narrow!: boolean;
|
||||
|
||||
@state() private _info?: ThreadInfo;
|
||||
@state() private _info?: OTBRInfo;
|
||||
|
||||
protected render(): TemplateResult {
|
||||
return html`
|
||||
<hass-subpage .narrow=${this.narrow} .hass=${this.hass} header="Thread">
|
||||
<div class="content">
|
||||
<ha-card header="Thread Border Router">
|
||||
<div class="card-content">
|
||||
${!this._info
|
||||
? html`<ha-circular-progress active></ha-circular-progress>`
|
||||
: html`
|
||||
<table>
|
||||
<tr>
|
||||
<td>URL</td>
|
||||
<td>${this._info.url}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Active Dataset TLVs</td>
|
||||
<td>${this._info.active_dataset_tlvs || "-"}</td>
|
||||
</tr>
|
||||
</table>
|
||||
`}
|
||||
</div>
|
||||
<ha-card header="Open Thread Border Router">
|
||||
${isComponentLoaded(this.hass, "otbr")
|
||||
? html`
|
||||
<div class="card-content">
|
||||
${!this._info
|
||||
? html`<ha-circular-progress
|
||||
active
|
||||
></ha-circular-progress>`
|
||||
: html`
|
||||
<table>
|
||||
<tr>
|
||||
<td>URL</td>
|
||||
<td>${this._info.url}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Active Dataset TLVs</td>
|
||||
<td>${this._info.active_dataset_tlvs || "-"}</td>
|
||||
</tr>
|
||||
</table>
|
||||
`}
|
||||
</div>
|
||||
`
|
||||
: html`
|
||||
<div class="card-content">No border routers found.</div>
|
||||
<div class="card-actions">
|
||||
<mwc-button
|
||||
@click=${this._addOTBR}
|
||||
label="Add border router"
|
||||
></mwc-button>
|
||||
</div>
|
||||
`}
|
||||
</ha-card>
|
||||
</div>
|
||||
</hass-subpage>
|
||||
@ -45,8 +61,24 @@ export class ThreadConfigPanel extends LitElement {
|
||||
protected override firstUpdated(changedProps: PropertyValues) {
|
||||
super.firstUpdated(changedProps);
|
||||
|
||||
threadGetInfo(this.hass).then((info) => {
|
||||
this._info = info;
|
||||
this._refresh();
|
||||
}
|
||||
|
||||
private _refresh() {
|
||||
if (isComponentLoaded(this.hass, "otbr")) {
|
||||
getOTBRInfo(this.hass).then((info) => {
|
||||
this._info = info;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
private _addOTBR() {
|
||||
showConfigFlowDialog(this, {
|
||||
dialogClosedCallback: () => {
|
||||
this._refresh();
|
||||
},
|
||||
startFlowHandler: "otbr",
|
||||
showAdvanced: this.hass.userData?.showAdvanced,
|
||||
});
|
||||
}
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user