{% load wagtailadmin_tags %}

<div
    class="wn-panel"
    data-controller="wn-panel"
    data-wn-panel-recipients-url-value="{% url "wagtail_newsletter:recipients" %}"
>
    {% if error_message %}
        <div class="help-block help-critical">
            {% icon name="warning" %}
            {{ error_message }}
        </div>
    {% endif %}

    {% if campaign.is_sent %}
        {% block campaign_status %}
            <p>
                <b>Status:</b>
                {{ campaign.status }}
            </p>

            {% if report %}
                {% if report.send_time %}
                    <p>
                        <b>Send time:</b>
                        {{ report.send_time }}
                        ({{ report.send_time|timesince }} ago).
                    </p>
                {% endif %}

                <p>
                    <b>Emails sent:</b>
                    {{ report.emails_sent }} ({{ report.bounces }} bounces)
                </p>

                <p>
                    <b>Opens:</b>
                    {{ report.opens }}
                </p>

                <p>
                    <b>Clicks:</b>
                    {{ report.clicks }}
                </p>
            {% endif %}
        {% endblock %}

    {% elif campaign.is_scheduled %}

        <div class="help-block help-info">
            {% icon name="help" %}
            <p>
                Further changes to the page won't affect the scheduled
                campaign. To make changes to the campaign, unschedule it first,
                then make your changes and schedule it again.
            </p>
        </div>

        {% if report %}
            <p>
                <b>Status:</b>
                {{ campaign.status }}
            </p>

            <p>
                <b>Send time:</b>
                {{ report.send_time }}
                (in {{ report.send_time|timeuntil }}).
            </p>
        {% endif %}

        {% if has_action_permission.unschedule_campaign %}
            <div class="wn-panel--buttons">
                <button
                    type="button"
                    class="button no button-longrunning"
                    data-a11y-dialog-show="wn-unschedule-dialog"
                    data-controller="w-progress"
                    data-action="wn-submit:unschedule_campaign@window->w-progress#activate"
                >
                    {% icon name="spinner" %}
                    Unschedule
                </button>

                {% fragment as unschedule_dialog_subtitle %}
                    The campaign is scheduled to send at
                    {{ report.send_time }} (in {{ report.send_time|timeuntil }}).
                    This action will unschedule the sending.
                {% endfragment %}

                {% dialog icon_name="mail" id="wn-unschedule-dialog" title="Unschedule campaign" subtitle=unschedule_dialog_subtitle %}
                    <div class="help-block help-warning">
                        {% icon name="warning" %}
                        <p>
                            If you proceed, any unsaved changes in the current
                            window will be lost.
                        </p>
                    </div>

                    <form method="post" action="{% url "wagtail_newsletter:unschedule" page_id=self.instance.id %}">
                        {% csrf_token %}

                        <button
                            type="submit"
                            class="button button-primary no"
                            name="newsletter-action"
                            value="unschedule_campaign"
                            data-controller="wn-submit"
                            data-action="
                                wn-submit#sendEvent
                                w-dialog#hide
                            "
                        >
                            Unschedule
                        </button>

                        <button
                            type="button"
                            class="button button-secondary"
                            data-action="w-dialog#hide"
                        >
                            Cancel
                        </button>
                    </form>
                {% enddialog %}
            </div>
        {% endif %}

    {% else %}

        <p>
            <div class="wn-panel--buttons">
                {% if has_action_permission.save_campaign %}
                    <button
                        type="button"
                        class="button button-secondary button-longrunning"
                        data-a11y-dialog-show="wn-save-dialog"
                        data-controller="w-progress"
                        data-action="wn-submit:save_campaign@window->w-progress#activate"
                    >
                        {% icon name="spinner" %}
                        Save campaign to {{ backend_name }}
                    </button>
                {% endif %}

                {% if has_action_permission.send_test_email %}
                    <button
                        type="button"
                        class="button button-secondary button-longrunning"
                        data-a11y-dialog-show="wn-test-dialog"
                        data-controller="w-progress"
                        data-action="wn-submit:send_test_email@window->w-progress#activate"
                    >
                        {% icon name="spinner" %}
                        Send test email
                    </button>
                {% endif %}

                {% if has_action_permission.send_campaign %}
                    <button
                        type="button"
                        class="button button-primary button-longrunning"
                        data-controller="w-progress"
                        data-wn-panel-target="sendButton"
                        data-action="
                            wn-panel#sendCampaign
                            wn-submit:send_campaign@window->w-progress#activate
                        "
                    >
                        {% icon name="spinner" %}
                        Send campaign
                    </button>
                {% endif %}

                {% if has_action_permission.schedule_campaign %}
                    <button
                        type="button"
                        class="button button-primary button-longrunning"
                        data-controller="w-progress"
                        data-wn-panel-target="scheduleButton"
                        data-action="
                            wn-panel#scheduleCampaign
                            wn-submit:schedule_campaign@window->w-progress#activate
                        "
                    >
                        {% icon name="spinner" %}
                        Schedule campaign
                    </button>
                {% endif %}
            </div>

            {% fragment as save_dialog_subtitle %}
                This action will save a new draft page revision and save the
                newsletter campaign to {{ backend_name }} with your changes.
            {% endfragment %}

            {% dialog icon_name="mail" id="wn-save-dialog" title="Save campaign" dialog_root_selector="[data-edit-form]" subtitle=save_dialog_subtitle %}
                <button
                    type="submit"
                    class="button button-primary"
                    name="newsletter-action"
                    value="save_campaign"
                    data-controller="wn-submit"
                    data-action="
                        wn-submit#sendEvent
                        w-dialog#hide
                    "
                >
                    Save campaign to {{ backend_name }}
                </button>

                <button
                    type="button"
                    class="button button-secondary"
                    data-action="w-dialog#hide"
                >
                    Cancel
                </button>
            {% enddialog %}

            {% fragment as test_dialog_subtitle %}
                This action will save a new draft page revision and send a test
                email with your changes.
            {% endfragment %}

            {% dialog icon_name="mail" id="wn-test-dialog" title="Send test email" dialog_root_selector="[data-edit-form]" subtitle=test_dialog_subtitle %}
                <div
                    data-controller="wn-submit"
                    data-action="keydown.enter->wn-submit#submit:prevent"
                >
                    {% include "wagtailadmin/shared/field.html" with field=test_form.email %}

                    <button
                        type="submit"
                        class="button button-primary"
                        name="newsletter-action"
                        value="send_test_email"
                        data-wn-submit-target="button"
                        data-action="
                            wn-submit#sendEvent
                            w-dialog#hide
                        "
                    >
                        Send test email
                    </button>

                    <button
                        type="button"
                        class="button button-secondary"
                        data-action="w-dialog#hide"
                    >
                        Cancel
                    </button>
                </div>
            {% enddialog %}

            {% dialog icon_name="mail" id="wn-recipients-required" title="Send campaign" dialog_root_selector="[data-edit-form]" %}
                <div class="help-block help-warning">
                    {% icon name="warning" %}
                    <p>You must first select recipients for the newsletter.</p>
                </div>

                <button
                    type="button"
                    class="button"
                    data-action="w-dialog#hide"
                >
                    Continue
                </button>
            {% enddialog %}

            {% fragment as send_dialog_subtitle %}
                This action will save a new draft page revision and send the
                campaign using {{ backend_name }} with your changes.
            {% endfragment %}

            {% dialog icon_name="mail" id="wn-send-dialog" title="Send campaign" dialog_root_selector="[data-edit-form]" subtitle=send_dialog_subtitle %}
                <div
                    data-controller="wn-send"
                    data-action="wn-panel:showSendDialog@window->wn-send#show"
                >
                    <div class="help-block help-warning">
                        {% icon name="warning" %}
                        <p data-wn-send-target="message"></p>
                    </div>

                    <button
                        type="submit"
                        class="button button-primary"
                        name="newsletter-action"
                        value="send_campaign"
                        data-controller="wn-submit"
                        data-action="
                            wn-submit#sendEvent
                            w-dialog#hide
                        "
                    >
                        Send
                    </button>

                    <button
                        type="button"
                        class="button button-secondary"
                        data-action="w-dialog#hide"
                    >
                        Cancel
                    </button>
                </div>
            {% enddialog %}

            {% fragment as schedule_dialog_subtitle %}
                This action will save a new draft page revision and schedule
                the campaign using {{ backend_name }} with your changes.
            {% endfragment %}

            {% dialog icon_name="mail" id="wn-schedule-dialog" title="Schedule campaign" dialog_root_selector="[data-edit-form]" subtitle=schedule_dialog_subtitle %}
                <div
                    data-controller="wn-send"
                    data-action="wn-panel:showScheduleDialog@window->wn-send#show"
                >
                    <div class="help-block help-warning">
                        {% icon name="warning" %}
                        <p data-wn-send-target="message"></p>
                    </div>

                    {% include "wagtailadmin/shared/field.html" with field=schedule_form.schedule_time %}

                    <button
                        type="submit"
                        class="button button-primary"
                        name="newsletter-action"
                        value="schedule_campaign"
                        data-controller="wn-submit"
                        data-action="
                            wn-submit#sendEvent
                            w-dialog#hide
                        "
                    >
                        Schedule
                    </button>

                    <button
                        type="button"
                        class="button button-secondary"
                        data-action="w-dialog#hide"
                    >
                        Cancel
                    </button>
                </div>
            {% enddialog %}
        </p>
    {% endif %}

    {% if campaign %}
        <p>
            <a href="{{ campaign.url }}" target="_blank">
                {% icon name="link-external" classname="w-w-4 w-h-4" %}
                Open campaign in {{ backend_name }}
            </a>
        </p>
    {% endif %}
</div>