diff --git a/static/js/utils/VirtualScroller.js b/static/js/utils/VirtualScroller.js
index c26d15ff..bbdc73b6 100644
--- a/static/js/utils/VirtualScroller.js
+++ b/static/js/utils/VirtualScroller.js
@@ -796,6 +796,30 @@ export class VirtualScroller {
         console.log('Virtual scroller enabled');
     }
 
+    // Helper function for deep merging objects
+    deepMerge(target, source) {
+        if (!source) return target;
+        
+        const result = { ...target };
+        
+        Object.keys(source).forEach(key => {
+            if (source[key] !== null && typeof source[key] === 'object' && !Array.isArray(source[key])) {
+                // If property exists in target and is an object, recursively merge
+                if (target[key] && typeof target[key] === 'object' && !Array.isArray(target[key])) {
+                    result[key] = this.deepMerge(target[key], source[key]);
+                } else {
+                    // Otherwise just assign the source value
+                    result[key] = source[key];
+                }
+            } else {
+                // For non-objects (including arrays), just assign the value
+                result[key] = source[key];
+            }
+        });
+        
+        return result;
+    }
+
     updateSingleItem(filePath, updatedItem) {
         if (!filePath || !updatedItem) {
             console.error('Invalid parameters for updateSingleItem');
@@ -809,8 +833,8 @@ export class VirtualScroller {
             return false;
         }
 
-        // Update the item data
-        this.items[index] = {...this.items[index], ...updatedItem};
+        // Update the item data using deep merge
+        this.items[index] = this.deepMerge(this.items[index], updatedItem);
         
         // If the item is currently rendered, update its DOM representation
         if (this.renderedItems.has(index)) {