{% load i18n wagtailadmin_tags %}

<div
    class="wai-image-description"
    data-controller="wai-describe"
    {% if file_selector %}data-wai-describe-file-value="{{ file_selector }}"{% endif %}
    {% if image_id %}data-wai-describe-image-id-value="{{ image_id }}"{% endif %}
    data-wai-describe-loading-class="wai-image-description--loading"
>
    <div class="wai-image-description__wrapper">
        {% include original_template_name %}
        <button data-controller="w-tooltip" data-w-tooltip-content-value="{% translate 'Describe image using AI' %}" data-wai-describe-target="button" type="button" class="wai-image-description__button button" data-action="click->wai-describe#describe">
            {% icon name="wand" classname="wai-image-description__icon" %}
            {% icon name="wand-animated" classname="wai-image-description__icon" %}
        </button>
    </div>
    <div data-wai-describe-target="error"></div>
    <template data-wai-describe-target="errorTemplate">
        <p class="error-message">
            {% translate "An error occurred while generating the description. Please try again." %}
        </p>
    </template>
</div>