@uxf/analytics 11.10.0 → 11.11.1

package/README.md

@@ -21,11 +21,15 @@ npm install @uxf/analytics
 ```ts
 import { storeConsentToCookie } from "@uxf/analytics/consent";
 
-storeConsentToCookie({
-    analytics_storage: true,
-    ad_storage: false,
-    personalization_storage: false,
-});
+storeConsentToCookie(
+    {
+        ad_personalization: true,
+        ad_storage: false,
+        ad_user_data: false,
+        analytics_storage: false,
+    },
+    1 // version - this allows us to simply re-request consents from users
+);
 ```
 
 ### Read consent from cookie
@@ -43,7 +47,10 @@ This checks if the consent is already stored in cookies.
 ```tsx
 import { isConsentCookieSet } from "@uxf/analytics/consent";
 
-const isSet = isCookieConsentSet(); // boolean
+const isSet = isCookieConsentSet(
+    null,
+    1 // version - this allows us to simply re-request consents from users
+); // boolean
 ```
 
 ## GTM
@@ -68,9 +75,13 @@ This stores the consent to cookie and updates the GTM dataLayer.
 ```tsx
 import { updateGtmConsent } from "@uxf/analytics/gtm";
 
-updateGtmConsent({
-    analytics_storage: true,
-    ad_storage: false,
-    personalization_storage: false,
-});
+updateGtmConsent(
+    {
+        ad_personalization: true,
+        ad_storage: false,
+        ad_user_data: false,
+        analytics_storage: false,
+    },
+    1
+);
 ```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/analytics",
-  "version": "11.10.0",
+  "version": "11.11.1",
   "description": "",
   "scripts": {
     "build": "tsc -P tsconfig.json",

package/src/consent/index.d.ts

@@ -1,8 +1,12 @@
 export type CookiesConsentType = {
-    analytics_storage?: boolean;
+    ad_personalization?: boolean;
     ad_storage?: boolean;
-    personalization_storage?: boolean;
+    ad_user_data?: boolean;
+    analytics_storage?: boolean;
+};
+export type CookieConsentTypeWithVersion = CookiesConsentType & {
+    version: number;
 };
-export declare const storeConsentToCookie: (consent: CookiesConsentType) => void;
-export declare const readConsentFromCookie: (ctx?: any) => CookiesConsentType;
-export declare const isConsentCookieSet: (ctx?: any) => boolean;
+export declare function storeConsentToCookie(consent: CookiesConsentType, version: number, cookieTtl?: number): void;
+export declare function readConsentFromCookie(ctx?: any): CookieConsentTypeWithVersion;
+export declare function isConsentCookieSet(ctx: any | null, version: number): boolean;

package/src/consent/index.js

@@ -4,23 +4,24 @@ exports.isConsentCookieSet = exports.readConsentFromCookie = exports.storeConsen
 const cookie_1 = require("@uxf/core/cookie");
 const COOKIE_NAME = "cookieConsent";
 const COOKIE_TTL = 3600 * 24 * 90;
-const storeConsentToCookie = (consent) => {
+function storeConsentToCookie(consent, version, cookieTtl = COOKIE_TTL) {
     if (typeof window === "undefined") {
         throw new Error("The 'storeConsentToCookie' method cannot be called on server side.");
     }
-    cookie_1.Cookie.create().set(COOKIE_NAME, btoa(JSON.stringify(consent)), COOKIE_TTL);
-};
+    cookie_1.Cookie.create().set(COOKIE_NAME, btoa(JSON.stringify({ ...consent, version })), cookieTtl);
+}
 exports.storeConsentToCookie = storeConsentToCookie;
-const readConsentFromCookie = (ctx) => {
+function readConsentFromCookie(ctx) {
     const cookieConsent = cookie_1.Cookie.create(ctx).get(COOKIE_NAME);
     return JSON.parse(atob(cookieConsent || "") || "{}");
-};
+}
 exports.readConsentFromCookie = readConsentFromCookie;
-const isConsentCookieSet = (ctx) => {
-    const cookieConsent = cookie_1.Cookie.create(ctx).get(COOKIE_NAME);
-    const parsedConsent = JSON.parse(atob(cookieConsent || "") || "{}");
-    return (typeof parsedConsent.ad_storage === "boolean" &&
+function isConsentCookieSet(ctx, version) {
+    const parsedConsent = readConsentFromCookie(ctx);
+    return (typeof parsedConsent.ad_personalization === "boolean" &&
+        typeof parsedConsent.ad_storage === "boolean" &&
+        typeof parsedConsent.ad_user_data === "boolean" &&
         typeof parsedConsent.analytics_storage === "boolean" &&
-        typeof parsedConsent.personalization_storage === "boolean");
-};
+        parsedConsent.version === version);
+}
 exports.isConsentCookieSet = isConsentCookieSet;

package/src/gtm/types.d.ts

@@ -1,8 +1,9 @@
 export type ConsentType = "granted" | "denied";
 export interface GtmConsentData {
-    analytics_storage: ConsentType;
+    ad_personalization: ConsentType;
     ad_storage: ConsentType;
-    personalization_storage: ConsentType;
+    ad_user_data: ConsentType;
+    analytics_storage: ConsentType;
 }
 export interface GtmDataLayer {
     push: (gtmEventData: GtmConsentData) => void;

package/src/gtm/use-gtm-script.d.ts

@@ -1 +1 @@
-export declare const useGtmScript: (gtmId: string) => string;
+export declare function useGtmScript(gtmId: string): string;

package/src/gtm/use-gtm-script.js

@@ -2,17 +2,18 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useGtmScript = void 0;
 const consent_1 = require("../consent");
-const useGtmScript = (gtmId) => {
+function useGtmScript(gtmId) {
     const decodedCookie = (0, consent_1.readConsentFromCookie)();
     const defaultGtmCookie = `
         window.dataLayer = window.dataLayer || [];
         if (typeof gtag !== "function") { function gtag(){dataLayer.push(arguments)}; }
         gtag("consent", "default", {
-            'analytics_storage': '${decodedCookie.analytics_storage ? "granted" : "denied"}',
+            'ad_personalization': '${decodedCookie.ad_personalization ? "granted" : "denied"}',
             'ad_storage': '${decodedCookie.ad_storage ? "granted" : "denied"}',
-            'personalization_storage': '${decodedCookie.personalization_storage ? "granted" : "denied"}'}
+            'ad_user_data': '${decodedCookie.ad_user_data ? "granted" : "denied"}',
+            'analytics_storage': '${decodedCookie.analytics_storage ? "granted" : "denied"}'}
         );`;
     return (defaultGtmCookie +
         `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.defer=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','${gtmId}');`);
-};
+}
 exports.useGtmScript = useGtmScript;

package/src/gtm/utils.d.ts

@@ -1,2 +1,2 @@
 import { CookiesConsentType } from "../consent";
-export declare const updateGtmConsent: (consent: CookiesConsentType) => void;
+export declare function updateGtmConsent(consent: CookiesConsentType, version: number): void;

package/src/gtm/utils.js

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.updateGtmConsent = void 0;
 const consent_1 = require("../consent");
-const updateGtmConsent = (consent) => {
-    (0, consent_1.storeConsentToCookie)(consent);
+function updateGtmConsent(consent, version) {
+    (0, consent_1.storeConsentToCookie)(consent, version);
     window.dataLayer = window.dataLayer || [];
     if (typeof window.gtag !== "function") {
         window.gtag = function () {
@@ -12,9 +12,10 @@ const updateGtmConsent = (consent) => {
         };
     }
     window.gtag("consent", "update", {
-        analytics_storage: consent.analytics_storage ? "granted" : "denied",
+        ad_personalization: consent.ad_personalization ? "granted" : "denied",
         ad_storage: consent.ad_storage ? "granted" : "denied",
-        personalization_storage: consent.personalization_storage ? "granted" : "denied",
+        ad_user_data: consent.ad_user_data ? "granted" : "denied",
+        analytics_storage: consent.analytics_storage ? "granted" : "denied",
     });
-};
+}
 exports.updateGtmConsent = updateGtmConsent;