From 805f5ff9b6754c47925911b5791784b9fc7cbc69 Mon Sep 17 00:00:00 2001
From: Bram Kragten <mail@bramkragten.nl>
Date: Wed, 30 Jun 2021 11:52:36 +0200
Subject: [PATCH] Recreate columns if cards change (#9480)

---
 src/panels/lovelace/views/hui-masonry-view.ts | 22 +++++++++----------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/src/panels/lovelace/views/hui-masonry-view.ts b/src/panels/lovelace/views/hui-masonry-view.ts
index 908d32e818..5ce2edf13e 100644
--- a/src/panels/lovelace/views/hui-masonry-view.ts
+++ b/src/panels/lovelace/views/hui-masonry-view.ts
@@ -127,6 +127,10 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
   public willUpdate(changedProperties: PropertyValues) {
     super.willUpdate(changedProperties);
 
+    if (this.lovelace?.editMode) {
+      import("./default-view-editable");
+    }
+
     if (changedProperties.has("hass")) {
       const oldHass = changedProperties.get("hass") as
         | HomeAssistant
@@ -140,14 +144,7 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
 
     if (changedProperties.has("narrow")) {
       this._updateColumns();
-    }
-  }
-
-  protected updated(changedProperties: PropertyValues): void {
-    super.updated(changedProperties);
-
-    if (this.lovelace?.editMode) {
-      import("./default-view-editable");
+      return;
     }
 
     const oldLovelace = changedProperties.get("lovelace") as
@@ -155,10 +152,11 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
       | undefined;
 
     if (
-      changedProperties.has("lovelace") &&
-      oldLovelace &&
-      (oldLovelace.config !== this.lovelace?.config ||
-        oldLovelace.editMode !== this.lovelace?.editMode)
+      changedProperties.has("cards") ||
+      (changedProperties.has("lovelace") &&
+        oldLovelace &&
+        (oldLovelace.config !== this.lovelace!.config ||
+          oldLovelace.editMode !== this.lovelace!.editMode))
     ) {
       this._createColumns();
     }