import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { ApiService } from '../../services/login-api';
import { Item, Character } from '../../../../../../backend/Types/Types';

@Component({
  selector: 'itemselect',
  templateUrl: './itemselect.component.html',
})
export class FrontcraftItemSelectComponent implements OnInit{

    selected: Item
    search: string
    allItems:Item[] = []
    displayedItems: any[]

    @Input() character: string
    @Input() items: string[]
    @Output() onSelect = new EventEmitter<Item>();

    constructor(
      private api: ApiService,
    ){}

    async ngOnInit(){
        
        Promise.all(this.items.map(itemname => 
            this.api.get('ItemManager').getItem(itemname)
        )).then(items => {
            this.allItems = items
            this.displayedItems = this.allItems
        })
    }

    changeSearch(){
        if(!this.search || this.search == "") 
            this.displayedItems = this.allItems
        else
            this.displayedItems = this.allItems.filter(it => it.itemname.toLowerCase().includes(this.search.toLowerCase()))
    }

    select(item: Item){
        this.onSelect.emit(item)
    }

}