update based on comments

coinbase · Dec 15, 2023 · f507a19 · f507a19
1 parent 9978254
commit f507a19
Show file tree

Hide file tree

Showing 12 changed files with 71 additions and 20 deletions.
diff --git a/apps/example/package.json b/apps/example/package.json
@@ -11,7 +11,7 @@
     "test": "jest --passWithNoTests"
   },
   "dependencies": {
-    "@coinbase/cookie-banner": "1.0.1",
+    "@coinbase/cookie-banner": "1.0.2",
     "@coinbase/cookie-manager": "1.1.0",
     "next": "14.0.0",
     "react": "^18",

diff --git a/apps/example/utils/cookieManagerConfig.ts b/apps/example/utils/cookieManagerConfig.ts
@@ -4,12 +4,13 @@ export const cookieManagerConfig = {
   categories: [
     {
       id: TrackingCategory.NECESSARY,
+      expiry: 365,
       required: true,
       trackers: [
         {
           id: 'ip_country',
           type: TrackerType.COOKIE,
-          expiry: new Date('2024-09-29T00:00:00.000Z'),
+          expiry: 10,
         },
         {
           id: 'locale',
@@ -19,6 +20,7 @@ export const cookieManagerConfig = {
     },
     {
       id: TrackingCategory.PERFORMANCE,
+      expiry: 365,
       trackers: [
         {
           id: 'rfm',
@@ -29,6 +31,7 @@ export const cookieManagerConfig = {
     },
     {
       id: TrackingCategory.FUNCTIONAL,
+      expiry: 365,
       trackers: [
         {
           id: 'mode',
@@ -38,6 +41,7 @@ export const cookieManagerConfig = {
     },
     {
       id: TrackingCategory.TARGETING,
+      expiry: 365,
       trackers: [
         {
           id: 'gclid',
@@ -47,6 +51,7 @@ export const cookieManagerConfig = {
     },
     {
       id: TrackingCategory.DELETE_IF_SEEN,
+      expiry: 0,
       trackers: [
         {
           id: 'challenge-regex',

diff --git a/packages/cookie-banner/CHANGELOG.md b/packages/cookie-banner/CHANGELOG.md
@@ -1,5 +1,11 @@
 # Changelog
 
+## 1.0.2 (12/11/2023 PST)
+
+#### Chore
+
+- Update the cookie manager version and fix Close Icon styling
+
 ## 1.0.1 (12/11/2023 PST)
 
 #### 🐞 Fixes

diff --git a/packages/cookie-banner/package.json b/packages/cookie-banner/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@coinbase/cookie-banner",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "main": "dist/index.js",
   "license": "Apache-2.0",
   "scripts": {
@@ -26,7 +26,7 @@
     "react-dom": "^18.1.0"
   },
   "dependencies": {
-    "@coinbase/cookie-manager": "^1.0.0",
+    "@coinbase/cookie-manager": "1.1.0",
     "react-intl": "^6.5.1",
     "styled-components": "^5.3.6"
   }

diff --git a/packages/cookie-banner/src/components/CookieBannerContent.tsx b/packages/cookie-banner/src/components/CookieBannerContent.tsx
@@ -126,8 +126,9 @@ const MobileDismissButton = styled(DismissButton)`
 `;
 
 const DesktopDismissButton = styled(DismissButton)`
+  display: flex;
   @media (max-width: ${({ theme }) => theme.breakpoints.tablet}px) {
-    display: flex;
+    display: none;
   }
 `;
 

diff --git a/packages/cookie-banner/src/examples/config.ts b/packages/cookie-banner/src/examples/config.ts
@@ -4,6 +4,7 @@ export default {
   categories: [
     {
       id: TrackingCategory.NECESSARY,
+      expiry: 365,
       required: true,
       trackers: [
         {
@@ -14,6 +15,7 @@ export default {
     },
     {
       id: TrackingCategory.PERFORMANCE,
+      expiry: 365,
       trackers: [
         {
           id: 'some_cookie',
@@ -31,6 +33,7 @@ export default {
     },
     {
       id: TrackingCategory.FUNCTIONAL,
+      expiry: 365,
       trackers: [
         {
           id: 'mode',
@@ -40,6 +43,7 @@ export default {
     },
     {
       id: TrackingCategory.TARGETING,
+      expiry: 365,
       trackers: [
         // First party
         {
@@ -55,6 +59,7 @@ export default {
     },
     {
       id: TrackingCategory.DELETE_IF_SEEN,
+      expiry: 0,
       trackers: [
         {
           id: 'cgl_prog',

diff --git a/packages/cookie-manager/README.md b/packages/cookie-manager/README.md
@@ -69,6 +69,7 @@ export default {
     {
       id: TrackingCategory.NECESSARY,
       required: true,
+      expiry: 365,
       trackers: [
         {
           id: 'locale',
@@ -79,6 +80,7 @@ export default {
     },
     {
       id: TrackingCategory.PERFORMANCE,
+      expiry: 365,
       trackers: [
         {
           id: 'some_cookie',
@@ -89,6 +91,7 @@ export default {
     },
     {
       id: TrackingCategory.FUNCTIONAL,
+      expiry: 365,
       trackers: [
         {
           id: 'mode',
@@ -98,6 +101,7 @@ export default {
     },
     {
       id: TrackingCategory.TARGETING,
+      expiry: 365,
       trackers: [
         {
           id: 'id-regex',
@@ -108,6 +112,7 @@ export default {
     },
     {
       id: TrackingCategory.DELETE_IF_SEEN,
+      expiry: 0,
       trackers: [
         {
           id: 'cgl_prog',
@@ -129,7 +134,7 @@ export default {
 };
 ```
 
-In this config, under each category you can specify what all cookies should be allowed. Everything else, if detected will be deleted at an interval of 500 ms.
+In this config, under each category you can specify what all cookies that should be allowed. Everything else, if detected will be deleted at an interval of 500 ms.
 
 `DELETE_IF_SEEN` can be used to specify the cookies which should be deleted if seen on the browser
 
@@ -147,13 +152,31 @@ Any id with `-regex` at the end should contain a `regex` which will be used to m
 
 In this example: `id_ac7a5c3da45e3612b44543a702e42b01` will also be allowed.
 
-Each cookie by default has an expiry of 1 year but you can also override this by specifying an expiry for the cookie within the config:
+You need to specify the retention days for a category using the expiry key as follows:
+
+```
+{
+      id: TrackingCategory.NECESSARY,
+      required: true,
+      expiry: 365,
+      trackers: [
+        {
+          id: 'locale',
+          type: TrackerType.COOKIE,
+          expiry: new Date('2024-09-29T00:00:00.000Z'),
+        },
+      ],
+    }
+
+```
+
+Each cookie by default will inherit its category's retention duration but you can override this by specifying an expiry (in days) for the cookie:
 
 ```
  {
     id: 'locale',
     type: TrackerType.COOKIE,
-    expiry: new Date('2024-09-29T00:00:00.000Z')
+    expiry: 10
 }
 ```
 
@@ -167,6 +190,8 @@ If you want a cookie to only be valid for a session, it can optionally be marked
 }
 ```
 
+**Note: Session cookies only last as long as your browser is open and are automatically deleted when a user closes the browser**
+
 ## Methods
 
 ### Provider

diff --git a/packages/cookie-manager/src/constants.ts b/packages/cookie-manager/src/constants.ts
@@ -4,6 +4,7 @@ export const EU_CONSENT_PREFERENCES_COOKIE = 'cm_eu_preferences';
 export const DEFAULT_CONSENT_PREFERENCES_COOKIE = 'cm_default_preferences';
 export const ADVERTISING_SHARING_ALLOWED = 'advertising_sharing_allowed';
 export const IS_MOBILE_APP = 'is_mobile_app';
+export const ONE_DAY_IN_MILLISECONDS = 24 * 60 * 60 * 1000;
 
 export const GEOLOCATION_RULES: Array<GeolocationRule> = [
   {

diff --git a/packages/cookie-manager/src/examples/config.ts b/packages/cookie-manager/src/examples/config.ts
@@ -4,6 +4,7 @@ export default {
   categories: [
     {
       id: TrackingCategory.NECESSARY,
+      expiry: 365,
       required: true,
       trackers: [
         {
@@ -13,12 +14,13 @@ export default {
         {
           id: 'test',
           type: TrackerType.COOKIE,
-          expiry: new Date('2038-01-01T00:00:00.000Z'),
+          expiry: 10,
         },
       ],
     },
     {
       id: TrackingCategory.PERFORMANCE,
+      expiry: 365,
       trackers: [
         {
           id: 'some_cookie',
@@ -36,6 +38,7 @@ export default {
     },
     {
       id: TrackingCategory.FUNCTIONAL,
+      expiry: 365,
       trackers: [
         {
           id: 'mode',
@@ -47,6 +50,7 @@ export default {
     },
     {
       id: TrackingCategory.TARGETING,
+      expiry: 365,
       trackers: [
         {
           id: 'gclid',
@@ -61,6 +65,7 @@ export default {
     },
     {
       id: TrackingCategory.DELETE_IF_SEEN,
+      expiry: 0,
       trackers: [
         {
           id: 'cgl_prog',

diff --git a/packages/cookie-manager/src/types.ts b/packages/cookie-manager/src/types.ts
@@ -43,13 +43,14 @@ export type Tracker = {
   type: TrackerType;
   sessionCookie?: boolean;
   regex?: string;
-  expiry?: Date;
+  expiry?: number;
 };
 
 export type ConfigCategoryInfo = {
   id: TrackingCategory;
   trackers: Array<Tracker>;
   required?: boolean;
+  expiry: number;
 };
 
 export type Config = {

diff --git a/packages/cookie-manager/src/utils/setExpiryForCookie.test.ts b/packages/cookie-manager/src/utils/setExpiryForCookie.test.ts
@@ -6,7 +6,9 @@ describe('setExpiryForCookie', () => {
     expect(setExpiryForCookie('cookieName', config)).toEqual(undefined);
   });
   it('returns expiry when cookie config has an expiry', () => {
-    expect(setExpiryForCookie('test', config)).toEqual(new Date('2038-01-01T00:00:00.000Z'));
+    const expiration = new Date();
+    expiration.setDate(expiration.getDate() + 10);
+    expect(setExpiryForCookie('test', config)).toEqual(expiration);
   });
   it('returns expiry when cookie is in a category with an expiry', () => {
     const expiration = new Date();

diff --git a/packages/cookie-manager/src/utils/setExpiryForCookie.ts b/packages/cookie-manager/src/utils/setExpiryForCookie.ts
@@ -1,4 +1,4 @@
-import { CATEGORY_EXPIRATION_DAYS } from '../constants';
+import { ONE_DAY_IN_MILLISECONDS } from '../constants';
 import { Config } from '../types';
 import getTrackerCategory from './getTrackerCategory';
 import trackerMatches from './trackerMatches';
@@ -18,22 +18,22 @@ const setExpiryForCookie = (cookieName: string, config: Config) => {
     return undefined;
   }
 
+  const expiration = new Date();
+
   // if its a session cookie, do not set an expiry
   if (cookieConfig && cookieConfig.sessionCookie) {
     return undefined;
   }
 
   if (cookieConfig && cookieConfig.expiry) {
-    return cookieConfig.expiry;
+    return new Date(expiration.getTime() + cookieConfig.expiry * ONE_DAY_IN_MILLISECONDS);
   }
-  // if cookie is in a category with an expiry, set the expiry to that
-  const trackingCategoryExpiration = CATEGORY_EXPIRATION_DAYS[trackingCategory.id];
-  if (!trackingCategoryExpiration) {
-    return undefined;
+
+  if (trackingCategory) {
+    return new Date(expiration.getTime() + trackingCategory.expiry * ONE_DAY_IN_MILLISECONDS);
   }
-  const expiration = new Date();
-  expiration.setDate(expiration.getDate() + trackingCategoryExpiration);
-  return expiration;
+
+  return undefined;
 };
 
 export default setExpiryForCookie;