import { ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges } from '@angular/core';

@Component({
  selector: 'ui-stars',
  templateUrl: 'stars.component.html',
  styleUrls: ['stars.component.scss'],
})
export class UiStarsComponent implements OnChanges {
  @Input()
  rating: number;

  @Input()
  size: number = 12;

  fullStars: number[];
  halfStars: number[];
  emptyStars: number[];

  constructor() {}

  ngOnChanges({ rating }: SimpleChanges) {
    if (rating?.currentValue) {
      const fullStars = Math.floor(rating.currentValue);
      const halfStars = rating.currentValue > fullStars ? 1 : 0;
      const emptyStars = 5 - (fullStars + halfStars);

      this.fullStars = new Array<number>(fullStars);
      this.halfStars = new Array<number>(halfStars);
      this.emptyStars = new Array<number>(emptyStars);
    }
  }
}
