Add installation method to the about page (#25378)

Co-authored-by: Bram Kragten <mail@bramkragten.nl>
Co-authored-by: Franck Nijhof <git@frenck.dev>

src/data/system_health.ts

@@ -26,13 +26,29 @@ export type SystemCheckValue =
   | boolean
   | SystemCheckValueObject;
 
-export type SystemHealthInfo = Record<
-  string,
-  {
+export type SystemHealthInfo = Partial<{
+  homeassistant: {
+    info: {
+      version: string;
+      installation_type: string;
+      dev: boolean;
+      hassio: boolean;
+      docker: boolean;
+      user: string;
+      virtualenv: boolean;
+      python_version: string;
+      os_name: string;
+      os_version: string;
+      arch: string;
+      timezone: string;
+      config_dir: string;
+    };
+  };
+  [domain: string]: {
     manage_url?: string;
     info: Record<string, SystemCheckValue>;
-  }
->;
+  };
+}>;
 
 interface SystemHealthEventInitial {
   type: "initial";

src/panels/config/info/ha-config-info.ts

@@ -29,6 +29,7 @@ import { mdiHomeAssistant } from "../../../resources/home-assistant-logo-svg";
 import { haStyle } from "../../../resources/styles";
 import type { HomeAssistant, Route } from "../../../types";
 import { documentationUrl } from "../../../util/documentation-url";
+import { subscribeSystemHealthInfo } from "../../../data/system_health";
 
 const JS_TYPE = __BUILD__;
 const JS_VERSION = __VERSION__;
@@ -99,6 +100,8 @@ class HaConfigInfo extends LitElement {
 
   @state() private _hassioInfo?: HassioInfo;
 
+  @state() private _installationMethod?: string;
+
   protected render(): TemplateResult {
     const hass = this.hass;
     const customUiList: { name: string; url: string; version: string }[] =
@@ -127,6 +130,14 @@ class HaConfigInfo extends LitElement {
             </a>
             <p>Home Assistant</p>
             <ul class="versions">
+              <li>
+                <span class="version-label"
+                  >${this.hass.localize(
+                    `ui.panel.config.info.installation_method`
+                  )}</span
+                >
+                <span class="version">${this._installationMethod || "…"}</span>
+              </li>
               <li>
                 <span class="version-label">Core</span>
                 <span class="version">${hass.connection.haVersion}</span>
@@ -249,6 +260,13 @@ class HaConfigInfo extends LitElement {
     if (isComponentLoaded(this.hass, "hassio")) {
       this._loadSupervisorInfo();
     }
+
+    const unsubSystemHealth = subscribeSystemHealthInfo(this.hass, (info) => {
+      if (info?.homeassistant) {
+        this._installationMethod = info.homeassistant.info.installation_type;
+        unsubSystemHealth.then((unsub) => unsub());
+      }
+    });
   }
 
   private async _loadSupervisorInfo(): Promise<void> {

src/panels/config/repairs/dialog-system-information.ts

@@ -301,7 +301,7 @@ class DialogSystemInformation extends LitElement {
     } else {
       const domains = Object.keys(this._systemInfo).sort(sortKeys);
       for (const domain of domains) {
-        const domainInfo = this._systemInfo[domain];
+        const domainInfo = this._systemInfo[domain]!;
         const keys: TemplateResult[] = [];
 
         for (const key of Object.keys(domainInfo.info)) {
@@ -387,7 +387,7 @@ class DialogSystemInformation extends LitElement {
     const domainParts: string[] = [];
 
     for (const domain of Object.keys(this._systemInfo!).sort(sortKeys)) {
-      const domainInfo = this._systemInfo![domain];
+      const domainInfo = this._systemInfo![domain]!;
       let first = true;
       const parts = [
         `${

src/translations/en.json

@@ -3110,6 +3110,7 @@
         },
         "info": {
           "caption": "About",
+          "installation_method": "Installation method",
           "copy_menu": "Copy menu",
           "copy_raw": "Raw text",
           "copy_github": "For GitHub",