All files / src/app/shared/components/product/product-list product-list.component.ts

100% Statements 9/9
75% Branches 3/4
100% Functions 4/4
100% Lines 9/9

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 432x     2x 2x                                 2x     4x       4x     4x       6x       3x      
import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';
import { Observable } from 'rxjs';
 
import { ShoppingFacade } from 'ish-core/facades/shopping.facade';
import { ViewType } from 'ish-core/models/viewtype/viewtype.types';
 
/**
 * The Product List Component displays a list of products.
 *
 * @example
 * <ish-product-list
 *               [products]="products$ | async"
 *               [categoryId]="selectedCategoryId$ | async"
 *               [viewType]="viewType$ | async"
 * ></ish-product-list>
 */
@Component({
  selector: 'ish-product-list',
  templateUrl: './product-list.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ProductListComponent implements OnInit {
  @Input({ required: true }) products: string[];
  @Input() categoryId: string;
  @Input() viewType: ViewType = 'grid';
 
  listingLoading$: Observable<boolean>;
 
  constructor(private shoppingFacade: ShoppingFacade) {}
 
  ngOnInit(): void {
    this.listingLoading$ = this.shoppingFacade.productListingLoading$;
  }
 
  get isList() {
    return this.viewType === 'list';
  }
 
  get isGrid() {
    return !this.isList;
  }
}