ladill-hosting/resources/js/ladill-domain-purchase.js

import { closeLadillModal, openLadillModal } from './ladill-modals';

const PURCHASE_MODAL = 'domain-purchase';

function allowedParentOrigin(origin) {
    try {
        const host = new URL(origin).hostname;

        return host === 'ladill.com' || host.endsWith('.ladill.com');
    } catch {
        return false;
    }
}

function loadPurchaseFrame() {
    const frame = document.getElementById('ladill-domain-purchase-frame');
    if (!frame || frame.dataset.loaded === '1') {
        return;
    }

    const embedUrl = frame.dataset.embedUrl;
    if (embedUrl) {
        frame.src = embedUrl;
        frame.dataset.loaded = '1';
    }
}

export function registerLadillDomainPurchase() {
    window.ladillDomainSourceForm = (initial = {}) => ({
        domainSource: initial.domainSource ?? 'external',
        selectedOwnedDomain: initial.selectedOwnedDomain ?? '',
        externalDomain: initial.externalDomain ?? '',
        ownedDomains: initial.ownedDomains ?? [],
        ownedUrl: initial.ownedUrl ?? '',
        onboardingMode: initial.onboardingMode ?? 'ns_auto',

        openPurchaseModal() {
            loadPurchaseFrame();
            openLadillModal(PURCHASE_MODAL);
        },

        async refreshOwnedDomains() {
            if (!this.ownedUrl) {
                return;
            }

            try {
                const res = await fetch(this.ownedUrl, {
                    headers: { Accept: 'application/json', 'X-Requested-With': 'XMLHttpRequest' },
                });

                if (!res.ok) {
                    return;
                }

                const payload = await res.json();
                this.ownedDomains = Array.isArray(payload.data) ? payload.data : [];
                this.domainSource = 'ladill';
            } catch {
                // Non-fatal.
            }
        },
    });

    window.addEventListener('message', (event) => {
        if (!allowedParentOrigin(event.origin)) {
            return;
        }

        const data = event.data;
        if (!data || data.type !== 'ladill:domains:purchase-complete') {
            return;
        }

        closeLadillModal(PURCHASE_MODAL);

        const domains = Array.isArray(data.domains) ? data.domains : (data.domain ? [data.domain] : []);
        document.querySelectorAll('[x-data*="ladillDomainSourceForm"]').forEach((el) => {
            const component = el._x_dataStack?.[0];
            if (!component?.refreshOwnedDomains) {
                return;
            }

            component.refreshOwnedDomains().then(() => {
                const newest = domains.map((d) => String(d).toLowerCase()).find(Boolean);
                if (newest) {
                    component.selectedOwnedDomain = newest;
                    component.domainSource = 'ladill';
                }
            });
        });
    });

    window.addEventListener('open-modal', (event) => {
        if (String(event.detail) === PURCHASE_MODAL) {
            loadPurchaseFrame();
        }
    });
}