<ion-header>
    <ion-toolbar>
        <ion-title>{{ 'core.sort' | translate }}</ion-title>
        <ion-buttons slot="end">
            <ion-button (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
                <ion-icon name="fas-times" slot="icon-only" aria-hidden="true"></ion-icon>
            </ion-button>
        </ion-buttons>
    </ion-toolbar>
</ion-header>
<ion-content>
    <ion-list id="addon-mod-forum-sort-selector" role="menu" aria-labelledby="addon-mod-forum-sort-order-button">
        <ng-container *ngFor="let sortOrder of sortOrders">
            <ion-item class="ion-text-wrap" detail="false" role="combobox"
                [attr.aria-current]="selected == sortOrder.value ? 'page' :  'false'" [attr.aria-label]="sortOrder.label | translate"
                (click)="selectSortOrder(sortOrder)" button aria-haspopup="dialog">
                <ion-label>
                    <h2>{{ sortOrder.label | translate }}</h2>
                </ion-label>
            </ion-item>
        </ng-container>
    </ion-list>
</ion-content>
