{% extends "admin_base.html" %}
{% import "macros/admin_crud_list.html" as crud %}

{% block page_title %}Revolut Integration{% endblock %}

{% block admin_content %}
<main class="mx-auto w-full max-w-7xl space-y-5 px-4 py-6 sm:px-6 lg:px-8">
    <header class="space-y-1">
        <h1 class="text-2xl font-bold text-foreground">Revolut payments</h1>
        <p class="text-sm text-muted">Review transactions and payment status for this tenant.</p>
    </header>
    <div class="overflow-x-auto rounded-xl border border-divider bg-surface px-3 sm:px-5">
        <nav class="blocks-filter-tabs" role="group" aria-label="Filter payments">
            <a href="#all" class="blocks-filter-tab active" data-status="all">All payments</a>
            <a href="#completed" class="blocks-filter-tab" data-status="completed">Completed</a>
            <a href="#created" class="blocks-filter-tab" data-status="created">Pending</a>
            <a href="#failed" class="blocks-filter-tab" data-status="failed">Failed</a>
        </nav>
    </div>

    {{ crud::shell_open(config_url="/plugins/revolut-payment/assets/admin/payments_list.json", mount_id="revolut-payments-list", context_selector="#revolut-config") }}

    <div class="overflow-x-auto rounded-xl border border-divider bg-surface">
    <table class="w-full min-w-[48rem] text-left text-sm">
        <thead></thead>
        <tbody>
            <tr><td colspan="5" class="p-5 text-center text-muted">Loading payments…</td></tr>
        </tbody>
    </table>
    </div>

    {{ crud::shell_close() }}

    <div id="revolut-config"
         data-currency-symbol="{{ settings.currency_symbol }}"
         hidden></div>
</main>
{% endblock %}