<section class="flex flex-col gap-4">
    {% include 'lib/alert.twig' %}

    <a href="/admin/subscriptions/add">
        {% include 'lib/buttons/submit.twig' with {
            label: 'Create a New Subscription',
        } %}
    </a>

    <h3 class="text-2xl font-semibold">
        Revenue
    </h3>
    <table class="min-w-full">
        <thead>
            <tr>
                <th class="py-2">
                    Metric
                </th>
                <th class="py-2">
                    Value
                </th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td class="border px-4 py-2">
                    Active Subscriptions
                </td>
                <td class="border px-4 py-2">
                    {{ active_count }}
                </td>
            </tr>
            <tr>
                <td class="border px-4 py-2">
                    Total Revenue (Cents)
                </td>
                <td class="border px-4 py-2">
                    {{ revenue.total_cents }}
                </td>
            </tr>
            <tr>
                <td class="border px-4 py-2">
                    Total Revenue (Sats)
                </td>
                <td class="border px-4 py-2">
                    {{ revenue.total_sats }}
                </td>
            </tr>
            <tr>
                <td class="border px-4 py-2">
                    Total Completed
                </td>
                <td class="border px-4 py-2">
                    {{ revenue.total_count }}
                </td>
            </tr>
        </tbody>
    </table>

    <h3 class="text-2xl font-semibold">
        Projected Revenue (No New Signups, No Cancelations)
    </h3>
    <table class="min-w-full">
        <thead>
            <tr>
                <th class="py-2">
                    Period
                </th>
                <th class="py-2">
                    Cents
                </th>
                <th class="py-2">
                    Sats
                </th>
            </tr>
        </thead>
        <tbody>
            {% for period, totals in projected_revenue %}
                <tr>
                    <td class="border px-4 py-2">
                        {{ period }}
                    </td>
                    <td class="border px-4 py-2">
                        {{ totals.cents }}
                    </td>
                    <td class="border px-4 py-2">
                        {{ totals.sats }}
                    </td>
                </tr>
            {% endfor %}
        </tbody>
    </table>

    <h3 class="text-2xl font-semibold">
        Upcoming Events
    </h3>
    <table class="min-w-full">
        <thead>
            <tr>
                <th class="py-2">
                    ID
                </th>
                <th class="py-2">
                    User
                </th>
                <th class="py-2">
                    Product
                </th>
                <th class="py-2">
                    State
                </th>
                <th class="py-2">
                    Renews At
                </th>
            </tr>
        </thead>
        <tbody>
            {% if upcoming is not empty %}
                {% for sub in upcoming %}
                    <tr>
                        <td class="border px-4 py-2">
                            {{ sub.subscription_id }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ sub.user_email }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ sub.product_title }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ sub.state }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ sub.renews_at }}
                        </td>
                    </tr>
                {% endfor %}
            {% else %}
                <tr>
                    <td class="border px-4 py-2" colspan="5">
                        No upcoming subscription events.
                    </td>
                </tr>
            {% endif %}
        </tbody>
    </table>

    <h3 class="text-2xl font-semibold">
        Recent Subscription Events
    </h3>
    <table class="min-w-full">
        <thead>
            <tr>
                <th class="py-2">
                    ID
                </th>
                <th class="py-2">
                    User
                </th>
                <th class="py-2">
                    Product
                </th>
                <th class="py-2">
                    Status
                </th>
                <th class="py-2">
                    State
                </th>
                <th class="py-2">
                    Start Date
                </th>
                <th class="py-2">
                    Renews At
                </th>
            </tr>
        </thead>
        <tbody>
            {% if recent is not empty %}
                {% for sub in recent %}
                    <tr>
                        <td class="border px-4 py-2">
                            {{ sub.subscription_id }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ sub.user_email }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ sub.product_title }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ sub.status }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ sub.state }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ sub.start_date }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ sub.renews_at }}
                        </td>
                    </tr>
                {% endfor %}
            {% else %}
                <tr>
                    <td class="border px-4 py-2" colspan="7">
                        No subscription events yet.
                    </td>
                </tr>
            {% endif %}
        </tbody>
    </table>
</section>
