import { router, usePage } from '@inertiajs/react';
import { useEffect } from 'react';
import type { ReactNode } from 'react';
import { CookieConsent } from '@/components/frontend/cookie-consent';
import WhatsAppWidget from '@/components/frontend/WhatsAppWidget';
import { reapplyTheme } from '@/hooks/use-appearance';
import { trackPageView } from '@/lib/visitor-tracking';
import Footer from './components/footer';
import Navbar from './components/navbar';

export default function FrontendLayout({ children }: { children: ReactNode }) {
    const { props } = usePage();
    const locale = String(props.locale ?? 'id');
    // Terapkan ulang tema sesuai preferensi pengguna (light/dark/system) —
    // dark mode kini aktif di halaman publik; tetap konsisten saat navigasi
    // SPA antara /admin ↔ halaman publik.
    useEffect(() => {
        reapplyTheme();
    }, []);

    // Analitik pengunjung: catat kunjungan halaman saat navigasi SPA
    // (throttle 30 dtk di util) — hanya bila cookie telah diterima.
    useEffect(() => {
        trackPageView();

        return router.on('navigate', () => trackPageView());
    }, []);

    return (
        <div className="flex min-h-screen flex-col">
            <Navbar />
            <main className="flex-1">{children}</main>
            <Footer />
            <CookieConsent />
            <WhatsAppWidget locale={locale} />
        </div>
    );
}