@matter-server/dashboard 0.5.10 → 0.5.12

package/src/components/dialogs/settings/log-level-dialog.ts

@@ -92,12 +92,9 @@ export class LogLevelDialog extends LitElement {
             <md-dialog open @cancel=${preventDefault} @closed=${this._handleClosed}>
                 <div slot="headline">Server Log Settings</div>
                 <div slot="content">
-                    ${
-                        this._loading
-                            ? html`
-                                  <p class="loading">Loading...</p>
-                              `
-                            : html`
+                    ${this._loading
+                        ? html` <p class="loading">Loading...</p> `
+                        : html`
                               <p class="hint">Changes are temporary and will be reset on the next server restart.</p>
                               <div class="form-field">
                                   <label>Console Log Level</label>
@@ -114,9 +111,8 @@ export class LogLevelDialog extends LitElement {
                                       )}
                                   </md-outlined-select>
                               </div>
-                              ${
-                                  this._fileLevel !== null
-                                      ? html`
+                              ${this._fileLevel !== null
+                                  ? html`
                                         <div class="form-field">
                                             <label>File Log Level</label>
                                             <md-outlined-select name="file" .value=${this._fileLevel}>
@@ -133,10 +129,8 @@ export class LogLevelDialog extends LitElement {
                                             </md-outlined-select>
                                         </div>
                                     `
-                                      : nothing
-                              }
-                          `
-                    }
+                                  : nothing}
+                          `}
                 </div>
                 <div slot="actions">
                     <md-text-button @click=${this._close}>Cancel</md-text-button>

package/src/pages/cluster-commands/clusters/basic-information-commands.ts

@@ -74,13 +74,9 @@ export class BasicInformationClusterCommands extends BaseClusterCommands {
             <details class="command-panel">
                 <summary>Node Label</summary>
                 <div class="command-content">
-                    ${
-                        !this._isNodeAvailable
-                            ? html`
-                                  <div class="offline-warning">Node is offline - cannot edit label</div>
-                              `
-                            : nothing
-                    }
+                    ${!this._isNodeAvailable
+                        ? html` <div class="offline-warning">Node is offline - cannot edit label</div> `
+                        : nothing}
                     <div class="command-row">
                         <md-outlined-text-field
                             label="Node Label"

package/src/pages/components/footer.ts

@@ -13,7 +13,9 @@ export class DashboardFooter extends LitElement {
         return html`
             <div class="footer">
                 The OHF Matter Server is a project by the Open Home Foundation.
-                <a href="https://www.openhomefoundation.org/structure/#support-our-work" target="_blank">Support development</a>
+                <a href="https://www.openhomefoundation.org/structure/#support-our-work" target="_blank"
+                    >Support development</a
+                >
             </div>
         `;
     }

package/src/pages/components/header.ts

@@ -107,26 +107,22 @@ export class DashboardHeader extends LitElement {
                     aria-current=${this.activeView === "nodes" ? "page" : nothing}
                     >Nodes</a
                 >
-                ${
-                    showThreadTab
-                        ? html`<a
+                ${showThreadTab
+                    ? html`<a
                           href="#thread"
                           class="nav-tab ${this.activeView === "thread" ? "active" : ""}"
                           aria-current=${this.activeView === "thread" ? "page" : nothing}
                           >Thread</a
                       >`
-                        : nothing
-                }
-                ${
-                    showWifiTab
-                        ? html`<a
+                    : nothing}
+                ${showWifiTab
+                    ? html`<a
                           href="#wifi"
                           class="nav-tab ${this.activeView === "wifi" ? "active" : ""}"
                           aria-current=${this.activeView === "wifi" ? "page" : nothing}
                           >WiFi</a
                       >`
-                        : nothing
-                }
+                    : nothing}
             </nav>
         `;
     }
@@ -135,15 +131,13 @@ export class DashboardHeader extends LitElement {
         return html`
             <div class="header">
                 <!-- optional back button -->
-                ${
-                    this.backButton
-                        ? html` <a .href=${this.backButton}>
+                ${this.backButton
+                    ? html` <a .href=${this.backButton}>
                           <md-icon-button>
                               <ha-svg-icon .path=${mdiArrowLeft}></ha-svg-icon>
                           </md-icon-button>
                       </a>`
-                        : ""
-                }
+                    : ""}
 
                 <div class="title">${this.title ?? ""}</div>
                 ${this._renderNavTabs()}
@@ -156,29 +150,25 @@ export class DashboardHeader extends LitElement {
                         `;
                     })}
                     <!-- settings button (only when connected) -->
-                    ${
-                        this.client
-                            ? html`
+                    ${this.client
+                        ? html`
                               <md-icon-button @click=${this._openSettings} title="Server Settings">
                                   <ha-svg-icon .path=${mdiCog}></ha-svg-icon>
                               </md-icon-button>
                           `
-                            : nothing
-                    }
+                        : nothing}
                     <!-- theme toggle button -->
                     <md-icon-button @click=${this._cycleTheme} .title=${this._getThemeTooltip()}>
                         <ha-svg-icon .path=${this._getThemeIcon()}></ha-svg-icon>
                     </md-icon-button>
                     <!-- optional logout button (only when client exists and not in production) -->
-                    ${
-                        this.client && !this.client.isProduction
-                            ? html`
+                    ${this.client && !this.client.isProduction
+                        ? html`
                               <md-icon-button @click=${this.client.disconnect}>
                                   <ha-svg-icon .path=${mdiLogout}></ha-svg-icon>
                               </md-icon-button>
                           `
-                            : nothing
-                    }
+                        : nothing}
                 </div>
             </div>
         `;

package/src/pages/components/node-details.ts

@@ -81,13 +81,7 @@ export class NodeDetails extends LitElement {
                     <ha-svg-icon slot="start" class="device-icon" .path=${getDeviceIcon(this.node)}></ha-svg-icon>
                     <div slot="headline">
                         <b>${this.node.nodeLabel || "Node Info"}</b>
-                        ${
-                            this.node.available
-                                ? nothing
-                                : html`
-                                      <span class="status">OFFLINE</span>
-                                  `
-                        }
+                        ${this.node.available ? nothing : html` <span class="status">OFFLINE</span> `}
                     </div>
                 </md-list-item>
                 <md-list-item>
@@ -101,56 +95,48 @@ export class NodeDetails extends LitElement {
                     </div>
                     <div slot="supporting-text"><span class="left">Is bridge: </span>${this.node.is_bridge}</div>
                     <div slot="supporting-text"><span class="left">Serialnumber: </span>${this.node.serialNumber}</div>
-                    ${
-                        this.node.matter_version
-                            ? html`<div slot="supporting-text">
+                    ${this.node.matter_version
+                        ? html`<div slot="supporting-text">
                               <span class="left">Matter version: </span>${this.node.matter_version}
                           </div>`
-                            : nothing
-                    }
-                    ${
-                        this.node.is_bridge
-                            ? ""
-                            : html` <div slot="supporting-text">
+                        : nothing}
+                    ${this.node.is_bridge
+                        ? ""
+                        : html` <div slot="supporting-text">
                               <span class="left">All device types: </span>${getNodeDeviceTypes(this.node)
                                   .map(deviceType => {
                                       return deviceType.label;
                                   })
                                   .join(" / ")}
-                          </div>`
-                    }
+                          </div>`}
                 </md-list-item>
                 <md-list-item>
                     <div class="btn-row">
                         <md-outlined-button @click=${handleAsync(() => this._reinterview())}
                             >Interview<ha-svg-icon slot="icon" .path=${mdiChatProcessing}></ha-svg-icon
                         ></md-outlined-button>
-                        ${
-                            this._updateInitiated
-                                ? html` <md-outlined-button disabled
+                        ${this._updateInitiated
+                            ? html` <md-outlined-button disabled
                                   >Checking for updates<ha-svg-icon slot="icon" .path=${mdiUpdate}></ha-svg-icon
                               ></md-outlined-button>`
-                                : (this.node.updateState ?? 0) > 1
-                                  ? html` <md-outlined-button disabled
+                            : (this.node.updateState ?? 0) > 1
+                              ? html` <md-outlined-button disabled
                                     >${getUpdateStateLabel(
                                         this.node.updateState!,
                                         this.node.updateStateProgress,
                                     )}<ha-svg-icon slot="icon" .path=${mdiUpdate}></ha-svg-icon
                                 ></md-outlined-button>`
-                                  : html`<md-outlined-button @click=${handleAsync(() => this._searchUpdate())}
+                              : html`<md-outlined-button @click=${handleAsync(() => this._searchUpdate())}
                                     >Update<ha-svg-icon slot="icon" .path=${mdiUpdate}></ha-svg-icon
-                                ></md-outlined-button>`
-                        }
-                        ${
-                            bindings
-                                ? html`
+                                ></md-outlined-button>`}
+                        ${bindings
+                            ? html`
                                   <md-outlined-button @click=${handleAsync(() => this._binding())}>
                                       Binding
                                       <ha-svg-icon slot="icon" .path=${mdiLink}></ha-svg-icon>
                                   </md-outlined-button>
                               `
-                                : nothing
-                        }
+                            : nothing}
 
                         <md-outlined-button @click=${handleAsync(() => this._openCommissioningWindow())}
                             >Share<ha-svg-icon slot="icon" .path=${mdiShareVariant}></ha-svg-icon
@@ -232,27 +218,24 @@ export class NodeDetails extends LitElement {
         if (
             !(await showPromptDialog({
                 title: "Firmware update available",
-                text: html`Found a firmware update for this node on
-                    <b>${nodeUpdate.update_source}</b>.
-                    ${
-                        isUnverifiedSource
-                            ? html`
-                                  <p
-                                      style="
+                text: html`Found a firmware update for this node on <b>${nodeUpdate.update_source}</b>.
+                    ${isUnverifiedSource
+                        ? html`
+                              <p
+                                  style="
                                           background: var(--md-sys-color-error, #b3261e);
                                           color: var(--md-sys-color-on-error, #fff);
                                           padding: 8px 12px;
                                           border-radius: 4px;
                                           font-weight: bold;
                                       "
-                                  >
-                                      Warning: This update was found on an unverified source. Updates from test-net or local sources have not been
-                                      certified and may contain untested firmware that could result in non-functional devices. Applying these updates is
-                                      entirely at your own risk.
-                                  </p>
-                              `
-                            : nothing
-                    }
+                              >
+                                  Warning: This update was found on an unverified source. Updates from test-net or local
+                                  sources have not been certified and may contain untested firmware that could result in
+                                  non-functional devices. Applying these updates is entirely at your own risk.
+                              </p>
+                          `
+                        : nothing}
                     <p>
                         Do you want to update this node to version
                         <b>${nodeUpdate.software_version_string}</b>?

package/src/pages/components/server-details.ts

@@ -32,13 +32,7 @@ export class ServerDetails extends LitElement {
         <md-list-item>
             <div slot="headline">
                 <b>Open Home Foundation Matter Server ${this.client.isProduction ? "" : `(${this.client.serverBaseAddress})`}</b>
-                ${
-                    this.client.connection.connected
-                        ? nothing
-                        : html`
-                              <span class="status">OFFLINE</span>
-                          `
-                }
+                ${this.client.connection.connected ? nothing : html` <span class="status">OFFLINE</span> `}
       </div>
         </md-list-item>
         <md-list-item>

package/src/pages/matter-cluster-view.ts

@@ -118,27 +118,23 @@ class MatterClusterView extends LitElement {
                         (attribute, index) => html`
                             <md-list-item class=${index % 2 === 1 ? "alternate-row" : ""}>
                                 <div slot="headline">
-                                    ${
-                                        clusters[this.cluster!]?.attributes[attribute.key]?.label ??
-                                        "Custom/Unknown Attribute"
-                                    }
+                                    ${clusters[this.cluster!]?.attributes[attribute.key]?.label ??
+                                    "Custom/Unknown Attribute"}
                                 </div>
                                 <div slot="supporting-text">
                                     AttributeId: ${attribute.key} (${formatHex(attribute.key)}) - Value type:
                                     ${clusters[this.cluster!]?.attributes[attribute.key]?.type ?? "unknown"}
                                 </div>
                                 <div slot="end">
-                                    ${
-                                        toBigIntAwareJson(attribute.value).length > 30
-                                            ? html`<button
+                                    ${toBigIntAwareJson(attribute.value).length > 30
+                                        ? html`<button
                                               @click=${() => {
                                                   this._showAttributeValue(attribute.value);
                                               }}
                                           >
                                               Show value
                                           </button>`
-                                            : html`<code>${toBigIntAwareJson(attribute.value)}</code>`
-                                    }
+                                        : html`<code>${toBigIntAwareJson(attribute.value)}</code>`}
                                 </div>
                             </md-list-item>
                         `,

package/src/pages/matter-network-view.ts

@@ -240,17 +240,13 @@ class MatterNetworkView extends LitElement {
                         </div>
                     </div>
                 </div>
-                ${
-                    this._threadAddressSearchStatus === "idle"
-                        ? ""
-                        : html`<div class="thread-search-status ${this._threadAddressSearchStatus}">
-                              ${
-                                  this._threadAddressSearchStatus === "found"
-                                      ? "Node highlighted."
-                                      : "No matching extended address found."
-                              }
-                          </div>`
-                }
+                ${this._threadAddressSearchStatus === "idle"
+                    ? ""
+                    : html`<div class="thread-search-status ${this._threadAddressSearchStatus}">
+                          ${this._threadAddressSearchStatus === "found"
+                              ? "Node highlighted."
+                              : "No matching extended address found."}
+                      </div>`}
                 <thread-graph
                     .nodes=${this.nodes}
                     @node-selected=${this._handleNodeSelected}

package/src/pages/matter-node-view.ts

@@ -75,16 +75,14 @@ class MatterNodeView extends LitElement {
                 <div class="node-title-bar">
                     <ha-svg-icon class="node-icon" .path=${getDeviceIcon(this.node)}></ha-svg-icon>
                     <h2>Node ${this.node.node_id} <span class="node-id-hex">${nodeHex}</span></h2>
-                    ${
-                        showGraphButton
-                            ? html`
+                    ${showGraphButton
+                        ? html`
                               <a href=${graphUrl} class="show-in-graph-button" title="Show in ${graphViewType} graph">
                                   <ha-svg-icon .path=${mdiGraphOutline}></ha-svg-icon>
                                   <span class="button-text">Show in graph</span>
                               </a>
                           `
-                            : ""
-                    }
+                        : ""}
                 </div>
                 <node-details .node=${this.node} .client=${this.client}></node-details>
             </div>

package/src/pages/matter-server-view.ts

@@ -97,13 +97,7 @@ class MatterServerView extends LitElement {
                                             node.node_id,
                                         )})</span
                                     >
-                                    ${
-                                        node.available
-                                            ? ""
-                                            : html`
-                                                  <span class="status">OFFLINE</span>
-                                              `
-                                    }
+                                    ${node.available ? "" : html` <span class="status">OFFLINE</span> `}
                                 </div>
                                 <div slot="supporting-text">
                                     ${node.nodeLabel ? `${node.nodeLabel} | ` : nothing} ${node.vendorName} |

package/src/pages/network/device-panel.ts

@@ -96,9 +96,8 @@ export class DevicePanel extends LitElement {
                         class="expand-icon"
                     ></ha-svg-icon>
                 </div>
-                ${
-                    this._isExpanded
-                        ? html`
+                ${this._isExpanded
+                    ? html`
                           <md-list class="device-list">
                               ${this.nodeIds.map(nodeId => {
                                   const node = this.nodes[nodeId.toString()];
@@ -114,8 +113,7 @@ export class DevicePanel extends LitElement {
                               })}
                           </md-list>
                       `
-                        : nothing
-                }
+                    : nothing}
             </div>
         `;
     }