aesirx-analytics 2.2.15 → 2.2.17

package/dist/index.js

@@ -10,9 +10,10 @@ import {
   AnalyticsContextProvider_default,
   bg_default,
   getConsentTemplate,
+  no_default,
   privacy_default,
   useTranslation
-} from "./chunk-SBBLINO2.js";
+} from "./chunk-P35CM6LS.js";
 
 // src/AnalyticsNext/index.tsx
 import React2, { useEffect as useEffect2, useState as useState2 } from "react";
@@ -75,14 +76,15 @@ var handle_default = AnalyticsHandle;
 
 // src/AnalyticsNext/index.tsx
 import dynamic from "next/dynamic";
-var ConsentComponent = dynamic(() => import("./Consent-7KAMDZ4V.js"), { ssr: false });
-var ConsentComponentCustom = dynamic(() => import("./ConsentCustom-BWBSRP5V.js"), { ssr: false });
+var ConsentComponent = dynamic(() => import("./Consent-LAJMH5O6.js"), { ssr: false });
+var ConsentComponentCustom = dynamic(() => import("./ConsentCustom-FMWN7JO6.js"), { ssr: false });
 var AnalyticsNext = ({
   router,
   attributes,
   oldLayout = false,
   loginApp,
   isLoggedApp,
+  isOptInReplaceAnalytics = false,
   children
 }) => {
   const [layout, setLayout] = useState2(process.env.NEXT_PUBLIC_CONSENT_LAYOUT ?? "simple-web-2");
@@ -121,7 +123,8 @@ var AnalyticsNext = ({
       isLoggedApp,
       gtagId,
       gtmId,
-      layout
+      layout,
+      isOptInReplaceAnalytics
     }
   )))));
 };
@@ -167,9 +170,15 @@ var AnalyticsHandle2 = ({ location, history, children }) => {
 var handle_default2 = AnalyticsHandle2;
 
 // src/AnalyticsReact/index.tsx
-var ConsentComponent2 = React4.lazy(() => import("./Consent-7KAMDZ4V.js"));
-var ConsentComponentCustom2 = React4.lazy(() => import("./ConsentCustom-BWBSRP5V.js"));
-var AnalyticsReact = ({ location, history, oldLayout = false, children }) => {
+var ConsentComponent2 = React4.lazy(() => import("./Consent-LAJMH5O6.js"));
+var ConsentComponentCustom2 = React4.lazy(() => import("./ConsentCustom-FMWN7JO6.js"));
+var AnalyticsReact = ({
+  location,
+  history,
+  oldLayout = false,
+  isOptInReplaceAnalytics = false,
+  children
+}) => {
   const [layout, setLayout] = useState3(process.env.REACT_APP_CONSENT_LAYOUT ?? "simple-web-2");
   const [gtagId, setGtagId] = useState3(process.env.REACT_APP_ANALYTICS_GTAG_ID);
   const [gtmId, setGtmId] = useState3(process.env.REACT_APP_ANALYTICS_GTM_ID);
@@ -202,102 +211,290 @@ var AnalyticsReact = ({ location, history, oldLayout = false, children }) => {
       aesirXEndpoint: process.env.REACT_APP_ENDPOINT_URL ?? "https://api.aesirx.io",
       gtagId,
       gtmId,
-      layout
+      layout,
+      isOptInReplaceAnalytics
     }
   ))));
 };
 var AnalyticsReact_default = AnalyticsReact;
 
-// src/Components/PaymentConsent.tsx
-import React5, { useEffect as useEffect5 } from "react";
-import { Button } from "react-bootstrap";
-var PaymentConsent = ({ show = false, handleClose }) => {
+// src/Components/OptInConsent.tsx
+import React5, { useEffect as useEffect5, useState as useState4 } from "react";
+import { Button, Form } from "react-bootstrap";
+var OptInConsent = ({
+  optInConsentData = window?.optInConsentData ? JSON.parse(window?.optInConsentData) : []
+}) => {
+  const optInReplace = optInConsentData?.find((obj) => obj.replaceAnalyticsConsent);
   const { t } = useTranslation();
-  const handleConsent = () => {
-    sessionStorage.setItem("aesirx-analytics-payment", "true");
-    window?.funcAfterPaymentConsent && window.funcAfterPaymentConsent();
-    handleClose();
-  };
+  const [showExpandRevoke, setShowExpandRevoke] = useState4(false);
+  const [showRevoke, setShowRevoke] = useState4(false);
+  const [revokeConsentOption, setRevokeConsentOption] = useState4(
+    optInReplace?.title ? `aesirx-analytics-optin-${optInReplace?.title}` : "aesirx-analytics-optin-default"
+  );
+  const optInRevokes = Object.keys(sessionStorage).filter((key) => key.startsWith("aesirx-analytics-optin")).map((key) => key);
   useEffect5(() => {
-    if (sessionStorage.getItem("aesirx-analytics-payment") === "true") {
-      window.funcAfterPaymentConsent && window.funcAfterPaymentConsent();
+    if (optInRevokes?.includes("aesirx-analytics-optin-default") || optInRevokes?.includes(`aesirx-analytics-optin-${optInReplace?.title}`)) {
+      setShowRevoke(true);
     }
-  }, []);
-  return /* @__PURE__ */ React5.createElement("div", { className: "aesirxconsent" }, /* @__PURE__ */ React5.createElement(
+  });
+  return /* @__PURE__ */ React5.createElement(React5.Fragment, null, optInConsentData?.map((optIn, key) => /* @__PURE__ */ React5.createElement(React5.Fragment, { key }, /* @__PURE__ */ React5.createElement(OptIntConsentDetail, { optIn, setShowRevoke }))), optInReplace && /* @__PURE__ */ React5.createElement("div", { className: "aesirxconsent" }, /* @__PURE__ */ React5.createElement(
     "div",
     {
       tabIndex: -1,
-      className: `toast-container position-fixed m-md-3 ${show ? "top-50 start-50 translate-middle" : "bottom-0 end-0 opacity-0"}`
+      className: `toast-container position-fixed m-md-3 ${showExpandRevoke ? "top-50 start-50 translate-middle" : "bottom-0 end-0"}`
     },
-    /* @__PURE__ */ React5.createElement("div", { className: `toast payment-consent ${show ? "show" : ""} custom` }, /* @__PURE__ */ React5.createElement("div", { className: "toast-body p-0 shadow mx-3 mx-md-0" }, /* @__PURE__ */ React5.createElement("div", { className: "bg-white" }, /* @__PURE__ */ React5.createElement(
+    /* @__PURE__ */ React5.createElement(
       "div",
       {
-        className: `d-flex rounded-top align-items-center justify-content-between p-2 p-lg-3 fw-medium flex-wrap py-2 py-lg-3 px-4 header-consent-bg`,
-        style: {
-          borderBottom: "1px solid #DEDEDE"
-        }
+        className: `toast revoke-toast custom ${showRevoke ? "show" : ""} ${showExpandRevoke ? "" : "minimize"}`
       },
-      /* @__PURE__ */ React5.createElement("div", { className: "text-primary text-nowrap" }, t("txt_tracking_data_privacy")),
-      /* @__PURE__ */ React5.createElement("div", { className: "d-flex align-items-center fs-14 text-primary" }, /* @__PURE__ */ React5.createElement(
-        "a",
+      /* @__PURE__ */ React5.createElement("div", { className: "toast-body p-0 shadow mx-1 mx-md-0 mb-2 mb-md-0" }, /* @__PURE__ */ React5.createElement(
+        "div",
         {
-          href: "https://shield.aesirx.io/",
-          rel: "noreferrer",
-          target: "_blank",
-          className: "minimize-shield-wrapper position-relative text-decoration-none"
+          className: `revoke-wrapper minimize-shield-wrapper position-relative ${showExpandRevoke ? "bg-white" : ""}`
         },
-        /* @__PURE__ */ React5.createElement(
+        !showExpandRevoke && /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(
           "img",
           {
-            className: "cover-img position-absolute h-100 w-100 object-fit-cover z-1",
+            className: "cover-img position-absolute h-100 w-100 object-fit-cover",
             src: bg_default
           }
-        ),
-        /* @__PURE__ */ React5.createElement("div", { className: "minimize-shield position-relative z-2 py-2" }, /* @__PURE__ */ React5.createElement("img", { src: privacy_default, alt: "Shield of Privacy" }), t("txt_shield_of_privacy"))
+        ), /* @__PURE__ */ React5.createElement(
+          "div",
+          {
+            className: "minimize-shield",
+            onClick: () => {
+              setShowExpandRevoke(true);
+            }
+          },
+          /* @__PURE__ */ React5.createElement("img", { src: privacy_default, alt: "Shield of Privacy" }),
+          t("txt_shield_of_privacy")
+        )),
+        showExpandRevoke && /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(
+          "div",
+          {
+            className: `d-flex rounded-top align-items-center justify-content-between p-2 p-lg-3 fw-medium flex-wrap py-2 py-lg-3 px-4 header-consent-bg`,
+            style: {
+              borderBottom: "1px solid #DEDEDE"
+            }
+          },
+          /* @__PURE__ */ React5.createElement("div", { className: "text-primary text-nowrap" }, t("txt_tracking_data_privacy")),
+          /* @__PURE__ */ React5.createElement("div", { className: "d-flex align-items-center fs-14 text-primary" }, /* @__PURE__ */ React5.createElement(
+            "a",
+            {
+              href: "https://shield.aesirx.io/",
+              rel: "noreferrer",
+              target: "_blank",
+              className: "minimize-shield-wrapper position-relative text-decoration-none"
+            },
+            /* @__PURE__ */ React5.createElement(
+              "img",
+              {
+                className: "cover-img position-absolute h-100 w-100 object-fit-cover z-1",
+                src: bg_default
+              }
+            ),
+            /* @__PURE__ */ React5.createElement("div", { className: "minimize-shield position-relative z-2 py-2" }, /* @__PURE__ */ React5.createElement("img", { src: privacy_default, alt: "Shield of Privacy" }), t("txt_shield_of_privacy"))
+          ))
+        ), /* @__PURE__ */ React5.createElement(
+          "div",
+          {
+            className: "minimize-revoke",
+            onClick: () => {
+              setShowExpandRevoke(false);
+            }
+          },
+          /* @__PURE__ */ React5.createElement("img", { src: no_default })
+        ), /* @__PURE__ */ React5.createElement("div", { className: "p-3 bg-white" }, t("txt_you_can_revoke")), /* @__PURE__ */ React5.createElement(Form, { className: "mb-0 w-100 bg-white px-3" }, optInRevokes?.map((item, key) => {
+          return /* @__PURE__ */ React5.createElement(
+            Form.Check,
+            {
+              key,
+              id: `option-revoke-${item}`,
+              checked: revokeConsentOption === item,
+              type: "checkbox",
+              label: item === "aesirx-analytics-optin-default" ? t("txt_revoke_opt_in") : t("txt_revoke_opt_in") + " " + item?.replace("aesirx-analytics-optin-", ""),
+              value: item,
+              onChange: ({ target: { value } }) => {
+                setRevokeConsentOption(value);
+              }
+            }
+          );
+        })), /* @__PURE__ */ React5.createElement("div", { className: "rounded-bottom position-relative overflow-hidden bg-white" }, /* @__PURE__ */ React5.createElement("div", { className: "position-relative p-3" }, /* @__PURE__ */ React5.createElement("div", { className: "d-flex align-items-center flex-wrap" }, /* @__PURE__ */ React5.createElement("div", { className: "d-flex align-items-center w-100 justify-content-end" }, /* @__PURE__ */ React5.createElement(
+          "a",
+          {
+            className: "manage-consent fs-14 btn btn-outline-success rounded-pill py-2 py-lg-3 d-flex align-items-center justify-content-center w-100 w-lg-35",
+            href: "https://dapp.shield.aesirx.io/revoke-consent",
+            target: "_blank",
+            rel: "noreferrer"
+          },
+          t("txt_manage_consent")
+        ), /* @__PURE__ */ React5.createElement(
+          Button,
+          {
+            variant: "outline-success",
+            onClick: async () => {
+              if (revokeConsentOption) {
+                sessionStorage.removeItem(revokeConsentOption);
+                setShowExpandRevoke(false);
+                if (revokeConsentOption === `aesirx-analytics-optin-${optInReplace?.title}` || revokeConsentOption === "aesirx-analytics-optin-default") {
+                  setTimeout(() => {
+                    window.location.reload();
+                  }, 1e3);
+                }
+              }
+            },
+            className: "d-flex align-items-center justify-content-center w-100 w-lg-35 revoke-btn fs-14 rounded-pill py-2 py-lg-3"
+          },
+          t("txt_revoke_consent")
+        ))))))
       ))
-    ), /* @__PURE__ */ React5.createElement("div", { className: "p-4 pt-3 pb-0 bg-white" }, /* @__PURE__ */ React5.createElement("p", { className: "fw-semibold lh-160 text-primary mb-2" }, t("txt_payment_notice")), /* @__PURE__ */ React5.createElement("div", { className: "text-primary lh-160" }, t("txt_payment_1"), /* @__PURE__ */ React5.createElement("br", null), /* @__PURE__ */ React5.createElement("br", null), /* @__PURE__ */ React5.createElement(
-      "div",
-      {
-        dangerouslySetInnerHTML: {
-          __html: t("txt_payment_2", {
-            interpolation: { escapeValue: false }
-          })
-        }
+    )
+  )));
+};
+var OptIntConsentDetail = ({ optIn, setShowRevoke }) => {
+  const { t } = useTranslation();
+  const [show, setShow] = useState4(false);
+  const [showBackdrop, setShowBackdrop] = useState4(true);
+  const [showExpandConsent, setShowExpandConsent] = useState4(true);
+  const handleConsent = () => {
+    setShow(false);
+    setShowBackdrop(false);
+    sessionStorage.setItem(
+      optIn?.title ? `aesirx-analytics-optin-${optIn?.title}` : "aesirx-analytics-optin-default",
+      "true"
+    );
+    if (optIn?.replaceAnalyticsConsent) {
+      setShowRevoke(true);
+    }
+    optIn?.handleConsent && optIn?.handleConsent();
+    window?.funcAfterOptInConsent && window.funcAfterOptInConsent();
+    window?.optInConsentData && document.querySelector(`.opt-in-consent.${optIn?.title}`).classList.remove("show");
+  };
+  const handleClose = () => {
+    setShow(false);
+    setShowBackdrop(false);
+    if (optIn?.replaceAnalyticsConsent) {
+      setShowExpandConsent(false);
+      sessionStorage.setItem("aesirx-analytics-rejected", "true");
+    }
+    optIn?.handleReject && optIn?.handleReject();
+    window.funcAfterRejectOptIn && window.funcAfterRejectOptIn();
+    window?.optInConsentData && document.querySelector(`.opt-in-consent.${optIn?.title}`).classList.remove("show");
+  };
+  useEffect5(() => {
+    if (sessionStorage.getItem(`aesirx-analytics-optin-${optIn?.title}`) === "true" || sessionStorage.getItem("aesirx-analytics-optin-default") === "true") {
+      window.funcAfterOptInConsent && window.funcAfterOptInConsent();
+    }
+    if (optIn?.replaceAnalyticsConsent === "true") {
+      if (sessionStorage.getItem("aesirx-analytics-rejected") === "true") {
+        setShow(false);
+        setShowExpandConsent(false);
+      } else if (sessionStorage.getItem(`aesirx-analytics-optin-${optIn?.title}`) !== "true") {
+        setShow(true);
       }
-    ), /* @__PURE__ */ React5.createElement("br", null), t("txt_payment_3"), /* @__PURE__ */ React5.createElement("br", null), /* @__PURE__ */ React5.createElement("br", null), /* @__PURE__ */ React5.createElement(
+    }
+  }, []);
+  useEffect5(() => {
+    if (optIn?.show) {
+      setShow(true);
+    }
+  }, [optIn]);
+  return /* @__PURE__ */ React5.createElement(React5.Fragment, null, (show || optIn?.replaceAnalyticsConsent || window?.optInConsentData) && /* @__PURE__ */ React5.createElement(
+    "div",
+    {
+      className: `aesirxconsent opt-in-consent ${optIn?.title ?? ""} ${show ? "show" : ""} ${showExpandConsent ? "" : "show-minimize"}`
+    },
+    /* @__PURE__ */ React5.createElement("div", { className: `offcanvas-backdrop fade ${showBackdrop && show ? "show" : "d-none"}` }),
+    /* @__PURE__ */ React5.createElement(
       "div",
       {
-        dangerouslySetInnerHTML: {
-          __html: t("txt_payment_4", {
-            interpolation: { escapeValue: false }
-          })
-        }
-      }
-    ))), /* @__PURE__ */ React5.createElement("div", { className: "rounded-bottom position-relative overflow-hidden text-white bg-white" }, /* @__PURE__ */ React5.createElement("div", { className: "position-relative pt-2 pt-lg-3 p-3" }, /* @__PURE__ */ React5.createElement("div", { className: "d-flex align-items-center justify-content-between flex-wrap" }, /* @__PURE__ */ React5.createElement(
-      Button,
-      {
-        onClick: handleClose,
-        variant: "outline-success",
-        className: "border-2 fs-7 fw-bold text-primary rounded-pill py-13px px-5rem"
+        tabIndex: -1,
+        className: `toast-container position-fixed m-md-3 ${show ? "" : "opacity-0"}`
       },
-      t("txt_reject_consent")
-    ), /* @__PURE__ */ React5.createElement(
-      Button,
-      {
-        onClick: handleConsent,
-        variant: "outline-success",
-        className: "border-2 fs-7 fw-bold text-primary rounded-pill py-13px px-5rem"
-      },
-      t("txt_yes_i_consent")
-    )))))))
+      /* @__PURE__ */ React5.createElement(
+        "div",
+        {
+          className: `toast ${show ? "show" : ""} custom ${showExpandConsent ? "" : "minimize"}`
+        },
+        /* @__PURE__ */ React5.createElement("div", { className: "toast-body p-0 shadow mx-3 mx-md-0" }, !showExpandConsent && optIn?.replaceAnalyticsConsent ? /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement("div", { className: "minimize-shield-wrapper position-relative" }, /* @__PURE__ */ React5.createElement(
+          "img",
+          {
+            className: "cover-img position-absolute h-100 w-100 object-fit-cover",
+            src: bg_default
+          }
+        ), /* @__PURE__ */ React5.createElement(
+          "div",
+          {
+            className: "minimize-shield",
+            onClick: () => {
+              setShow(true);
+              setShowExpandConsent(true);
+              sessionStorage.removeItem("aesirx-analytics-rejected");
+            }
+          },
+          /* @__PURE__ */ React5.createElement("img", { src: privacy_default, alt: "Shield of Privacy" }),
+          t("txt_shield_of_privacy")
+        ))) : /* @__PURE__ */ React5.createElement("div", { className: "bg-white" }, /* @__PURE__ */ React5.createElement(
+          "div",
+          {
+            className: `d-flex rounded-top align-items-center justify-content-between p-2 p-lg-3 fw-medium flex-wrap py-2 py-lg-3 px-4 header-consent-bg`,
+            style: {
+              borderBottom: "1px solid #DEDEDE"
+            }
+          },
+          /* @__PURE__ */ React5.createElement("div", { className: "text-primary text-nowrap" }, t("txt_tracking_data_privacy")),
+          /* @__PURE__ */ React5.createElement("div", { className: "d-flex align-items-center fs-14 text-primary" }, /* @__PURE__ */ React5.createElement(
+            "a",
+            {
+              href: "https://shield.aesirx.io/",
+              rel: "noreferrer",
+              target: "_blank",
+              className: "minimize-shield-wrapper position-relative text-decoration-none"
+            },
+            /* @__PURE__ */ React5.createElement(
+              "img",
+              {
+                className: "cover-img position-absolute h-100 w-100 object-fit-cover z-1",
+                src: bg_default
+              }
+            ),
+            /* @__PURE__ */ React5.createElement("div", { className: "minimize-shield position-relative z-2 py-2" }, /* @__PURE__ */ React5.createElement("img", { src: privacy_default, alt: "Shield of Privacy" }), t("txt_shield_of_privacy"))
+          ))
+        ), /* @__PURE__ */ React5.createElement("div", { className: "p-4 pt-3 pb-0 bg-white" }, /* @__PURE__ */ React5.createElement(
+          "div",
+          {
+            dangerouslySetInnerHTML: {
+              __html: optIn?.content ?? ""
+            }
+          }
+        )), /* @__PURE__ */ React5.createElement("div", { className: "rounded-bottom position-relative overflow-hidden text-white bg-white" }, /* @__PURE__ */ React5.createElement("div", { className: "position-relative pt-2 pt-lg-3 p-3" }, /* @__PURE__ */ React5.createElement("div", { className: "d-flex align-items-center justify-content-between flex-wrap" }, /* @__PURE__ */ React5.createElement(
+          Button,
+          {
+            onClick: handleClose,
+            variant: "outline-success",
+            className: "border-2 fs-7 fw-bold text-primary rounded-pill"
+          },
+          t("txt_reject_consent")
+        ), /* @__PURE__ */ React5.createElement(
+          Button,
+          {
+            onClick: handleConsent,
+            variant: "outline-success",
+            className: "border-2 fs-7 fw-bold text-primary rounded-pill"
+          },
+          t("txt_yes_i_consent")
+        ))))))
+      )
+    )
   ));
 };
-var PaymentConsent_default = PaymentConsent;
+var OptInConsent_default = OptInConsent;
 export {
   AnalyticsContext,
   AnalyticsNext_default as AnalyticsNext,
   AnalyticsReact_default as AnalyticsReact,
-  PaymentConsent_default as PaymentConsent,
+  OptInConsent_default as OptInConsent,
   fingerprint_default as getFingerprint,
   trackEvent
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aesirx-analytics",
-  "version": "2.2.15",
+  "version": "2.2.17",
   "license": "GPL-3.0-only",
   "author": "AesirX",
   "repository": "https://gitlab.redweb.dk/aesirx/analytics",
@@ -14,7 +14,7 @@
     "@concordium/web-sdk": "^7.0.4-rc.3",
     "@web3modal/ethereum": "^2.7.0",
     "@web3modal/react": "^2.7.0",
-    "aesirx-sso": "^1.4.13",
+    "aesirx-sso": "^1.4.15",
     "axios": "^1.6.0",
     "bootstrap": "^5.3.2",
     "bowser": "^2.11.0",