{% extends "base.html" %}
{% load humanize %}
{% block title %}Releases — {{ project.name }} — Fossilrepo{% endblock %}

{% block content %}
<h1 class="text-2xl font-bold text-gray-100 mb-2">{{ project.name }}</h1>
{% include "fossil/_project_nav.html" %}

<div class="flex items-center justify-between mb-6">
  <h2 class="text-lg font-semibold text-gray-200">Releases</h2>
  <div class="flex items-center gap-3">
    <input type="search"
           name="search"
           value="{{ search }}"
           placeholder="Search releases..."
           class="rounded-md border-gray-700 bg-gray-800 text-gray-100 shadow-sm focus:border-brand focus:ring-brand text-sm px-3 py-1.5"
           hx-get="{% url 'fossil:releases' slug=project.slug %}"
           hx-trigger="input changed delay:300ms, search"
           hx-target="#release-content"
           hx-swap="innerHTML"
           hx-push-url="true" />
    {% if has_write %}
    <a href="{% url 'fossil:release_create' slug=project.slug %}"
       class="inline-flex items-center rounded-md bg-brand px-3 py-1.5 text-sm font-semibold text-white shadow-sm hover:bg-brand-hover">
      Create Release
    </a>
    {% endif %}
  </div>
</div>

<div id="release-content">
{% if releases %}
<div class="space-y-4">
  {% for release in releases %}
  <div class="overflow-hidden rounded-lg bg-gray-800 shadow border border-gray-700">
    <div class="px-6 py-4">
      <div class="flex items-start justify-between gap-4">
        <div class="flex-1 min-w-0">
          <div class="flex items-center gap-3 mb-1">
            <a href="{% url 'fossil:release_detail' slug=project.slug tag_name=release.tag_name %}"
               class="text-lg font-bold text-brand-light hover:text-brand">{{ release.tag_name }}</a>
            {% if release.is_prerelease %}
            <span class="inline-flex rounded-full bg-yellow-900/50 px-2.5 py-0.5 text-xs font-semibold text-yellow-300">Pre-release</span>
            {% endif %}
            {% if release.is_draft %}
            <span class="inline-flex rounded-full bg-gray-700 px-2.5 py-0.5 text-xs font-semibold text-gray-400">Draft</span>
            {% endif %}
          </div>
          <p class="text-sm text-gray-200">{{ release.name }}</p>
          <p class="mt-1 text-xs text-gray-500">
            {% if release.published_at %}
            Published {{ release.published_at|timesince }} ago
            {% else %}
            Created {{ release.created_at|timesince }} ago
            {% endif %}
            {% with asset_count=release.assets.count %}
            {% if asset_count %}
            &middot; {{ asset_count }} asset{{ asset_count|pluralize }}
            {% endif %}
            {% endwith %}
          </p>
        </div>
      </div>
    </div>
  </div>
  {% endfor %}
</div>
{% else %}
<div class="rounded-lg bg-gray-800 border border-gray-700 p-8 text-center">
  <p class="text-sm text-gray-500">{% if search %}No releases matching "{{ search }}".{% else %}No releases yet.{% endif %}</p>
  {% if has_write and not search %}
  <a href="{% url 'fossil:release_create' slug=project.slug %}"
     class="mt-3 inline-flex items-center rounded-md bg-brand px-3 py-1.5 text-sm font-semibold text-white shadow-sm hover:bg-brand-hover">
    Create the first release
  </a>
  {% endif %}
</div>
{% endif %}
{% include "includes/_pagination.html" %}
</div>
{% endblock %}