{% extends "base.html" %}
{% import "_macros.html" as macros %}

{% block title %}Playground - Memorizz{% endblock %}

{% block content %}
<div class="page-header">
    <h1>Playground</h1>
    <p>Select an agent to start an interactive session</p>
</div>

{% if agents %}
<div class="agents-grid">
    {% for agent in agents %}
    {% set meta_items = [] %}
    {% if agent.persona and agent.persona.role %}
        {% set _ = meta_items.append({'label': 'Role:', 'value': agent.persona.role}) %}
    {% endif %}
    {{ macros.agent_card(
        agent,
        agent.agent_id,
        agent.persona.name if agent.persona and agent.persona.name else 'Agent',
        meta_items=meta_items,
        footer_links=[
            {'href': '/agents/' ~ agent.agent_id ~ '/playground', 'class': 'btn btn-primary', 'label': 'Open Playground →'},
        ]
    ) }}
    {% endfor %}
</div>
{% else %}
<div class="empty-state">
    <div class="empty-icon">🎮</div>
    <h3>No Agents Available</h3>
    <p>Create an agent first to use the playground.</p>
    <a href="/agents/new" class="btn btn-primary">Create Agent</a>
</div>
{% endif %}
{% endblock %}