From 02d608b7049ad29adfa73b2f450fe7db31049650 Mon Sep 17 00:00:00 2001
From: Bram Kragten <mail@bramkragten.nl>
Date: Mon, 5 Sep 2022 14:12:04 +0200
Subject: [PATCH] only show cpu and mem when available (#13589)

---
 .../config/hardware/ha-config-hardware.ts     | 99 +++++++++----------
 1 file changed, 49 insertions(+), 50 deletions(-)

diff --git a/src/panels/config/hardware/ha-config-hardware.ts b/src/panels/config/hardware/ha-config-hardware.ts
index 14795a97e3..6806eb5cb0 100644
--- a/src/panels/config/hardware/ha-config-hardware.ts
+++ b/src/panels/config/hardware/ha-config-hardware.ts
@@ -284,38 +284,38 @@ class HaConfigHardware extends SubscribeMixin(LitElement) {
                 </ha-card>
               `
             : ""}
-
-          <ha-card outlined>
-            <div class="header">
-              <div class="title">
-                ${this.hass.localize("ui.panel.config.hardware.processor")}
-              </div>
-              <div class="value">
-                ${this._systemStatusData?.cpu_percent || "-"}%
-              </div>
-            </div>
-            <div class="card-content">
-              <ha-chart-base
-                .data=${{
-                  datasets: [
-                    {
-                      ...DATA_SET_CONFIG,
-                      data: this._cpuEntries,
-                    },
-                  ],
-                }}
-                .options=${this._chartOptions}
-              ></ha-chart-base>
-            </div>
-          </ha-card>
-          <ha-card outlined>
-            <div class="header">
-              <div class="title">
-                ${this.hass.localize("ui.panel.config.hardware.memory")}
-              </div>
-              <div class="value">
-                ${this._systemStatusData
-                  ? html`
+          ${this._systemStatusData
+            ? html` <ha-card outlined>
+                  <div class="header">
+                    <div class="title">
+                      ${this.hass.localize(
+                        "ui.panel.config.hardware.processor"
+                      )}
+                    </div>
+                    <div class="value">
+                      ${this._systemStatusData.cpu_percent || "-"}%
+                    </div>
+                  </div>
+                  <div class="card-content">
+                    <ha-chart-base
+                      .data=${{
+                        datasets: [
+                          {
+                            ...DATA_SET_CONFIG,
+                            data: this._cpuEntries,
+                          },
+                        ],
+                      }}
+                      .options=${this._chartOptions}
+                    ></ha-chart-base>
+                  </div>
+                </ha-card>
+                <ha-card outlined>
+                  <div class="header">
+                    <div class="title">
+                      ${this.hass.localize("ui.panel.config.hardware.memory")}
+                    </div>
+                    <div class="value">
                       ${round(this._systemStatusData.memory_used_mb / 1024, 1)}
                       GB /
                       ${round(
@@ -325,24 +325,23 @@ class HaConfigHardware extends SubscribeMixin(LitElement) {
                         0
                       )}
                       GB
-                    `
-                  : "- GB / - GB"}
-              </div>
-            </div>
-            <div class="card-content">
-              <ha-chart-base
-                .data=${{
-                  datasets: [
-                    {
-                      ...DATA_SET_CONFIG,
-                      data: this._memoryEntries,
-                    },
-                  ],
-                }}
-                .options=${this._chartOptions}
-              ></ha-chart-base>
-            </div>
-          </ha-card>
+                    </div>
+                  </div>
+                  <div class="card-content">
+                    <ha-chart-base
+                      .data=${{
+                        datasets: [
+                          {
+                            ...DATA_SET_CONFIG,
+                            data: this._memoryEntries,
+                          },
+                        ],
+                      }}
+                      .options=${this._chartOptions}
+                    ></ha-chart-base>
+                  </div>
+                </ha-card>`
+            : ""}
         </div>
       </hass-subpage>
     `;