Component: Accordion do not reset selected active Tab on new dynamic tab data

[kievsash]

Describe the bug

Scenario:

1. We create accordion with dynamic tabs (with ngFor)

   <button (click)="refreshData()">Reload data</button>
   <p-accordion [activeIndex]="0">
   <p-accordionTab [header]="tab.title" *ngFor="let tab of tabs">
     <p class="m-0">{{ tab.content }}</p>
   </p-accordionTab>
   </p-accordion>

   and say press tab 3 to open it.

2. Then tabs array is changed but active tab is still tab 3 that creates bad UX (since data can be totally different).
3. No public method to drop it. Need to grab accordion instance and manually assign _activeIndex and tab.selected=false

Environment

Angular 18 Primeng 17

Reproducer

https://stackblitz.com/edit/lpeujv?file=src%2Fapp%2Faccordion-dynamic-demo.ts

Angular version

18.0.2

PrimeNG version

17.18.11

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

v20.9.0

Browser(s)

Chrome

Steps to reproduce the behavior

1. Go to reproduce stackblizts
2. Open tab 3 by clicking it
3. Press Refresh button to recreate tabs array.
4. Observe tab 3 still active

Expected behavior

4. Either active tab should be 1st or all closed. Or Alternative - accordion instance public method (after grabbing instance with ViewChild) to reset active Tab

[github-actions[bot]]

Due to PrimeNG team's busy roadmap, this issue is available for anyone to work on. Make sure to reference this issue in your pull request. :sparkles: Thank you for your contribution! :sparkles: