{{!
    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_myoverview/nav-grouping-selector

    This template renders grouping dropdown.

    Example context (json):
    {
        "allincludinghidden": false,
        "all": true,
        "inprogress": false,
        "future": false,
        "past": false,
        "favourites": false,
        "hidden": false,
        "displaygroupingallincludinghidden": false,
        "displaygroupingall": true,
        "displaygroupinginprogress": true,
        "displaygroupingfuture": true,
        "displaygroupingpast": true,
        "displaygroupingfavourites": true,
        "displaygroupinghidden": true,
        "displaygroupingselector": true
    }
}}
{{#displaygroupingselector}}
<div class="dropdown mb-1 mr-auto">
    <button id="groupingdropdown" type="button" class="btn btn-sm btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" aria-label="{{#str}} aria:groupingdropdown, block_myoverview {{/str}}">
        <div class="rui-btn--icon">
            <svg width="18" height="18" fill="none" viewBox="0 0 24 24">
                <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.25 4.75H4.75L9.31174 10.4522C9.59544 10.8068 9.75 11.2474 9.75 11.7016V18.25C9.75 18.8023 10.1977 19.25 10.75 19.25H13.25C13.8023 19.25 14.25 18.8023 14.25 18.25V11.7016C14.25 11.2474 14.4046 10.8068 14.6883 10.4522L19.25 4.75Z"></path>
            </svg>
        </div>
        <span class="d-sm-inline-block ml-2" data-active-item-text>
            {{#allincludinghidden}}{{#str}} allincludinghidden, block_myoverview {{/str}}{{/allincludinghidden}}
            {{#all}}{{#str}} all, block_myoverview {{/str}}{{/all}}
            {{#inprogress}}{{#str}} inprogress, block_myoverview {{/str}}{{/inprogress}}
            {{#future}}{{#str}} future, block_myoverview {{/str}}{{/future}}
            {{#past}}{{#str}} past, block_myoverview {{/str}}{{/past}}
            {{#favourites}}{{#str}} favourites, block_myoverview {{/str}}{{/favourites}}
            {{#hidden}}{{#str}} hiddencourses, block_myoverview {{/str}}{{/hidden}}
            {{selectedcustomfield}}
        </span>
    </button>
    <ul class="dropdown-menu" role="menu" data-show-active-item data-skip-active-class="true" data-active-item-text aria-labelledby="groupingdropdown">
        {{#displaygroupingallincludinghidden}}
        <li>
            <a class="dropdown-item" href="#" data-filter="grouping" data-value="allincludinghidden" data-pref="allincludinghidden" aria-label="{{#str}} aria:allcoursesincludinghidden, block_myoverview {{/str}}" aria-controls="courses-view-{{uniqid}}" role="menuitem" {{#allincludinghidden}}aria-current="true"{{/allincludinghidden}}>
                {{#str}} allincludinghidden, block_myoverview {{/str}}
            </a>
        </li>
        {{/displaygroupingallincludinghidden}}
        {{#displaygroupingall}}
        <li class="dropdown-divider" role="presentation">
            <span class="filler">&nbsp;</span>
        </li>
        <li>
            <a class="dropdown-item" href="#" data-filter="grouping" data-value="all" data-pref="all" aria-label="{{#str}} aria:allcourses, block_myoverview {{/str}}" aria-controls="courses-view-{{uniqid}}" role="menuitem" {{#all}}aria-current="true"{{/all}}>
                {{#str}} all, block_myoverview {{/str}}
            </a>
        </li>
        {{/displaygroupingall}}
        {{#displaygroupinginprogress}}
        <li class="dropdown-divider" role="presentation">
            <span class="filler">&nbsp;</span>
        </li>
        <li>
            <a class="dropdown-item" href="#" data-filter="grouping" data-value="inprogress" data-pref="inprogress" aria-label="{{#str}} aria:inprogress, block_myoverview {{/str}}" aria-controls="courses-view-{{uniqid}}" role="menuitem" {{#inprogress}}aria-current="true"{{/inprogress}}>
                {{#str}} inprogress, block_myoverview {{/str}}
            </a>
        </li>
        {{/displaygroupinginprogress}}
        {{#displaygroupingfuture}}
            {{^displaygroupinginprogress}}
            <li class="dropdown-divider" role="presentation">
                <span class="filler">&nbsp;</span>
            </li>
            {{/displaygroupinginprogress}}
        <li>
            <a class="dropdown-item" href="#" data-filter="grouping" data-value="future" data-pref="future" aria-label="{{#str}} aria:future, block_myoverview {{/str}}" aria-controls="courses-view-{{uniqid}}" role="menuitem" {{#future}}aria-current="true"{{/future}}>
                {{#str}} future, block_myoverview {{/str}}
            </a>
        </li>
        {{/displaygroupingfuture}}
        {{#displaygroupingpast}}
            {{^displaygroupinginprogress}}
                {{^displaygroupingfuture}}
                <li class="dropdown-divider" role="presentation">
                    <span class="filler">&nbsp;</span>
                </li>
                {{/displaygroupingfuture}}
            {{/displaygroupinginprogress}}
        <li>
            <a class="dropdown-item" href="#" data-filter="grouping" data-value="past" data-pref="past" aria-label="{{#str}} aria:past, block_myoverview {{/str}}" aria-controls="courses-view-{{uniqid}}" role="menuitem" {{#past}}aria-current="true"{{/past}}>
                {{#str}} past, block_myoverview {{/str}}
            </a>
        </li>
        {{/displaygroupingpast}}
        {{#displaygroupingcustomfield}}
            <li class="dropdown-divider" role="presentation">
                <span class="filler">&nbsp;</span>
            </li>
            {{#customfieldvalues}}
                <li>
                    <a class="dropdown-item" href="#" data-filter="grouping"
                       data-value="customfield" data-pref="customfield" data-customfieldvalue="{{value}}"
                       aria-label="{{#str}}aria:customfield, block_myoverview, {{name}}{{/str}}"
                       aria-controls="courses-view-{{uniqid}}" role="menuitem" {{#active}}aria-current="true"{{/active}}>
                        {{name}}
                    </a>
                </li>
            {{/customfieldvalues}}
        {{/displaygroupingcustomfield}}
        {{#displaygroupingfavourites}}
        <li class="dropdown-divider" role="presentation">
            <span class="filler">&nbsp;</span>
        </li>
        <li>
            <a class="dropdown-item" href="#" data-filter="grouping" data-value="favourites"  data-pref="favourites" aria-label="{{#str}} aria:favourites, block_myoverview {{/str}}" aria-controls="courses-view-{{uniqid}}" role="menuitem" {{#favourites}}aria-current="true"{{/favourites}}>
                {{#str}} favourites, block_myoverview {{/str}}
            </a>
        {{/displaygroupingfavourites}}
        {{#displaygroupinghidden}}
        <li class="dropdown-divider" role="presentation">
            <span class="filler">&nbsp;</span>
        </li>
        <li>
            <a class="dropdown-item" href="#" data-filter="grouping" data-value="hidden"  data-pref="hidden" aria-label="{{#str}} aria:hiddencourses, block_myoverview {{/str}}" aria-controls="courses-view-{{uniqid}}" role="menuitem" {{#hidden}}aria-current="true"{{/hidden}}>
                {{#str}} hiddencourses, block_myoverview {{/str}}
            </a>
        </li>
        {{/displaygroupinghidden}}
    </ul>
</div>
{{/displaygroupingselector}}
{{^displaygroupingselector}}
<div class="mb-1 mr-auto">
    <span class="filler">&nbsp;</span>
</div>
{{/displaygroupingselector}}
