import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
import { Badge } from '../../../core/models';

/**
 * Composant d'en-tête de page réutilisable
 * Affiche titre, description et badges/KPIs
 */
@Component({
  selector: 'app-page-header',
  templateUrl: './page-header.component.html',
  styleUrls: ['./page-header.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class PageHeaderComponent {
  
  @Input() title: string = '';
  @Input() description: string = '';
  @Input() icon: string = '';
  @Input() badges: Badge[] = [];
  @Input() loading: boolean = false;

  /**
   * TrackBy function pour optimiser le rendu des badges
   */
  trackByBadge(index: number, badge: Badge): string {
    return badge.title || index.toString();
  }
}

