{% extends "default.html" %}

{% set active_page = "setting" %}
{% block title %}Recovery Codes{% endblock %}
{% block default_content %}

  <div class="card">
    <div class="card-body">
      <h1 class="h3">Recovery codes</h1>
      <p>
        In the event you lose access to your authenticator app you can use one of these recovery codes to gain access to
        your account again.
        Each code can only be used once, make sure to store them in a safe place.
      </p>
      <ul>
        {% for recovery_code in recovery_codes %}

          {% if recovery_code.used %}

            <li>
              <span style="text-decoration: line-through">{{ recovery_code.code }}</span>.
              Used {{ recovery_code.used_at | dt }}.
            </li>
          {% else %}
            <li>{{ recovery_code.code }}</li>
          {% endif %}
        {% endfor %}
      </ul>
      <form method="post" class="mt-6">
        <input type="submit"
               class="btn btn-outline-primary"
               value="Generate New Codes">
      </form>
      <div class="small-text">Warning: Generating new codes will invalidate the older ones.</div>
      <hr />
      <a href="{{ url_for('dashboard.index') }}"
         class="btn btn-primary btn-lg">Back to the home page</a>
    </div>
  </div>
{% endblock %}
