import { IGoodResponse } from '@/domains/pos/models/good.io';
import { Component, computed, EventEmitter, inject, Output } from '@angular/core';
import { ButtonDirective } from 'primeng/button';
import { Skeleton } from 'primeng/skeleton';
import images from 'src/assets/images';
import { PosLandingStore } from '../store/main.store';

@Component({
  selector: 'pos-good-grid-view',
  templateUrl: './grid-view.component.html',
  imports: [ButtonDirective, Skeleton],
})
export class PosGoodsGridViewComponent {
  private readonly store = inject(PosLandingStore);
  @Output() onAdd = new EventEmitter<IGoodResponse>();

  goods = computed(() => this.store.activatedCategoryGoods());
  loading = computed(() => this.store.getGoodsLoading());

  goodPlaceholder = images.placeholders.default;

  addProduct(good: IGoodResponse) {
    this.onAdd.emit(good);
  }
}
