Guard for null badges (#3841)

* Guard for null badges

* Check for null badges on load and save

src/panels/lovelace/editor/view-editor/hui-edit-view.ts

@@ -215,9 +215,9 @@ export class HuiEditView extends LitElement {
     this._saving = true;
 
     const viewConf: LovelaceViewConfig = {
-      cards: this._cards,
-      badges: this._badges!.map((entityConf) => entityConf.entity),
       ...this._config,
+      badges: this._badges!.map((entityConf) => entityConf.entity),
+      cards: this._cards,
     };
 
     const lovelace = this.lovelace!;

src/panels/lovelace/ha-panel-lovelace.ts

@@ -249,7 +249,17 @@ class LovelacePanel extends LitElement {
     this._setLovelaceConfig(conf, confMode);
   }
 
+  private _checkLovelaceConfig(config: LovelaceConfig) {
+    // Somehow there can be badges with value null, we remove those
+    config.views.forEach((view) => {
+      if (view.badges) {
+        view.badges = view.badges.filter(Boolean);
+      }
+    });
+  }
+
   private _setLovelaceConfig(config: LovelaceConfig, mode: Lovelace["mode"]) {
+    this._checkLovelaceConfig(config);
     this.lovelace = {
       config,
       mode,
@@ -273,6 +283,7 @@ class LovelacePanel extends LitElement {
       },
       saveConfig: async (newConfig: LovelaceConfig): Promise<void> => {
         const { config: previousConfig, mode: previousMode } = this.lovelace!;
+        this._checkLovelaceConfig(newConfig);
         try {
           // Optimistic update
           this._updateLovelace({

src/panels/lovelace/views/hui-view.ts

@@ -262,8 +262,7 @@ export class HUIView extends LitElement {
     }
 
     const elements: HUIView["_badges"] = [];
-    // It's possible that a null value was stored as a badge entry
+    const badges = processConfigEntities(config.badges);
-    const badges = processConfigEntities(config.badges.filter(Boolean));
     for (const badge of badges) {
       const element = document.createElement("ha-state-label-badge");
       const entityId = badge.entity;