frontend/src/hooks/usePageTracking.js

import { useEffect } from "react";
import { useLocation } from "react-router-dom";
import debounce from "lodash.debounce";

const debouncedEvent = debounce((eventName, args) => {
  if (window.gtag) {
    console.log('Sending event', eventName, args);
    window.gtag("event", eventName, args);
  }
}, 500)


export function usePageTracking() {
  const location = useLocation();

  useEffect(() => {
    // Send pageview to Google Analytics
    if (window.gtag) {
      const args = {
        page_path: location.pathname + location.search + location.hash,
        page_location: window.location.href,
        page_title: document.title
      }
      debouncedEvent("page_view", args);
    }
  }, [location]);
}