{% extends "console_page.html" %}

{% block title %}Agent Collaboration Invite{% endblock %}

{% block console_content %}
<div class="space-y-6 pb-6">
  <div class="mx-auto w-full max-w-2xl">
    <div class="gobii-card-base overflow-hidden">
      <div class="px-6 py-6 space-y-5">
        <div class="space-y-2">
          <p class="text-xs font-semibold uppercase tracking-wide text-slate-500">Collaboration invite</p>
          <h1 class="text-2xl font-semibold text-slate-900">
            {% if invalid_token %}
              Invalid Invitation
            {% elif expired %}
              Invitation Expired
            {% elif wrong_account %}
              Sign In Required
            {% elif already_responded %}
              Invitation {% if invite.status == "accepted" %}Accepted{% elif invite.status == "rejected" %}Declined{% else %}{{ status }}{% endif %}
            {% elif rejecting %}
              Decline Collaboration?
            {% else %}
              Join Collaboration?
            {% endif %}
          </h1>
        </div>

        {% if invalid_token %}
          <div class="space-y-3">
            <p class="text-sm text-slate-600">This invitation link is invalid or has been removed.</p>
            <div class="flex flex-wrap gap-3">
              <a href="{% url 'account_login' %}" class="inline-flex items-center rounded-lg bg-blue-600 px-4 py-2 text-sm font-semibold text-white hover:bg-blue-700">Sign in</a>
            </div>
            <p class="text-xs text-slate-500">Ask the agent owner to send a new invite.</p>
          </div>

        {% elif expired %}
          <div class="space-y-3">
            <p class="text-sm text-slate-600">This invitation has expired.</p>
            <p class="text-sm text-slate-600">Please contact {{ agent.user.get_full_name|default:agent.user.username }} to request a new invitation.</p>
            <div class="flex flex-wrap gap-3">
              <a href="{% url 'account_login' %}" class="inline-flex items-center rounded-lg bg-blue-600 px-4 py-2 text-sm font-semibold text-white hover:bg-blue-700">Sign in</a>
            </div>
          </div>

        {% elif wrong_account %}
          <div class="space-y-3">
            <p class="text-sm text-slate-600">This invitation was sent to a different account. Please sign in with the invited account to respond.</p>
            <div class="flex flex-wrap gap-3">
              <form method="post" action="{% url 'account_logout' %}">
                {% csrf_token %}
                <input type="hidden" name="next" value="{% url 'account_login' %}?next={{ request.path }}">
                <button type="submit" class="inline-flex items-center rounded-lg bg-blue-600 px-4 py-2 text-sm font-semibold text-white hover:bg-blue-700">Sign out and sign in</button>
              </form>
            </div>
          </div>

        {% elif already_responded %}
          <div class="space-y-3">
            {% if invite.status == "accepted" %}
              <p class="text-emerald-700 font-semibold">You have accepted this invitation.</p>
              <div class="flex flex-wrap gap-3">
                <a href="{% url 'agent_chat_shell' pk=agent.id %}" class="inline-flex items-center rounded-lg bg-blue-600 px-4 py-2 text-sm font-semibold text-white hover:bg-blue-700">Chat</a>
              </div>
            {% elif invite.status == "rejected" %}
              <p class="text-sm text-slate-600">You have declined this invitation.</p>
            {% else %}
              <p class="text-sm text-slate-600">This invitation has already been responded to.</p>
            {% endif %}
          </div>

        {% else %}
          <div class="space-y-4">
            <div class="rounded-lg border border-slate-200/70 bg-white/60 px-4 py-3">
              <h3 class="text-lg font-semibold text-slate-900">{{ agent.name }}</h3>
              <p class="text-sm text-slate-600 italic">{{ agent.charter }}</p>
              <p class="text-xs text-slate-500 mt-2">Invited by {{ agent.user.get_full_name|default:agent.user.username }}</p>
            </div>

            {% if can_accept %}
              <form method="post" class="space-y-3">
                {% csrf_token %}
                <button type="submit" class="w-full rounded-lg bg-blue-600 px-4 py-3 text-sm font-semibold text-white hover:bg-blue-700">
                  Accept Invitation
                </button>
                <a href="{% url 'agent_collaborator_invite_reject' token=invite.token %}" class="block w-full rounded-lg border border-rose-200 bg-rose-50 px-4 py-3 text-center text-sm font-semibold text-rose-700 hover:bg-rose-100">
                  Decline Invitation
                </a>
              </form>
            {% elif can_reject %}
              <form method="post" class="space-y-3">
                {% csrf_token %}
                <button type="submit" class="w-full rounded-lg bg-rose-600 px-4 py-3 text-sm font-semibold text-white hover:bg-rose-700">
                  Confirm Decline
                </button>
                <a href="{% url 'agent_collaborator_invite_accept' token=invite.token %}" class="block w-full rounded-lg border border-blue-200 bg-blue-50 px-4 py-3 text-center text-sm font-semibold text-blue-700 hover:bg-blue-100">
                  Go Back
                </a>
              </form>
            {% endif %}
          </div>
        {% endif %}
      </div>
    </div>
  </div>
</div>
{% endblock %}
