// Bootstrap modal shell: a title, a close button and an empty body to fill

import { h } from './common.js';

/** Opens the modal at once; returns { body, hide }. The element is removed when it closes. */
export function openModal(title) {
    const body = h('div', { class: 'modal-body' }, h('div', { class: 'text-muted' }, 'Загрузка…'));
    const element = h('div', { class: 'modal fade', tabindex: '-1', 'aria-labelledby': 'modal-title', 'aria-hidden': 'true' },
        h('div', { class: 'modal-dialog modal-lg modal-dialog-scrollable' },
            h('div', { class: 'modal-content' },
                h('div', { class: 'modal-header' },
                    h('h2', { class: 'modal-title h5', id: 'modal-title' }, title),
                    h('button', { type: 'button', class: 'btn-close', 'data-bs-dismiss': 'modal', 'aria-label': 'Закрыть' })),
                body)));

    const modal = new bootstrap.Modal(element);
    element.addEventListener('hidden.bs.modal', () => {
        modal.dispose();
        element.remove();
    });
    document.body.append(element);
    modal.show();
    return { body, hide: () => modal.hide() };
}