{% extends "base.html" %}{% block title %}{{ t("link.title") }}{% endblock %}
{% block body %}
<div class="auth">
  <h1>{{ t("link.title") }}</h1>
  <p class="lede">{{ t("link.lede") }}</p>

  {% if pending %}
  <div class="card">
    <h2>{{ t("link.request") }}</h2>
    <table>
      <tr><th>{{ t("link.code") }}</th><td class="mono">{{ code }}</td></tr>
      <tr><th>{{ t("link.label") }}</th><td>{{ pending.label or "-" }}</td></tr>
      <tr><th>{{ t("link.from_ip") }}</th><td class="mono">{{ pending.ip or "-" }}</td></tr>
      <tr><th>{{ t("link.expires") }}</th><td class="mono">{{ pending.expires_at }}</td></tr>
    </table>
    <p class="hint">{{ t("link.warning") }}</p>
    <form method="post" action="/link">
      <input type="hidden" name="csrf" value="{{ csrf }}">
      <input type="hidden" name="code" value="{{ code }}">
      <button name="decision" value="approve">{{ t("link.approve") }}</button>
      <button name="decision" value="deny" class="ghost">{{ t("link.deny") }}</button>
    </form>
  </div>
  {% else %}
  <div class="card">
    <form method="get" action="/link">
      <div class="field">
        <label for="code">{{ t("link.code") }}</label>
        <input id="code" name="code" class="mono" value="{{ code }}" placeholder="ABCD-2345"
               maxlength="12" autocomplete="off" autocapitalize="characters" required autofocus>
        <p class="hint">{{ t("link.nothing") }}</p>
      </div>
      <button>{{ t("link.find") }}</button>
    </form>
  </div>
  {% endif %}

  <p class="foot"><a href="/app">{{ t("nav.app") }}</a></p>
</div>
{% endblock %}