feat: Add function to update all consent cookies

app/layouts/LayoutDefault.telefunc.ts

@@ -7,10 +7,19 @@ type ConsentCookies = keyof PageContext["cookies"]["consent"];
 
 export async function onUpdateConsentCookie(cookieName: ConsentCookies, cookieValue: boolean) {
   const context = getTelefuncContext();
-  console.log(`Updating cookie ${cookieName} to ${cookieValue}`);
-
   const { reply } = context;
+
   CookieParser.set(reply, cookieName, cookieValue.toString(), 365);
 
-  return { ok: true, message: "Updated consent cookie" };
+  return { ok: true, message: "Updated consent cookie", cookieName, cookieValue };
+}
+
+export async function onAcceptAllConsentCookie() {
+  const context = getTelefuncContext();
+  const { reply } = context;
+
+  CookieParser.set(reply, "analytics", "true", 365);
+  CookieParser.set(reply, "customization", "true", 365);
+
+  return { ok: true, message: "Updated consents cookies" };
 }

app/layouts/LayoutDefault.tsx

@@ -1,4 +1,4 @@
-import { onUpdateConsentCookie } from "./LayoutDefault.telefunc";
+import { onUpdateConsentCookie, onAcceptAllConsentCookie } from "./LayoutDefault.telefunc";
 import { MobileNavigation } from "@syntax/MobileNavigation";
 import { usePageContext } from "vike-react/usePageContext";
 import { ThemeProvider } from "@/providers/ThemeProvider";
@@ -133,7 +133,10 @@ function CookieModal() {
                     success: "Cookies mis à jour !",
                     error: "Erreur lors de la mise à jour des cookies.",
                   })
-                  .finally(reload);
+                  .then((data) => {
+                    setConsentCookies({ ...consentCookies, [data.cookieName]: data.cookieValue });
+                    reload();
+                  });
               }}
             />
           </div>
@@ -142,6 +145,8 @@ function CookieModal() {
     );
   }
 
+  if (!isOpen) return null;
+
   return (
     <div className="flex flex-col fixed bottom-4 left-4 bg-slate-50 dark:bg-slate-800 z-50 rounded-md shadow-xl w-full max-w-sm overflow-hidden">
       <Button variant="ghost" size="sm" className="absolute top-0 right-0" onClick={() => setIsOpen(false)}>
@@ -185,8 +190,20 @@ function CookieModal() {
 
         <button
           className="cursor-pointer px-2 py-1 font-bold text-white dark:text-black bg-violet-600 dark:bg-violet-300"
-          onClick={async () => {
+          onClick={() => {
-            // TODO
+            setConsentCookies({ analytics: true, customization: true });
+
+            toast
+              .promise(onAcceptAllConsentCookie(), {
+                pending: "Mise à jour des cookies...",
+                success: "Cookies mis à jour !",
+                error: "Erreur lors de la mise à jour des cookies.",
+              })
+              .then(() => {
+                setIsOpen(false);
+                setIsOpen(false);
+                reload();
+              });
           }}
         >
           Oui, j'ai faim !

app/server/vike-handler.ts

@@ -16,8 +16,8 @@ export const vikeHandler: Get<[], UniversalHandler> = () => async (request, cont
     headersOriginal: request.headers,
     cookies: {
       consent: {
-        analytics: cookies.get("analytics", Boolean) || false,
+        analytics: cookies.get<boolean>("analytics", (value) => value === "true") || false,
-        customization: cookies.get("customization", Boolean) || false,
+        customization: cookies.get<boolean>("customization", (value) => value === "true") || false,
       },
       settings: {
         theme: cookies.get("theme") || "light",

app/services/CookieParser.ts

@@ -17,8 +17,8 @@ export class CookieParser {
     this.parse();
   }
 
-  parse(): Record<string, string> {
+  parse() {
-    return this.rawCookies.split("; ").reduce(
+    this.cookies = this.rawCookies.split("; ").reduce(
       (acc, cookie) => {
         const [key, value] = cookie.split("=");
         acc[key] = decodeURIComponent(value);
@@ -28,11 +28,11 @@ export class CookieParser {
     );
   }
 
-  get(key: CookieKeys, formatter?: Function): string | undefined {
+  get(key: CookieKeys): string | undefined;
+  get<T = unknown>(key: CookieKeys, formatter: (value: string) => T): T | undefined;
+  get<T = unknown>(key: CookieKeys, formatter?: (value: string) => T): T | string | undefined {
     const value = this.cookies[key];
 
-    console.log({ key, value });
-
     if (formatter) return formatter(value);
     return value;
   }