From bf87b9c21863ae9ff27270ab607a610a7e566132 Mon Sep 17 00:00:00 2001 From: Van Leemput Dayron Date: Fri, 6 Feb 2026 17:00:52 +0100 Subject: [PATCH] feat: Implement cookie consent management with a new banner and introduce a language-aware root redirection. --- frontend/index.html | 27 +-- frontend/src/App.tsx | 33 ++-- frontend/src/components/Contact.tsx | 8 +- .../components/CookieBanner/CookieBanner.tsx | 157 ++++++++++++++++++ .../CookieBanner/cookie-banner.scss | 157 ++++++++++++++++++ frontend/src/components/Education.tsx | 2 +- frontend/src/components/RootRedirect.tsx | 14 ++ frontend/src/components/TravelMate.tsx | 44 ++++- frontend/src/contexts/CookieContext.tsx | 101 +++++++++++ frontend/src/contexts/LanguageContext.tsx | 33 +++- .../src/styles/components/_education.scss | 6 + 11 files changed, 549 insertions(+), 33 deletions(-) create mode 100644 frontend/src/components/CookieBanner/CookieBanner.tsx create mode 100644 frontend/src/components/CookieBanner/cookie-banner.scss create mode 100644 frontend/src/components/RootRedirect.tsx create mode 100644 frontend/src/contexts/CookieContext.tsx diff --git a/frontend/index.html b/frontend/index.html index b0abe1d..a4ae7b8 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -1,13 +1,16 @@ - - - - - - xeewy.be - - -
- - - + + + + + + + xeewy.be + + + +
+ + + + \ No newline at end of file diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index a63649b..9550e25 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -1,5 +1,5 @@ import { useState, useEffect } from 'react'; -import { BrowserRouter, Routes, Route, Navigate, useParams } from 'react-router-dom'; +import { BrowserRouter, Routes, Route, useParams } from 'react-router-dom'; import { LanguageProvider } from './contexts/LanguageContext'; import Header from './components/Header'; import Home from './components/Home'; @@ -10,19 +10,24 @@ import EraseData from './components/TravelMate/EraseData'; import Support from './components/TravelMate/Support'; import HomeSync from './components/HomeSync'; import ScrollToTop from './components/ScrollToTop'; +import RootRedirect from './components/RootRedirect'; import './styles/main.scss'; +import { CookieProvider, useCookie } from './contexts/CookieContext'; +import CookieBanner from './components/CookieBanner/CookieBanner'; function App() { return ( - - } /> - - - - } /> - + + + } /> + + + + } /> + + ); } @@ -36,6 +41,8 @@ function AppContent() { // Optional: Check if useParamsLang.lang is valid, else redirect }, [useParamsLang]); + const { consent } = useCookie(); + useEffect(() => { const savedTheme = localStorage.getItem('darkMode'); if (savedTheme) { @@ -46,9 +53,12 @@ function AppContent() { }, []); useEffect(() => { - localStorage.setItem('darkMode', JSON.stringify(darkMode)); + // Only save if preferences are allowed + if (consent.preferences || consent.essential) { + localStorage.setItem('darkMode', JSON.stringify(darkMode)); + } document.documentElement.setAttribute('data-theme', darkMode ? 'dark' : 'light'); - }, [darkMode]); + }, [darkMode, consent]); const toggleDarkMode = () => { setDarkMode(!darkMode); @@ -71,6 +81,7 @@ function AppContent() {