{% extends 'layouts/base.html' %}

{% block content %}

<div class="page-head">
    <h1>Saved Reports Folder</h1>
    <a class="btn" href="{{ url_for('reports.index') }}">Create New Report</a>
</div>

{% for source, reports in saved_by_source.items() %}
<div class="panel report-folder">
    <div class="panel-head">
        <h2>{{ source.title() }} Reports</h2>
        <span class="badge">{{ reports|length }} files</span>
    </div>
    <div class="table-wrap">
        <table class="modern-table">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Source</th>
                    <th>Columns</th>
                    <th>Created</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                {% for report in reports %}
                <tr>
                    <td>{{ report.name }}</td>
                    <td><span class="badge">{{ report.source_table }}</span></td>
                    <td>{{ report.columns_json }}</td>
                    <td>{{ report.created_at }}</td>
                    <td class="action-buttons">
                        <a class="btn btn-sm" href="{{ url_for('reports.download_report', report_id=report.id) }}">Download {{ report.export_format|upper }}</a>
                        <form method="post" action="{{ url_for('reports.delete_report', report_id=report.id) }}"
                              onsubmit="return confirm('Delete this saved report and its generated files?')">
                            <button class="btn btn-sm danger" type="submit" title="Delete report" aria-label="Delete {{ report.name }}">&#128465;</button>
                        </form>
                    </td>
                </tr>
                {% else %}
                <tr><td colspan="5" style="text-align:center;">No reports saved yet.</td></tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>
{% endfor %}

{% endblock %}