Move unsupported and unhealthy alerts (#12431)

hassio/src/system/hassio-supervisor-info.ts

@@ -23,6 +23,10 @@ import {
   showAlertDialog,
   showConfirmationDialog,
 } from "../../../src/dialogs/generic/show-dialog-box";
+import {
+  UNHEALTHY_REASON_URL,
+  UNSUPPORTED_REASON_URL,
+} from "../../../src/panels/config/system-health/ha-config-system-health";
 import { haStyle } from "../../../src/resources/styles";
 import { HomeAssistant } from "../../../src/types";
 import { bytesToString } from "../../../src/util/bytes-to-string";
@@ -30,11 +34,6 @@ import { documentationUrl } from "../../../src/util/documentation-url";
 import "../components/supervisor-metric";
 import { hassioStyle } from "../resources/hassio-style";
 
-const UNSUPPORTED_REASON_URL = {};
-const UNHEALTHY_REASON_URL = {
-  privileged: "/more-info/unsupported/privileged",
-};
-
 @customElement("hassio-supervisor-info")
 class HassioSupervisorInfo extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;

src/panels/config/system-health/ha-config-system-health.ts

@@ -14,15 +14,21 @@ import "../../../components/ha-card";
 import "../../../components/ha-circular-progress";
 import "../../../components/ha-metric";
 import { fetchHassioStats, HassioStats } from "../../../data/hassio/common";
+import {
+  fetchHassioResolution,
+  HassioResolution,
+} from "../../../data/hassio/resolution";
 import { domainToName } from "../../../data/integration";
 import {
   subscribeSystemHealthInfo,
   SystemCheckValueObject,
   SystemHealthInfo,
 } from "../../../data/system_health";
+import { showAlertDialog } from "../../../dialogs/generic/show-dialog-box";
 import "../../../layouts/hass-subpage";
 import { SubscribeMixin } from "../../../mixins/subscribe-mixin";
 import type { HomeAssistant } from "../../../types";
+import { documentationUrl } from "../../../util/documentation-url";
 import { showToast } from "../../../util/toast";
 
 const sortKeys = (a: string, b: string) => {
@@ -41,6 +47,11 @@ const sortKeys = (a: string, b: string) => {
   return 0;
 };
 
+export const UNSUPPORTED_REASON_URL = {};
+export const UNHEALTHY_REASON_URL = {
+  privileged: "/more-info/unsupported/privileged",
+};
+
 @customElement("ha-config-system-health")
 class HaConfigSystemHealth extends SubscribeMixin(LitElement) {
   @property({ attribute: false }) public hass!: HomeAssistant;
@@ -51,6 +62,8 @@ class HaConfigSystemHealth extends SubscribeMixin(LitElement) {
 
   @state() private _supervisorStats?: HassioStats;
 
+  @state() private _resolutionInfo?: HassioResolution;
+
   @state() private _coreStats?: HassioStats;
 
   @state() private _error?: { code: string; message: string };
@@ -79,6 +92,9 @@ class HaConfigSystemHealth extends SubscribeMixin(LitElement) {
           10000
         )
       );
+      fetchHassioResolution(this.hass).then((data) => {
+        this._resolutionInfo = data;
+      });
     }
 
     return subs;
@@ -219,6 +235,35 @@ class HaConfigSystemHealth extends SubscribeMixin(LitElement) {
             `
           : ""}
         <div class="content">
+          ${this._resolutionInfo
+            ? html`${this._resolutionInfo.unhealthy.length
+                ? html`<ha-alert alert-type="error">
+                    ${this.hass.localize("ui.dialogs.unhealthy.title")}
+                    <mwc-button
+                      slot="action"
+                      .label=${this.hass.localize(
+                        "ui.panel.config.common.learn_more"
+                      )}
+                      @click=${this._unhealthyDialog}
+                    >
+                    </mwc-button
+                  ></ha-alert>`
+                : ""}
+              ${this._resolutionInfo.unsupported.length
+                ? html`<ha-alert alert-type="warning">
+                    ${this.hass.localize("ui.dialogs.unsupported.title")}
+                    <mwc-button
+                      slot="action"
+                      .label=${this.hass.localize(
+                        "ui.panel.config.common.learn_more"
+                      )}
+                      @click=${this._unsupportedDialog}
+                    >
+                    </mwc-button>
+                  </ha-alert>`
+                : ""} `
+            : ""}
+
           <ha-card outlined>
             <div class="card-content">${sections}</div>
           </ha-card>
@@ -277,6 +322,64 @@ class HaConfigSystemHealth extends SubscribeMixin(LitElement) {
     `;
   }
 
+  private async _unsupportedDialog(): Promise<void> {
+    await showAlertDialog(this, {
+      title: this.hass.localize("ui.dialogs.unsupported.title"),
+      text: html`${this.hass.localize("ui.dialogs.unsupported.description")}
+        <br /><br />
+        <ul>
+          ${this._resolutionInfo!.unsupported.map(
+            (reason) => html`
+              <li>
+                <a
+                  href=${documentationUrl(
+                    this.hass,
+                    UNSUPPORTED_REASON_URL[reason] ||
+                      `/more-info/unsupported/${reason}`
+                  )}
+                  target="_blank"
+                  rel="noreferrer"
+                >
+                  ${this.hass.localize(
+                    `ui.dialogs.unsupported.reason.${reason}`
+                  ) || reason}
+                </a>
+              </li>
+            `
+          )}
+        </ul>`,
+    });
+  }
+
+  private async _unhealthyDialog(): Promise<void> {
+    await showAlertDialog(this, {
+      title: this.hass.localize("ui.dialogs.unhealthy.title"),
+      text: html`${this.hass.localize("ui.dialogs.unhealthy.description")}
+        <br /><br />
+        <ul>
+          ${this._resolutionInfo!.unhealthy.map(
+            (reason) => html`
+              <li>
+                <a
+                  href=${documentationUrl(
+                    this.hass,
+                    UNHEALTHY_REASON_URL[reason] ||
+                      `/more-info/unhealthy/${reason}`
+                  )}
+                  target="_blank"
+                  rel="noreferrer"
+                >
+                  ${this.hass.localize(
+                    `ui.dialogs.unhealthy.reason.${reason}`
+                  ) || reason}
+                </a>
+              </li>
+            `
+          )}
+        </ul>`,
+    });
+  }
+
   private async _copyInfo(ev: CustomEvent<ActionDetail>): Promise<void> {
     const github = ev.detail.index === 1;
     let haContent: string | undefined;
@@ -354,6 +457,12 @@ class HaConfigSystemHealth extends SubscribeMixin(LitElement) {
       padding-bottom: 16px;
       margin-bottom: max(24px, env(safe-area-inset-bottom));
     }
+    ha-alert {
+      display: block;
+      max-width: 500px;
+      margin: 0 auto;
+      margin-bottom: max(24px, env(safe-area-inset-bottom));
+    }
     table {
       width: 100%;
     }

src/translations/en.json

@@ -994,6 +994,38 @@
         "recent_tx_messages": "{n} most recently transmitted message(s)",
         "show_as_yaml": "Show as YAML",
         "triggers": "Triggers"
+      },
+      "unsupported": {
+        "title": "[%key:supervisor::system::supervisor::unsupported_title%]",
+        "description": "[%key:supervisor::system::supervisor::unsupported_description%]",
+        "reasons": {
+          "apparmor": "[%key:supervisor::system::supervisor::unsupported_reason::apparmor%]",
+          "content_trust": "[%key:supervisor::system::supervisor::unsupported_reason::content_trust%]",
+          "dbus": "[%key:supervisor::system::supervisor::unsupported_reason::dbus%]",
+          "docker_configuration": "[%key:supervisor::system::supervisor::unsupported_reason::docker_configuration%]",
+          "docker_version": "[%key:supervisor::system::supervisor::unsupported_reason::docker_version%]",
+          "job_conditions": "[%key:supervisor::system::supervisor::unsupported_reason::job_conditions%]",
+          "lxc": "[%key:supervisor::system::supervisor::unsupported_reason::lxc%]",
+          "network_manager": "[%key:supervisor::system::supervisor::unsupported_reason::network_manager%]",
+          "os": "[%key:supervisor::system::supervisor::unsupported_reason::os%]",
+          "os_agent": "[%key:supervisor::system::supervisor::unsupported_reason::os_agent%]",
+          "privileged": "[%key:supervisor::system::supervisor::unsupported_reason::privileged%]",
+          "software": "[%key:supervisor::system::supervisor::unsupported_reason::software%]",
+          "source_mods": "[%key:supervisor::system::supervisor::unsupported_reason::source_mods%]",
+          "systemd": "[%key:supervisor::system::supervisor::unsupported_reason::systemd%]",
+          "systemd_resolved": "[%key:supervisor::system::supervisor::unsupported_reason::systemd_resolved%]"
+        }
+      },
+      "unhealthy": {
+        "title": "[%key:supervisor::system::supervisor::unhealthy_title%]",
+        "description": "[%key:supervisor::system::supervisor::unhealthy_description%]",
+        "reasons": {
+          "privileged": "[%key:supervisor::system::supervisor::unhealthy_reason::privileged%]",
+          "supervisor": "[%key:supervisor::system::supervisor::unhealthy_reason::supervisor%]",
+          "setup": "[%key:supervisor::system::supervisor::unhealthy_reason::setup%]",
+          "docker": "[%key:supervisor::system::supervisor::unhealthy_reason::docker%]",
+          "untrusted": "[%key:supervisor::system::supervisor::unhealthy_reason::untrusted%]"
+        }
       }
     },
     "duration": {