<app-show-debug></app-show-debug>
<!--<link-to-old-version [viewType]="viewType"></link-to-old-version>-->

<div class="tabs">
    <div class="tabs__row">
        <a
            class="tabs__tab"
            [ngClass]="{ active: viewType === ViewType.Onlineboard }"
            tabindex="0"
            routerLink="/onlineboard"
            pTooltip="{{ 'SHARED.TAB-BOARD-TOOLTIP' | translate }}"
            tooltipPosition="top"
            tooltipStyleClass="afl-tooltip"
            data-testid="onlineboard-tab"
        >
            {{ 'BOARD.TITLE' | translate }}
        </a>
        <a
            class="tabs__tab"
            [ngClass]="{ active: viewType === ViewType.Schedule }"
            tabindex="1"
            routerLink="/schedule"
            pTooltip="{{ 'SHARED.TAB-SCHEDULE-TOOLTIP' | translate }}"
            tooltipPosition="top"
            tooltipStyleClass="afl-tooltip"
            data-testid="schedule-tab"
        >
            {{ 'SCHEDULE.TITLE-TAB' | translate }}
        </a>
    </div>

    <div class="tabs__row" *ngIf="flightsMapEnabled">
        <a
            class="tabs__tab tabs__tab--full"
            [ngClass]="{ active: viewType === ViewType.FlightsMap}"
            tabindex="2"
            routerLink="/flights-map"
            pTooltip="{{ 'SHARED.TAB-FLIGHTS-MAP-TOOLTIP' | translate }}"
            tooltipPosition="top"
            tooltipStyleClass="afl-tooltip"
            data-testid="flights-map-tab"
        >
            {{ 'FLIGHTS-MAP.TITLE' | translate }}
        </a>
    </div>

</div>
