import { ChangeDetectionStrategy, Component, EventEmitter, Output, computed, input } from '@angular/core';
import { TranslatePipe } from '../../../../../i18n/translate.pipe';
import { TranslateService } from '../../../../../i18n/translate.service';
import { ButtonComponent } from '../../../../../shared/ui/button/button.component';
import { CardComponent } from '../../../../../shared/ui/card/card.component';
import { DashboardMetricComponent } from '../../../dashboard/components/dashboard-metric.component';
import { AdminCategoriesDashboardStats } from '../../facade/admin-categories.facade';
import { inject } from '@angular/core';

@Component({
  selector: 'app-categories-dashboard',
  standalone: true,
  imports: [TranslatePipe, ButtonComponent, CardComponent, DashboardMetricComponent],
  templateUrl: './categories-dashboard.component.html',
  styleUrl: './categories-dashboard.component.scss',
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class CategoriesDashboardComponent {
  private readonly translate = inject(TranslateService);

  readonly stats = input.required<AdminCategoriesDashboardStats>();

  @Output() openCategory = new EventEmitter<string>();

  readonly lastModifiedValue = computed(() => {
    const iso = this.stats().lastModifiedAt;
    return iso ? new Date(iso).toLocaleDateString() : this.translate.t('adminCategories.lastModifiedNever');
  });

  goRecommended(): void {
    const id = this.stats().recommendation.categoryId;
    if (id) {
      this.openCategory.emit(id);
    }
  }
}
