fix for content Items not showing if contnent is added after contentRows

rdkcentral · Sep 6, 2024 · 976868a · 976868a
1 parent 761b5db
commit 976868a
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 1 deletion.
diff --git a/packages/@lightningjs/ui-components/src/components/ControlRow/ControlRow.js b/packages/@lightningjs/ui-components/src/components/ControlRow/ControlRow.js
@@ -122,7 +122,7 @@ export default class ControlRow extends TitleRow {
   _appendItemsAt(items, appendIndex, removeSpacingIndex) {
     const itemsCopy = [...items];
 
-    if (removeSpacingIndex != undefined) {
+    if (removeSpacingIndex != undefined && removeSpacingIndex >= 0) {
       this.items[removeSpacingIndex].extraItemSpacing = undefined;
       itemsCopy[itemsCopy.length - 1].extraItemSpacing =
         this.extraItemSpacing == undefined
@@ -133,6 +133,7 @@ export default class ControlRow extends TitleRow {
   }
 
   addContentItems(items) {
+    const lastSelected = this.selectedIndex;
     const itemsToAdd = this._createContentItems(items);
     const addIndex = this._lastItemIndex + 1;
     this._appendItemsAt(itemsToAdd, addIndex, this._lastItemIndex);
@@ -142,6 +143,9 @@ export default class ControlRow extends TitleRow {
       this._contentItems = [...this.contentItems, ...itemsToAdd];
     }
 
+    this._updateContent();
+    this.selectedIndex = lastSelected;
+
     this.patch({
       stopLazyScrollIndex: this.leftControls.length + this.items.length - 1
     });

diff --git a/packages/@lightningjs/ui-components/src/components/ControlRow/ControlRow.stories.js b/packages/@lightningjs/ui-components/src/components/ControlRow/ControlRow.stories.js
@@ -83,6 +83,42 @@ export const Basic = () =>
     }
   };
 
+export const Bug = () =>
+  class Bug extends lng.Component {
+    static _template() {
+      return {
+        ControlRow: {
+          type: ControlRowComponent,
+          leftControls: [],
+          contentItems: [],
+          rightControls: [],
+          lazyLoadBuffer: 1
+        }
+      };
+    }
+
+    _construct() {
+      setTimeout(() => {
+        if (this._ControlRow) {
+          this._ControlRow.addContentItems(
+            createItems(
+              3,
+              'https://image.tmdb.org/t/p/w500/frwl2zBNAl5ZbFDJGoJv0mYo0rF.jpg'
+            )
+          );
+        }
+      }, 1500);
+    }
+    _getFocused() {
+      return this.tag('ControlRow');
+    }
+
+    get _ControlRow() {
+      return this.tag('ControlRow');
+    }
+  };
+
+
 export const LazyLoading = () =>
   class LazyLoading extends lng.Component {
     static _template() {