Updating object property inside an array of objects

I'm trying to update a property in an object inside an array using an EventEmitter in a child component.

interface productItem {
  keepOpen: boolean;
}

products$:productItem[] = Array(7).fill(
    {
      keepOpen:false
    }
  )

I'm using this function when the user clicks on the button :

shouldKeepAddToBagOpen(dataFromChild: boolean, index: number): void {
    // handle callback
    this.keepAddToBagOpen = dataFromChild;
    this.products$[index].keepOpen = dataFromChild;
 
  }

However it is affecting all the items in the array, not only the one with the given index:

What am I doing wrong?