import { Component, OnInit, Output, EventEmitter } from '@angular/core';
import { Select, Store } from '@ngxs/store';
import { SharedSelectors } from 'apps/sales/src/app/core/store/selectors/shared.selectors';
import { ProcessCart } from 'apps/sales/src/app/core/models/process-cart.model';
import { Observable, Subject } from 'rxjs';
import { CartReviewItem, deliveryFilter, cartToCartReviewArray } from '../../pages/cart-review/cart-review.component';
import { filter, map } from 'rxjs/operators';
import { isArrayMinLength } from 'apps/sales/src/app/core/utils/app.utils';
import { DeliveryOption } from 'apps/sales/src/app/core/models/delivery-option.model';
import { AddBreadcrumb } from 'apps/sales/src/app/core/store/actions/breadcrumb.actions';
import { ChangeCurrentRoute, RemoveSelectedItem } from 'apps/sales/src/app/core/store/actions/process.actions';
import { Router } from '@angular/router';
import { DeleteProductFromCart } from 'apps/sales/src/app/core/store/actions/cart.actions';
import { cartItem } from 'apps/sales/src/app/shared/animations/cart-item.animation';

@Component({
  selector: 'app-download-cart',
  templateUrl: './download-cart.component.html',
  styleUrls: ['./download-cart.component.scss'],
  animations: [cartItem],
})
export class DownloadCartComponent implements OnInit {
  @Select(SharedSelectors.getCart) cartData$: Observable<ProcessCart>;
  @Output() editItem = new EventEmitter<boolean>();
  download$: Observable<CartReviewItem[]>;
  customer: any;
  blockingItem: number;
  lastDeletedItemIndex = -1;
  destroy$ = new Subject();
  constructor(private store: Store, private router: Router) {}

  ngOnInit() {
    this.download$ = this.cartData$.pipe(
      filter((c) => isArrayMinLength(c, 'cart', 0)),
      map((review) => review.cart),
      map(deliveryFilter(DeliveryOption.DOWNLOAD)),
      map((cart) => cartToCartReviewArray(cart))
    );
  }

  productDetails(item) {
    if (item) {
      this.store.dispatch(
        new AddBreadcrumb(
          {
            name: item.product.name ? item.product.name.substring(0, 12) + (item.product.name.length > 12 ? '...' : '') : '',
            path: '/product/details/' + item.id,
          },
          'product'
        )
      );
      this.store.dispatch(new RemoveSelectedItem());
      this.store.dispatch(new ChangeCurrentRoute(`product/details/${item.id}`));
      this.router.navigate([`product/details/${item.id}`]);
    }
  }

  blockModal(blockItemId?: number) {
    if (!blockItemId) {
      this.blockingItem = null;
      this.editItem.emit(false);
    } else {
      this.editItem.emit(true);
      this.blockingItem = blockItemId;
    }
  }

  getDeleteAnimation(index: number) {
    const animation = index >= this.lastDeletedItemIndex && this.lastDeletedItemIndex !== -1 ? 'delete' : '';
    return animation;
  }

  deleteItem(item: CartReviewItem, index: number) {
    this.lastDeletedItemIndex = index;
    if (item) {
      this.store.dispatch(new DeleteProductFromCart(item.cartId, item.cartEntryId));
    }
  }
}
