{% extends 'base.html' %}
{% set title = 'Delivery' %}

{% block content %}
  <section class="stack-layout">
    <div class="panel panel-header">
      <div>
        <div class="eyebrow">Unlocked batch</div>
        <h1>{{ batch.name }}</h1>
        {% if batch.description %}
          <p class="lede">{{ batch.description }}</p>
        {% endif %}
      </div>
      <div class="action-row">
        <button type="button" class="secondary-button" data-copy-target="#all-credentials">Copy all</button>
        <form method="post" action="{{ url_for('public.relock') }}" class="inline-form">
          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
          <button type="submit" class="ghost-button">Lock page</button>
        </form>
      </div>
    </div>

    <textarea id="all-credentials" class="sr-only">{{ credentials|join('\n') }}</textarea>

    <div class="panel">
      <div class="panel-heading">
        <div>
          <div class="eyebrow">Credentials</div>
          <h2>{{ credentials|length }} item{% if credentials|length != 1 %}s{% endif %}</h2>
        </div>
        <span class="badge badge-{{ access_key.status|replace(' ', '-') }}">{{ access_key.status }}</span>
      </div>

      <div class="credential-stack">
        {% for credential in credentials %}
          <div class="credential-row">
            <code class="credential-value">{{ credential }}</code>
            <button type="button" class="icon-button" data-copy-previous>Copy</button>
          </div>
        {% endfor %}
      </div>
    </div>
  </section>
{% endblock %}