add cookie consent and GA

ui/app/page.tsx

@@ -5,6 +5,7 @@ import { useEffect, useState } from "react";
 import Flag from "./flag";
 import { COPY, COPY_SUCCESS, FILTER_BY_COUNTRY, FILTER_BY_SPORT, MADE_BY_FABRICE, NOT_AFFILIATED } from "../lib/text";
 import useLocalStorage from "@/lib/local-storage";
+import { GoogleAnalytics } from "@next/third-parties/google";
 
 interface MultilingualString {
   [key: string]: string;
@@ -55,6 +56,7 @@ export default function Home() {
 
   const [data, setData] = useState<Calendar | null>(null);
   const [language, setLanguage] = useLocalStorage('lang', (navigator.language || 'en').split('-')[0]);
+  const [cookieConsent, setCookieConsent] = useLocalStorage('cookie-consent', 'null');
 
   const translate = (text: MultilingualString) => {
     return text[`${language}`] || text['en'] || Object.values(text)[0] || '';
@@ -370,6 +372,19 @@ export default function Home() {
             </div>
           </nav>
         </footer>
+
+        {cookieConsent === 'true' &&
+          <GoogleAnalytics gaId="G-SLBLJRE0CM" />
+        }
+
+        {cookieConsent === 'null' &&
+          <div className="sticky bottom-0 bg-gray-800 text-white text-center p-8">
+            <p className="p-4">This website uses cookies for statistics purposes and to enhance the user experience.</p>
+            <button className="btn btn-sm mx-2" onClick={() => setCookieConsent('true')}>Accept</button>
+            <button className="btn btn-sm btn-outline" onClick={() => setCookieConsent('false')}>Decline</button>
+          </div>
+        }
+
       </div>
     );
   }

ui/package-lock.json

@@ -8,6 +8,7 @@
       "name": "ui",
       "version": "0.1.0",
       "dependencies": {
+        "@next/third-parties": "^16.0.8",
         "next": "16.0.8",
         "react": "19.2.1",
         "react-dom": "19.2.1"
@@ -1180,6 +1181,19 @@
         "node": ">= 10"
       }
     },
+    "node_modules/@next/third-parties": {
+      "version": "16.0.8",
+      "resolved": "https://registry.npmjs.org/@next/third-parties/-/third-parties-16.0.8.tgz",
+      "integrity": "sha512-F8TNI1GFm7ivZX6HBMDVsDklAXOHlACbtw7w3WFbDk2oFXdVgKZBfdK+ILhjTBK4ibIXzLMWO1Py3bgSETKHYQ==",
+      "license": "MIT",
+      "dependencies": {
+        "third-party-capital": "1.0.20"
+      },
+      "peerDependencies": {
+        "next": "^13.0.0 || ^14.0.0 || ^15.0.0 || ^16.0.0-beta.0",
+        "react": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0"
+      }
+    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -5040,6 +5054,7 @@
       "resolved": "https://registry.npmjs.org/next/-/next-16.0.8.tgz",
       "integrity": "sha512-LmcZzG04JuzNXi48s5P+TnJBsTGPJunViNKV/iE4uM6kstjTQsQhvsAv+xF6MJxU2Pr26tl15eVbp0jQnsv6/g==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@next/env": "16.0.8",
         "@swc/helpers": "0.5.15",
@@ -6127,6 +6142,12 @@
         "url": "https://opencollective.com/webpack"
       }
     },
+    "node_modules/third-party-capital": {
+      "version": "1.0.20",
+      "resolved": "https://registry.npmjs.org/third-party-capital/-/third-party-capital-1.0.20.tgz",
+      "integrity": "sha512-oB7yIimd8SuGptespDAZnNkzIz+NWaJCu2RMsbs4Wmp9zSDUM8Nhi3s2OOcqYuv3mN4hitXc8DVx+LyUmbUDiA==",
+      "license": "ISC"
+    },
     "node_modules/tinyglobby": {
       "version": "0.2.15",
       "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.15.tgz",

ui/package.json

@@ -9,6 +9,7 @@
     "lint": "eslint"
   },
   "dependencies": {
+    "@next/third-parties": "^16.0.8",
     "next": "16.0.8",
     "react": "19.2.1",
     "react-dom": "19.2.1"