From 4f2652abd2f85c2ba41b1ddf818333a93b09a95b Mon Sep 17 00:00:00 2001
From: Paul Bottein <paul.bottein@gmail.com>
Date: Mon, 9 Sep 2024 16:34:22 +0200
Subject: [PATCH] Improve error messages

---
 .../lovelace/editor/hui-element-editor.ts     | 30 ++++++++++++++-----
 src/translations/en.json                      |  7 +++--
 2 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/src/panels/lovelace/editor/hui-element-editor.ts b/src/panels/lovelace/editor/hui-element-editor.ts
index a8682d01c3..1e71e455e1 100644
--- a/src/panels/lovelace/editor/hui-element-editor.ts
+++ b/src/panels/lovelace/editor/hui-element-editor.ts
@@ -251,17 +251,30 @@ export abstract class HuiElementEditor<T, C = any> extends LitElement {
             `}
         ${this._guiSupported === false && this.configElementType
           ? html`
-              <ha-alert alert-type="info">
-                ${this.hass.localize("ui.errors.config.editor_not_available", {
-                  type: this.configElementType,
-                })}
+              <ha-alert
+                alert-type="info"
+                .title=${this.hass.localize(
+                  "ui.errors.config.editor_not_supported"
+                )}
+              >
+                ${this.hass.localize(
+                  "ui.errors.config.editor_not_supported_details",
+                  { type: this.configElementType }
+                )}
+                <br />
+                ${this.hass.localize("ui.errors.config.edit_in_yaml_supported")}
               </ha-alert>
             `
           : nothing}
         ${this.hasError
           ? html`
-              <ha-alert alert-type="error">
-                ${this.hass.localize("ui.errors.config.error_detected")}:
+              <ha-alert
+                alert-type="error"
+                .title=${this.hass.localize(
+                  "ui.errors.config.invalid_configuration"
+                )}
+              >
+                ${this.hass.localize("ui.errors.config.error_details")}
                 <ul>
                   ${this._errors!.map((error) => html`<li>${error}</li>`)}
                 </ul>
@@ -272,12 +285,13 @@ export abstract class HuiElementEditor<T, C = any> extends LitElement {
           ? html`
               <ha-alert
                 alert-type="warning"
-                .title="${this.hass.localize(
+                .title=${this.hass.localize(
                   "ui.errors.config.editor_not_supported"
-                )}:"
+                )}
               >
                 ${this._warnings!.length > 0 && this._warnings![0] !== undefined
                   ? html`
+                      ${this.hass.localize("ui.errors.config.warning_details")}
                       <ul>
                         ${this._warnings!.map(
                           (warning) => html`<li>${warning}</li>`
diff --git a/src/translations/en.json b/src/translations/en.json
index 6f5f252572..fb96580917 100644
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -1797,9 +1797,12 @@
     "errors": {
       "config": {
         "no_type_provided": "No type provided.",
-        "error_detected": "Configuration errors detected",
+        "invalid_configuration": "Invalid configuration",
+        "error_details": "The configuration contains the following errors:",
         "editor_not_available": "No visual editor available for type ''{type}''.",
-        "editor_not_supported": "Visual editor is not supported for this configuration",
+        "editor_not_supported": "Visual editor not supported",
+        "editor_not_supported_details": "The visual editor is not supported for type ''{type}''.",
+        "warning_details": "The configuration contains the following warnings:",
         "edit_in_yaml_supported": "You can still edit your config in YAML.",
         "key_missing": "Required key ''{key}'' is missing.",
         "key_not_expected": "Key ''{key}'' is not expected or not supported by the visual editor.",