import { Component, OnInit, Input, ViewChild } from '@angular/core';
import { ModalService } from '@libs/ui';
import { ProductReview } from '../../../../core/models/product-review.model';
import { of } from 'rxjs';
import { Review } from '../../../../core/models/review.model';
import { AddProductReviewComponent } from '../add-product-review/add-product-review.component';

@Component({
  selector: 'app-product-review',
  templateUrl: './product-review.component.html',
  styleUrls: ['./product-review.component.scss'],
})
export class ProductReviewComponent implements OnInit {
  id = 'product-review-modal';
  @Input() review: ProductReview;
  moreBtn: [{ index: number; show: boolean }] = [{ index: null, show: false }];
  _fullStars = 0;
  _halfStars = 0;
  _emptyStars = 0;
  get fullStars() {
    return of(
      Array(this._fullStars)
        .fill(0)
        .map((x, i) => i)
    );
  }
  get halfStars() {
    return of(
      Array(this._halfStars)
        .fill(0)
        .map((x, i) => i)
    );
  }
  get emptyStars() {
    return of(
      Array(this._emptyStars)
        .fill(0)
        .map((x, i) => i)
    );
  }
  get starsDisplay() {
    if (this.review) {
      return this._fullStars + (this._halfStars === 1 ? 0.5 : 0);
    }
  }
  @ViewChild('addReview') addReview: AddProductReviewComponent;

  // [HIMA-292] - feature disabled
  reviewFeatureDisabled = true;

  constructor(private modalService: ModalService) {}

  ngOnInit() {}

  getMoreBtn(index: number) {
    if (this.moreBtn && this.moreBtn.find((t) => t.index === index)) {
      return this.moreBtn.find((t) => t.index === index).show;
    }
  }

  openDialog() {
    this.modalService.open(this.id);
    const rating = this.review.stars;
    this._fullStars = Math.floor(rating);
    this._halfStars = rating > this._fullStars ? 1 : 0;
    this._emptyStars = 5 - (this._fullStars + this._halfStars);
    this.review.reviews.forEach((review: Review, index: number) => {
      this.moreBtn.push({ index: index, show: false });
    });
  }

  closeDialog() {
    this.modalService.close(this.id);
  }

  openAddReview() {
    this.closeDialog();
    this.addReview.openDialog();
  }

  getFullStarsFromRate(rate: number): number[] {
    return Array(Math.floor(rate))
      .fill(0)
      .map((x, i) => i);
  }

  getHalfStarsFromRate(rate: number): number[] {
    return Array(rate > Math.floor(rate) ? 1 : 0)
      .fill(0)
      .map((x, i) => i);
  }

  getEmptyStarsFromRate(rate: number): number[] {
    const _fullStars = Math.floor(rate);
    const _halfStars = rate > _fullStars ? 1 : 0;
    const _emptyStars = 5 - (_fullStars + _halfStars);
    return Array(_emptyStars)
      .fill(0)
      .map((x, i) => i);
  }

  reviewDescriptionText(input: string) {
    if (input.length <= 150) {
      return input;
    }
    return input.substring(0, 150) + '...';
  }

  toggleMore(index: number) {
    const currentStatus = this.moreBtn.find((t) => t.index === index).show;
    this.moreBtn.find((t) => t.index === index).show = !currentStatus;
  }
}
