{% extends "base.html" %}
{% block content %}

<div class="card">
    <div style="display:flex; justify-content:space-between; align-items:center">
        <h2>Projects</h2>
        <a href="/projects/new" class="btn btn-primary">+ New Project</a>
    </div>
    <p style="color:#94a3b8; font-size:0.85rem; margin-bottom:1rem">
        Select a project to work on. Projects are stored in /Volumes/1TB_APL_Storage/UmbraAudio/
    </p>

    {% if projects %}
    <table>
        <thead>
            <tr>
                <th>Project</th>
                <th>Slug</th>
                <th></th>
            </tr>
        </thead>
        <tbody>
            {% for p in projects %}
            <tr>
                <td style="font-weight:600">{{ p.name }}</td>
                <td style="color:#94a3b8">{{ p.slug }}</td>
                <td>
                    <form method="post" action="/api/projects/activate/{{ p.slug }}" style="display:inline">
                        <button type="submit" class="btn btn-primary">Open</button>
                    </form>
                </td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
    {% else %}
    <p style="color:#94a3b8">No projects found.</p>
    <p style="color:#94a3b8; margin-top:0.5rem">
        Create your first project with the <a href="/projects/new" style="color:#a78bfa">New Project</a> form.
    </p>
    {% endif %}
</div>

{% endblock %}