aesirx-analytics 2.2.16 → 2.2.18

package/README.md

@@ -286,13 +286,10 @@ Please follow below CSS example:
 ## Choose template for Consent modal
 
 There is 5 template for Consent modal
-1. original
-2. default (recommend)
-3. simple-consent-mode
-   1. Support Basic Consent Mode v2
-4. advance-consent-mode
+1. default (recommend)
    1. Support Advance Consent Mode v2
-5. simple-web-2
+2. simple-consent-mode
+   1. Support Basic Consent Mode v2
 
 #### Usage in SSR site:
 ```
@@ -325,7 +322,10 @@ NEXT_PUBLIC_CONSENT_LAYOUT=default
         "title":"payment",
         "content":"<div>YOUR_CONTENT_INPUT_HERE</div>"
       }
-    ]`
+    ]`;
+
+    //trigger open optIn consent with Javascript
+    document.querySelector('.opt-in-consent.payment').classList.add('show');
 </script>
 ```
 

package/dist/{Consent-5DG23CO4.js → Consent-BHX6FYD6.js}

@@ -7,7 +7,7 @@ import {
   WALLET_CONNECT,
   getWeb3ID,
   useConsentStatus_default
-} from "./chunk-7VGQDRF4.js";
+} from "./chunk-Q4NTXDNB.js";
 import {
   AnalyticsContext,
   agreeConsents,
@@ -24,7 +24,7 @@ import {
   revokeConsents,
   useTranslation,
   verifySignature
-} from "./chunk-EQQ4ASJH.js";
+} from "./chunk-EL2DBQXP.js";
 
 // src/Components/Consent.tsx
 import React, { Suspense, useContext, useEffect, useState } from "react";
@@ -544,31 +544,45 @@ var ConsentComponentApp = (props) => {
     const element = document.querySelector(selector);
     element.click();
   };
-  const loadConsentDefault = (gtagId2, gtmId2) => {
+  const loadConsentDefault = async (gtagId2, gtmId2) => {
     window.dataLayer = window.dataLayer || [];
     function gtag(p0, p1, p2) {
       dataLayer.push(arguments);
     }
-    gtag("consent", "default", {
-      ad_user_data: "denied",
-      ad_personalization: "denied",
-      ad_storage: "denied",
-      analytics_storage: "denied",
-      wait_for_update: 500
-    });
-    if (gtagId2) {
-      gtag("js", /* @__PURE__ */ new Date());
-      gtag("config", `${gtagId2}`);
-    }
-    if (gtmId2) {
-      dataLayer.push({ "gtm.start": (/* @__PURE__ */ new Date()).getTime(), event: "gtm.js" });
-    }
-    if (layout === "advance-consent-mode") {
-      gtagId2 && loadGtagScript(gtagId2);
-      gtmId2 && loadGtmScript(gtmId2);
+    if (layout !== "simple-consent-mode" && sessionStorage.getItem("consentGranted") !== "true") {
+      gtag("consent", "default", {
+        ad_user_data: "denied",
+        ad_personalization: "denied",
+        ad_storage: "denied",
+        analytics_storage: "denied",
+        wait_for_update: 500
+      });
       gtag("set", "url_passthrough", true);
       gtag("set", "ads_data_redaction", true);
     }
+    if ((layout !== "simple-consent-mode" || sessionStorage.getItem("consentGranted") === "true") && (gtmId2 && !document.querySelector(
+      `script[src="https://www.googletagmanager.com/gtm.js?id=${gtmId2}"]`
+    ) || gtagId2 && !document.querySelector(
+      `script[src="https://www.googletagmanager.com/gtag/js?id=${gtagId2}"]`
+    ))) {
+      gtagId2 && await loadGtagScript(gtagId2);
+      gtmId2 && await loadGtmScript(gtmId2);
+      if (gtagId2) {
+        gtag("js", /* @__PURE__ */ new Date());
+        gtag("config", `${gtagId2}`);
+      }
+      if (gtmId2) {
+        dataLayer.push({ "gtm.start": (/* @__PURE__ */ new Date()).getTime(), event: "gtm.js" });
+      }
+    }
+    if (sessionStorage.getItem("consentGranted") === "true") {
+      gtag("consent", "update", {
+        ad_user_data: "granted",
+        ad_personalization: "granted",
+        ad_storage: "granted",
+        analytics_storage: "granted"
+      });
+    }
   };
   useEffect(() => {
     if (activeConnectorError) {
@@ -580,8 +594,10 @@ var ConsentComponentApp = (props) => {
       setShowBackdrop(false);
       setShowExpandConsent(false);
     }
-    (gtagId || gtmId) && loadConsentDefault(gtagId, gtmId);
   }, []);
+  useEffect(() => {
+    (gtagId || gtmId) && loadConsentDefault(gtagId, gtmId);
+  }, [layout]);
   console.log("level", uuid, level, web3ID, account, loading);
   return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(ToastContainer, null), /* @__PURE__ */ React.createElement("div", { className: `offcanvas-backdrop fade ${showBackdrop && show ? "show" : "d-none"}` }), /* @__PURE__ */ React.createElement(
     "div",

package/dist/{ConsentCustom-ZJOKKK4Z.js → ConsentCustom-IPEDWQWE.js}

@@ -11,7 +11,7 @@ import {
   check_circle_default,
   getWeb3ID,
   useConsentStatus_default
-} from "./chunk-7VGQDRF4.js";
+} from "./chunk-Q4NTXDNB.js";
 import {
   AnalyticsContext,
   agreeConsents,
@@ -28,7 +28,7 @@ import {
   revokeConsents,
   useTranslation,
   verifySignature
-} from "./chunk-EQQ4ASJH.js";
+} from "./chunk-EL2DBQXP.js";
 
 // src/Components/ConsentCustom.tsx
 import React, { Suspense, useContext, useEffect, useState } from "react";
@@ -72,7 +72,8 @@ var ConsentComponentCustom = ({
   gtagId,
   gtmId,
   layout,
-  isOptInReplaceAnalytics
+  isOptInReplaceAnalytics,
+  customConsentText
 }) => {
   return /* @__PURE__ */ React.createElement(React.Fragment, null, !isOptInReplaceAnalytics ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(WithWalletConnector, { network: networkEnv === "testnet" ? TESTNET : MAINNET }, (props) => /* @__PURE__ */ React.createElement(
     ConsentComponentCustomWrapper,
@@ -84,7 +85,8 @@ var ConsentComponentCustom = ({
       isLoggedApp,
       gtagId,
       gtmId,
-      layout
+      layout,
+      customConsentText
     }
   ))) : /* @__PURE__ */ React.createElement(React.Fragment, null));
 };
@@ -113,6 +115,7 @@ var ConsentComponentCustomWrapper = (props) => {
       gtagId: props?.gtagId,
       gtmId: props?.gtmId,
       layout: props?.layout,
+      customConsentText: props?.customConsentText,
       uuid,
       level,
       connection,
@@ -136,6 +139,7 @@ var ConsentComponentCustomApp = (props) => {
     gtagId,
     gtmId,
     layout,
+    customConsentText,
     activeConnectorType,
     activeConnector,
     activeConnectorError,
@@ -180,8 +184,8 @@ var ConsentComponentCustomApp = (props) => {
   const { t } = useTranslation();
   const gRPCClient = useGrpcClient(network);
   const revoke = sessionStorage.getItem("aesirx-analytics-revoke");
-  const { address, connector } = (layout === "simple-consent-mode" || layout === "simple-web-2" || level === 1) && (!revoke || revoke === "0" || revoke === "1") ? { address: "", connector: "" } : useAccount();
-  const { signMessage } = (layout === "simple-consent-mode" || layout === "simple-web-2" || level === 1) && (!revoke || revoke === "0" || revoke === "1") ? { signMessage: {} } : useSignMessage({
+  const { address, connector } = (layout === "simple-consent-mode" || level === 1) && (!revoke || revoke === "0" || revoke === "1") ? { address: "", connector: "" } : useAccount();
+  const { signMessage } = (layout === "simple-consent-mode" || level === 1) && (!revoke || revoke === "0" || revoke === "1") ? { signMessage: {} } : useSignMessage({
     async onSuccess(data, variables) {
       const signature = Buffer.from(
         typeof data === "object" && data !== null ? JSON.stringify(data) : data,
@@ -638,8 +642,10 @@ var ConsentComponentCustomApp = (props) => {
     if (sessionStorage.getItem("aesirx-analytics-revoke") && sessionStorage.getItem("aesirx-analytics-revoke") !== "0") {
       window.funcAfterConsent && window.funcAfterConsent();
     }
-    (gtagId || gtmId) && loadConsentDefault(gtagId, gtmId);
   }, []);
+  useEffect(() => {
+    (gtagId || gtmId) && loadConsentDefault(gtagId, gtmId);
+  }, [layout]);
   useEffect(() => {
     if (showExpandRevoke && isDesktop && (sessionStorage.getItem("aesirx-analytics-revoke") === "3" || sessionStorage.getItem("aesirx-analytics-revoke") === "4")) {
       setActiveConnectorType(BROWSER_WALLET);
@@ -667,30 +673,44 @@ var ConsentComponentCustomApp = (props) => {
       ))
     );
   };
-  const loadConsentDefault = (gtagId2, gtmId2) => {
+  const loadConsentDefault = async (gtagId2, gtmId2) => {
     window.dataLayer = window.dataLayer || [];
     function gtag(p0, p1, p2) {
       dataLayer.push(arguments);
     }
-    gtag("consent", "default", {
-      ad_user_data: "denied",
-      ad_personalization: "denied",
-      ad_storage: "denied",
-      analytics_storage: "denied",
-      wait_for_update: 500
-    });
-    if (gtagId2) {
-      gtag("js", /* @__PURE__ */ new Date());
-      gtag("config", `${gtagId2}`);
-    }
-    if (gtmId2) {
-      dataLayer.push({ "gtm.start": (/* @__PURE__ */ new Date()).getTime(), event: "gtm.js" });
+    if ((layout !== "simple-consent-mode" || sessionStorage.getItem("consentGranted") === "true") && (gtmId2 && !document.querySelector(
+      `script[src="https://www.googletagmanager.com/gtm.js?id=${gtmId2}"]`
+    ) || gtagId2 && !document.querySelector(
+      `script[src="https://www.googletagmanager.com/gtag/js?id=${gtagId2}"]`
+    ))) {
+      gtagId2 && await loadGtagScript(gtagId2);
+      gtmId2 && await loadGtmScript(gtmId2);
+      if (gtagId2) {
+        gtag("js", /* @__PURE__ */ new Date());
+        gtag("config", `${gtagId2}`);
+      }
+      if (gtmId2) {
+        dataLayer.push({ "gtm.start": (/* @__PURE__ */ new Date()).getTime(), event: "gtm.js" });
+      }
     }
-    if (layout === "advance-consent-mode") {
-      gtagId2 && loadGtagScript(gtagId2);
-      gtmId2 && loadGtmScript(gtmId2);
+    if (layout !== "simple-consent-mode" && sessionStorage.getItem("consentGranted") !== "true") {
       gtag("set", "url_passthrough", true);
       gtag("set", "ads_data_redaction", true);
+      gtag("consent", "default", {
+        ad_user_data: "denied",
+        ad_personalization: "denied",
+        ad_storage: "denied",
+        analytics_storage: "denied",
+        wait_for_update: 500
+      });
+    }
+    if (sessionStorage.getItem("consentGranted") === "true") {
+      gtag("consent", "update", {
+        ad_user_data: "granted",
+        ad_personalization: "granted",
+        ad_storage: "granted",
+        analytics_storage: "granted"
+      });
     }
   };
   const paymentRevoke = sessionStorage.getItem("aesirx-analytics-opt-payment");
@@ -967,7 +987,7 @@ var ConsentComponentCustomApp = (props) => {
         {
           className: `ssoBtnWrapper d-flex align-items-center justify-content-center w-100 w-lg-30 me-3 bg-success rounded-pill ${level === 4 && !account && !address ? "" : "d-none"}`
         },
-        layout !== "simple-consent-mode" && layout !== "simple-web-2" && /* @__PURE__ */ React.createElement(
+        layout !== "simple-consent-mode" && /* @__PURE__ */ React.createElement(
           Suspense,
           {
             fallback: /* @__PURE__ */ React.createElement("div", { className: "d-flex h-100 justify-content-center align-items-center" }, "Loading...")
@@ -1052,7 +1072,7 @@ var ConsentComponentCustomApp = (props) => {
             }
           ) : /* @__PURE__ */ React.createElement(React.Fragment, null),
           t("txt_yes_i_consent")
-        ), layout === "simple-consent-mode" || layout === "simple-web-2" ? /* @__PURE__ */ React.createElement(React.Fragment, null) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+        ), layout === "simple-consent-mode" ? /* @__PURE__ */ React.createElement(React.Fragment, null) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
           Button,
           {
             variant: "outline-success",
@@ -1069,7 +1089,8 @@ var ConsentComponentCustomApp = (props) => {
           level,
           handleLevel,
           isCustom: true,
-          layout
+          layout,
+          customConsentText
         },
         /* @__PURE__ */ React.createElement(Form, { className: "mb-0 w-100" }, /* @__PURE__ */ React.createElement(
           Form.Check,
@@ -1115,7 +1136,7 @@ var ConsentComponentCustomApp = (props) => {
             }
           ) : /* @__PURE__ */ React.createElement(React.Fragment, null),
           t("txt_yes_i_consent")
-        ), layout === "simple-consent-mode" || layout === "simple-web-2" ? /* @__PURE__ */ React.createElement(React.Fragment, null) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+        ), layout === "simple-consent-mode" ? /* @__PURE__ */ React.createElement(React.Fragment, null) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
           Button,
           {
             variant: "outline-success",