{% extends 'base.html' %}

{% block title %}Trade Offer Detail{% endblock title %}

{% block content %}
<div class="container mx-auto max-w-2xl mt-6">
  <h2 class="text-2xl font-bold">Trade Offer Details</h2>
  <div class="card bg-base-100 shadow-lg p-4">
    <p>
      <strong>Hash:</strong> {{ object.hash }}<br>
      <strong>Initiated By:</strong> {{ object.initiated_by }}<br>
      <strong>Cards You Have (Offer):</strong>
      {% for through in object.trade_offer_have_cards.all %}
        {{ through.card.name }} x{{ through.quantity }}{% if not forloop.last %}, {% endif %}
      {% endfor %}<br>
      <strong>Cards You Want:</strong>
      {% for through in object.trade_offer_want_cards.all %}
        {{ through.card.name }} x{{ through.quantity }}{% if not forloop.last %}, {% endif %}
      {% endfor %}<br>
      <strong>Created At:</strong> {{ object.created_at|date:"M d, Y H:i" }}<br>
      <strong>Updated At:</strong> {{ object.updated_at|date:"M d, Y H:i" }}<br>
      <strong>Status:</strong> {% if object.is_closed %}Closed{% else %}Open{% endif %}
    </p>
  </div>

  <h3 class="text-xl font-semibold mt-6">Acceptances</h3>
  {% if acceptances %}
    <ul class="space-y-2">
      {% for acceptance in acceptances %}
        <li class="card p-4">
          <p>
            <strong>Accepted By:</strong> {{ acceptance.accepted_by }}<br>
            <strong>Requested Card:</strong> {{ acceptance.requested_card.name }}<br>
            <strong>Offered Card:</strong> {{ acceptance.offered_card.name }}<br>
            <strong>State:</strong> {{ acceptance.get_state_display }}
          </p>
          <a href="{% url 'trade_acceptance_update' acceptance.pk %}" class="btn btn-sm">Update</a>
        </li>
      {% endfor %}
    </ul>
  {% else %}
    <p>No acceptances yet.</p>
  {% endif %}

  {% if acceptance_form %}
    <h3 class="text-xl font-semibold mt-6">Accept This Offer</h3>
    <div class="card p-4">
      <form method="post" action="{% url 'trade_acceptance_create' offer_pk=object.pk %}">
        {% csrf_token %}
        {{ acceptance_form.as_p }}
        <button type="submit" class="btn btn-primary">Submit Acceptance</button>
      </form>
    </div>
  {% endif %}

  <div class="mt-6">
      <!-- Show delete/close button for the initiator -->
  {% if is_initiator %}
    <a href="{{ delete_close_url }}" class="btn btn-danger">Delete/Close Trade Offer</a>
  {% endif %}
    <a href="{% url 'trade_offer_list' %}" class="btn btn-secondary">Back to Trade Offers</a>
  </div>
</div>
{% endblock content %}