From 2738f40c5e3028822c4586556fddc16af5aa7d58 Mon Sep 17 00:00:00 2001
From: Meier Lukas <meierschlumpf@gmail.com>
Date: Thu, 29 Aug 2024 22:26:02 +0200
Subject: [PATCH] fix: when removing one item and then adding another one that
 newly added one can not be moved (#1025)

* fix: when removing one item and then adding another one that newly added one can not be moved

* chore: address pull request feedback

* fix: deepsource canceled
---
 .../board/sections/gridstack/use-gridstack.ts          | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/apps/nextjs/src/components/board/sections/gridstack/use-gridstack.ts b/apps/nextjs/src/components/board/sections/gridstack/use-gridstack.ts
index f916bec92..c305c75f5 100644
--- a/apps/nextjs/src/components/board/sections/gridstack/use-gridstack.ts
+++ b/apps/nextjs/src/components/board/sections/gridstack/use-gridstack.ts
@@ -80,8 +80,16 @@ export const useGridstack = (section: Omit<Section, "items">, itemIds: string[])
     isDynamic: section.kind === "dynamic",
   });
 
+  const itemRefKeys = Object.keys(itemRefs.current);
   // define items in itemRefs for easy access and reference to items
-  if (Object.keys(itemRefs.current).length !== itemIds.length) {
+  if (itemRefKeys.length !== itemIds.length) {
+    // Remove items that are not in the itemIds
+    // Otherwise when an item is removed and then another item is added, this foreach below will not run.
+    itemRefKeys.forEach((id) => {
+      if (!itemIds.includes(id)) {
+        delete itemRefs.current[id];
+      }
+    });
     itemIds.forEach((id) => {
       itemRefs.current[id] = itemRefs.current[id] ?? createRef();
     });