{% extends "themis/base.html" %}

{% block title %}{{ api.name }} — LLM API{% endblock %}

{% block content %}
<div class="mb-6">
    <div class="text-sm breadcrumbs">
        <ul>
            <li><a href="{% url 'llm_manager:dashboard' %}">LLM Manager</a></li>
            <li><a href="{% url 'llm_manager:api_list' %}">APIs</a></li>
            <li>{{ api.name }}</li>
        </ul>
    </div>
    <div class="flex justify-between items-center mt-2">
        <h1 class="text-2xl font-bold">{{ api.name }}</h1>
        <div class="flex gap-2">
            <form method="post" action="{% url 'llm_manager:api_test' api.pk %}">
                {% csrf_token %}
                <button type="submit" class="btn btn-sm btn-accent">Test Connection</button>
            </form>
            <a href="{% url 'llm_manager:api_edit' api.pk %}" class="btn btn-sm btn-primary">Edit</a>
            <a href="{% url 'llm_manager:api_delete' api.pk %}" class="btn btn-sm btn-error btn-outline">Delete</a>
        </div>
    </div>
</div>

<!-- API details -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-8">
    <div class="card bg-base-200 shadow">
        <div class="card-body">
            <h2 class="card-title text-lg">Configuration</h2>
            <div class="grid grid-cols-2 gap-2 text-sm">
                <span class="font-semibold">Type:</span><span class="badge badge-ghost">{{ api.get_api_type_display }}</span>
                <span class="font-semibold">Base URL:</span><span class="font-mono text-xs break-all">{{ api.base_url }}</span>
                <span class="font-semibold">Active:</span><span>{% if api.is_active %}Yes{% else %}No{% endif %}</span>
                <span class="font-semibold">Streaming:</span><span>{% if api.supports_streaming %}Yes{% else %}No{% endif %}</span>
                <span class="font-semibold">Timeout:</span><span>{{ api.timeout_seconds }}s</span>
                <span class="font-semibold">Max Retries:</span><span>{{ api.max_retries }}</span>
            </div>
        </div>
    </div>
    <div class="card bg-base-200 shadow">
        <div class="card-body">
            <h2 class="card-title text-lg">Test Status</h2>
            <div class="grid grid-cols-2 gap-2 text-sm">
                <span class="font-semibold">Status:</span>
                <span>
                    {% if api.last_test_status == "success" %}<span class="badge badge-success">Success</span>
                    {% elif api.last_test_status == "failed" %}<span class="badge badge-error">Failed</span>
                    {% else %}<span class="badge badge-warning">Pending</span>{% endif %}
                </span>
                <span class="font-semibold">Last Tested:</span><span>{{ api.last_tested_at|default:"Never" }}</span>
            </div>
            {% if api.last_test_message %}
            <div class="mt-2 text-xs bg-base-300 p-2 rounded">{{ api.last_test_message }}</div>
            {% endif %}
        </div>
    </div>
</div>

<!-- Models -->
<div>
    <div class="flex justify-between items-center mb-3">
        <h2 class="text-xl font-semibold">Models ({{ models.count }})</h2>
        <a href="{% url 'llm_manager:model_create' %}?api={{ api.pk }}" class="btn btn-sm btn-primary">Add Model</a>
    </div>
    {% if models %}
    <div class="overflow-x-auto">
        <table class="table table-zebra table-sm w-full">
            <thead><tr><th>Name</th><th>Type</th><th>Context</th><th>Dims</th><th>Active</th><th>System</th></tr></thead>
            <tbody>
            {% for m in models %}
            <tr>
                <td><a href="{% url 'llm_manager:model_detail' m.pk %}" class="link link-primary">{{ m.name }}</a></td>
                <td><span class="badge badge-ghost badge-sm">{{ m.get_model_type_display }}</span></td>
                <td>{{ m.context_window|default:"—" }}</td>
                <td>{{ m.vector_dimensions|default:"—" }}</td>
                <td>{% if m.is_active %}<span class="badge badge-success badge-xs">✓</span>{% else %}<span class="badge badge-error badge-xs">✗</span>{% endif %}</td>
                <td>
                    {% if m.is_system_embedding_model %}<span class="badge badge-sm badge-success">Embed</span>{% endif %}
                    {% if m.is_system_chat_model %}<span class="badge badge-sm badge-info">Chat</span>{% endif %}
                    {% if m.is_system_reranker_model %}<span class="badge badge-sm badge-warning">Rerank</span>{% endif %}
                </td>
            </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
    {% else %}
    <div class="alert alert-info">No models for this API yet. Use "Test Connection" to auto-discover or add manually.</div>
    {% endif %}
</div>
{% endblock %}