import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
import { TranslatePipe } from '../../../../../../i18n/translate.pipe';

export type ProductTabKey = 'description' | 'specifications' | 'reviews' | 'questions' | 'delivery' | 'warranty';

export interface ProductTabItem {
  key: ProductTabKey;
  label: string;
  count?: number;
  enabled?: boolean;
}

@Component({
  selector: 'app-product-tabs',
  standalone: true,
  imports: [TranslatePipe],
  templateUrl: './product-tabs.component.html',
  styleUrls: ['./product-tabs.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class ProductTabsComponent {
  @Input() tabs: ProductTabItem[] = [];
  @Input() activeKey: ProductTabKey | null = null;

  @Output() activeKeyChange = new EventEmitter<ProductTabKey>();

  selectTab(tab: ProductTabItem): void {
    if (tab.enabled === false) {
      return;
    }

    this.activeKeyChange.emit(tab.key);
  }
}
