{% extends 'base.html.twig' %}

{% block title %}checkout{% endblock %}

{% block body %}
<div class="text-center">
    <p>{{ prestation.user.profil.parentChambre.value }} - {{ prestation.user.profil.chambre.numero }}</p>
    <p>{{ prestation.user.profil.chambre.studioType.value }}</p>
    <p>{{ prestation.date|format_datetime('full', 'short', locale: app.session.get('_locale')) }}</p>
</div>
<div id="checkout" class="col-12">
    <!-- Checkout will insert the payment form here -->
</div>


<script>
    const stripe = Stripe('{{ stripe_public|e("js") }}');

    initialize();
    async function initialize() {
        const fetchClientSecret = async () => {
            const response = await fetch("/prestation/checkout", {
                method: "POST",
            });
            const { clientSecret } = await response.json();
            return clientSecret;
        };
        const checkout = await stripe.initEmbeddedCheckout({
            fetchClientSecret,
        });
        checkout.mount('#checkout');
    }
</script>

{% endblock %}