import '@synapxlab/cookie-consent';

// C'est tout ! La bannière s'affiche automatiquement

// Importer directement le bundle complet
import '@synapxlab/cookie-consent/dist/bundle.js';

// La bannière s'affiche automatiquement si aucun consentement n'existe
// API disponible globalement sur window.CookieConsent

// webpack.config.js
const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'main.js'
  },
  // Votre config...
};

// src/index.js
import '@synapxlab/cookie-consent/dist/bundle.js';

// Ou si vous voulez seulement le module cookie sans les styles
// import '@synapxlab/cookie-consent/dist/cookie.js';

// API complète disponible sur window.CookieConsent
const api = window.CookieConsent;

// 📱 Afficher la bannière avec préférences
api.show();

// 🙈 Masquer la bannière
api.hide();

// 🔄 Réinitialiser complètement (supprime localStorage et recharge la page)
api.reset();

// 📊 Récupérer les préférences actuelles
const prefs = api.getPreferences();
console.log(prefs);
// Retourne: { cookies: true, statistics: false, marketing: true } ou null

// ✅ Vérifier une catégorie spécifique
const hasAnalytics = api.hasConsent('statistics');
const hasMarketing = api.hasConsent('marketing');
const hasFunctional = api.hasConsent('cookies');

// 👂 Écouter les changements de consentement
api.on('change', (event) => {
    console.log('Nouvelles préférences:', event.detail.preferences);
});

document.addEventListener('cookieConsentChanged', (event) => {
    const preferences = event.detail.preferences;
    
    if (preferences.statistics) {
        // ✅ Utilisateur a accepté les cookies statistiques
        loadGoogleAnalytics();
    }
    
    if (preferences.marketing) {
        // ✅ Utilisateur a accepté les cookies marketing
        loadFacebookPixel();
        loadGoogleAds();
    }
});

function loadGoogleAnalytics() {
    const script = document.createElement('script');
    script.src = 'https://www.googletagmanager.com/gtag/js?id=G-VOTRE-ID';
    script.async = true;
    document.head.appendChild(script);
    
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());
    gtag('config', 'G-VOTRE-ID', {
        anonymize_ip: true, // Conformité RGPD
        cookie_flags: 'SameSite=None;Secure'
    });
}

function loadFacebookPixel() {
    !function(f,b,e,v,n,t,s) {
        if(f.fbq)return;n=f.fbq=function(){n.callMethod?
        n.callMethod.apply(n,arguments):n.queue.push(arguments)};
        if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
        n.queue=[];t=b.createElement(e);t.async=!0;
        t.src=v;s=b.getElementsByTagName(e)[0];
        s.parentNode.insertBefore(t,s)
    }(window,document,'script','https://connect.facebook.net/en_US/fbevents.js');
    
    fbq('init', 'VOTRE-PIXEL-ID');
    fbq('track', 'PageView');
}

document.addEventListener('DOMContentLoaded', () => {
    // Vérifier si l'utilisateur a déjà donné son consentement
    const prefs = window.CookieConsent?.getPreferences();
    
    if (prefs?.statistics) {
        loadGoogleAnalytics();
    }
    
    if (prefs?.marketing) {
        loadFacebookPixel();
    }
});

// pages/_app.js
import { useEffect } from 'react';

// Charger le bundle complet
import '@synapxlab/cookie-consent/dist/bundle.js';

function MyApp({ Component, pageProps }) {
    useEffect(() => {
        // Gestion des cookies côté client uniquement
        if (typeof window !== 'undefined') {
            const handleConsent = (event) => {
                const prefs = event.detail.preferences;
                
                // Router les events vers votre analytics
                if (prefs.statistics) {
                    // gtag ou autre
                }
            };
            
            document.addEventListener('cookieConsentChanged', handleConsent);
            
            return () => {
                document.removeEventListener('cookieConsentChanged', handleConsent);
            };
        }
    }, []);
    
    return <Component {...pageProps} />;
}

export default MyApp;

// Appliquer un thème au body de la page
document.body.classList.add('cookie-theme-dark');    // Sombre
document.body.classList.add('cookie-theme-blue');    // Bleu
document.body.classList.add('cookie-theme-brown');   // Marron
document.body.classList.add('cookie-theme-default'); // Défaut (clair)

// Activer le logging automatique des consentements
window.CookieConsent.enableLogging({
    endpoint: '/api/consent/log',           // Votre endpoint de logging
    includeUserAgent: true,                 // Inclure le User-Agent
    anonymousId: true,                      // Générer un ID anonyme
    headers: {
        'Content-Type': 'application/json',
        'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]')?.content
    }
});


//{
//    "consent_id": "094e6f3b-5a71-4b62-890e-c78032ab79ea",
//    "timestamp": "2025-09-19T12:45:49.150Z",
//    "device_id": "cc_6041de70-0fab-425c-bb38-a48d45da7545",
//    "site_host": "192.168.23.250:3000",
//    "site_path": "/",
//    "preferences": {
//        "cookies": true,
//        "statistics": true,
//        "marketing": true
//    },
//    "action": "updated",
//    "locale": "fr-FR",
//    "referrer": null,
//    "banner_version": "2.2.0",
//    "policy_hash": "581f06e8",
//    "user_agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/140.0.0.0 Safari/537.36"
//}