fix: recreate card if first render was errored

brunosabot · Sep 3, 2024 · 819e728 · 819e728
1 parent 23c1a7b
commit 819e728
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 13 deletions.
diff --git a/src/streamline-card-editor.js b/src/streamline-card-editor.js
@@ -82,12 +82,14 @@ class StreamlineCardEditor extends HTMLElement {
   initialize() {
     this.elements = {};
 
+    this.elements.error = document.createElement("ha-alert");
+    this.elements.error.setAttribute("alert-type", "error");
+    this.elements.error.classList.add("streamline-card-form__error");
+
     this.elements.style = document.createElement("style");
     this.elements.style.innerHTML = `
-      .streamline-card-form > * {
-        display: block;
-        margin-top: 8px;
-        width: 100%;
+      .streamline-card-form__error {
+        margin-bottom: 8px;
       }
     `;
 
@@ -105,6 +107,7 @@ class StreamlineCardEditor extends HTMLElement {
       this.render();
     });
 
+    this._shadow.appendChild(this.elements.error);
     this._shadow.appendChild(this.elements.form);
     this._shadow.appendChild(this.elements.style);
   }
@@ -227,9 +230,21 @@ class StreamlineCardEditor extends HTMLElement {
   render() {
     const schema = this.getSchema();
 
+    const areAllPrimitives = this._config.variables.every((variable) =>
+      Object.values(variable).every((value) => typeof value !== "object"),
+    );
+
+    if (areAllPrimitives === false) {
+      this.elements.error.style.display = "block";
+      this.elements.error.innerText = `Object and array variables are not supported in the visual editor.`;
+      this.elements.form.schema = [schema[0]];
+    } else {
+      this.elements.error.style.display = "none";
+      this.elements.form.schema = schema;
+    }
+
     this.elements.form.hass = this._hass;
     this.elements.form.data = this._config;
-    this.elements.form.schema = schema;
   }
 }
 

diff --git a/src/streamline-card.js b/src/streamline-card.js
@@ -2,8 +2,7 @@ import "./streamline-card-editor";
 import { getLovelace, getLovelaceCast } from "./getLovelace.helper";
 import deepClone from "./deepClone-helper";
 import deepEqual from "./deepEqual-helper";
-import evaluateJavascript from "./evaluateJavascript-helper";
-import evaluateVariables from "./evaluateVariables-helper";
+import evaluateConfig from "./evaluteConfig-helper";
 import { version } from "../package.json";
 
 (async function initializeStreamlineCard() {
@@ -40,7 +39,14 @@ import { version } from "../package.json";
 
     updateCardConfig() {
       if (this._isConnected && this._card && this._config) {
-        this._card.setConfig?.(this._config);
+        // If the card is errored, try to recreate it
+        if (this._card.nodeName === "HUI-ERROR-CARD") {
+          this._shadow.removeChild(this._card);
+          this._card = HELPERS.createCardElement(this._config);
+          this._shadow.appendChild(this._card);
+        } else {
+          this._card.setConfig?.(this._config);
+        }
 
         if (this._config.visibility) {
           this.parentNode.config = {
@@ -112,15 +118,12 @@ import { version } from "../package.json";
         throw new Error("You can define a card and an element in the template");
       }
 
-      this._config = evaluateVariables(
+      this._config = evaluateConfig(
         templateConfig,
         this._originalConfig.variables,
+        this._hass,
       );
 
-      if (typeof this._hass !== "undefined") {
-        evaluateJavascript(this._config, this._hass);
-      }
-
       const newParsedConfig = deepClone(this._config);
       const hasConfigChanged =
         deepEqual(oldParsedConfig, newParsedConfig) === false;