Cornish Hue - James William Dawes

Back to Portfolio

View Live

Cornish Hue

import React, { useState, useEffect } from 'react'; const CookieBanner = () => { const [showBanner, setShowBanner] = useState(false); const [showSettings, setShowSettings] = useState(false); const [cookiePreferences, setCookiePreferences] = useState({ necessary: true, analytics: false, marketing: false, functional: false }); useEffect(() => { // Check if user has already made a choice const consent = getCookieConsent(); if (!consent) { setShowBanner(true); } else { setCookiePreferences(consent); } }, []); const getCookieConsent = () => { try { const consent = document.cookie .split('; ') .find(row => row.startsWith('cookie_consent=')); return consent ? JSON.parse(decodeURIComponent(consent.split('=')[1])) : null; } catch { return null; } }; const setCookieConsent = (preferences) => { const consentData = { necessary: true, // Always required analytics: preferences.analytics, marketing: preferences.marketing, functional: preferences.functional, timestamp: new Date().toISOString() }; // Set cookie for 1 year const expires = new Date(); expires.setFullYear(expires.getFullYear() + 1); document.cookie = `cookie_consent=${encodeURIComponent(JSON.stringify(consentData))}; expires=${expires.toUTCString()}; path=/; SameSite=Strict`; // Trigger Google Analytics or other tracking based on consent if (preferences.analytics) { // Initialize Google Analytics if (typeof gtag !== 'undefined') { gtag('consent', 'update', { 'analytics_storage': 'granted' }); } } if (preferences.marketing) { // Initialize marketing cookies if (typeof gtag !== 'undefined') { gtag('consent', 'update', { 'ad_storage': 'granted' }); } } }; const handleAcceptAll = () => { const allAccepted = { necessary: true, analytics: true, marketing: true, functional: true }; setCookieConsent(allAccepted); setCookiePreferences(allAccepted); setShowBanner(false); }; const handleRejectAll = () => { const rejected = { necessary: true, // Can't reject necessary analytics: false, marketing: false, functional: false }; setCookieConsent(rejected); setCookiePreferences(rejected); setShowBanner(false); }; const handleSavePreferences = () => { setCookieConsent(cookiePreferences); setShowSettings(false); setShowBanner(false); }; const handleTogglePreference = (type) => { if (type === 'necessary') return; // Can't toggle necessary cookies setCookiePreferences(prev => ({ ...prev, [type]: !prev[type] })); }; if (!showBanner && !showSettings) return null; return ( <> {/* Cookie Banner */} {showBanner && (

We use cookies

We use cookies and similar technologies to improve your browsing experience, analyze website traffic, and provide personalized content. You can choose which cookies to accept below. For more information, please read our{' '} Privacy Notice .

)} {/* Cookie Settings Modal */} {showSettings && (

Cookie Settings

Choose which cookies you'd like to accept. You can change these settings at any time.

{/* Necessary Cookies */}

Necessary Cookies

Essential cookies that enable basic website functionality. These cannot be disabled.

{/* Analytics Cookies */}

Analytics Cookies

handleTogglePreference('analytics')} className="sr-only" />

handleTogglePreference('analytics')} >

Help us understand how visitors interact with our website through Google Analytics.

{/* Marketing Cookies */}

Marketing Cookies

handleTogglePreference('marketing')} className="sr-only" />

handleTogglePreference('marketing')} >

Used to show you relevant ads and measure advertising effectiveness.

{/* Functional Cookies */}

Functional Cookies

handleTogglePreference('functional')} className="sr-only" />

handleTogglePreference('functional')} >

Remember your preferences and provide enhanced, personalized features.