import { ChangeDetectionStrategy, Component, EventEmitter, inject, Output } from '@angular/core';
import { Skeleton } from 'primeng/skeleton';
import { PosLandingStore } from '../store/main.store';

@Component({
  selector: 'pos-good-categories',
  templateUrl: './categories.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush,
  imports: [Skeleton],
})
export class PosGoodCategoriesComponent {
  @Output() categoryChange = new EventEmitter<string>();

  private readonly store = inject(PosLandingStore);

  categories = this.store.goodCategories;
  loading = this.store.getGoodCategoriesLoading;

  selectedCategory = this.store.activeGoodCategory;

  changeSelectedCategory(category: { id: string; name: string }) {
    this.store.changeActiveCategory(category.id);
  }
}
