{% extends "base.html" %}
{% block title %}Agents - ICDEV Dashboard{% endblock %}

{% block content %}
<div class="page-header">
    <div class="breadcrumbs">
        <a href="/">Home</a>
        <span class="separator">/</span>
        <span class="current">Agents</span>
    </div>
    <h1>Agent Registry</h1>
    <p class="subtitle"><span data-glossary="A2A">A2A</span> agent fleet status and health</p>
</div>

<!-- Summary -->
<div class="stat-grid mb-3">
    <div class="stat-card">
        <div class="stat-value text-green">{{ active_count }}</div>
        <div class="stat-label">Active Agents</div>
    </div>
    <div class="stat-card">
        <div class="stat-value {% if inactive_count > 0 %}text-red{% else %}text-green{% endif %}">{{ inactive_count }}</div>
        <div class="stat-label">Inactive Agents</div>
    </div>
    <div class="stat-card">
        <div class="stat-value text-blue">{{ agents|length }}</div>
        <div class="stat-label">Total Agents</div>
    </div>
</div>

<!-- Agent Cards -->
<div class="agent-grid">
    {% for agent in agents %}
    <div class="agent-card">
        <div class="agent-card-header">
            {% if agent.status == 'active' %}
            <span class="status-dot green"></span>
            {% else %}
            <span class="status-dot red"></span>
            {% endif %}
            <h3>{{ agent.name }}</h3>
            <span class="badge badge-{{ agent.status }}">{{ agent.status }}</span>
        </div>
        <div class="agent-card-body">
            {{ agent.description or 'No description available.' }}
        </div>
        <div class="agent-card-meta">
            <span>
                {% if agent.last_heartbeat %}
                Last heartbeat: <span data-timestamp="{{ agent.last_heartbeat }}" data-timestamp-format="ago">{{ agent.last_heartbeat | friendly_time }}</span>
                {% else %}
                No heartbeat recorded
                {% endif %}
            </span>
            <span>
                {% if agent.active_task_count > 0 %}
                <span class="text-blue">{{ agent.active_task_count }} active task{{ 's' if agent.active_task_count != 1 }}</span>
                {% else %}
                <span class="text-muted">No active tasks</span>
                {% endif %}
            </span>
        </div>
    </div>
    {% else %}
    <div class="card">
        <div class="card-label">No Agents</div>
        <div class="card-footer">No agents have been registered in the system.</div>
    </div>
    {% endfor %}
</div>
{% endblock %}