import {
    ChangeDetectionStrategy,
    Component,
    EventEmitter,
    Input,
    Output,
} from '@angular/core';

import {
    BasicTabInterface,
} from './../../models/index';

@Component({
    changeDetection: ChangeDetectionStrategy.OnPush,
    selector: 'basic-tabs-component',
    styleUrls: [
        './basic-tabs.component.scss',
    ],
    templateUrl: './basic-tabs.component.template.pug',
})
export class BasicTabsComponent {
    @Input()
    public tabs: BasicTabInterface[] = [];
    @Output()
    public onTabClicked = new EventEmitter<string>();

    public trackByTabId({
        id,
    }: BasicTabInterface) {
        return id;
    }

    public tabClicked({
        id,
    }: BasicTabInterface) {
        this.onTabClicked.emit(id);
    }
}