feat: useGA hooks 분리 #430

frontend/src/lib/googleAnalytics/hooks/useGAInitialize.ts

@@ -0,0 +1,10 @@
+import { useEffect } from 'react';
+import ReactGA from 'react-ga4';
+
+const useGAInitialize = () => {
+  useEffect(() => {
+    ReactGA.initialize(process.env.GA_MANAGEMENT_ID || '');
+  }, []);
+};
+
+export default useGAInitialize;

frontend/src/lib/googleAnalytics/hooks/useGAPageTimeSpent.ts

@@ -0,0 +1,10 @@
+import { useEffect } from 'react';
+import ReactGA from 'react-ga4';
+
+const useGAPageTimeSpent = (page: string, timeSpent: number) => {
+  useEffect(() => {
+    ReactGA.send({ hitType: 'pageview', page, timeSpent });
+  });
+};
+
+export default useGAPageTimeSpent;

frontend/src/router/MainLayout.tsx

@@ -4,13 +4,11 @@ import { Outlet } from 'react-router-dom';
 
 import AsyncErrorBoundary from '@/components/common/ErrorBoundary/AsyncErrorBoundary';
 import RootErrorBoundary from '@/components/common/ErrorBoundary/RootErrorBoundary';
+import useGAInitialize from '@/lib/googleAnalytics/hooks/useGAInitialize';
 import ModalProvider from '@/providers/ModalProvider/ModalProvider';
 
 const MainLayout = () => {
-  useEffect(() => {
-    ReactGA.initialize('G-3BFVVPQT0Z');
-    ReactGA.send({ hitType: 'pageview', page: '/my-path', title: 'Custom Title' });
-  });
+  useGAInitialize();
 
   return (
     <RootErrorBoundary>