import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { BreadcrumbsItem } from './breadcrumbs-item.model';
import { BreadcrumbsLinkTarget } from './breadcrumbs-link-target.enum';
/**
 * This is a breadcrumbs component. Provide an array of BreadcrumbsItem and it will create a list of links.
 * If the BreadcrumbsItem contains both href and routerLink, the routerLink takes presedence.
 */
@Component({
  selector: 'ui-breadcrumbs',
  templateUrl: './breadcrumbs.component.html',
  styleUrls: ['./breadcrumbs.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class BreadcrumbsComponent {
  /**
   * A list of navigation items.
   */
  @Input() uiItems: BreadcrumbsItem[] = [];

  /**
   * An optional aria-label for the nav element. Defaults to 'breadcrumbs'.
   */
  @Input() uiAriaLabel: string = 'breadcrumbs';

  /**
   * The element's target attribute. If target is BreadcrumbsLinkTarget.BLANK, the component will add necessary rel attribute
   * for security reasons.
   */
  @Input() uiTarget?: BreadcrumbsLinkTarget;

  /**
   * Optional download attribute
   */
  @Input() uiDownload?: boolean | string;

  /**
   * Optional type attribute
   */
  @Input() uiType?: string;

  /**
   * A href string.
   */
  @Input() uiHref: string = ' ';

  /**
   * Optional rel attribute
   */
  @Input() uiRel?: string;

  /**
   * Angular router queryParams. F.e. `{ lorem: "ipsum" }`
   */
  @Input() uiQueryParams?: { [key: string]: string };

  /**
   * How to handle query parameters in a router link. One of:
   * - merge : Merge new with current parameters.
   * - preserve : Preserve current parameters.
   */
  @Input() uiQueryParamsHandling: 'merge' | 'preserve' = 'merge';

  get parents(): BreadcrumbsItem[] {
    return this.uiItems.slice(0, this.uiItems.length - 1);
  }

  get currentItem(): BreadcrumbsItem {
    return this.uiItems[this.uiItems.length - 1];
  }

  get rel() {
    if (this.uiTarget === BreadcrumbsLinkTarget.BLANK) {
      return 'noopener noreferrer';
    } else if (this.uiRel) {
      return this.uiRel;
    } else {
      return null;
    }
  }
}
