{% extends "default.html" %}
{% block pagetitle %}/h/{{hole}} Mods{% endblock %}
{% block content %}
	<h5 class="mt-2">/h/{{hole}} Mods</h5>

	<div class="overflow-x-auto mt-1">
		<table>
			<thead>
				<tr>
					<th>#</th>
					<th>Name</th>
					<th>Mod since</th>
					<th class="disable-sort-click"></th>
				</tr>
			</thead>
			{% for user, mod in users %}
				<tr>
					<td>{{loop.index}}</td>
					<td>{% include "user_in_table.html" %}</td>
					<td data-time="{{mod.created_utc}}"></td>
					<td>
						{% if v.id == user.id or v.mod_date(hole.name) and v.mod_date(hole.name) < mod.created_utc %}
							<form action="/h/{{hole}}/remove_mod" method="post" data-nonce="{{g.nonce}}" data-onsubmit="removeMod(this)">
								<input hidden name="formkey" value="{{v|formkey}}" class="notranslate" translate="no">
								<input hidden name="uid" value="{{user.id}}">
								<input autocomplete="off" class="btn btn-primary ml-auto" type="submit" value="{% if v.id == user.id %}Resign{% else %}Remove Mod{% endif %}">
							</form>
						{% endif %}
					</td>
				</tr>
			{% endfor %}
		</table>
	</div>

	{% if v.mods_hole(hole.name) %}
		<form action="/h/{{hole}}/add_mod" method="post" data-nonce="{{g.nonce}}" data-onsubmit="sendFormXHRReload(this)">
			<input hidden name="formkey" value="{{v|formkey}}" class="notranslate" translate="no">
			<input class="form-control" style="display:inline;width:250px" autocomplete="off" type="text" name="user" class="form-control" placeholder="Enter username..">
			<input autocomplete="off" class="btn btn-primary ml-auto" type="submit" value="Add Mod" style="margin-bottom: 5px">
		</form>
	{% endif %}

	<script defer src="{{'js/remove_mod.js' | asset}}"></script>
{% endblock %}