{{!
	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 mod_booking/report/allusercertificate_modal

    Classes required for JS:
    * none

    Data attributes required for JS:
    * data-region

    Example context (json):
    {
        "title": "User's Certificates",
        "id": 1,
        "certificates": [
            {
                "code": "CE1234",
                "timecreated": "1.1.1970, 1:00 AM",
                "expires": "1.1.1970, 2:00 AM",
                "url": "certificate/issue/1234.pdf"
            }
        ]
    }
}}

<div>
  <button id="modal-button-{{id}}" type="button" class="btn btn-secondary"
    data-toggle="modal" data-target="#custom-modal-{{id}}"
    data-bs-toggle="modal" data-bs-target="#custom-modal-{{id}}">
    {{#str}} showcertificates, mod_booking {{/str}}
  </button>
</div>

<!-- Modal -->
<div class="modal fade" id="custom-modal-{{id}}" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">

      <div class="modal-header">
        <h5 class="modal-title">{{title}}</h5>
        <button type="button" class="btn-close" data-dismiss="modal" data-bs-dismiss="modal" aria-label="{{#str}} close, mod_booking {{/str}}">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <table class="table table-striped table-sm">
          <thead>
            <tr>
              <th>{{#str}} certificatecode, mod_booking {{/str}}</th>
              <th>{{#str}} certificateissuedate, mod_booking {{/str}}</th>
              <th>{{#str}} certificateexpirationdate, mod_booking {{/str}}</th>
            </tr>
          </thead>
          <tbody>
            {{#certificates}}
              <tr>
                <td>
                  <a href="{{{url}}}" target="_blank">
                    {{code}}
                  </a>
                </td>
                <td>{{timecreated}}</td>
                <td>{{expires}}</td>
              </tr>
            {{/certificates}}
          </tbody>
        </table>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal" data-bs-dismiss="modal">
          {{#str}} close, mod_booking {{/str}}
        </button>
      </div>

    </div>
  </div>
</div>
