{% extends "base.html" %}
{% set active_nav = 'apps' %}
{% block title %}Apps — Heddle Workshop{% endblock %}
{% block content %}
<hgroup>
    <h1>Deployed Apps</h1>
    <p>Upload a Heddle app bundle (.zip) to deploy workers and pipelines.</p>
</hgroup>

<article>
    <header>Deploy App</header>
    <form action="/apps/deploy" method="post" enctype="multipart/form-data"
          hx-post="/apps/deploy" hx-indicator="#deploy-spinner" hx-encoding="multipart/form-data">
        <fieldset role="group">
            <input type="file" name="zip_file" accept=".zip" required aria-label="Select app bundle ZIP file">
            <button type="submit">Deploy</button>
        </fieldset>
        <div id="deploy-spinner" class="htmx-indicator deploy-progress" aria-busy="true" role="status">
            <progress></progress>
            <small>Deploying app bundle&hellip;</small>
        </div>
    </form>
</article>

{% if error %}
<article aria-label="Error">
    <p><strong>Deployment error:</strong> {{ error }}</p>
</article>
{% endif %}

{% if apps %}
<div class="table-wrap">
<table>
    <thead>
        <tr>
            <th scope="col">Name</th>
            <th scope="col">Version</th>
            <th scope="col">Description</th>
            <th scope="col">Workers</th>
            <th scope="col">Pipelines</th>
            <th scope="col">Actions</th>
        </tr>
    </thead>
    <tbody>
        {% for app in apps %}
        <tr>
            <td><a href="/apps/{{ app.name }}">{{ app.name }}</a></td>
            <td><code>{{ app.version }}</code></td>
            <td>{{ app.description }}</td>
            <td>{{ app.entry_configs.workers | length }}</td>
            <td>{{ app.entry_configs.pipelines | length }}</td>
            <td>
                <form action="/apps/{{ app.name }}/remove" method="post" style="display:inline;"
                      onsubmit="return confirm('Remove {{ app.name }}?');">
                    <button type="submit" class="secondary outline small">Remove</button>
                </form>
            </td>
        </tr>
        {% endfor %}
    </tbody>
</table>
</div>
{% else %}
<p>No apps deployed yet. Upload a <code>.zip</code> bundle to get started.</p>
{% endif %}
{% endblock %}