import { ChangeDetectionStrategy, Component, Input, OnChanges } from '@angular/core';
import { IconSize } from '@msfa-enums/icon-size.enum';
import { IconType } from '@msfa-enums/icon-type.enum';

const CUSTOM_ICONS: IconType[] = [
  IconType.HOME,
  IconType.SETTINGS,
  IconType.PLUS,
  IconType.CLIPBOARD,
  IconType.BUILDING,
  IconType.LOGOUT,
];

@Component({
  selector: 'msfa-icon',
  templateUrl: './icon.component.html',
  styleUrls: ['./icon.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class IconComponent implements OnChanges {
  @Input() icon: IconType;
  @Input() size: IconSize = IconSize.M;

  iconClass: string;
  iconType = IconType;

  ngOnChanges(): void {
    this.iconClass = `icon--${this.size}`;
  }

  get isCustomIcon(): boolean {
    return CUSTOM_ICONS.includes(this.icon);
  }
}
