added ga code

front/src/app/layout.tsx

@@ -1,7 +1,11 @@
 import React from "react";
 import "./globals.css";
 import { FooterComponent, HeaderComponent } from "../layouts";
-import { CookiesConsentProvider, CookiesBanner } from "../common/cookies";
+import {
+  CookiesConsentProvider,
+  CookiesBanner,
+  GoogleAnalytics,
+} from "../common/cookies";
 
 interface Props {
   children: React.ReactNode;
@@ -20,6 +24,7 @@ const RootLayout = (props: Props) => {
           <main className="flex grow flex-col">{children}</main>
           <FooterComponent />
           <CookiesBanner />
+          <GoogleAnalytics />
         </CookiesConsentProvider>
       </body>
     </html>

front/src/common/cookies/google-analytics.component.tsx

@@ -0,0 +1,31 @@
+"use client";
+
+import Script from "next/script";
+import { useCookiesConsent } from "./cookies-consent.context";
+
+const GA_ID = "G-0SF5QPC7FQ";
+
+export const GoogleAnalytics: React.FC = () => {
+  const { consent } = useCookiesConsent();
+
+  if (consent !== "accepted") {
+    return null;
+  }
+
+  return (
+    <>
+      <Script
+        src={`https://www.googletagmanager.com/gtag/js?id=${GA_ID}`}
+        strategy="afterInteractive"
+      />
+      <Script id="google-analytics" strategy="afterInteractive">
+        {`
+          window.dataLayer = window.dataLayer || [];
+          function gtag(){dataLayer.push(arguments);}
+          gtag('js', new Date());
+          gtag('config', '${GA_ID}');
+        `}
+      </Script>
+    </>
+  );
+};

front/src/common/cookies/index.ts

@@ -1,3 +1,4 @@
 export { CookiesConsentProvider, useCookiesConsent } from "./cookies-consent.context";
 export { CookiesBanner } from "./cookies-banner.component";
 export { CookiesResetButton } from "./cookies-reset-button.component";
+export { GoogleAnalytics } from "./google-analytics.component";