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} +