{% set firstView = fsc.views | first %}
{% set model = firstView.model %}

<div class="card shadow mb-4" id="email-html">
    <div class="card-body">
        <div class="row">
            <div class="col-12 text-center mb-4">
                <h4>{{ trans('loading') }}</h4>
                <i class="fa-solid fa-circle-notch fa-5x fa-spin"></i>
            </div>
        </div>
    </div>
</div>

<script>
    let formData = new FormData();
    formData.append('action', 'getHtml');
    formData.append('code', '{{ model.primaryColumnValue() }}');

    fetch('{{ fsc.url() }}', {
        method: 'POST',
        body: formData,
    }).then(function (response) {
        if (response.ok) {
            return response.json();
        }
        return Promise.reject(response);
    }).then(function (data) {
        if (data.getHtml) {
            $('#email-html').html('');

            let div = document.createElement('div');
            div.className = 'message-content';
            $('#email-html').prepend(div);

            let frame = document.createElement('iframe');
            frame.setAttribute('sandbox', '');
            frame.setAttribute('referrerpolicy', 'no-referrer');
            frame.className = 'w-100 border-0';
            frame.style.minHeight = '70vh';
            frame.srcdoc = data.html;

            div.appendChild(frame);
        }
    }).catch(function (error) {
        alert('error getHtml');
        console.warn(error);
    });
</script>
