<!--

    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/>.

-->
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{edition/view}">
    <!--@thymesVar id="edition" type="nl.tudelft.labracore.api.dto.EditionDetailsDTO"-->

    <!--@thymesVar id="_module" type="nl.tudelft.labracore.api.dto.ModuleDetailsDTO"-->

    <body>
        <section class="flex vertical gap-3" layout:fragment="subcontent">
            <h3 class="font-500" th:text="|${module.name} - Join a group|"></h3>

            <table class="table" data-style="surface">
                <tr class="table__header">
                    <td>Group</td>
                    <td>Capacity</td>
                    <td></td>
                </tr>
                <tr th:each="group : ${groups}" th:if="${group.memberUsernames.size() < group.capacity}">
                    <td th:text="${group.name}"></td>
                    <td>
                        <span class="chip" th:text="|${group.memberUsernames.size()} / ${group.capacity}|"></span>
                    </td>
                    <td class="flex justify-end">
                        <form th:action="@{/group/{id}/join(id=${group.id})}" th:method="post">
                            <button type="submit" class="button p-min">Join</button>
                        </form>
                    </td>
                </tr>
            </table>
        </section>
    </body>
</html>
