import { useLocation } from 'react-router-dom';
import { useLayoutEffect } from 'react';

const ScrollToTop = () => {
    const { pathname } = useLocation();

    useLayoutEffect(() => {
        window.scrollTo({ top: 0, left: 0, behavior: 'instant' });
        
        // Backup GA4 tracking mechanism
        try {
            if (typeof window !== 'undefined' && typeof window.gtag === 'function') {
                console.log(`[Backup] Sending page_view event to GA4: ${pathname}`);
                window.gtag('event', 'page_view', {
                    page_path: pathname,
                    page_title: document.title
                });
                console.log('[Backup] GA4 page_view event sent successfully');
            }
        } catch (error) {
            console.error('[Backup] Error sending page_view event to GA4:', error);
        }
    }, [pathname]);

    return null;
}

export default ScrollToTop;