aesirx-analytics 2.2.5 → 2.2.6

package/README.md

@@ -22,6 +22,7 @@ Follow the instructions in: [https://github.com/aesirxio/analytics-1stparty](htt
 <script>
   window.aesirx1stparty = "https://example.com"
   window.aesirxClientID="[REPLACE THIS WITH THE PROVIDED CLIENT_ID]"
+  window.aesirxClientSecret="[REPLACE THIS WITH THE PROVIDED CLIENT_SECRET]"
 </script>
 <script async defer src="YOUR_PROJECT_PATH/analytics.js"></script>
 ```
@@ -46,9 +47,11 @@ Follow the instructions in: [https://github.com/aesirxio/analytics-1stparty](htt
 ```
 REACT_APP_ENDPOINT_ANALYTICS_URL=https://example.com
 REACT_APP_SSO_CLIENT_ID=[REPLACE THIS WITH THE PROVIDED CLIENT_ID]
+REACT_APP_SSO_CLIENT_SECRET=[REPLACE THIS WITH THE PROVIDED CLIENT_SECRET]
 
 (https://example.com is the link to your 1st party server)
 `CLIENT_ID` replace this with the provided `CLIENT_ID` from https://dapp.shield.aesirx.io/
+`CLIENT_SECRET` replace this with the provided `CLIENT_SECRET` fromhttps://dapp.shield.aesirx.io/
 ```
 
 ##### Disable Consent Popup:
@@ -87,9 +90,11 @@ export default AnalyticsContainer;
 ```
 NEXT_PUBLIC_ENDPOINT_ANALYTICS_URL=https://example.com
 NEXT_PUBLIC_SSO_CLIENT_ID=[REPLACE THIS WITH THE PROVIDED CLIENT_ID]
+NEXT_PUBLIC_SSO_CLIENT_SECRET=[REPLACE THIS WITH THE PROVIDED CLIENT_SECRET]
 
 (https://example.com is the link to your 1st party server)
 `CLIENT_ID` replace this with the provided `CLIENT_ID` from https://dapp.shield.aesirx.io/
+`CLIENT_SECRET` replace this with the provided `CLIENT_SECRET` fromhttps://dapp.shield.aesirx.io/
 ```
 
 ##### Disable Consent Popup:
@@ -274,4 +279,37 @@ Please follow below CSS example:
   [data-bs-theme=dark] .aesirxconsent {
     color: #fff;
   }
+```
+
+
+## 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. Support Advance Consent Mode v2
+5. simple-web-2
+
+#### Usage in SSR site:
+```
+<script>
+  window.consentLayout = "default"
+</script>
+```
+
+#### In ReactJS:
+
+add this environment variable to `.env`
+```
+REACT_APP_CONSENT_LAYOUT=default
+```
+
+#### In NextJS:
+
+add this environment variable to `.env`
+```
+NEXT_PUBLIC_CONSENT_LAYOUT=default
 ```

package/dist/{Consent-ZWVGMKB7.js → Consent-U7ESRVW5.js}

@@ -5,25 +5,27 @@ import {
   LoadingStatus,
   TermsComponent,
   WALLET_CONNECT,
-  agreeConsents,
   bg_default,
-  getConsents,
-  getMember,
-  getNonce,
-  getSignature,
-  getWalletNonce,
   getWeb3ID,
   no_default,
   privacy_default,
-  revokeConsents,
   useConsentStatus_default,
-  verifySignature,
   yes_default
-} from "./chunk-PHG7RB3K.js";
+} from "./chunk-7GRKFZZL.js";
 import {
   AnalyticsContext,
-  useTranslation
-} from "./chunk-JH54YDTD.js";
+  agreeConsents,
+  getConsents,
+  getMember,
+  getNonce,
+  getSignature,
+  getWalletNonce,
+  loadGtagScript,
+  loadGtmScript,
+  revokeConsents,
+  useTranslation,
+  verifySignature
+} from "./chunk-N36VEWSG.js";
 
 // src/Components/Consent.tsx
 import React, { useContext, useEffect, useState } from "react";
@@ -47,7 +49,16 @@ import {
 } from "@concordium/react-components";
 import { OsTypes, isDesktop, isMobile, osName } from "react-device-detect";
 import { useAccount, useSignMessage } from "wagmi";
-var ConsentComponent = ({ endpoint, aesirXEndpoint, networkEnv, loginApp, isLoggedApp }) => {
+var ConsentComponent = ({
+  endpoint,
+  aesirXEndpoint,
+  networkEnv,
+  loginApp,
+  isLoggedApp,
+  gtagId,
+  gtmId,
+  layout
+}) => {
   return /* @__PURE__ */ React.createElement(WithWalletConnector, { network: networkEnv === "testnet" ? TESTNET : MAINNET }, (props) => /* @__PURE__ */ React.createElement("div", { className: "aesirxconsent" }, /* @__PURE__ */ React.createElement(Ethereum_default, null, /* @__PURE__ */ React.createElement(
     ConsentComponentApp,
     {
@@ -55,7 +66,10 @@ var ConsentComponent = ({ endpoint, aesirXEndpoint, networkEnv, loginApp, isLogg
       endpoint,
       aesirXEndpoint,
       loginApp,
-      isLoggedApp
+      isLoggedApp,
+      gtagId,
+      gtmId,
+      layout
     }
   ))));
 };
@@ -65,6 +79,9 @@ var ConsentComponentApp = (props) => {
     aesirXEndpoint,
     loginApp,
     isLoggedApp,
+    gtagId,
+    gtmId,
+    layout,
     activeConnectorType,
     activeConnector,
     activeConnectorError,
@@ -93,7 +110,7 @@ var ConsentComponentApp = (props) => {
     handleLevel,
     showRevoke,
     handleRevoke
-  ] = useConsentStatus_default(endpoint, props);
+  ] = useConsentStatus_default(endpoint, layout, props);
   const [consents, setConsents] = useState([1, 2]);
   const [loading, setLoading] = useState("done");
   const [loadingCheckAccount, setLoadingCheckAccount] = useState(false);
@@ -155,7 +172,10 @@ var ConsentComponentApp = (props) => {
           signature,
           web3ID,
           jwt,
-          "metamask"
+          "metamask",
+          gtagId,
+          gtmId,
+          layout
         );
         sessionStorage.setItem("aesirx-analytics-uuid", uuid);
         sessionStorage.setItem("aesirx-analytics-allow", "1");
@@ -233,7 +253,20 @@ var ConsentComponentApp = (props) => {
             level === 3 ? "Give consent:{nonce} {domain} {time}" : "Give consent Tier 4:{nonce} {domain} {time}"
           );
           setLoading("saving");
-          await agreeConsents(endpoint, level, uuid, consents, account, signature, web3ID, jwt);
+          await agreeConsents(
+            endpoint,
+            level,
+            uuid,
+            consents,
+            account,
+            signature,
+            web3ID,
+            jwt,
+            "concordium",
+            gtagId,
+            gtmId,
+            layout
+          );
           sessionStorage.setItem("aesirx-analytics-consent-type", "concordium");
         } else if (connector) {
           if (level === 3) {
@@ -255,9 +288,35 @@ var ConsentComponentApp = (props) => {
         consents.forEach(async (consent) => {
           const existConsent = consentList.find((item) => item?.consent === consent);
           if (!existConsent) {
-            await agreeConsents(endpoint, 1, uuid, consent);
+            await agreeConsents(
+              endpoint,
+              1,
+              uuid,
+              consent,
+              null,
+              null,
+              null,
+              null,
+              "concordium",
+              gtagId,
+              gtmId,
+              layout
+            );
           } else if (!!existConsent?.consent_uuid && existConsent?.expiration && new Date(existConsent.expiration) < /* @__PURE__ */ new Date()) {
-            await agreeConsents(endpoint, 1, uuid, consent);
+            await agreeConsents(
+              endpoint,
+              1,
+              uuid,
+              consent,
+              null,
+              null,
+              null,
+              null,
+              "concordium",
+              gtagId,
+              gtmId,
+              layout
+            );
           }
         });
       }
@@ -315,7 +374,11 @@ var ConsentComponentApp = (props) => {
           account,
           signature,
           null,
-          response?.jwt
+          response?.jwt,
+          "concordium",
+          gtagId,
+          gtmId,
+          layout
         );
         setShow(false);
         handleRevoke(true, level);
@@ -354,7 +417,20 @@ var ConsentComponentApp = (props) => {
           }
           setConsentTier4(response);
         } else {
-          await agreeConsents(endpoint, level, uuid, consents, null, null, null, response?.jwt);
+          await agreeConsents(
+            endpoint,
+            level,
+            uuid,
+            consents,
+            null,
+            null,
+            null,
+            response?.jwt,
+            "concordium",
+            gtagId,
+            gtmId,
+            layout
+          );
           setShow(false);
           handleRevoke(true, level);
           setLoading("done");
@@ -463,6 +539,32 @@ var ConsentComponentApp = (props) => {
     const element = document.querySelector(selector);
     element.click();
   };
+  const loadConsentDefault = (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);
+      gtag("set", "url_passthrough", true);
+      gtag("set", "ads_data_redaction", true);
+    }
+  };
   useEffect(() => {
     if (activeConnectorError) {
       toast.error(activeConnectorError);
@@ -473,6 +575,7 @@ var ConsentComponentApp = (props) => {
       setShowBackdrop(false);
       setShowExpandConsent(false);
     }
+    (gtagId || gtmId) && loadConsentDefault(gtagId, gtmId);
   }, []);
   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(
@@ -580,7 +683,7 @@ var ConsentComponentApp = (props) => {
       },
       /* @__PURE__ */ React.createElement("img", { src: privacy_default, alt: "Shield of Privacy" }),
       t("txt_shield_of_privacy")
-    ))) : /* @__PURE__ */ React.createElement(React.Fragment, null, level ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TermsComponent, { level, handleLevel }, /* @__PURE__ */ React.createElement(Form, { className: "mb-0" }, /* @__PURE__ */ React.createElement(
+    ))) : /* @__PURE__ */ React.createElement(React.Fragment, null, level ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TermsComponent, { level, handleLevel, layout }, /* @__PURE__ */ React.createElement(Form, { className: "mb-0" }, /* @__PURE__ */ React.createElement(
       Form.Check,
       {
         checked: consents.includes(1),