From 319837701381604b5ca946fb24cbdf968ae2a428 Mon Sep 17 00:00:00 2001 From: Alexandre Philibeaux Date: Mon, 30 Dec 2024 11:51:11 +0100 Subject: [PATCH 1/2] fix(cookies): usage of cookie package --- .../CookieConsentProvider.tsx | 41 ++++++++----------- .../SegmentConsentMiddleware.tsx | 9 ++-- .../src/CookieConsentProvider/helpers.ts | 2 + 3 files changed, 24 insertions(+), 28 deletions(-) diff --git a/packages/cookie-consent/src/CookieConsentProvider/CookieConsentProvider.tsx b/packages/cookie-consent/src/CookieConsentProvider/CookieConsentProvider.tsx index f0ffce732..6439cdcd5 100644 --- a/packages/cookie-consent/src/CookieConsentProvider/CookieConsentProvider.tsx +++ b/packages/cookie-consent/src/CookieConsentProvider/CookieConsentProvider.tsx @@ -1,4 +1,4 @@ -import cookie from 'cookie' +import { parse, serialize } from 'cookie' import type { SerializeOptions } from 'cookie' import { createContext, @@ -11,13 +11,12 @@ import { import type { PropsWithChildren } from 'react' import { uniq } from '../helpers/array' import { stringToHash } from '../helpers/misc' -import { isCategoryKind } from './helpers' +import { IS_CLIENT, isCategoryKind } from './helpers' import type { Config, Consent, Integrations } from './types' import { useSegmentIntegrations } from './useSegmentIntegrations' const COOKIE_PREFIX = '_scw_rgpd' const HASH_COOKIE = `${COOKIE_PREFIX}_hash` -const IS_CLIENT = typeof document !== 'undefined' // Appx 13 Months const CONSENT_MAX_AGE = 13 * 30 * 24 * 60 * 60 @@ -73,7 +72,7 @@ export const CookieConsentProvider = ({ }>) => { const [needConsent, setNeedsConsent] = useState(false) const [cookies, setCookies] = useState>( - IS_CLIENT ? cookie.parse(document.cookie) : {}, + IS_CLIENT ? parse(document.cookie) : {}, ) const { @@ -160,22 +159,18 @@ export const CookieConsentProvider = ({ if (!consentValue) { // If consent is set to false we have to delete the cookie - document.cookie = cookie.serialize(cookieName, '', { + document.cookie = serialize(cookieName, '', { ...cookiesOptions, expires: new Date(0), }) } else { - document.cookie = cookie.serialize( - cookieName, - consentValue.toString(), - { - ...cookiesOptions, - maxAge: - consentCategoryName === 'advertising' - ? consentAdvertisingMaxAge - : consentMaxAge, - }, - ) + document.cookie = serialize(cookieName, consentValue.toString(), { + ...cookiesOptions, + maxAge: + consentCategoryName === 'advertising' + ? consentAdvertisingMaxAge + : consentMaxAge, + }) } setCookies(prevCookies => ({ ...prevCookies, @@ -183,15 +178,11 @@ export const CookieConsentProvider = ({ })) } // We set the hash cookie to the current consented integrations - document.cookie = cookie.serialize( - HASH_COOKIE, - integrationsHash.toString(), - { - ...cookiesOptions, - // Here we use the shortest max age to force to ask again for expired consent - maxAge: consentAdvertisingMaxAge, - }, - ) + document.cookie = serialize(HASH_COOKIE, integrationsHash.toString(), { + ...cookiesOptions, + // Here we use the shortest max age to force to ask again for expired consent + maxAge: consentAdvertisingMaxAge, + }) setCookies(prevCookies => ({ ...prevCookies, [HASH_COOKIE]: integrationsHash.toString(), diff --git a/packages/cookie-consent/src/CookieConsentProvider/SegmentConsentMiddleware.tsx b/packages/cookie-consent/src/CookieConsentProvider/SegmentConsentMiddleware.tsx index 383406b18..a0cd2c15d 100644 --- a/packages/cookie-consent/src/CookieConsentProvider/SegmentConsentMiddleware.tsx +++ b/packages/cookie-consent/src/CookieConsentProvider/SegmentConsentMiddleware.tsx @@ -1,8 +1,9 @@ import { useSegment } from '@scaleway/use-segment' -import cookie from 'cookie' +import { parse } from 'cookie' import type { PropsWithChildren } from 'react' import { useCookieConsent } from './CookieConsentProvider' -import { type CategoryKind } from './helpers' +import { IS_CLIENT } from './helpers' +import type { CategoryKind } from './helpers' export const AMPLITUDE_INTEGRATION_NAME = 'Amplitude (Actions)' const COOKIE_SESSION_ID_NAME = 'analytics_session_id' @@ -14,7 +15,9 @@ type ConsentObject = { } export const getSessionId = () => { - const sessionId = cookie.parse(document.cookie)[COOKIE_SESSION_ID_NAME] + const sessionId = IS_CLIENT + ? parse(document.cookie)[COOKIE_SESSION_ID_NAME] + : '' if (sessionId) { return Number.parseInt(sessionId, 10) } diff --git a/packages/cookie-consent/src/CookieConsentProvider/helpers.ts b/packages/cookie-consent/src/CookieConsentProvider/helpers.ts index d5e7f32b8..36233357b 100644 --- a/packages/cookie-consent/src/CookieConsentProvider/helpers.ts +++ b/packages/cookie-consent/src/CookieConsentProvider/helpers.ts @@ -8,5 +8,7 @@ export const categories = [ export type CategoryKind = (typeof categories)[number] +export const IS_CLIENT = typeof document !== 'undefined' + export const isCategoryKind = (key: string): key is CategoryKind => categories.includes(key as CategoryKind) From 97559bb581a90425eb25aafb8c9f3572da94f686 Mon Sep 17 00:00:00 2001 From: Alexandre Philibeaux Date: Mon, 30 Dec 2024 11:53:26 +0100 Subject: [PATCH 2/2] fix(cookies): usage of cookie package --- .changeset/slow-cooks-bow.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/slow-cooks-bow.md diff --git a/.changeset/slow-cooks-bow.md b/.changeset/slow-cooks-bow.md new file mode 100644 index 000000000..b776a0dab --- /dev/null +++ b/.changeset/slow-cooks-bow.md @@ -0,0 +1,5 @@ +--- +"@scaleway/cookie-consent": patch +--- + +fix usage of cookies