cb-cookie-manager 0.0.1-security → 1.0.0

package/.eslintignore

@@ -0,0 +1,11 @@
+# specific files to ignore
+*.md
+.eslintrc.js
+.eslintignore
+webpack.*.js
+
+# folders to ignore
+build
+chrome
+**/dist/*
+node_modules

package/LICENSE.md

@@ -0,0 +1,13 @@
+Copyright (c) 2018-2023 Coinbase, Inc.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.

package/README.md

@@ -1,5 +1,479 @@
-# Security holding package
+# Cookie Manager
 
-This package contained malicious code and was removed from the registry by the npm security team. A placeholder was published to ensure users are not affected in the future.
+**Helps with managaing first-party client side cookies to adhere to CCPA and GDPR Cookie regulations**
 
-Please refer to www.npmjs.com/advisories?search=cb-cookie-manager for more information.
+# Contents
+
+- [Introduction](#Introduction)
+- [Installation](#installation)
+- [Methods](#methods)
+  - [Provider](#provider)
+  - [useCookie](#usecookie)
+  - [useHasConsent](#usehasconsent)
+  - [useRequiredCategories](#userequiredcategories)
+  - [useSavedTrackingPreference](#usesavedtrackingpreference)
+  - [useSetTrackingPreference](#usesettrackingpreference)
+  - [useTrackingPreference](#usesettrackingpreference)
+  - [areCookiesEnabled](#arecookiesenabled)
+  - [getDefaultTrackingPreference](#getdefaulttrackingpreference)
+  - [useTrackingManager](#usetrackingmanager)
+  - [isOptOut](#isoptout)
+- [License](#license)
+
+## Introduction
+
+`cb-cookie-manager` helps manage the following first party client side cookie categories:
+
+- `Necessary Cookies`: Cookies that are necessary for the site to the function
+- `Performance Cookies`: Cookies that impact site performance and help mesaure performance
+- `Functional Cookies`: Cookies to improve the functionality of the site
+- `Targeting Cookies`: Cookies used for advertising and ad targeting
+
+The preferences is stored as `cm_eu_preference` cookie in case the user is from EU or as `cm_default_preference` cookie in any other case
+
+A `cm_default_preference` cookie looks like the following:
+
+```json
+{
+  "region": "DEFAULT",
+  "consent": ["necessary", "performance", "functional", "targeting"]
+}
+```
+
+Where region is `DEFAULT` and consent specifies what types of cookie categories the user has given preference too. This is stored as a strictly necessary cookie and has an expiration duration of 1 year.
+
+Cookie Manager accepts a config like this:
+
+```typescript
+import {
+  Framework,
+  Region,
+  TrackerType,
+  TrackingCategory,
+} from 'cb-cookie-manager';
+
+export default {
+  categories: [
+    {
+      id: TrackingCategory.NECESSARY,
+      required: true,
+      trackers: [
+        {
+          id: 'locale',
+          type: TrackerType.COOKIE,
+        },
+      ],
+    },
+    {
+      id: TrackingCategory.PERFORMANCE,
+      trackers: [
+        {
+          id: 'some_cookie',
+          type: TrackerType.COOKIE,
+        },
+      ],
+    },
+    {
+      id: TrackingCategory.FUNCTIONAL,
+      trackers: [
+        {
+          id: 'mode',
+          type: TrackerType.COOKIE,
+        },
+      ],
+    },
+    {
+      id: TrackingCategory.TARGETING,
+      trackers: [
+        {
+          id: 'id-regex',
+          type: TrackerType.COOKIE,
+          regex: 'id(?:_[a-f0-9]{32}|undefined)(?:.*)',
+        },
+      ],
+    },
+    {
+      id: TrackingCategory.DELETE_IF_SEEN,
+      trackers: [
+        {
+          id: 'cgl_prog',
+          type: TrackerType.COOKIE,
+        },
+      ],
+    },
+  ],
+  geolocationRules: [
+    {
+      region: Region.DEFAULT,
+      framework: Framework.OPT_OUT,
+    },
+    {
+      region: Region.EU,
+      framework: Framework.OPT_IN,
+    },
+  ],
+};
+```
+
+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.
+
+`DELETE_IF_SEEN` can be used to specify the cookies which should be deleted if seen on the browser
+
+You can also specify regex for a given cookie as follows:
+
+```json
+{
+    id: 'id-regex',
+    type: TrackerType.COOKIE,
+    regex: 'id(?:_[a-f0-9]{32}|undefined)(?:.*)',
+}
+```
+
+Any id with `-regex` at the end should contain a `regex` which will be used to match different cookies.
+
+In this example: `id_ac7a5c3da45e3612b44543a702e42b01` will also be allowed
+
+## Installation
+
+Install the package as follows:
+
+```shell
+yarn add cb-cookie-manager
+
+npm install cb-cookie-manager
+
+pnpm install cb-cookie-manager
+```
+
+## Methods
+
+### Provider
+
+The provider must wrap the entire application and only be instantiated once. On mount, it will remove all blocked cookies (i.e. cookies that do not have user consent). It takes the following props:
+
+`onError: (error: Error) => void`: Error function
+
+`projectName: string`: Current project name
+
+`locale: string`: Locale to be displayed
+
+`region: 'EU' | 'DEFAULT'`; `DEFAULT` refers to non-EU countries
+
+`onPreferenceChange?: (preference: TrackingPreference) => void`: Callback for when user consent preferences change. This will also be called on mount.
+
+`config: Config`: Cookie manager config. See [Config](#config) section below
+
+`shadowMode?: boolean`: Cookies will not be removed in this mode
+
+`log: (str: string, options?: Record<string, any>) => void`: Log function
+
+Example usage:
+
+```typescript
+import { Provider, Region, TrackingCategory, TrackingPreference } from 'cb-cookie-manager';
+
+<Provider
+  onError={notifyError}
+  onPreferenceChange={() => {}}
+  locale={localeCode}
+  region={isInEU(locale.country) ? Region.EU : Region.Default}
+  projectName="consumer-marketing"
+  config={cookieManagerConfig}
+  log={eventTracking.track}
+  shadowMode
+  >
+  {children}
+</Provider>
+
+```
+
+### useCookie
+
+You should replace all usages of setting, removing or getting cookies with the `useCookie` hook. The cookie manager will prevent any non-consented cookies from being set. Passing `undefined` or `null` to the set cookie function will remove that cookie. You can also pass optional parameters to change the cookie properties.
+
+It accepts the following props:
+
+```
+`cookieName`: Name of the cookie for which you want to perform operations
+```
+
+`useCookie` returns the current `cookie` value and a `setCookieFunction`
+
+`setCookieFunction` can take in the following props:
+
+- `value`: The value to be set for the cookie
+- `CookieAttributes`: This is optional but you can specify the following properties for a cookie:
+
+```typescript
+interface CookieAttributes {
+  /**
+   * Define when the cookie will be removed. Value can be a Number
+   * which will be interpreted as days from time of creation or a
+   * Date instance. If omitted, the cookie becomes a session cookie.
+   */
+  expires?: number | Date;
+
+  /**
+   * Define the path where the cookie is available. Defaults to '/'
+   */
+  path?: string;
+
+  /**
+   * Define the domain where the cookie is available. Defaults to
+   * the domain of the page where the cookie was created.
+   */
+  domain?: string;
+
+  /**
+   * A Boolean indicating if the cookie transmission requires a
+   * secure protocol (https). Defaults to false.
+   */
+  secure?: boolean;
+
+  /**
+   * Asserts that a cookie must not be sent with cross-origin requests,
+   * providing some protection against cross-site request forgery
+   * attacks (CSRF)
+   */
+  sameSite?: 'strict' | 'lax' | 'none';
+
+  /**
+   * An attribute which will be serialized, conformably to RFC 6265
+   * section 5.2.
+   */
+  [property: string]: any;
+}
+```
+
+Example usage:
+
+```typescript
+import { useCookie } from '@cb/cookie-manager';
+
+const SomeComponent = () => {
+  const [cookie, setCookie] = useCookie('some_cookie');
+  const handleClick = () => {
+    setCookie('hello')
+  };
+
+  return (
+    <div>
+      <button onClick={handleClick}>Set cookie</button>
+      <span>Current cookie: </span>
+      <span>{cookie}</span>
+    </div>
+}
+```
+
+### useHasConsent
+
+This is a hook for programmatically determining if a tracker (e.g. cookie) has been consented to by the user.
+
+```typescript
+import { useHasConsent } from 'cb-cookie-manager';
+
+const SomeComponent = () => {
+  const hasConsent = useHasConsent('cookie');
+
+  return (
+    <div>
+      {hasConsent && <div> Cookie has consent </div>
+    </div>
+}
+```
+
+### useRequiredCategories
+
+This hook is used to determine which category of cookies is required.
+
+Example Usage:
+
+```typescript
+import { useRequiredCategories, TRACKER_CATEGORIES } from 'cb-cookie-manager';
+
+const SomeComponent = () => {
+  const requiredCategories = useRequiredCategories();
+
+  return (
+    <div>
+       <CategoryContainer>
+          {TRACKER_CATEGORIES.map(t => (
+            <CheckBoxContainer key={t}>
+              <CheckBox
+                disabled={requiredCategories.includes(t)}
+                checked={state.consent.includes(t)}
+                onChange={(val: boolean) => dispatch({ name: t, value: val })}
+              >
+                <CategoryLabel name={t} />
+              </CheckBox>
+            </CheckBoxContainer>
+          ))}
+        </CategoryContainer>
+    </div>
+}
+```
+
+### useSavedTrackingPreference
+
+This hook is used to retrieve the saved cookie preference in cache
+
+Example Usage:
+
+```typescript
+import { useSavedTrackingPreference } from 'cb-cookie-manager';
+
+const SomeComponent = () => {
+  const preference = useSavedTrackingPreference();
+
+  return (
+    <div>
+       {preference}
+    </div>
+  )
+}
+```
+
+### useSetTrackingPreference
+
+This hook is used to set the saved cookie preference in cache
+
+Example Usage:
+
+```typescript
+import { useSetTrackingPreference, Region, TrackingCategory } from 'cb-cookie-manager';
+
+const SomeComponent = () => {
+    const setTrackingPreference = useSetTrackingPreference();
+
+    const handleSave = useCallback(() => {
+        setTrackingPreference({
+            region: Region.Default,
+            consent: [TrackingCategory.Functional],
+        });
+        console.log('cookie_consent_manager_saved_tapped');
+    }, [setTrackingPreference]);
+
+  return (
+    <div>
+        <Button onClick={handleSave} large>
+            Save Preference
+        </Button>
+    </div>
+  )
+}
+```
+
+### useTrackingPreference
+
+This hook returns the cached preference and if no preference is cached, it returns the default preference based on user's region
+
+Example Usage:
+
+```typescript
+import { useTrackingPreference } from 'cb-cookie-manager';
+
+const SomeComponent = () => {
+  const initialTrackingPreference = useTrackingPreference();
+
+  return (
+    <div>
+       {initialTrackingPreference}
+    </div>
+  )
+}
+```
+
+### areCookiesEnabled
+
+This hook is used to determine if cookies have been enabled on user's browser
+
+Example usage:
+
+```typescript
+
+import { areCookiesEnabled } from 'cb-cookie-manager';
+
+
+const SomeComponent = () => {
+  const enabled = areCookiesEnabled();
+
+  return (
+    <div>
+       {enabled? <div> Cookies Enabled </div> : <div> Cookies not enabled </div>}
+    </div>
+  )
+}
+```
+
+### getDefaultTrackingPreference
+
+This hook is used to retrieve the default tracking preference for a given user based on their region
+
+Example usage:
+
+```typescript
+import { getDefaultTrackingPreference } from 'cb-cookie-manager';
+
+const SomeComponent = () => {
+  const preference = getDefaultTrackingPreference();
+
+  return (
+    <div>
+       {preference}
+    </div>
+  )
+}
+```
+
+### useTrackingManager
+
+This hook is used to return `TrackingManagerDependencies` which includes all the values/methods which were passed into Cookie Manager Provider
+
+Example usage:
+
+```typescript
+import { isOptOut, useTrackingManager } from 'cb-cookie-manager';
+
+const SomeComponent = () => {
+  const { region } = useTrackingManager();
+  const optOut = isOptOut(region);
+
+  return (
+    <div>
+       `Region for the given user is ${region}`
+    </div>
+  )
+}
+```
+
+### isOptOut
+
+Used for determining if the current region is using the `optOut` framework
+
+It follows the following logic in order:
+
+- If there's no geolocation rule for the specified region then use the rule for DEFAULT region
+- Otherwise use the following rules:
+  - optIn: Users must opt in to tracking (EU)
+  - optOut: Users must opt out of tracking (non-EU)
+
+Example usage:
+
+```typescript
+import { isOptOut, useTrackingManager } from 'cb-cookie-manager';
+
+const SomeComponent = () => {
+  const { region } = useTrackingManager();
+  const optOut = isOptOut(region);
+
+  return (
+    <div>
+       {isOptOut ? <div> In default region </div> : <div> In Eu </div>}
+    </div>
+  )
+}
+```
+
+## License
+
+Licensed under the Apache License. See [LICENSE](./LICENSE) for more information.

package/dist/CookieContext.d.ts

@@ -0,0 +1,10 @@
+import { CookieAttributes } from 'js-cookie';
+import React from 'react';
+import { SetCookieFunction } from './types';
+type Props = {
+    children: React.ReactNode;
+};
+export declare const CookieProvider: ({ children }: Props) => React.JSX.Element;
+export declare const useSetCookie: () => (cookieName: string, value: any, options?: CookieAttributes) => void;
+export declare const useCookie: (cookieName: string) => [any | undefined, SetCookieFunction];
+export {};

package/dist/CookieContext.js

@@ -0,0 +1,182 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCookie = exports.useSetCookie = exports.CookieProvider = void 0;
+const js_cookie_1 = __importDefault(require("js-cookie"));
+const react_1 = __importStar(require("react"));
+const constants_1 = require("./constants");
+const TrackingManagerContext_1 = require("./TrackingManagerContext");
+const types_1 = require("./types");
+const getAllCookies_1 = __importStar(require("./utils/getAllCookies"));
+const getDefaultTrackingPreference_1 = __importDefault(require("./utils/getDefaultTrackingPreference"));
+const getDomain_1 = require("./utils/getDomain");
+const getTrackerInfo_1 = __importDefault(require("./utils/getTrackerInfo"));
+const hasConsent_1 = __importDefault(require("./utils/hasConsent"));
+const isMaxKBSize_1 = __importDefault(require("./utils/isMaxKBSize"));
+const setGTMVariables_1 = __importDefault(require("./utils/setGTMVariables"));
+const CookieContext = (0, react_1.createContext)([{}]);
+const CookieProvider = ({ children }) => {
+    const { config, region, shadowMode, log, onPreferenceChange } = (0, TrackingManagerContext_1.useTrackingManager)();
+    const POLL_INTERVAL = 500;
+    let cookieValues = {};
+    let trackingPreference;
+    let adTrackingPreference;
+    const removeCookies = (0, react_1.useCallback)((cookies) => {
+        cookies.forEach((c) => {
+            if (!shadowMode) {
+                js_cookie_1.default.remove(c, { domain: (0, getDomain_1.getDomainWithoutSubdomain)(), path: '/' });
+                js_cookie_1.default.remove(c, { domain: (0, getDomain_1.getHostname)(), path: '/' });
+            }
+            log('Cookie does not have consent and will be removed', {
+                cookie: c,
+            });
+        });
+    }, [shadowMode, log]);
+    (0, react_1.useEffect)(() => {
+        if (typeof window !== 'undefined') {
+            const checkCookies = () => {
+                const currentCookie = (0, getAllCookies_1.default)();
+                if (!(0, getAllCookies_1.areRecordsEqual)(cookieValues, currentCookie)) {
+                    cookieValues = currentCookie;
+                    trackingPreference = getTrackingPreference(cookieValues, region, config);
+                    adTrackingPreference = getAdTrackingPreference(cookieValues);
+                    (0, setGTMVariables_1.default)(trackingPreference, adTrackingPreference);
+                    const cookiesToRemove = [];
+                    Object.keys(cookieValues).forEach((c) => {
+                        const trackerInfo = (0, getTrackerInfo_1.default)(c, config);
+                        if (constants_1.REQUIRED_COOKIE_MANAGER_COOKIES.includes(c)) {
+                            return;
+                        }
+                        if (!trackerInfo) {
+                            // This cookie is not present in the config. For legal/compliance
+                            // reasons, any cookies not listed in the config may not be set.
+                            cookiesToRemove.push(c);
+                            return;
+                        }
+                        if (!(0, hasConsent_1.default)(c, config, trackingPreference) &&
+                            trackerInfo.type === types_1.TrackerType.COOKIE) {
+                            cookiesToRemove.push(c);
+                        }
+                    });
+                    removeCookies(cookiesToRemove);
+                }
+            };
+            checkCookies();
+            // Call the function once before setting the interval
+            const intervalId = setInterval(checkCookies, POLL_INTERVAL);
+            return () => {
+                clearInterval(intervalId);
+            };
+        }
+    }, []);
+    (0, react_1.useEffect)(() => {
+        if (onPreferenceChange) {
+            onPreferenceChange(trackingPreference);
+        }
+    }, []);
+    return react_1.default.createElement(CookieContext.Provider, { value: cookieValues }, children);
+};
+exports.CookieProvider = CookieProvider;
+const useSetCookie = () => {
+    const cookieChangedRef = (0, react_1.useContext)(CookieContext);
+    const { config, region, log, shadowMode, onError } = (0, TrackingManagerContext_1.useTrackingManager)();
+    const trackingPreference = getTrackingPreference(cookieChangedRef, region, config);
+    return (0, react_1.useCallback)((cookieName, value, options) => {
+        const setCookieFunc = setCookieFunction({
+            cookieName,
+            trackingPreference,
+            config,
+            log,
+            shadowMode,
+            onError,
+        });
+        setCookieFunc(value, options);
+    }, [trackingPreference, config, log, shadowMode, onError]);
+};
+exports.useSetCookie = useSetCookie;
+const setCookieFunction = ({ cookieName, trackingPreference, config, shadowMode, log, onError, }) => {
+    return (value, options) => {
+        var _a;
+        if (value === undefined || value === null) {
+            js_cookie_1.default.remove(cookieName, options);
+            return;
+        }
+        const cookieHasConsent = (0, hasConsent_1.default)(cookieName, config, trackingPreference);
+        if (cookieHasConsent || shadowMode) {
+            const stringValue = JSON.stringify(value);
+            const cookieSize = (_a = options === null || options === void 0 ? void 0 : options.size) !== null && _a !== void 0 ? _a : constants_1.MAX_COOKIE_SIZE;
+            /*
+            Url encoded cookie string (since that is what Cookies.set coverts the string into) including its name must not exceed 4KB
+            For example, "," becomes %22%2C%2C making it go from 3 characters to now 9. The size has tripled.
+            This is why we need to compare the url encoded stringValue instead of the stringValue itself to account for the extra characters.
+            */
+            if ((0, isMaxKBSize_1.default)(encodeURIComponent(stringValue) + cookieName, cookieSize)) {
+                onError(new Error(`${cookieName} value exceeds ${cookieSize}KB`));
+            }
+            else {
+                const newOptions = options ? Object.assign({}, options) : undefined;
+                if (newOptions === null || newOptions === void 0 ? void 0 : newOptions.size) {
+                    delete newOptions.size;
+                }
+                js_cookie_1.default.set(cookieName, stringValue, newOptions);
+            }
+        }
+        if (!cookieHasConsent) {
+            log('Cookie does not have consent and will not be set', {
+                cookie: cookieName,
+            });
+        }
+    };
+};
+const getTrackingPreference = (cookieCache, region, config) => {
+    const trackingPreference = region === 'EU'
+        ? cookieCache[constants_1.EU_CONSENT_PREFERENCES_COOKIE]
+        : cookieCache[constants_1.DEFAULT_CONSENT_PREFERENCES_COOKIE];
+    return trackingPreference || (0, getDefaultTrackingPreference_1.default)(region, config);
+};
+const adTrackingDefault = { value: 'true' };
+const getAdTrackingPreference = (cookieCache) => {
+    const adTrackingPreference = cookieCache[constants_1.ADVERTISING_SHARING_ALLOWED];
+    return adTrackingPreference || adTrackingDefault;
+};
+const useCookie = (cookieName) => {
+    const cookieCache = (0, react_1.useContext)(CookieContext);
+    const { config, region, log, shadowMode, onError } = (0, TrackingManagerContext_1.useTrackingManager)();
+    const trackingPreference = getTrackingPreference(cookieCache, region, config);
+    const setCookie = setCookieFunction({
+        cookieName,
+        trackingPreference,
+        config,
+        log,
+        shadowMode,
+        onError,
+    });
+    const cookieValue = (0, react_1.useContext)(CookieContext)[cookieName];
+    return [cookieValue, setCookie];
+};
+exports.useCookie = useCookie;

package/dist/TrackingManagerContext.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { TrackingManagerDependencies } from './types';
+export declare const useTrackingManager: () => TrackingManagerDependencies;
+export declare function Provider({ children, ...restProps }: {
+    children: React.ReactNode;
+} & TrackingManagerDependencies): React.JSX.Element;