feat: add cookie consent banner and privacy policy page; update dependencies and improve animations

2025-02-04 16:44:49 +01:00
parent e37aba3ece
commit 36e44ef1b8
24 changed files with 929 additions and 168 deletions
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -1,32 +1,45 @@
 // app/layout.tsx

-import type {Metadata} from "next";
+"use client";
+
+import {SpeedInsights} from "@vercel/speed-insights/next";
+import {Analytics} from "@vercel/analytics/next";
 import "./globals.css";

-import {Roboto} from 'next/font/google'
-import React from "react";
+import {Roboto} from 'next/font/google';
+import React, {useEffect, useState} from "react";
+import ClientCookieConsentBanner from "./components/ClientCookieConsentBanner";
+

 const roboto = Roboto({
    variable: '--font-roboto',
    weight: '400',
    subsets: ['latin'],
-})
-
-
-export const metadata: Metadata = {
-    title: "Dennis",
-    description: "A portfolio website showcasing my work and skills.",
-};
+});

 export default function RootLayout({
                                       children,
                                   }: {
    children: React.ReactNode;
 }) {
+    const [consent, setConsent] = useState<string | null>(null);
+
+    useEffect(() => {
+        const storedConsent = localStorage.getItem("CookieConsent");
+        setConsent(storedConsent);
+    }, []);
+
+    const handleConsentChange = (newConsent: string) => {
+        setConsent(newConsent);
+    };
+
    return (
        <html lang="en">
        <body className={roboto.variable}>
+        <ClientCookieConsentBanner onConsentChange={handleConsentChange}/>
        {children}
+        {consent === "accepted" && <SpeedInsights/>}
+        {consent === "accepted" && <Analytics/>}
        </body>
        </html>
    );