{% extends "base.html" %}

{% block content %}
  <div class="d-flex flex-column gap-3">
    <div class="d-flex flex-column flex-md-row align-items-md-center justify-content-between gap-3">
      {% include "partials/repo_heading.html" %}
      {% set repo_tab = "files" %}
      {% set repo_tab_label = "Tags" %}
      {% include "partials/repo_tabs.html" %}
    </div>

    <div class="card">
      <div class="card-header d-flex align-items-center justify-content-between">
        <span class="fw-semibold">Tags</span>
        <span class="text-muted small">{{ tags | length }} shown</span>
      </div>
      <div class="card-body">
        {% if tags | length == 0 %}
          <p class="text-muted mb-0">No tags yet.</p>
        {% else %}
          <div class="table-responsive">
            <table class="table table-sm align-middle mb-0">
              <thead>
                <tr>
                  <th scope="col">Tag</th>
                  <th scope="col">Creator</th>
                  {% set order_value = query.order | default('', true) %}
                  {% if order_value == "created_at" %}
                    {% set next_order = "-created_at" %}
                  {% else %}
                    {% set next_order = "created_at" %}
                  {% endif %}
                  <th scope="col" class="d-none d-md-table-cell">
                    <a
                      class="link-secondary text-decoration-none"
                      href="{{ query_url(repo_path ~ '/tags', {
                        'order': next_order
                      }) }}"
                    >
                      Created
                      {% if order_value == "created_at" %}
                        ↑
                      {% elif order_value == "-created_at" %}
                        ↓
                      {% endif %}
                    </a>
                  </th>
                </tr>
              </thead>
              <tbody>
                {% for tag in tags %}
                  <tr>
                    <td>
                      <a class="font-monospace text-decoration-none" href="{{ repo_path }}/tag/{{ tag.name }}">
                        {{ tag.name }}
                      </a>
                    </td>
                    <td class="text-muted">
                      {% if tag.creator %}
                        {{ tag.creator }}
                      {% else %}
                        —
                      {% endif %}
                    </td>
                    <td class="text-muted d-none d-md-table-cell" {% if tag.created_at %}title="{{ tag.created_at }}"{% endif %}>
                      {% if tag.created_at %}
                        {{ tag.created_at | humantime }}
                      {% else %}
                        —
                      {% endif %}
                    </td>
                  </tr>
                {% endfor %}
              </tbody>
            </table>
          </div>
        {% endif %}
      </div>
    </div>
  </div>
{% endblock %}