p-image-preview-indicator rendered when preview is false

[kevinley]

Describe the bug

Image with preview: false show the p-image-preview-indicator, but should not.
When inspecting our page, that image indicator mask is covering the whole page, making it impossible to inspect any elements without deleting the dom node everytime.
I checked the code and this commit seems to have introduced the regression: 162d199

Environment

PrimeNG 16.6

Reproducer

No response

Angular version

16.2.0

PrimeNG version

16.6.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.17

Browser(s)

No response

Steps to reproduce the behavior

No response

Expected behavior

No response

[francopan]

I would also add that when the user clicks on the image when [preview]="true", it is adding "p-overflow-hidden" to body in order to show the preview. However, if you have a click event to redirect, when the user clicks the image, it will get redirected and the preview is not shown, which is correct, but the class is still applied.

Example below.

<div (click)="onClick()">
    <p-image [src]="src" [height]="height + 'px'" [width]="width + 'px'" [preview]="true">
    </p-image>
    <span>{{person.name}}</span>
</div>

@Component({
  selector: 'app-person-photo',
  templateUrl: './person-photo.component.html',
  styleUrls: ['./person-photo.component.scss'],
})
export class PersonPhotoComponent {
  ...
  public src: string | undefined;
  private _person: PersonCredit | Person | undefined;
  private _router = inject(Router);

  @Input() set person(person: PersonCredit | Person | undefined) {
    this._person = person;
    if (this._person?.profile_path) {
      this.src = `${api_url.image}/w${this.width}_and_h${this.height}_face/${this._person?.profile_path}`;
    }
  }

  public get person(): PersonCredit | Person | undefined {
    return this._person;
  }

  public onClick() {
    if (this._person) {
       this._router.navigate([`/person/${this._person.id}`]);
    }
  }
}