fix: remove error when recreating node

Author: remilry

packages/lib/src/spatial-navigation/components/virtualizedList/helpers/updateVirtualNodeRegistration.test.ts

@@ -11,6 +11,7 @@ describe('updateVirtualNodeRegistration', () => {
       previousItems,
       currentItems,
       addVirtualNode: mockAddNode,
+      removeVirtualNode: jest.fn(),
     });
 
     expect(mockAddNode).toHaveBeenCalledTimes(2);
@@ -24,6 +25,7 @@ describe('updateVirtualNodeRegistration', () => {
       previousItems,
       currentItems,
       addVirtualNode: mockAddNode,
+      removeVirtualNode: jest.fn(),
     });
 
     expect(mockAddNode).not.toHaveBeenCalled();

packages/lib/src/spatial-navigation/components/virtualizedList/helpers/updateVirtualNodeRegistration.ts

@@ -15,6 +15,20 @@ const registerNewNode = <T>({
   });
 };
 
+const unregisterOldNode = <T>({
+  currentItems,
+  previousItems,
+  removeVirtualNode,
+}: {
+  currentItems: Array<T>;
+  previousItems: Array<T>;
+  removeVirtualNode: (index: number) => void;
+}) => {
+  for (let index = previousItems.length - 1; index > currentItems.length - 1; index--) {
+    removeVirtualNode(index);
+  }
+};
+
 /**
  * This function aims to compare 2 arrays of items : currentItems and previousItems and :
  * - addVirtualNode for every item from currentItems that weren't in previousItems
@@ -26,16 +40,18 @@ export const updateVirtualNodeRegistration = <T>({
   currentItems,
   previousItems,
   addVirtualNode,
+  removeVirtualNode,
 }: {
   currentItems: Array<T>;
   previousItems: Array<T>;
   addVirtualNode: (index: number) => void;
+  removeVirtualNode: (index: number) => void;
 }) => {
   // Step 1 : addVirtualNode for every item from currentItems that weren't in previousItems
   registerNewNode({ currentItems, previousItems, addVirtualNode });
 
   // Step 2 : removeVirtualNode for every from previousItems that aren't there anymore in currentItems
-  // TODO
+  unregisterOldNode({ currentItems, previousItems, removeVirtualNode });
 
   // Step 3 : re-order all the items
   // TODO