<!--

    Queue - A Queueing system that can be used to handle labs in higher education
    Copyright (C) 2016-2024  Delft University of Technology

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

    This program 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 Affero General Public License for more details.

    You should have received a copy of the GNU Affero General Public License
    along with this program.  If not, see <https://www.gnu.org/licenses/>.

-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
    <body>
        <th:block th:fragment="header">
            <div class="flex space-between wrap">
                <h1
                    class="font-800"
                    th:if="${request.qSession.type == T(nl.tudelft.queue.model.enums.QueueSessionType).REGULAR}"
                    th:text="${'Request #' + request.id}"></h1>
                <h1
                    class="font-800"
                    th:unless="${request.qSession.type == T(nl.tudelft.queue.model.enums.QueueSessionType).REGULAR}"
                    th:text="${'Request #' + request.id + ' at ' + request.timeSlot.slot.toSentence()}"></h1>
                <div class="flex space-between wrap">
                    <div
                        th:if="${(edition != null) ? @permissionService.canManageSessions(edition.id)
                                            : @permissionService.canManageSessions(request.edition.id)}">
                        <a
                            th:if="${@permissionService.canPickRequest(request.id)}"
                            class="button"
                            data-style="outlined"
                            th:href="@{/request/{id}/pick(id=${request.id})}">
                            Claim request
                        </a>
                    </div>
                    <div th:if="${@permissionService.canRevokeRequest(request.data)}">
                        <a
                            th:if="${@permissionService.canRevokeRequest(request.data) and #authenticatedP.id != request.getRequester().getId()}"
                            class="button"
                            data-type="error"
                            data-style="outlined"
                            th:data-dialog="revoke-request-confirmation-dialog">
                            Revoke request
                        </a>
                    </div>
                </div>
            </div>

            <div>
                <dialog class="dialog" id="revoke-request-confirmation-dialog" th:if="${@permissionService.canRevokeRequest(request.data)}">
                    <form th:action="@{/request/{id}/revoke(id=${request.id})}" method="post" class="flex vertical p-7">
                        <h3 class="underlined font-500">Revoke Request</h3>
                        <div class="banner" data-type="warning" role="banner">
                            <span class="banner__icon fa-solid fa-info-circle"></span>
                            <p>Are you sure you want to revoke this request? This action is irreversible.</p>
                        </div>

                        <p>
                            Revoking a request removes a student from the queue. This can be useful if a student repeatedly misuses the queue or if
                            you need to free up a slot within a specific timeslot.
                        </p>

                        <div class="flex space-between">
                            <button type="button" data-cancel class="button p-less" data-style="outlined">Cancel</button>
                            <button type="submit" class="button p-less" data-type="error">Revoke</button>
                        </div>
                    </form>
                </dialog>
            </div>
        </th:block>
    </body>
</html>
