{% extends "layout.html" %}
{% block content %}
<h1>Accounts</h1>
<div class="panel">
{#- `hx-get` on change rather than a submit button: one control, and the
response replaces the table alone. -#}
<form class="row" hx-get="/ui/accounts" hx-target="#accounts-table"
hx-push-url="true" hx-trigger="change">
<div class="field">
<label for="profile">Profile</label>
<select id="profile" name="profile">
<option value="">every profile</option>
{% for profile in profiles %}
<option value="{{ profile.name }}"
{% if filters.profile == profile.name %}selected{% endif %}>
{{ profile.name }}
</option>
{% endfor %}
</select>
</div>
{#- What a credential card links to before an operator deletes it. A
field rather than a hidden input, so the filter is visible and can be
cleared: `hx-trigger="change"` sends every control in the form. -#}
<div class="field">
<label for="eabKid">EAB credential</label>
<input type="text" id="eabKid" name="eabKid"
placeholder="kid" value="{{ filters.eabKid | default('') }}">
</div>
{% include "partials/_filter_meta.html" %}
</form>
</div>
{% include "accounts/_table.html" %}
{% endblock %}