/* eslint-disable @typescript-eslint/no-explicit-any */
import { Component, EventEmitter, Input, Output} from '@angular/core';
import { Filter } from './interface/filter.interface';
import { ACTION_TYPE } from './enum/action-type.enum';
import { Action } from './interface/action.interface';
import { Group } from './interface/group.interface';
import { FilterChange, ToolbarFilterAction } from './interface';

@Component({
    selector: 'kit-toolbar',
    templateUrl: './toolbar.component.html',    
    styleUrls: ['../styles/index.scss']
})

export class ToolbarComponent{
    // all actions elements
    @Input() public actions!: Action[];
    @Input() public groups: Group[] = [];
    @Output() changeFilters: EventEmitter<FilterChange> = new EventEmitter();    
    @Output() toolbarFilterAction: EventEmitter<ToolbarFilterAction> = new EventEmitter();
    @Output() toolbarAction: EventEmitter<string> = new EventEmitter();

    public ACTION_TYPE = ACTION_TYPE; 

    private _filters!: Filter[];

    public constructor() {}

    @Input() public set filters(filters:Filter[]){
        this._filters = [...filters];  
    }

    public get filters(){
        return this._filters;
    }

    public onChangeFilters($event:FilterChange){
        this.changeFilters.emit($event);
    }

    public onToolbarFilterAction(toolbarFilterAction:ToolbarFilterAction){
        this.toolbarFilterAction.emit(toolbarFilterAction)
    }

    public onToolbarAction(action:string){
        this.toolbarAction.emit(action)
    }
}