{{!
    This file is part of Moodle - http://moodle.org/

    Moodle is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    Moodle is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
}}
{{!
    @template block_timeline/nav-view-selector

    This template renders the timeline sort selector.

    Example context (json):
    {}
}}
<div data-region="view-selector" class="btn-group mb-1">
    <button type="button" class="btn btn-outline-secondary dropdown-toggle icon-no-margin" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
            aria-label="{{#str}} ariaviewselector, block_timeline{{/str}}" aria-controls="menusortby"
            title="{{#str}} ariaviewselector, block_timeline{{/str}}" aria-describedby="timeline-view-selector-current-selection">
        <span id="timeline-view-selector-current-selection" data-active-item-text>
            {{#sorttimelinecourses}}{{#str}} sortbycourses, block_timeline{{/str}}{{/sorttimelinecourses}}
            {{#sorttimelinedates}}{{#str}} sortbydates, block_timeline {{/str}}{{/sorttimelinedates}}
        </span>
    </button>
    <div id="menusortby" role="tablist" class="dropdown-menu dropdown-menu-end list-group hidden" data-show-active-item>
        <a
            class="dropdown-item {{#sorttimelinedates}}active{{/sorttimelinedates}}"
            href="#view_dates_{{uniqid}}-{{timelineinstanceid}}"
            data-bs-toggle="tab"
            data-filtername="sortbydates"
            {{#sorttimelinedates}}aria-current="true"{{/sorttimelinedates}}
            aria-label="{{#str}} ariaviewselectoroption, block_timeline, {{#str}} sortbydates, block_timeline {{/str}}{{/str}}"
            aria-controls="view_dates_{{uniqid}}-{{timelineinstanceid}}"
            role="tab"
        >
            {{#str}} sortbydates, block_timeline {{/str}}
        </a>
        <a
            class="dropdown-item {{#sorttimelinecourses}}active{{/sorttimelinecourses}}"
            href="#view_courses_{{uniqid}}-{{timelineinstanceid}}"
            data-bs-toggle="tab"
            data-filtername="sortbycourses"
            {{#sorttimelinecourses}}aria-current="true"{{/sorttimelinecourses}}
            aria-label="{{#str}} ariaviewselectoroption, block_timeline, {{#str}} sortbycourses, block_timeline {{/str}}{{/str}}"
            aria-controls="view_courses_{{uniqid}}-{{timelineinstanceid}}"
            role="tab"
        >
            {{#str}} sortbycourses, block_timeline {{/str}}
        </a>
    </div>
</div>
