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

    <h3 class="text-2xl font-semibold">
        Products
    </h3>
    <a href="/admin/products/add">
        {% include 'lib/buttons/primary.twig' with {
        label: 'Create a Product'
    } %}
    </a>
    <table class="min-w-full">
        <thead>
            <tr>
                <th class="py-2">
                    Product ID
                </th>
                <th class="py-2">
                    Title
                </th>
                <th class="py-2">
                    Description
                </th>
                <th class="py-2">
                    Stock Quantity
                </th>
                <th class="py-2">
                    Price (Sats)
                </th>
                <th class="py-2">
                    Price (Cents)
                </th>
                <th class="py-2">
                    Action
                </th>
            </tr>
        </thead>
        <tbody>
            {% if products %}
                {% for product in products %}
                    <tr>
                        <td class="border px-4 py-2">
                            {{ product.id }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ product.title }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ product.description }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ product.stock_qty }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ product.price_sats }}
                        </td>
                        <td class="border px-4 py-2">
                            {{ product.price_cents }}
                        </td>
                        <td class="border px-4 py-2">
                            <a href="/admin/products/edit/{{ product.id }}">
                                Edit
                            </a>
                        </td>
                    </tr>
                {% endfor %}
            {% else %}
                <tr>
                    <td class="border px-4 py-2" colspan="7">
                        No products found.
                    </td>
                </tr>
            {% endif %}
        </tbody>
    </table>
</section>
