@devgateway/dvz-ui-react/dist/esm/tracker/InternalTrafficToggle.js

A modular, embeddable React component library for data visualization and UI, built with TypeScript. Provides reusable components for charts, maps, dashboards, and more, with built-in support for internationalization and Redux integration.

import { jsx as o, jsxs as p } from "react/jsx-runtime";
import { useState as d, useEffect as y } from "react";
import { useSearchParams as S, useNavigate as h } from "react-router";
import { validateToken as v, setInternalTrafficCookie as x } from "./internalTrafficUtils.js";
const M = ({ token: l, redirectTo: c = "/" }) => {
  const [a] = S(), f = h(), [e, s] = d("validating"), [g, t] = d("Processing...");
  y(() => {
    const n = a.get("enable"), u = a.get("k");
    if (!v(u, l)) {
      s("error"), t("Invalid or missing token. Access denied."), console.error("Invalid token provided for internal traffic toggle");
      return;
    }
    if (n !== "0" && n !== "1") {
      s("error"), t("Invalid enable parameter. Use ?enable=0 or ?enable=1"), console.error("Invalid enable parameter:", n);
      return;
    }
    try {
      const r = n === "1";
      x(r), s("success"), t(
        r ? "✓ Internal traffic enabled. GA4 events will be tagged as internal." : "✓ Internal traffic disabled. GA4 events will be tagged as external."
      ), console.log(`Internal traffic ${r ? "enabled" : "disabled"} successfully`), setTimeout(() => {
        f(c);
      }, 3e3);
    } catch (r) {
      s("error"), t(`Error: ${r instanceof Error ? r.message : "Unknown error"}`), console.error("Error setting internal traffic cookie:", r);
    }
  }, [a, l, f, c]);
  const m = {
    display: "flex",
    justifyContent: "center",
    alignItems: "center",
    minHeight: "100vh",
    fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif'
  }, i = {
    textAlign: "center",
    padding: "2rem",
    borderRadius: "8px",
    boxShadow: "0 2px 8px rgba(0, 0, 0, 0.1)",
    maxWidth: "500px"
  }, b = e === "success" ? {
    ...i,
    backgroundColor: "#f0f9ff",
    borderLeft: "4px solid #10b981"
  } : e === "error" ? {
    ...i,
    backgroundColor: "#fef2f2",
    borderLeft: "4px solid #ef4444"
  } : {
    ...i,
    backgroundColor: "#f3f4f6",
    borderLeft: "4px solid #3b82f6"
  };
  return /* @__PURE__ */ o("div", { style: m, children: /* @__PURE__ */ p("div", { style: b, children: [
    /* @__PURE__ */ o("h1", { style: {
      fontSize: "1.5rem",
      fontWeight: "600",
      margin: "0 0 1rem 0",
      color: e === "success" ? "#059669" : e === "error" ? "#dc2626" : "#1f2937"
    }, children: e === "success" ? "Success" : e === "error" ? "Error" : "Processing" }),
    /* @__PURE__ */ o("p", { style: {
      fontSize: "1rem",
      margin: "1rem 0",
      color: e === "success" ? "#047857" : e === "error" ? "#991b1b" : "#374151",
      lineHeight: "1.5"
    }, children: g }),
    e === "success" && /* @__PURE__ */ o("p", { style: {
      fontSize: "0.875rem",
      color: "#6b7280",
      marginTop: "1.5rem",
      fontStyle: "italic"
    }, children: "Redirecting to home page in 3 seconds..." })
  ] }) });
};
export {
  M as default
};