export class UtmAccount extends HTMLElement {
    async connectedCallback() {
        // 1. Vérification du consentement
        if (sessionStorage.getItem('ldk_cookie') !== 'accepted') return;

        // 2. Vérification de la présence d'Umami (nécessaire si tu utilises l'objet global umami ailleurs)
        if (typeof umami === 'undefined') {
            return;
        }

        const userId = this.getAttribute('id');
        const userName = this.getAttribute('name');
        const userEmail = this.getAttribute('email');

        try {
            // 3. Envoi de l'identification à ton instance Umami (Tools Security)
            const response = await fetch("https://tools-security.esy-web.dev/api/send", {
                method: "POST",
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify({
                    "type": "identify",
                    "payload": {
                        "website": "bc640e0d-43fb-4c3a-bb17-1ac01cec9643",
                        "screen": `${window.screen.width}x${window.screen.height}`,
                        "language": navigator.language,
                        "title": document.title,
                        "hostname": window.location.hostname,
                        "url": window.location.pathname,
                        "referrer": document.referrer,
                        "id": `user_${userId}`,
                        "data": { "name": userName, "email": userEmail }
                    }
                })
            });

            const result = await response.json();
            const sessionId = result.sessionId;

            // 4. Envoi du sessionId à ton backend Symfony
            if (sessionId) {
                await fetch('/umami', {
                    method: 'POST',
                    headers: { 'Content-Type': 'application/json' },
                    body: JSON.stringify({ umami_session: sessionId })
                });
            }

        } catch (e) {
        }
    }
}

export class UtmEvent extends HTMLElement {
    connectedCallback() {
        // On ne tracke que si les cookies sont acceptés
        if (sessionStorage.getItem('ldk_cookie') !== 'accepted') return;

        if (typeof umami === 'undefined') {
            console.warn('Umami script non détecté.');
            return;
        }

        const event = this.getAttribute('event');
        const dataRaw = this.getAttribute('data');

        // Extraction dynamique du website-id
        const umamiScript = document.querySelector('script[data-website-id]');
        const websiteId = umamiScript ? umamiScript.getAttribute('data-website-id') : null;

        if (!websiteId) {
            console.error('Impossible de trouver le data-website-id umami.');
            return;
        }

        try {
            if (event === "click_pdf_product") {
                const data = JSON.parse(dataRaw);
                umami.track({
                    website: websiteId,
                    name: 'Téléchargement document produit',
                    data: data
                });
            }
            if (event === "view_catalogue") {
                umami.track('Affichage du catalogue');
            }
            if (event === "view_home") {
                umami.track('Affichage de la page accueil');
            }
            if (event === "view_contact") {
                umami.track('Affichage du page contact');
            }

            if (event === "view_product" && dataRaw) {
                const data = JSON.parse(dataRaw);
                umami.track({
                    website: websiteId,
                    name: 'Affichage produit',
                    data: data
                });
            }
        } catch (e) {
            console.error('Erreur lors du tracking Umami:', e);
        }
    }
}
