import {
    Component,
    ContentChildren,
    ViewEncapsulation,
    QueryList,
    ViewChild,
    AfterViewInit,
    Input,
} from '@angular/core';
import { MatTab, MatTabGroup } from '@angular/material/tabs';

@Component({
    selector: 'onguard-tab-container',
    templateUrl: './tab-container.component.html',
    styleUrls: ['./tab-container.component.scss'],
    encapsulation: ViewEncapsulation.None,
})
export class TabContainerComponent implements AfterViewInit {
    @Input() selectedIndex: number;
    @Input() hideHeader: boolean = false;
    @ViewChild(MatTabGroup) matTabGroup: MatTabGroup;
    @ContentChildren(MatTab, { descendants: true }) tabsFromNgContent: QueryList<MatTab>;

    constructor() {}

    ngAfterViewInit(): void {
        this.matTabGroup._tabs.reset([...this.tabsFromNgContent.toArray()]);
        this.matTabGroup._tabs.notifyOnChanges();
    }
}