Add no IP found message to ping a matter device (#22103)

src/panels/config/integrations/integration-panels/matter/dialog-matter-ping-node.ts

@@ -5,7 +5,7 @@ import { customElement, property, state } from "lit/decorators";
 import { fireEvent } from "../../../../../common/dom/fire_event";
 import "../../../../../components/ha-circular-progress";
 import { createCloseHeading } from "../../../../../components/ha-dialog";
-import { pingMatterNode, MatterPingResult } from "../../../../../data/matter";
+import { pingMatterNode } from "../../../../../data/matter";
 import { haStyle, haStyleDialog } from "../../../../../resources/styles";
 import { HomeAssistant } from "../../../../../types";
 import { MatterPingNodeDialogParams } from "./show-dialog-matter-ping-node";
@@ -16,9 +16,12 @@ class DialogMatterPingNode extends LitElement {
 
   @state() private device_id?: string;
 
-  @state() private _status?: string;
+  @state() private _status?: "started" | "failed";
 
-  @state() private _pingResult?: MatterPingResult;
+  @state() private _pingResultEntries?: [
+    ip_address: string,
+    success: boolean,
+  ][];
 
   public async showDialog(params: MatterPingNodeDialogParams): Promise<void> {
     this.device_id = params.device_id;
@@ -38,60 +41,62 @@ class DialogMatterPingNode extends LitElement {
           this.hass.localize("ui.panel.config.matter.ping_node.title")
         )}
       >
-        ${this._pingResult
+        ${this._status === "failed"
           ? html`
-              <h2>
-                ${this.hass.localize(
-                  "ui.panel.config.matter.ping_node.ping_complete"
-                )}
-              </h2>
-              <mwc-list>
-                ${Object.entries(this._pingResult).map(
-                  ([ip, success]) =>
-                    html`<ha-list-item hasMeta noninteractive
-                      >${ip}
-                      <ha-svg-icon
-                        slot="meta"
-                        .path=${success ? mdiCheckCircle : mdiAlertCircle}
-                        class=${success ? "success" : "failed"}
-                      ></ha-svg-icon>
-                    </ha-list-item>`
-                )}
-              </mwc-list>
+              <div class="flex-container">
+                <ha-svg-icon
+                  .path=${mdiCloseCircle}
+                  class="failed"
+                ></ha-svg-icon>
+                <div class="status">
+                  <p>
+                    ${this.hass.localize(
+                      this._pingResultEntries
+                        ? "ui.panel.config.matter.ping_node.no_ip_found"
+                        : "ui.panel.config.matter.ping_node.ping_failed"
+                    )}
+                  </p>
+                </div>
+              </div>
               <mwc-button slot="primaryAction" @click=${this.closeDialog}>
                 ${this.hass.localize("ui.common.close")}
               </mwc-button>
             `
-          : this._status === "started"
+          : this._pingResultEntries
             ? html`
-                <div class="flex-container">
-                  <ha-circular-progress indeterminate></ha-circular-progress>
-                  <div class="status">
-                    <p>
-                      <b>
-                        ${this.hass.localize(
-                          "ui.panel.config.matter.ping_node.in_progress"
-                        )}
-                      </b>
-                    </p>
-                  </div>
-                </div>
+                <h2>
+                  ${this.hass.localize(
+                    "ui.panel.config.matter.ping_node.ping_complete"
+                  )}
+                </h2>
+                <mwc-list>
+                  ${this._pingResultEntries.map(
+                    ([ip, success]) =>
+                      html`<ha-list-item hasMeta noninteractive
+                        >${ip}
+                        <ha-svg-icon
+                          slot="meta"
+                          .path=${success ? mdiCheckCircle : mdiAlertCircle}
+                          class=${success ? "success" : "failed"}
+                        ></ha-svg-icon>
+                      </ha-list-item>`
+                  )}
+                </mwc-list>
                 <mwc-button slot="primaryAction" @click=${this.closeDialog}>
                   ${this.hass.localize("ui.common.close")}
                 </mwc-button>
               `
-            : this._status === "failed"
+            : this._status === "started"
               ? html`
                   <div class="flex-container">
-                    <ha-svg-icon
-                      .path=${mdiCloseCircle}
-                      class="failed"
-                    ></ha-svg-icon>
+                    <ha-circular-progress indeterminate></ha-circular-progress>
                     <div class="status">
                       <p>
-                        ${this.hass.localize(
-                          "ui.panel.config.matter.ping_node.ping_failed"
-                        )}
+                        <b>
+                          ${this.hass.localize(
+                            "ui.panel.config.matter.ping_node.in_progress"
+                          )}
+                        </b>
                       </p>
                     </div>
                   </div>
@@ -128,7 +133,13 @@ class DialogMatterPingNode extends LitElement {
     }
     this._status = "started";
     try {
-      this._pingResult = await pingMatterNode(this.hass, this.device_id!);
+      const pingResult = await pingMatterNode(this.hass, this.device_id!);
+      const pingResultEntries = Object.entries(pingResult);
+      if (pingResultEntries.length === 0) {
+        this._status = "failed";
+      }
+
+      this._pingResultEntries = pingResultEntries;
     } catch (err) {
       this._status = "failed";
     }
@@ -137,7 +148,7 @@ class DialogMatterPingNode extends LitElement {
   public closeDialog(): void {
     this.device_id = undefined;
     this._status = undefined;
-    this._pingResult = undefined;
+    this._pingResultEntries = undefined;
     fireEvent(this, "dialog-closed", { dialog: this.localName });
   }
 

src/translations/en.json

@@ -5127,7 +5127,8 @@
             "start_ping": "Start ping",
             "in_progress": "The device is being pinged. This may take some time.",
             "ping_failed": "The device ping failed. Additional information may be available in the logs.",
-            "ping_complete": "Ping device complete."
+            "ping_complete": "Ping device complete.",
+            "no_ip_found": "The device ping failed. No IP addresses found for this device."
           },
           "open_commissioning_window": {
             "title": "Share device",