From 26b2d41aa57db09cb98d5dd39b4036191c20a553 Mon Sep 17 00:00:00 2001
From: Ananda
Date: Wed, 18 Sep 2024 18:30:01 +0200
Subject: [PATCH] feat: ajout du consentement
---
ui/app/components/ConsentManagement.tsx | 21 +++++++++++++++++++++
ui/app/components/LogRocketInitializer.tsx | 8 ++++++--
ui/app/components/Plausible.tsx | 17 +++++++++++++++++
ui/app/components/RootLayout.tsx | 9 ++-------
ui/app/layout.tsx | 2 ++
5 files changed, 48 insertions(+), 9 deletions(-)
create mode 100644 ui/app/components/ConsentManagement.tsx
create mode 100644 ui/app/components/Plausible.tsx
diff --git a/ui/app/components/ConsentManagement.tsx b/ui/app/components/ConsentManagement.tsx
new file mode 100644
index 0000000..802dd8b
--- /dev/null
+++ b/ui/app/components/ConsentManagement.tsx
@@ -0,0 +1,21 @@
+"use client";
+
+import { createConsentManagement } from "@codegouvfr/react-dsfr/consentManagement";
+
+export const {
+ ConsentBannerAndConsentManagement,
+ FooterConsentManagementItem,
+ FooterPersonalDataPolicyItem,
+ useConsent,
+} = createConsentManagement({
+ finalityDescription: ({ lang }) => ({
+ analytics: {
+ title: "Analyse",
+ description: "Nous utilisons des cookies pour mesurer l’audience de notre site et améliorer son contenu.",
+ },
+ personalization: {
+ title: "Personnalisation",
+ description: "Nous utilisons des cookies pour vous proposer des contenus adaptés à vos centres d’intérêts.",
+ },
+ }),
+});
diff --git a/ui/app/components/LogRocketInitializer.tsx b/ui/app/components/LogRocketInitializer.tsx
index 0af87a7..5ce1932 100644
--- a/ui/app/components/LogRocketInitializer.tsx
+++ b/ui/app/components/LogRocketInitializer.tsx
@@ -1,10 +1,14 @@
"use client";
import { useEffect } from "react";
import LogRocket from "logrocket";
+import { useConsent } from "./ConsentManagement";
export function LogRocketInitializer() {
+ const { finalityConsent } = useConsent();
+
useEffect(() => {
- process.env.NEXT_PUBLIC_LOGROCKET &&
+ finalityConsent?.analytics &&
+ process.env.NEXT_PUBLIC_LOGROCKET &&
LogRocket.init(process.env.NEXT_PUBLIC_LOGROCKET, {
network: {
requestSanitizer: (request) => {
@@ -34,6 +38,6 @@ export function LogRocketInitializer() {
},
},
});
- });
+ }, [finalityConsent]);
return null;
}
diff --git a/ui/app/components/Plausible.tsx b/ui/app/components/Plausible.tsx
new file mode 100644
index 0000000..6f75f19
--- /dev/null
+++ b/ui/app/components/Plausible.tsx
@@ -0,0 +1,17 @@
+"use client";
+import PlausibleProvider from "next-plausible";
+import { useConsent } from "./ConsentManagement";
+
+export function Plausible() {
+ const { finalityConsent } = useConsent();
+
+ return (
+ finalityConsent?.analytics && (
+
+ )
+ );
+}
diff --git a/ui/app/components/RootLayout.tsx b/ui/app/components/RootLayout.tsx
index 99487dd..3d4db0e 100644
--- a/ui/app/components/RootLayout.tsx
+++ b/ui/app/components/RootLayout.tsx
@@ -3,12 +3,11 @@ import { getHtmlAttributes } from "@codegouvfr/react-dsfr/next-appdir/getHtmlAtt
import StartDsfr from "#/app/StartDsfr";
import { defaultColorScheme } from "#/app/defaultColorScheme";
import Link from "next/link";
-import PlausibleProvider from "next-plausible";
import { LogRocketInitializer } from "./LogRocketInitializer";
+import { Plausible } from "./Plausible";
export default function RootLayout({ title, children }: { title?: string; children: JSX.Element }) {
const lang = "fr";
-
return (
-
+
} title={title}>
<>
{children}
+