{% extends "saas/base_dashboard.html" %}

{% block saas_content %}
<card-update inline-template id="update-card-container"
    data-processor-pub-key="{{STRIPE_PUB_KEY}}"
    {% if STRIPE_INTENT_SECRET %}
    data-stripe-intent-secret="{{STRIPE_INTENT_SECRET}}"
    {% endif %}
    {% if STRIPE_ACCOUNT %}
    data-stripe-account="{{STRIPE_ACCOUNT}}"
    {% endif %}
  >
  <div>
    <h1>Update Card for {{organization}}</h1>
    <form id="update-card" method="post"
        action=".{% if next %}/?next={{next}}{% endif %}"
        v-on:submit.prevent="save">
        <input type="hidden" name="csrfmiddlewaretoken" value="{{csrf_token}}">
        {% include "saas/_card_use.html" %}
        <div id="delete-action-open">
            <div id="delete-action">
                <button type="button" id="delete-card-btn"
                        @click.prevent="remove"
                        v-if="haveCardData">Remove</button>
            </div>
        </div>
    </form>
  </div>
</card-update>
{% endblock %}

{% block saas_bodyscripts %}
{% if USE_STRIPE_V2 %}
{# We cannot use `if STRIPE_INTENT_SECRET` since it is loaded through the API.#}
<script type="text/javascript" src="https://js.stripe.com/v2/"></script>
{% else %}
<script type="text/javascript" src="https://js.stripe.com/v3/"></script>
{% endif %}
{% endblock %}