From 72528d7a8d79e917c7b09a2d294d10c824d272c2 Mon Sep 17 00:00:00 2001
From: nikita <nikitakashyap00256@gmail.com>
Date: Sat, 13 Jun 2026 01:23:24 +0530
Subject: [PATCH] Add Cookie Consent Banner

---
 frontend/src/App.jsx                     |  1 +
 frontend/src/components/CookieBanner.jsx | 63 ++++++++++++++++++++++++
 2 files changed, 64 insertions(+)
 create mode 100644 frontend/src/components/CookieBanner.jsx

diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index 8c7dba9..3ad1467 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -4,6 +4,7 @@ import "./App.css";
 import ScrollToTop from "./components/ScrollToTop";
 
 import Layout from "./components/Layout/Layout";
+import CookieBanner from "./components/CookieBanner";
 import ErrorBoundary from "./ErrorBoundary";
 
 const UrlToQr = lazy(() => import("./pages/UrlToQr"));
diff --git a/frontend/src/components/CookieBanner.jsx b/frontend/src/components/CookieBanner.jsx
new file mode 100644
index 0000000..9acc4ed
--- /dev/null
+++ b/frontend/src/components/CookieBanner.jsx
@@ -0,0 +1,63 @@
+import React, { useEffect, useState } from "react";
+import { Link } from "react-router-dom";
+
+function CookieBanner() {
+  const [visible, setVisible] = useState(false);
+
+  useEffect(() => {
+    const consent = localStorage.getItem("cookieConsent");
+
+    if (!consent) {
+      setVisible(true);
+    }
+  }, []);
+
+  const acceptCookies = () => {
+    localStorage.setItem("cookieConsent", "accepted");
+    setVisible(false);
+  };
+
+  const rejectCookies = () => {
+    localStorage.setItem("cookieConsent", "rejected");
+    setVisible(false);
+  };
+
+  if (!visible) return null;
+
+  return (
+    <div className="fixed bottom-4 left-4 right-4 md:left-auto md:max-w-lg bg-white border border-gray-200 rounded-xl shadow-xl p-5 z-50">
+      <h3 className="text-lg font-semibold mb-2">
+        🍪 Cookie Preferences
+      </h3>
+
+      <p className="text-sm text-gray-600 mb-4">
+        We use cookies to improve your experience and remember your preferences.
+        Read our{" "}
+        <Link
+          to="/cookies"
+          className="text-blue-600 underline"
+        >
+          Cookie Policy
+        </Link>.
+      </p>
+
+      <div className="flex gap-3">
+        <button
+          onClick={acceptCookies}
+          className="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700"
+        >
+          Accept
+        </button>
+
+        <button
+          onClick={rejectCookies}
+          className="px-4 py-2 border border-gray-300 rounded-lg hover:bg-gray-100"
+        >
+          Reject
+        </button>
+      </div>
+    </div>
+  );
+}
+
+export default CookieBanner;
\ No newline at end of file