Add translation to integration setup failures (#19128)

gallery/src/pages/misc/integration-card.ts

@@ -36,6 +36,8 @@ const createConfigEntry = (
   pref_disable_new_entities: false,
   pref_disable_polling: false,
   reason: null,
+  error_reason_translation_key: null,
+  error_reason_translation_placeholders: null,
   ...override,
 });
 

src/data/config_entries.ts

@@ -23,6 +23,8 @@ export interface ConfigEntry {
   pref_disable_polling: boolean;
   disabled_by: "user" | null;
   reason: string | null;
+  error_reason_translation_key: string | null;
+  error_reason_translation_placeholders: Record<string, string> | null;
 }
 
 export type ConfigEntryMutableParams = Partial<

src/panels/config/integrations/ha-config-integration-page.ts

@@ -37,6 +37,7 @@ import {
 } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import { classMap } from "lit/directives/class-map";
+import { until } from "lit/directives/until";
 import memoizeOne from "memoize-one";
 import { isComponentLoaded } from "../../../common/config/is_component_loaded";
 import { isDevVersion } from "../../../common/config/version";
@@ -550,10 +551,24 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
         `ui.panel.config.integrations.config_entry.state.${item.state}`,
       ];
       if (item.reason) {
-        this.hass.loadBackendTranslation("config", item.domain);
-        stateTextExtra = html`${this.hass.localize(
-          `component.${item.domain}.config.error.${item.reason}`
-        ) || item.reason}`;
+        if (item.error_reason_translation_key) {
+          const lokalisePromExc = this.hass
+            .loadBackendTranslation("exceptions", item.domain)
+            .then((localize) =>
+              localize(
+                `component.${item.domain}.exceptions.${item.error_reason_translation_key}.message`,
+                item.error_reason_translation_placeholders ?? undefined
+              )
+            );
+          stateTextExtra = html`${until(lokalisePromExc)}`;
+        } else {
+          const lokalisePromError = this.hass
+            .loadBackendTranslation("config", item.domain)
+            .then((localize) =>
+              localize(`component.${item.domain}.config.error.${item.reason}`)
+            );
+          stateTextExtra = html`${until(lokalisePromError, item.reason)}`;
+        }
       } else {
         stateTextExtra = html`
           <br />