Google Analytics not sending different pages aside from home page in ReactJS(Vite)

Question

I'm using react-ga4 for my [portfolio[(https://vicentereyes.org). I have a PageViewTracker.jsx which has:

import { useEffect } from 'react';
import { useLocation } from 'react-router-dom';
import { trackPageView } from '../utils/analytics';

const PageViewTracker = ({ children }) => {
  const location = useLocation();

  useEffect(() => {
    trackPageView(location);
  }, [location]);

  return children;
};

export default PageViewTracker;

The PageViewTracker component is in the app.jsx

  return (
    <>
      <Router>
        <PageViewTracker>
        ...
      </Router>
    </>
)

The utils/analytics.js is here:

import ReactGA from 'react-ga4';

// Initialize Google Analytics with your measurement ID
const GA_MEASUREMENT_ID = 'G-ID_IS_HERE';

// Initialize Google Analytics
const initGA = () => {
  ReactGA.initialize(GA_MEASUREMENT_ID);
  // Send initial pageview
  ReactGA.send({ hitType: "pageview", page: window.location.pathname + window.location.search });
};

// Track page views
const trackPageView = (location) => {
  ReactGA.send({ hitType: "pageview", page: location.pathname + location.search });
};

export { initGA, trackPageView };

When I look at the site and go to the now page and look at Google Analytics dashboard, I don't see anything logged. How do I fix this?