feat: implement RouteTracker for page view tracking and enhance local…

src/App.tsx

@@ -1,12 +1,23 @@
-import { BrowserRouter } from "react-router-dom";
+import { useEffect } from "react";
+import { BrowserRouter, useLocation } from "react-router-dom";
 import { MainLayout } from "./layout/main.layout";
 import { AppRoutes } from "./routes";
+import { trackPageView } from "./services/analytics/initAnalytics";
 import "./App.css";
 
+function RouteTracker() {
+  const { pathname } = useLocation();
+  useEffect(() => {
+    trackPageView(pathname);
+  }, [pathname]);
+  return null;
+}
+
 function App() {
   return (
     <MainLayout>
       <BrowserRouter>
+        <RouteTracker />
         <AppRoutes />
       </BrowserRouter>
     </MainLayout>

src/services/analytics/initAnalytics.ts

@@ -50,6 +50,15 @@ async function startAnalytics(): Promise<void> {
   }
 }
 
+export function trackPageView(path: string): void {
+  if (typeof window.gtag === "function") {
+    window.gtag("event", "page_view", {
+      page_path: path,
+      page_location: window.location.href,
+    });
+  }
+}
+
 export function initAnalytics(): void {
   if (!import.meta.env.PROD) {
     return;

src/test-setup.ts

@@ -1 +1,26 @@
 import "@testing-library/jest-dom";
+
+const localStorageMock = (() => {
+  let store: Record<string, string> = {};
+  return {
+    getItem: (key: string) => store[key] ?? null,
+    setItem: (key: string, value: string) => {
+      store[key] = value;
+    },
+    removeItem: (key: string) => {
+      delete store[key];
+    },
+    clear: () => {
+      store = {};
+    },
+    get length() {
+      return Object.keys(store).length;
+    },
+    key: (index: number) => Object.keys(store)[index] ?? null,
+  };
+})();
+
+Object.defineProperty(window, "localStorage", {
+  value: localStorageMock,
+  writable: true,
+});