@healthya-team/pharmacy-analytics 1.0.0 → 1.0.1

package/dist/studio/index.js

@@ -70,7 +70,7 @@ module.exports = __toCommonJS(studio_exports);
 var import_lucide_react5 = require("lucide-react");
 
 // src/studio/components/UnifiedDashboard.tsx
-var import_react11 = require("react");
+var import_react12 = require("react");
 var import_lucide_react4 = require("lucide-react");
 
 // src/studio/utils-ga-api.ts
@@ -364,6 +364,43 @@ var fDur = (s) => {
 };
 var fPct = (v) => `${(v * 100).toFixed(1)}%`;
 var fEngPct = (v) => `${(v * 100).toFixed(0)}%`;
+var MONTH_NAMES = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+var evenTickInterval = (count, maxTicks = 8) => Math.max(0, Math.ceil(count / maxTicks) - 1);
+var formatDateTick = (v) => {
+  if (!v || typeof v !== "string") return "";
+  if (v.length === 10 && v[4] === "-" && v[7] === "-") {
+    const m = parseInt(v.slice(5, 7), 10) - 1;
+    const d = parseInt(v.slice(8, 10), 10);
+    return `${d} ${MONTH_NAMES[m] || v.slice(5, 7)}`;
+  }
+  if (v.length === 8 && !v.includes("-") && !v.includes("/")) {
+    const m = parseInt(v.slice(4, 6), 10) - 1;
+    const d = parseInt(v.slice(6, 8), 10);
+    return `${d} ${MONTH_NAMES[m] || v.slice(4, 6)}`;
+  }
+  if (v.length === 5 && v[2] === "/") {
+    const m = parseInt(v.slice(0, 2), 10) - 1;
+    const d = parseInt(v.slice(3, 5), 10);
+    return `${d} ${MONTH_NAMES[m] || v.slice(0, 2)}`;
+  }
+  return v;
+};
+var formatTooltipDate = (v) => {
+  if (typeof v !== "string") return typeof v === "number" ? String(v) : "";
+  if (v.length === 10 && v[4] === "-" && v[7] === "-") {
+    const y = v.slice(0, 4);
+    const m = parseInt(v.slice(5, 7), 10) - 1;
+    const d = parseInt(v.slice(8, 10), 10);
+    return `${d} ${MONTH_NAMES[m] || v.slice(5, 7)} ${y}`;
+  }
+  if (v.length === 8 && !v.includes("-") && !v.includes("/")) {
+    const y = v.slice(0, 4);
+    const m = parseInt(v.slice(4, 6), 10) - 1;
+    const d = parseInt(v.slice(6, 8), 10);
+    return `${d} ${MONTH_NAMES[m] || v.slice(4, 6)} ${y}`;
+  }
+  return v;
+};
 var GLOBAL_CSS = `
 @keyframes ga-spin   { to { transform: rotate(360deg); } }
 @keyframes ga-pulse  { 0%,100%{box-shadow:0 0 0 3px rgba(62,207,142,.3)} 50%{box-shadow:0 0 0 7px rgba(62,207,142,.08)} }
@@ -376,13 +413,14 @@ var GLOBAL_CSS = `
 .ga-tooltip-wrap { position:relative; display:inline-flex; align-items:center; }
 .ga-tooltip-wrap .ga-tip {
   visibility:hidden; opacity:0; pointer-events:none;
-  position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%);
+  position:absolute; bottom:calc(100% + 6px); right:-6px;
   background:#1e293b; color:#f1f5f9; font-size:12px; line-height:1.5;
   padding:8px 12px; border-radius:7px; white-space:normal; width:220px;
+  max-width:calc(100vw - 32px);
   box-shadow:0 4px 16px rgba(0,0,0,.18); z-index:9999; transition:opacity .15s;
 }
 .ga-tooltip-wrap .ga-tip::after {
-  content:''; position:absolute; top:100%; left:50%; transform:translateX(-50%);
+  content:''; position:absolute; top:100%; right:10px;
   border:5px solid transparent; border-top-color:#1e293b;
 }
 .ga-tooltip-wrap:hover .ga-tip { visibility:visible; opacity:1; }
@@ -400,13 +438,84 @@ var GLOBAL_CSS = `
 `;
 
 // src/studio/components/shared-ui.tsx
+var import_react = require("react");
+var import_react_dom = require("react-dom");
 var import_recharts = require("recharts");
 var import_jsx_runtime = require("react/jsx-runtime");
 function InfoIcon({ text }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "ga-tooltip-wrap", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "ga-info-btn", tabIndex: -1, children: "i" }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "ga-tip", children: text })
-  ] });
+  const triggerRef = (0, import_react.useRef)(null);
+  const [tip, setTip] = (0, import_react.useState)(null);
+  const show = () => {
+    const el = triggerRef.current;
+    if (!el || typeof window === "undefined") return;
+    const rect = el.getBoundingClientRect();
+    const placeBelow = rect.top < 100;
+    const tipWidth = 230;
+    const pad = 12;
+    const centerX = rect.left + rect.width / 2;
+    const clampedLeft = Math.max(
+      tipWidth / 2 + pad,
+      Math.min(centerX, window.innerWidth - tipWidth / 2 - pad)
+    );
+    setTip({
+      top: placeBelow ? rect.bottom + 8 : rect.top - 8,
+      left: clampedLeft,
+      placement: placeBelow ? "bottom" : "top"
+    });
+  };
+  const hide = () => setTip(null);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "span",
+    {
+      className: "ga-tooltip-wrap",
+      onMouseEnter: show,
+      onMouseLeave: hide,
+      style: { position: "relative", display: "inline-flex", alignItems: "center" },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "button",
+          {
+            ref: triggerRef,
+            className: "ga-info-btn",
+            tabIndex: -1,
+            type: "button",
+            onFocus: show,
+            onBlur: hide,
+            children: "i"
+          }
+        ),
+        tip && typeof document !== "undefined" && (0, import_react_dom.createPortal)(
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "div",
+            {
+              style: {
+                position: "fixed",
+                top: tip.top,
+                left: tip.left,
+                transform: tip.placement === "top" ? "translate(-50%, -100%)" : "translate(-50%, 0)",
+                width: 230,
+                background: "#0f172a",
+                color: "#f8fafc",
+                fontSize: 12,
+                lineHeight: 1.45,
+                padding: "8px 12px",
+                borderRadius: 8,
+                boxShadow: "0 10px 25px -5px rgba(0,0,0,0.3), 0 8px 10px -6px rgba(0,0,0,0.2)",
+                border: "1px solid #334155",
+                pointerEvents: "none",
+                zIndex: 99999,
+                wordWrap: "break-word",
+                whiteSpace: "normal",
+                fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'
+              },
+              children: text
+            }
+          ),
+          document.body
+        )
+      ]
+    }
+  );
 }
 function Skel({
   w,
@@ -811,11 +920,11 @@ function OverviewTab({ data, loading }) {
 }
 
 // src/studio/tabs/traffic-tab.tsx
-var import_react = require("react");
+var import_react2 = require("react");
 var import_recharts2 = require("recharts");
 var import_jsx_runtime3 = require("react/jsx-runtime");
 function TrafficTab({ data, loading }) {
-  const channelBar = (0, import_react.useMemo)(
+  const channelBar = (0, import_react2.useMemo)(
     () => data.channels.map((c) => ({
       name: c.channel,
       Sessions: c.sessions,
@@ -841,7 +950,11 @@ function TrafficTab({ data, loading }) {
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
             import_recharts2.XAxis,
             {
-              dataKey: "displayDate",
+              dataKey: "date",
+              tickFormatter: formatDateTick,
+              minTickGap: 28,
+              interval: evenTickInterval(data.timeSeries?.length ?? 0),
+              padding: { left: 2, right: 15 },
               fontSize: 11,
               tick: { fill: "#94a3b8" },
               axisLine: false,
@@ -861,6 +974,7 @@ function TrafficTab({ data, loading }) {
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
             import_recharts2.Tooltip,
             {
+              labelFormatter: formatTooltipDate,
               contentStyle: {
                 background: "#fff",
                 border: "1px solid #e2e8f0",
@@ -1157,7 +1271,7 @@ function GeographyTab({ data, loading }) {
 }
 
 // src/studio/tabs/events-tab.tsx
-var import_react2 = require("react");
+var import_react3 = require("react");
 
 // src/studio/sanity-client-shim.ts
 var projectId = typeof process !== "undefined" ? process.env.SANITY_STUDIO_PROJECT_ID || process.env.NEXT_PUBLIC_SANITY_PROJECT_ID || "" : "";
@@ -1190,16 +1304,16 @@ function EventsTab({
   apiUrl,
   dateRange
 }) {
-  const [selectedEvent, setSelectedEvent] = (0, import_react2.useState)(null);
-  const [paramRows, setParamRows] = (0, import_react2.useState)([]);
-  const [paramsLoading, setParamsLoading] = (0, import_react2.useState)(false);
-  const [paramsError, setParamsError] = (0, import_react2.useState)(null);
-  const [conditionValues, setConditionValues] = (0, import_react2.useState)([]);
-  const [selectedCondition, setSelectedCondition] = (0, import_react2.useState)(null);
-  const [filteredEvents, setFilteredEvents] = (0, import_react2.useState)(null);
-  const [filterLoading, setFilterLoading] = (0, import_react2.useState)(false);
-  const [pharmacyNameMap, setPharmacyNameMap] = (0, import_react2.useState)({});
-  (0, import_react2.useEffect)(() => {
+  const [selectedEvent, setSelectedEvent] = (0, import_react3.useState)(null);
+  const [paramRows, setParamRows] = (0, import_react3.useState)([]);
+  const [paramsLoading, setParamsLoading] = (0, import_react3.useState)(false);
+  const [paramsError, setParamsError] = (0, import_react3.useState)(null);
+  const [conditionValues, setConditionValues] = (0, import_react3.useState)([]);
+  const [selectedCondition, setSelectedCondition] = (0, import_react3.useState)(null);
+  const [filteredEvents, setFilteredEvents] = (0, import_react3.useState)(null);
+  const [filterLoading, setFilterLoading] = (0, import_react3.useState)(false);
+  const [pharmacyNameMap, setPharmacyNameMap] = (0, import_react3.useState)({});
+  (0, import_react3.useEffect)(() => {
     sanityClient.fetch(`*[_type == "pharmacies"]{corporateId, name}`).then((pharmacies) => {
       const map = {};
       for (const p of pharmacies) {
@@ -1208,7 +1322,7 @@ function EventsTab({
       setPharmacyNameMap(map);
     }).catch((err) => console.error("[EventsTab] fetchPharmacies error:", err));
   }, []);
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     let cancelled = false;
     fetchConditionValues(apiUrl, dateRange).then((values) => {
       if (!cancelled) setConditionValues(values);
@@ -1217,7 +1331,7 @@ function EventsTab({
       cancelled = true;
     };
   }, [apiUrl, dateRange]);
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     if (!selectedCondition) {
       setFilteredEvents(null);
       return;
@@ -1236,7 +1350,7 @@ function EventsTab({
       cancelled = true;
     };
   }, [selectedCondition, apiUrl, dateRange]);
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     if (!selectedEvent) {
       setParamRows([]);
       return;
@@ -1256,7 +1370,7 @@ function EventsTab({
       cancelled = true;
     };
   }, [selectedEvent, apiUrl, dateRange]);
-  const displayEvents = (0, import_react2.useMemo)(
+  const displayEvents = (0, import_react3.useMemo)(
     () => filteredEvents ?? data.topEvents,
     [filteredEvents, data.topEvents]
   );
@@ -1442,7 +1556,7 @@ function AcquisitionTab({ data, loading }) {
 }
 
 // src/studio/tabs/conditions-products-tab.tsx
-var import_react3 = require("react");
+var import_react4 = require("react");
 var import_recharts3 = require("recharts");
 
 // src/studio/utils-mixpanel-api.ts
@@ -1551,18 +1665,30 @@ async function fetchPmProductCart(apiUrl, dateRange, conditionId, product, signa
   }
   return res.json();
 }
+async function parseJsonResponse(res, label, url) {
+  const text = await res.text();
+  if (!res.ok) {
+    let msg = `${label} API error: ${res.status} ${res.statusText}`;
+    try {
+      const err = JSON.parse(text);
+      if (err?.error) msg = err.error;
+    } catch {
+    }
+    throw new Error(msg);
+  }
+  if (/^\s*<(!doctype|html)/i.test(text)) {
+    throw new Error(
+      `${label} API (${url}) returned HTML instead of JSON. Check the Mixpanel API URL (mixpanelApiUrl) points at the /api/mixpanel route.`
+    );
+  }
+  return JSON.parse(text);
+}
 async function fetchTopEntities(apiUrl, dateRange, opts, signal) {
   let url = `${apiUrl}?mode=top-entities&dateRange=${dateRange}`;
   if (opts?.condition) url += `&condition=${encodeURIComponent(opts.condition)}`;
   if (opts?.product) url += `&product=${encodeURIComponent(opts.product)}`;
   const res = await fetch(url, { cache: "no-store", signal });
-  if (!res.ok) {
-    const err = await res.json().catch(() => null);
-    throw new Error(
-      err?.error || `Top entities API error: ${res.status} ${res.statusText}`
-    );
-  }
-  const json = await res.json();
+  const json = await parseJsonResponse(res, "Top entities", url);
   return {
     conditions: json.conditions ?? [],
     products: json.products ?? [],
@@ -1573,13 +1699,7 @@ async function fetchTopEntities(apiUrl, dateRange, opts, signal) {
 async function fetchTopSearches(apiUrl, dateRange, type, signal) {
   const url = `${apiUrl}?mode=top-searches&dateRange=${dateRange}&type=${type}`;
   const res = await fetch(url, { cache: "no-store", signal });
-  if (!res.ok) {
-    const err = await res.json().catch(() => null);
-    throw new Error(
-      err?.error || `Top searches API error: ${res.status} ${res.statusText}`
-    );
-  }
-  const json = await res.json();
+  const json = await parseJsonResponse(res, "Top searches", url);
   return { topSearches: json.topSearches ?? [] };
 }
 async function clearMixpanelCache(apiUrl) {
@@ -1735,22 +1855,23 @@ function EmptyState({ label }) {
     }
   );
 }
-function ConditionsProductsTab({ dateRange }) {
-  const [subTab, setSubTab] = (0, import_react3.useState)("conditions");
-  const [data, setData] = (0, import_react3.useState)(null);
-  const [loading, setLoading] = (0, import_react3.useState)(true);
-  const [error, setError] = (0, import_react3.useState)(null);
-  const [fetchTick] = (0, import_react3.useState)(0);
-  const [topConditionSearches, setTopConditionSearches] = (0, import_react3.useState)(null);
-  const [topConditionSearchesLoading, setTopConditionSearchesLoading] = (0, import_react3.useState)(true);
-  const [conditionSearchVisible, setConditionSearchVisible] = (0, import_react3.useState)(20);
-  const [topProductSearches, setTopProductSearches] = (0, import_react3.useState)(null);
-  const [topProductSearchesLoading, setTopProductSearchesLoading] = (0, import_react3.useState)(true);
-  const [productSearchVisible, setProductSearchVisible] = (0, import_react3.useState)(20);
-  (0, import_react3.useEffect)(() => {
+function ConditionsProductsTab({ apiUrl, dateRange }) {
+  const targetUrl = apiUrl || MIXPANEL_API_URL;
+  const [subTab, setSubTab] = (0, import_react4.useState)("conditions");
+  const [data, setData] = (0, import_react4.useState)(null);
+  const [loading, setLoading] = (0, import_react4.useState)(true);
+  const [error, setError] = (0, import_react4.useState)(null);
+  const [fetchTick] = (0, import_react4.useState)(0);
+  const [topConditionSearches, setTopConditionSearches] = (0, import_react4.useState)(null);
+  const [topConditionSearchesLoading, setTopConditionSearchesLoading] = (0, import_react4.useState)(true);
+  const [conditionSearchVisible, setConditionSearchVisible] = (0, import_react4.useState)(20);
+  const [topProductSearches, setTopProductSearches] = (0, import_react4.useState)(null);
+  const [topProductSearchesLoading, setTopProductSearchesLoading] = (0, import_react4.useState)(true);
+  const [productSearchVisible, setProductSearchVisible] = (0, import_react4.useState)(20);
+  (0, import_react4.useEffect)(() => {
     const controller = new AbortController();
     setTopConditionSearchesLoading(true);
-    fetchTopSearches(MIXPANEL_API_URL, dateRange, "condition", controller.signal).then((res) => {
+    fetchTopSearches(targetUrl, dateRange, "condition", controller.signal).then((res) => {
       if (!controller.signal.aborted) setTopConditionSearches(res);
     }).catch((err) => {
       if (err instanceof Error && err.name === "AbortError") return;
@@ -1758,11 +1879,11 @@ function ConditionsProductsTab({ dateRange }) {
       if (!controller.signal.aborted) setTopConditionSearchesLoading(false);
     });
     return () => controller.abort();
-  }, [dateRange, fetchTick]);
-  (0, import_react3.useEffect)(() => {
+  }, [targetUrl, dateRange, fetchTick]);
+  (0, import_react4.useEffect)(() => {
     const controller = new AbortController();
     setTopProductSearchesLoading(true);
-    fetchTopSearches(MIXPANEL_API_URL, dateRange, "product", controller.signal).then((res) => {
+    fetchTopSearches(targetUrl, dateRange, "product", controller.signal).then((res) => {
       if (!controller.signal.aborted) setTopProductSearches(res);
     }).catch((err) => {
       if (err instanceof Error && err.name === "AbortError") return;
@@ -1770,12 +1891,12 @@ function ConditionsProductsTab({ dateRange }) {
       if (!controller.signal.aborted) setTopProductSearchesLoading(false);
     });
     return () => controller.abort();
-  }, [dateRange, fetchTick]);
-  (0, import_react3.useEffect)(() => {
+  }, [targetUrl, dateRange, fetchTick]);
+  (0, import_react4.useEffect)(() => {
     const controller = new AbortController();
     setLoading(true);
     setError(null);
-    fetchTopEntities(MIXPANEL_API_URL, dateRange, void 0, controller.signal).then((res) => {
+    fetchTopEntities(targetUrl, dateRange, void 0, controller.signal).then((res) => {
       if (!controller.signal.aborted) setData(res);
     }).catch((err) => {
       if (err instanceof Error && err.name === "AbortError") return;
@@ -1784,12 +1905,12 @@ function ConditionsProductsTab({ dateRange }) {
       if (!controller.signal.aborted) setLoading(false);
     });
     return () => controller.abort();
-  }, [dateRange, fetchTick]);
-  const conditionBarData = (0, import_react3.useMemo)(
+  }, [targetUrl, dateRange, fetchTick]);
+  const conditionBarData = (0, import_react4.useMemo)(
     () => [...data?.conditions ?? []].sort((a, b) => b.condition_viewed - a.condition_viewed).filter((c) => c.condition_viewed > 0).slice(0, 12).map((c) => ({ fullName: c.name, name: shortLabel(c.name), Views: c.condition_viewed })),
     [data]
   );
-  const pieData = (0, import_react3.useMemo)(() => {
+  const pieData = (0, import_react4.useMemo)(() => {
     const sb = data?.serviceBreakdown ?? { nhs: 0, private_service: 0, private_medication: 0 };
     return [
       { name: "NHS", value: sb.nhs, color: SERVICE_COLORS["NHS"] },
@@ -1797,7 +1918,7 @@ function ConditionsProductsTab({ dateRange }) {
       { name: "Private Medication", value: sb.private_medication, color: SERVICE_COLORS["Private Medication"] }
     ].filter((e) => e.value > 0);
   }, [data]);
-  const productBarData = (0, import_react3.useMemo)(
+  const productBarData = (0, import_react4.useMemo)(
     () => [...data?.products ?? []].sort((a, b) => b.product_viewed - a.product_viewed).filter((p) => p.product_viewed > 0).slice(0, 12).map((p) => ({ fullName: p.name, name: shortLabel(p.name), Views: p.product_viewed })),
     [data]
   );
@@ -1830,6 +1951,7 @@ function ConditionsProductsTab({ dateRange }) {
     border: "1px solid #e2e8f0",
     boxShadow: "0 4px 16px rgba(0,0,0,.08)"
   };
+  const barTooltipLabelStyle = { color: "#0f172a", fontWeight: 600 };
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { style: { animation: "ga-fadein .25s ease", display: "flex", flexDirection: "column", gap: 20 }, children: [
     /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       "div",
@@ -1941,6 +2063,7 @@ function ConditionsProductsTab({ dateRange }) {
                             formatter: (v) => [fNum(Number(v ?? 0)), "Views"],
                             labelFormatter: (label, payload) => payload?.[0]?.payload?.fullName ?? label,
                             contentStyle: barTooltipStyle,
+                            labelStyle: barTooltipLabelStyle,
                             cursor: { fill: "rgba(99,102,241,0.06)" }
                           }
                         ),
@@ -2197,6 +2320,7 @@ function ConditionsProductsTab({ dateRange }) {
                       formatter: (v) => [fNum(Number(v ?? 0)), "Views"],
                       labelFormatter: (label, payload) => payload?.[0]?.payload?.fullName ?? label,
                       contentStyle: barTooltipStyle,
+                      labelStyle: barTooltipLabelStyle,
                       cursor: { fill: "rgba(99,102,241,0.06)" }
                     }
                   ),
@@ -2250,10 +2374,10 @@ function ConditionsProductsTab({ dateRange }) {
 }
 
 // src/studio/funnel/funnel-events-tab.tsx
-var import_react7 = require("react");
+var import_react8 = require("react");
 
 // src/studio/funnel/custom-select.tsx
-var import_react4 = require("react");
+var import_react5 = require("react");
 var import_jsx_runtime10 = require("react/jsx-runtime");
 function CustomSelect({
   label,
@@ -2264,16 +2388,16 @@ function CustomSelect({
   loading,
   onChange
 }) {
-  const [open, setOpen] = (0, import_react4.useState)(false);
-  const [search, setSearch] = (0, import_react4.useState)("");
-  const ref = (0, import_react4.useRef)(null);
-  const searchRef = (0, import_react4.useRef)(null);
-  const selected = (0, import_react4.useMemo)(() => options.find((o) => o.value === value), [options, value]);
-  const filtered = (0, import_react4.useMemo)(
+  const [open, setOpen] = (0, import_react5.useState)(false);
+  const [search, setSearch] = (0, import_react5.useState)("");
+  const ref = (0, import_react5.useRef)(null);
+  const searchRef = (0, import_react5.useRef)(null);
+  const selected = (0, import_react5.useMemo)(() => options.find((o) => o.value === value), [options, value]);
+  const filtered = (0, import_react5.useMemo)(
     () => search.trim() ? options.filter((o) => o.label.toLowerCase().includes(search.toLowerCase())) : options,
     [options, search]
   );
-  (0, import_react4.useEffect)(() => {
+  (0, import_react5.useEffect)(() => {
     if (!open) return;
     function handler(e) {
       if (ref.current && !ref.current.contains(e.target)) setOpen(false);
@@ -2281,11 +2405,11 @@ function CustomSelect({
     document.addEventListener("mousedown", handler);
     return () => document.removeEventListener("mousedown", handler);
   }, [open]);
-  (0, import_react4.useEffect)(() => {
+  (0, import_react5.useEffect)(() => {
     if (open) setTimeout(() => searchRef.current?.focus(), 40);
     else setSearch("");
   }, [open]);
-  const handleSelect = (0, import_react4.useCallback)(
+  const handleSelect = (0, import_react5.useCallback)(
     (val) => {
       onChange(val);
       setOpen(false);
@@ -2510,9 +2634,9 @@ function CustomSelect({
 }
 
 // src/studio/funnel/patient-modal.tsx
-var import_react5 = __toESM(require("react"));
+var import_react6 = __toESM(require("react"));
 var import_jsx_runtime11 = require("react/jsx-runtime");
-var PatientModal = import_react5.default.memo(function PatientModal2({
+var PatientModal = import_react6.default.memo(function PatientModal2({
   open,
   onClose,
   loading,
@@ -2523,7 +2647,7 @@ var PatientModal = import_react5.default.memo(function PatientModal2({
   pharmacyNameMap,
   onExport
 }) {
-  const formattedRecords = (0, import_react5.useMemo)(
+  const formattedRecords = (0, import_react6.useMemo)(
     () => records.map((p) => ({
       ...p,
       _date: p.timestamp ? new Date(p.timestamp * 1e3).toLocaleDateString("en-GB", {
@@ -2839,7 +2963,7 @@ var PatientModal = import_react5.default.memo(function PatientModal2({
 });
 
 // src/studio/funnel/funnel-card.tsx
-var import_react6 = require("react");
+var import_react7 = require("react");
 
 // src/studio/funnel/card-sections.tsx
 var import_jsx_runtime12 = require("react/jsx-runtime");
@@ -3413,18 +3537,18 @@ function FunnelCard({
 }) {
   const color = FUNNEL_EVENT_COLOR[r.event] ?? "#888";
   const isQfs = r.event === "questionnaire_flow_step";
-  const breakdown = (0, import_react6.useMemo)(
+  const breakdown = (0, import_react7.useMemo)(
     () => !isQfs && r.event !== "condition_viewed" ? paramBreakdowns[r.event] : void 0,
     [isQfs, paramBreakdowns, r.event]
   );
-  const filteredBreakdownEntries = (0, import_react6.useMemo)(
+  const filteredBreakdownEntries = (0, import_react7.useMemo)(
     () => breakdown ? Object.entries(breakdown).filter(
       ([pk]) => pk !== "condition_slug" && pk !== "date_of_birth" && pk !== "is_pre_consult" && !(r.event === "start_assessment_clicked" && pk === "is_nhs")
     ) : [],
     [breakdown, r.event]
   );
   const hasBreakdown = filteredBreakdownEntries.length > 0;
-  const visibleFlows = (0, import_react6.useMemo)(
+  const visibleFlows = (0, import_react7.useMemo)(
     () => isQfs ? qfsFlows.filter((f) => f.steps.some((s) => s.count > 0)) : [],
     [isQfs, qfsFlows]
   );
@@ -3638,28 +3762,29 @@ function FunnelCard({
 
 // src/studio/funnel/funnel-events-tab.tsx
 var import_jsx_runtime14 = require("react/jsx-runtime");
-function FunnelEventsTab({ dateRange }) {
-  const [loading, setLoading] = (0, import_react7.useState)(false);
-  const [error, setError] = (0, import_react7.useState)(null);
-  const [refreshKey, setRefreshKey] = (0, import_react7.useState)(0);
-  const [clearing, setClearing] = (0, import_react7.useState)(false);
-  const [conditionOptions, setConditionOptions] = (0, import_react7.useState)([]);
-  const [selectedCondition, setSelectedCondition] = (0, import_react7.useState)("");
-  const [conditionsLoading, setConditionsLoading] = (0, import_react7.useState)(true);
-  const [rows, setRows] = (0, import_react7.useState)([]);
-  const [qfsFlows, setQfsFlows] = (0, import_react7.useState)([]);
-  const [paramBreakdowns, setParamBreakdowns] = (0, import_react7.useState)({});
-  const [qfsStepBreakdowns, setQfsStepBreakdowns] = (0, import_react7.useState)({});
-  const [conditionServiceMap, setConditionServiceMap] = (0, import_react7.useState)({});
-  const [patientModalOpen, setPatientModalOpen] = (0, import_react7.useState)(false);
-  const [patientRecords, setPatientRecords] = (0, import_react7.useState)([]);
-  const [patientsLoading, setPatientsLoading] = (0, import_react7.useState)(false);
-  const [patientsError, setPatientsError] = (0, import_react7.useState)(null);
-  const doFetchPatients = (0, import_react7.useCallback)(() => {
+function FunnelEventsTab({ apiUrl, dateRange }) {
+  const targetUrl = apiUrl || MIXPANEL_API_URL;
+  const [loading, setLoading] = (0, import_react8.useState)(false);
+  const [error, setError] = (0, import_react8.useState)(null);
+  const [refreshKey, setRefreshKey] = (0, import_react8.useState)(0);
+  const [clearing, setClearing] = (0, import_react8.useState)(false);
+  const [conditionOptions, setConditionOptions] = (0, import_react8.useState)([]);
+  const [selectedCondition, setSelectedCondition] = (0, import_react8.useState)("");
+  const [conditionsLoading, setConditionsLoading] = (0, import_react8.useState)(true);
+  const [rows, setRows] = (0, import_react8.useState)([]);
+  const [qfsFlows, setQfsFlows] = (0, import_react8.useState)([]);
+  const [paramBreakdowns, setParamBreakdowns] = (0, import_react8.useState)({});
+  const [qfsStepBreakdowns, setQfsStepBreakdowns] = (0, import_react8.useState)({});
+  const [conditionServiceMap, setConditionServiceMap] = (0, import_react8.useState)({});
+  const [patientModalOpen, setPatientModalOpen] = (0, import_react8.useState)(false);
+  const [patientRecords, setPatientRecords] = (0, import_react8.useState)([]);
+  const [patientsLoading, setPatientsLoading] = (0, import_react8.useState)(false);
+  const [patientsError, setPatientsError] = (0, import_react8.useState)(null);
+  const doFetchPatients = (0, import_react8.useCallback)(() => {
     if (!selectedCondition) return;
     setPatientsLoading(true);
     setPatientsError(null);
-    fetchSignupPatients(MIXPANEL_API_URL, dateRange, selectedCondition).then((records) => {
+    fetchSignupPatients(targetUrl, dateRange, selectedCondition).then((records) => {
       setPatientRecords(records);
       setPatientsLoading(false);
     }).catch((err) => {
@@ -3667,18 +3792,18 @@ function FunnelEventsTab({ dateRange }) {
       setPatientsError(err instanceof Error ? err.message : String(err));
       setPatientsLoading(false);
     });
-  }, [dateRange, selectedCondition]);
-  const handleSignupCountClick = (0, import_react7.useCallback)(() => {
+  }, [targetUrl, dateRange, selectedCondition]);
+  const handleSignupCountClick = (0, import_react8.useCallback)(() => {
     if (!selectedCondition) return;
     setPatientModalOpen(true);
     doFetchPatients();
   }, [selectedCondition, doFetchPatients]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (patientModalOpen && refreshKey > 0) {
       doFetchPatients();
     }
   }, [refreshKey]);
-  const exportPatientsCSV = (0, import_react7.useCallback)(() => {
+  const exportPatientsCSV = (0, import_react8.useCallback)(() => {
     if (!patientRecords.length) return;
     const headers = [
       "Date",
@@ -3721,11 +3846,11 @@ function FunnelEventsTab({ dateRange }) {
     a.click();
     URL.revokeObjectURL(url);
   }, [patientRecords, selectedCondition]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     const controller = new AbortController();
     setConditionsLoading(true);
     setSelectedCondition("");
-    fetchFunnelConditions(MIXPANEL_API_URL, dateRange, void 0, true, controller.signal).then((values) => {
+    fetchFunnelConditions(targetUrl, dateRange, void 0, true, controller.signal).then((values) => {
       setConditionOptions(values);
       setConditionsLoading(false);
     }).catch((err) => {
@@ -3744,8 +3869,8 @@ function FunnelEventsTab({ dateRange }) {
       setConditionServiceMap(map);
     }).catch((err) => console.error("[FunnelEventsTab] fetchConditionServices error:", err));
     return () => controller.abort();
-  }, [dateRange, refreshKey]);
-  (0, import_react7.useEffect)(() => {
+  }, [targetUrl, dateRange, refreshKey]);
+  (0, import_react8.useEffect)(() => {
     if (!selectedCondition) {
       setRows([]);
       setQfsFlows([]);
@@ -3757,7 +3882,7 @@ function FunnelEventsTab({ dateRange }) {
     const controller = new AbortController();
     setLoading(true);
     setError(null);
-    fetchFunnelEvents(MIXPANEL_API_URL, dateRange, selectedCondition, void 0, controller.signal).then((data) => {
+    fetchFunnelEvents(targetUrl, dateRange, selectedCondition, void 0, controller.signal).then((data) => {
       const { eventCounts, qfsStepsByFlow, paramBreakdowns: bd, qfsStepBreakdowns: qfsStepBd } = data;
       setParamBreakdowns(bd);
       setQfsStepBreakdowns(qfsStepBd ?? {});
@@ -3780,19 +3905,19 @@ function FunnelEventsTab({ dateRange }) {
       setLoading(false);
     });
     return () => controller.abort();
-  }, [dateRange, selectedCondition, refreshKey]);
-  const qfsTotal = (0, import_react7.useMemo)(
+  }, [targetUrl, dateRange, selectedCondition, refreshKey]);
+  const qfsTotal = (0, import_react8.useMemo)(
     () => qfsFlows.reduce((sum, f) => sum + (f.steps[0]?.count ?? 0), 0),
     [qfsFlows]
   );
-  const allRows = (0, import_react7.useMemo)(
+  const allRows = (0, import_react8.useMemo)(
     () => [
       ...rows.filter((r) => !r.isStep),
       { event: "questionnaire_flow_step", label: "Pre Consult Journey", count: qfsTotal, isStep: false }
     ],
     [rows, qfsTotal]
   );
-  const conditionSelectOptions = (0, import_react7.useMemo)(
+  const conditionSelectOptions = (0, import_react8.useMemo)(
     () => conditionOptions.map((c) => {
       const svc = conditionServiceMap[String(c.id)];
       return {
@@ -3804,21 +3929,21 @@ function FunnelEventsTab({ dateRange }) {
     }),
     [conditionOptions, conditionServiceMap]
   );
-  const handleClearFilters = (0, import_react7.useCallback)(() => {
+  const handleClearFilters = (0, import_react8.useCallback)(() => {
     setSelectedCondition("");
   }, []);
-  const handleFetchLatest = (0, import_react7.useCallback)(async () => {
+  const handleFetchLatest = (0, import_react8.useCallback)(async () => {
     setClearing(true);
     try {
-      await clearMixpanelCache(MIXPANEL_API_URL);
+      await clearMixpanelCache(targetUrl);
     } catch (err) {
       console.error("[FunnelEventsTab] clear-cache error:", err);
     } finally {
       setClearing(false);
       setRefreshKey((k) => k + 1);
     }
-  }, []);
-  const handleClosePatientModal = (0, import_react7.useCallback)(() => setPatientModalOpen(false), []);
+  }, [targetUrl]);
+  const handleClosePatientModal = (0, import_react8.useCallback)(() => setPatientModalOpen(false), []);
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { padding: "28px 0 48px", background: "#f8f9fb", minHeight: 500 }, children: [
     /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
       "div",
@@ -3982,7 +4107,7 @@ function FunnelEventsTab({ dateRange }) {
 }
 
 // src/studio/funnel/pm-funnel-tab.tsx
-var import_react8 = require("react");
+var import_react9 = require("react");
 var import_jsx_runtime15 = require("react/jsx-runtime");
 var HIDDEN_PARAMS = /* @__PURE__ */ new Set([
   "product_name",
@@ -4586,51 +4711,52 @@ function FlowTab({ label, icon, desc, active, onClick }) {
     }
   );
 }
-function PmFunnelTab({ dateRange }) {
-  const [flowSource, setFlowSource] = (0, import_react8.useState)("product_detail");
-  const [refreshKey, setRefreshKey] = (0, import_react8.useState)(0);
-  const [clearing, setClearing] = (0, import_react8.useState)(false);
-  const [pdFilterOptions, setPdFilterOptions] = (0, import_react8.useState)([]);
-  const [pdSelectedFilter, setPdSelectedFilter] = (0, import_react8.useState)("");
-  const [pdOptionsLoading, setPdOptionsLoading] = (0, import_react8.useState)(true);
-  const [pdEventsData, setPdEventsData] = (0, import_react8.useState)(null);
-  const [pdLoading, setPdLoading] = (0, import_react8.useState)(false);
-  const [pdError, setPdError] = (0, import_react8.useState)(null);
-  const [cdConditionOptions, setCdConditionOptions] = (0, import_react8.useState)([]);
-  const [cdSelectedConditionId, setCdSelectedConditionId] = (0, import_react8.useState)("");
-  const [cdOptionsLoading, setCdOptionsLoading] = (0, import_react8.useState)(true);
-  const [cdConditionData, setCdConditionData] = (0, import_react8.useState)(null);
-  const [cdConditionLoading, setCdConditionLoading] = (0, import_react8.useState)(false);
-  const [cdConditionError, setCdConditionError] = (0, import_react8.useState)(null);
-  const [cdSelectedProduct, setCdSelectedProduct] = (0, import_react8.useState)(null);
-  const [cdCartData, setCdCartData] = (0, import_react8.useState)(null);
-  const [cdCartLoading, setCdCartLoading] = (0, import_react8.useState)(false);
-  const [cartAuthModalOpen, setCartAuthModalOpen] = (0, import_react8.useState)(false);
-  const [cartAuthPatients, setCartAuthPatients] = (0, import_react8.useState)([]);
-  const [cartAuthPatientsLoading, setCartAuthPatientsLoading] = (0, import_react8.useState)(false);
-  const [cartAuthPatientsError, setCartAuthPatientsError] = (0, import_react8.useState)(null);
-  const [authModalOpen, setAuthModalOpen] = (0, import_react8.useState)(false);
-  const [authPatients, setAuthPatients] = (0, import_react8.useState)([]);
-  const [authPatientsLoading, setAuthPatientsLoading] = (0, import_react8.useState)(false);
-  const [authPatientsError, setAuthPatientsError] = (0, import_react8.useState)(null);
-  const handleFetchLatest = (0, import_react8.useCallback)(async () => {
+function PmFunnelTab({ apiUrl, dateRange }) {
+  const targetUrl = apiUrl || MIXPANEL_API_URL;
+  const [flowSource, setFlowSource] = (0, import_react9.useState)("product_detail");
+  const [refreshKey, setRefreshKey] = (0, import_react9.useState)(0);
+  const [clearing, setClearing] = (0, import_react9.useState)(false);
+  const [pdFilterOptions, setPdFilterOptions] = (0, import_react9.useState)([]);
+  const [pdSelectedFilter, setPdSelectedFilter] = (0, import_react9.useState)("");
+  const [pdOptionsLoading, setPdOptionsLoading] = (0, import_react9.useState)(true);
+  const [pdEventsData, setPdEventsData] = (0, import_react9.useState)(null);
+  const [pdLoading, setPdLoading] = (0, import_react9.useState)(false);
+  const [pdError, setPdError] = (0, import_react9.useState)(null);
+  const [cdConditionOptions, setCdConditionOptions] = (0, import_react9.useState)([]);
+  const [cdSelectedConditionId, setCdSelectedConditionId] = (0, import_react9.useState)("");
+  const [cdOptionsLoading, setCdOptionsLoading] = (0, import_react9.useState)(true);
+  const [cdConditionData, setCdConditionData] = (0, import_react9.useState)(null);
+  const [cdConditionLoading, setCdConditionLoading] = (0, import_react9.useState)(false);
+  const [cdConditionError, setCdConditionError] = (0, import_react9.useState)(null);
+  const [cdSelectedProduct, setCdSelectedProduct] = (0, import_react9.useState)(null);
+  const [cdCartData, setCdCartData] = (0, import_react9.useState)(null);
+  const [cdCartLoading, setCdCartLoading] = (0, import_react9.useState)(false);
+  const [cartAuthModalOpen, setCartAuthModalOpen] = (0, import_react9.useState)(false);
+  const [cartAuthPatients, setCartAuthPatients] = (0, import_react9.useState)([]);
+  const [cartAuthPatientsLoading, setCartAuthPatientsLoading] = (0, import_react9.useState)(false);
+  const [cartAuthPatientsError, setCartAuthPatientsError] = (0, import_react9.useState)(null);
+  const [authModalOpen, setAuthModalOpen] = (0, import_react9.useState)(false);
+  const [authPatients, setAuthPatients] = (0, import_react9.useState)([]);
+  const [authPatientsLoading, setAuthPatientsLoading] = (0, import_react9.useState)(false);
+  const [authPatientsError, setAuthPatientsError] = (0, import_react9.useState)(null);
+  const handleFetchLatest = (0, import_react9.useCallback)(async () => {
     setClearing(true);
     try {
-      await clearMixpanelCache(MIXPANEL_API_URL);
+      await clearMixpanelCache(targetUrl);
     } catch (err) {
       console.error("PM funnel clear-cache error:", err);
     } finally {
       setClearing(false);
       setRefreshKey((k) => k + 1);
     }
-  }, []);
-  (0, import_react8.useEffect)(() => {
+  }, [targetUrl]);
+  (0, import_react9.useEffect)(() => {
     if (flowSource !== "product_detail") return;
     const controller = new AbortController();
     setPdOptionsLoading(true);
     setPdSelectedFilter("");
     setPdEventsData(null);
-    fetchPmFunnelProducts(MIXPANEL_API_URL, dateRange, "product_detail", controller.signal).then((values) => {
+    fetchPmFunnelProducts(targetUrl, dateRange, "product_detail", controller.signal).then((values) => {
       if (!controller.signal.aborted) {
         setPdFilterOptions(values);
         setPdOptionsLoading(false);
@@ -4641,8 +4767,8 @@ function PmFunnelTab({ dateRange }) {
       if (!controller.signal.aborted) setPdOptionsLoading(false);
     });
     return () => controller.abort();
-  }, [dateRange, flowSource, refreshKey]);
-  (0, import_react8.useEffect)(() => {
+  }, [targetUrl, dateRange, flowSource, refreshKey]);
+  (0, import_react9.useEffect)(() => {
     if (flowSource !== "product_detail" || !pdSelectedFilter) {
       setPdEventsData(null);
       setPdLoading(false);
@@ -4651,7 +4777,7 @@ function PmFunnelTab({ dateRange }) {
     const controller = new AbortController();
     setPdLoading(true);
     setPdError(null);
-    fetchPmFunnelEvents(MIXPANEL_API_URL, dateRange, pdSelectedFilter, "product_detail", controller.signal).then((data) => {
+    fetchPmFunnelEvents(targetUrl, dateRange, pdSelectedFilter, "product_detail", controller.signal).then((data) => {
       if (!controller.signal.aborted) {
         setPdEventsData(data);
         setPdLoading(false);
@@ -4664,8 +4790,8 @@ function PmFunnelTab({ dateRange }) {
       }
     });
     return () => controller.abort();
-  }, [pdSelectedFilter, dateRange, flowSource, refreshKey]);
-  (0, import_react8.useEffect)(() => {
+  }, [targetUrl, pdSelectedFilter, dateRange, flowSource, refreshKey]);
+  (0, import_react9.useEffect)(() => {
     if (flowSource !== "condition_detail") return;
     const controller = new AbortController();
     setCdOptionsLoading(true);
@@ -4674,7 +4800,7 @@ function PmFunnelTab({ dateRange }) {
     setCdSelectedProduct(null);
     setCdCartData(null);
     Promise.all([
-      fetchPmConditionOptions(MIXPANEL_API_URL, dateRange, controller.signal),
+      fetchPmConditionOptions(targetUrl, dateRange, controller.signal),
       sanityClient.fetch(
         `*[_type == "singleCondition" && defined(conditionId)]{conditionId, title}`
       )
@@ -4696,8 +4822,8 @@ function PmFunnelTab({ dateRange }) {
       if (!controller.signal.aborted) setCdOptionsLoading(false);
     });
     return () => controller.abort();
-  }, [dateRange, flowSource, refreshKey]);
-  (0, import_react8.useEffect)(() => {
+  }, [targetUrl, dateRange, flowSource, refreshKey]);
+  (0, import_react9.useEffect)(() => {
     if (flowSource !== "condition_detail" || !cdSelectedConditionId) {
       setCdConditionData(null);
       setCdSelectedProduct(null);
@@ -4710,7 +4836,7 @@ function PmFunnelTab({ dateRange }) {
     setCdConditionError(null);
     setCdSelectedProduct(null);
     setCdCartData(null);
-    fetchPmConditionEvents(MIXPANEL_API_URL, dateRange, Number(cdSelectedConditionId), controller.signal).then((data) => {
+    fetchPmConditionEvents(targetUrl, dateRange, Number(cdSelectedConditionId), controller.signal).then((data) => {
       if (!controller.signal.aborted) {
         setCdConditionData(data);
         setCdConditionLoading(false);
@@ -4723,76 +4849,76 @@ function PmFunnelTab({ dateRange }) {
       }
     });
     return () => controller.abort();
-  }, [cdSelectedConditionId, dateRange, flowSource, refreshKey]);
-  const handleProductSelect = (0, import_react8.useCallback)((productName) => {
+  }, [targetUrl, cdSelectedConditionId, dateRange, flowSource, refreshKey]);
+  const handleProductSelect = (0, import_react9.useCallback)((productName) => {
     if (productName === cdSelectedProduct) return;
     setCdSelectedProduct(productName);
     setCdCartData(null);
     setCdCartLoading(true);
-    fetchPmProductCart(MIXPANEL_API_URL, dateRange, Number(cdSelectedConditionId), productName).then((data) => {
+    fetchPmProductCart(targetUrl, dateRange, Number(cdSelectedConditionId), productName).then((data) => {
       setCdCartData(data);
       setCdCartLoading(false);
     }).catch((err) => {
       console.error("PM funnel cart error:", err);
       setCdCartLoading(false);
     });
-  }, [cdSelectedConditionId, cdSelectedProduct, dateRange]);
-  const handlePdCartAuthClick = (0, import_react8.useCallback)(() => {
+  }, [targetUrl, cdSelectedConditionId, cdSelectedProduct, dateRange]);
+  const handlePdCartAuthClick = (0, import_react9.useCallback)(() => {
     if (!pdSelectedFilter) return;
     setCartAuthModalOpen(true);
     setCartAuthPatientsLoading(true);
     setCartAuthPatientsError(null);
     setCartAuthPatients([]);
-    fetchCartAuthPatients(MIXPANEL_API_URL, dateRange, { flowSource: "product_detail", product: pdSelectedFilter }).then((records) => {
+    fetchCartAuthPatients(targetUrl, dateRange, { flowSource: "product_detail", product: pdSelectedFilter }).then((records) => {
       setCartAuthPatients(records);
       setCartAuthPatientsLoading(false);
     }).catch((err) => {
       setCartAuthPatientsError(err instanceof Error ? err.message : String(err));
       setCartAuthPatientsLoading(false);
     });
-  }, [pdSelectedFilter, dateRange]);
-  const handleCdCartAuthClick = (0, import_react8.useCallback)(() => {
+  }, [targetUrl, pdSelectedFilter, dateRange]);
+  const handleCdCartAuthClick = (0, import_react9.useCallback)(() => {
     if (!cdSelectedProduct || !cdSelectedConditionId) return;
     setCartAuthModalOpen(true);
     setCartAuthPatientsLoading(true);
     setCartAuthPatientsError(null);
     setCartAuthPatients([]);
-    fetchCartAuthPatients(MIXPANEL_API_URL, dateRange, { flowSource: "condition_detail", product: cdSelectedProduct, conditionId: Number(cdSelectedConditionId) }).then((records) => {
+    fetchCartAuthPatients(targetUrl, dateRange, { flowSource: "condition_detail", product: cdSelectedProduct, conditionId: Number(cdSelectedConditionId) }).then((records) => {
       setCartAuthPatients(records);
       setCartAuthPatientsLoading(false);
     }).catch((err) => {
       setCartAuthPatientsError(err instanceof Error ? err.message : String(err));
       setCartAuthPatientsLoading(false);
     });
-  }, [cdSelectedConditionId, cdSelectedProduct, dateRange]);
-  const handlePdAuthClick = (0, import_react8.useCallback)(() => {
+  }, [targetUrl, cdSelectedConditionId, cdSelectedProduct, dateRange]);
+  const handlePdAuthClick = (0, import_react9.useCallback)(() => {
     if (!pdSelectedFilter) return;
     setAuthModalOpen(true);
     setAuthPatientsLoading(true);
     setAuthPatientsError(null);
     setAuthPatients([]);
-    fetchAuthPatients(MIXPANEL_API_URL, dateRange, { flowSource: "product_detail", product: pdSelectedFilter }).then((records) => {
+    fetchAuthPatients(targetUrl, dateRange, { flowSource: "product_detail", product: pdSelectedFilter }).then((records) => {
       setAuthPatients(records);
       setAuthPatientsLoading(false);
     }).catch((err) => {
       setAuthPatientsError(err instanceof Error ? err.message : String(err));
       setAuthPatientsLoading(false);
     });
-  }, [pdSelectedFilter, dateRange]);
-  const handleCdAuthClick = (0, import_react8.useCallback)(() => {
+  }, [targetUrl, pdSelectedFilter, dateRange]);
+  const handleCdAuthClick = (0, import_react9.useCallback)(() => {
     if (!cdSelectedConditionId) return;
     setAuthModalOpen(true);
     setAuthPatientsLoading(true);
     setAuthPatientsError(null);
     setAuthPatients([]);
-    fetchAuthPatients(MIXPANEL_API_URL, dateRange, { flowSource: "condition_detail", conditionId: Number(cdSelectedConditionId) }).then((records) => {
+    fetchAuthPatients(targetUrl, dateRange, { flowSource: "condition_detail", conditionId: Number(cdSelectedConditionId) }).then((records) => {
       setAuthPatients(records);
       setAuthPatientsLoading(false);
     }).catch((err) => {
       setAuthPatientsError(err instanceof Error ? err.message : String(err));
       setAuthPatientsLoading(false);
     });
-  }, [cdSelectedConditionId, dateRange]);
+  }, [targetUrl, cdSelectedConditionId, dateRange]);
   const pdFunnelEvents = [...PM_PRODUCT_DETAIL_EVENTS];
   const pdAuthMethods = pdEventsData?.paramBreakdowns?.auth_completed?.method ?? {};
   const pdGuestCount = (pdAuthMethods["guest"] ?? 0) + (pdAuthMethods["Guest"] ?? 0);
@@ -5102,13 +5228,13 @@ function PmFunnelTab({ dateRange }) {
 }
 
 // src/studio/search-console/search-console-dashboard.tsx
-var import_react10 = require("react");
+var import_react11 = require("react");
 var import_recharts5 = require("recharts");
 var import_lucide_react2 = require("lucide-react");
 
 // src/studio/search-console/dashboard-ui.tsx
-var import_react9 = require("react");
-var import_react_dom = require("react-dom");
+var import_react10 = require("react");
+var import_react_dom2 = require("react-dom");
 var import_lucide_react = require("lucide-react");
 var import_recharts4 = require("recharts");
 var import_jsx_runtime16 = require("react/jsx-runtime");
@@ -5994,16 +6120,20 @@ function ErrorState({
   ] });
 }
 function InfoIcon2({ text }) {
-  const triggerRef = (0, import_react9.useRef)(null);
-  const [tip, setTip] = (0, import_react9.useState)(null);
+  const triggerRef = (0, import_react10.useRef)(null);
+  const [tip, setTip] = (0, import_react10.useState)(null);
   const show = () => {
     const el = triggerRef.current;
     if (!el) return;
     const rect = el.getBoundingClientRect();
     const placeBelow = rect.top < 120;
+    const tipWidth = 230;
+    const pad = 12;
+    const centerX = rect.left + rect.width / 2;
+    const clampedLeft = typeof window !== "undefined" ? Math.max(tipWidth / 2 + pad, Math.min(centerX, window.innerWidth - tipWidth / 2 - pad)) : centerX;
     setTip({
       top: placeBelow ? rect.bottom + 8 : rect.top - 8,
-      left: rect.left + rect.width / 2,
+      left: clampedLeft,
       placement: placeBelow ? "bottom" : "top"
     });
   };
@@ -6021,7 +6151,7 @@ function InfoIcon2({ text }) {
         children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_lucide_react.Info, { size: 12 })
       }
     ),
-    tip && typeof document !== "undefined" && (0, import_react_dom.createPortal)(
+    tip && typeof document !== "undefined" && (0, import_react_dom2.createPortal)(
       /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
         "span",
         {
@@ -6293,9 +6423,26 @@ function ScOverviewTab({ data, loading }) {
         /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("stop", { offset: "95%", stopColor: color, stopOpacity: 0 })
       ] }, id)) }),
       /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_recharts5.CartesianGrid, { strokeDasharray: "4 6", stroke: CHART_GRID }),
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_recharts5.XAxis, { dataKey: "displayDate", ...chartAxis }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        import_recharts5.XAxis,
+        {
+          dataKey: "date",
+          tickFormatter: formatDateTick,
+          minTickGap: 28,
+          interval: evenTickInterval(clicksSeries?.length ?? 0),
+          padding: { left: 2, right: 15 },
+          ...chartAxis
+        }
+      ),
       /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_recharts5.YAxis, { ...chartAxis, width: 38 }),
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_recharts5.Tooltip, { contentStyle: chartTooltipStyle, cursor: { stroke: "#cbd5e1", strokeDasharray: "4 4" } }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        import_recharts5.Tooltip,
+        {
+          labelFormatter: formatTooltipDate,
+          contentStyle: chartTooltipStyle,
+          cursor: { stroke: "#cbd5e1", strokeDasharray: "4 4" }
+        }
+      ),
       /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_recharts5.Legend, { wrapperStyle: { fontSize: 12, fontWeight: 700, paddingTop: 10 } }),
       /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_recharts5.Area, { type: "monotone", dataKey: "clicks", name: "Clicks", stroke: "#0f9f6e", fill: "url(#scClicks)", strokeWidth: 2.4, dot: false }),
       /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_recharts5.Area, { type: "monotone", dataKey: "impressions", name: "Impressions", stroke: "#6366f1", fill: "url(#scImpressions)", strokeWidth: 2.4, dot: false })
@@ -6486,9 +6633,9 @@ function ScSitemapsTab({
   onRefreshData,
   loading
 }) {
-  const [submitting, setSubmitting] = (0, import_react10.useState)(null);
-  const [submitMsg, setSubmitMsg] = (0, import_react10.useState)(null);
-  const [newSitemapUrl, setNewSitemapUrl] = (0, import_react10.useState)("");
+  const [submitting, setSubmitting] = (0, import_react11.useState)(null);
+  const [submitMsg, setSubmitMsg] = (0, import_react11.useState)(null);
+  const [newSitemapUrl, setNewSitemapUrl] = (0, import_react11.useState)("");
   const totalSubmitted = data.sitemaps.reduce((sum, sitemap) => sum + sitemap.contents.reduce((contentSum, content) => contentSum + content.submitted, 0), 0);
   const totalIndexed = data.sitemaps.reduce((sum, sitemap) => sum + sitemap.contents.reduce((contentSum, content) => contentSum + content.indexed, 0), 0);
   const indexRate = totalSubmitted > 0 ? totalIndexed / totalSubmitted : 0;
@@ -6623,25 +6770,25 @@ function SearchConsoleDashboard({
   activeTab: controlledTab,
   onTabChange
 }) {
-  const [data, setData] = (0, import_react10.useState)(null);
-  const [loading, setLoading] = (0, import_react10.useState)(true);
-  const [error, setError] = (0, import_react10.useState)(null);
-  const [dateRange, setDateRange] = (0, import_react10.useState)("28");
-  const [uncontrolledTab, setUncontrolledTab] = (0, import_react10.useState)(initialTab);
+  const [data, setData] = (0, import_react11.useState)(null);
+  const [loading, setLoading] = (0, import_react11.useState)(true);
+  const [error, setError] = (0, import_react11.useState)(null);
+  const [dateRange, setDateRange] = (0, import_react11.useState)("28");
+  const [uncontrolledTab, setUncontrolledTab] = (0, import_react11.useState)(initialTab);
   const activeTab = controlledTab !== void 0 ? controlledTab : uncontrolledTab;
-  const handleTabChange = (0, import_react10.useCallback)(
+  const handleTabChange = (0, import_react11.useCallback)(
     (nextTab) => {
       setUncontrolledTab(nextTab);
       onTabChange?.(nextTab);
     },
     [onTabChange]
   );
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     if (initialTab) {
       setUncontrolledTab(initialTab);
     }
   }, [initialTab]);
-  const loadData = (0, import_react10.useCallback)(async () => {
+  const loadData = (0, import_react11.useCallback)(async () => {
     try {
       setLoading(true);
       setError(null);
@@ -6653,7 +6800,7 @@ function SearchConsoleDashboard({
       setLoading(false);
     }
   }, [apiUrl, dateRange]);
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     loadData();
   }, [loadData]);
   if (loading && !data) {
@@ -7199,7 +7346,10 @@ function CombinedOverviewTab({
               import_recharts6.XAxis,
               {
                 dataKey: "date",
-                tickFormatter: (v) => v.slice(5).replace("-", "/"),
+                tickFormatter: formatDateTick,
+                minTickGap: 28,
+                interval: evenTickInterval(scTimeSeries?.length ?? 0),
+                padding: { left: 2, right: 15 },
                 tick: { fontSize: 10, fill: "#94a3b8" },
                 axisLine: false,
                 tickLine: false
@@ -7209,6 +7359,7 @@ function CombinedOverviewTab({
             /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
               import_recharts6.Tooltip,
               {
+                labelFormatter: formatTooltipDate,
                 contentStyle: {
                   background: "#1e293b",
                   border: "none",
@@ -7248,7 +7399,10 @@ function CombinedOverviewTab({
               import_recharts6.XAxis,
               {
                 dataKey: "date",
-                tickFormatter: (v) => v.length === 8 ? `${v.slice(4, 6)}/${v.slice(6, 8)}` : v,
+                tickFormatter: formatDateTick,
+                minTickGap: 28,
+                interval: evenTickInterval(gaTimeSeries?.length ?? 0),
+                padding: { left: 2, right: 15 },
                 tick: { fontSize: 10, fill: "#94a3b8" },
                 axisLine: false,
                 tickLine: false
@@ -7258,6 +7412,7 @@ function CombinedOverviewTab({
             /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
               import_recharts6.Tooltip,
               {
+                labelFormatter: formatTooltipDate,
                 contentStyle: {
                   background: "#1e293b",
                   border: "none",
@@ -7399,25 +7554,27 @@ function mapToScRange(range) {
 function UnifiedDashboard({
   apiUrl = "/api/analytics",
   scApiUrl,
+  mixpanelApiUrl,
   brandName = "Pharmacy Analytics"
 }) {
-  const [activeMainSection, setActiveMainSection] = (0, import_react11.useState)("all");
-  const [activeTab, setActiveTab] = (0, import_react11.useState)("all-overview");
-  const [scActiveTab, setScActiveTab] = (0, import_react11.useState)("overview");
-  const [dateRange, setDateRange] = (0, import_react11.useState)("30");
-  const [gaOpen, setGaOpen] = (0, import_react11.useState)(true);
-  const [customOpen, setCustomOpen] = (0, import_react11.useState)(true);
-  const [scOpen, setScOpen] = (0, import_react11.useState)(true);
-  const [gaData, setGaData] = (0, import_react11.useState)(null);
-  const [scData, setScData] = (0, import_react11.useState)(null);
-  const [loadingGa, setLoadingGa] = (0, import_react11.useState)(true);
-  const [loadingSc, setLoadingSc] = (0, import_react11.useState)(true);
-  const [gaError, setGaError] = (0, import_react11.useState)(null);
-  const [scError, setScError] = (0, import_react11.useState)(null);
-  const gaAbortRef = (0, import_react11.useRef)(null);
-  const scAbortRef = (0, import_react11.useRef)(null);
+  const [activeMainSection, setActiveMainSection] = (0, import_react12.useState)("all");
+  const [activeTab, setActiveTab] = (0, import_react12.useState)("all-overview");
+  const [scActiveTab, setScActiveTab] = (0, import_react12.useState)("overview");
+  const [dateRange, setDateRange] = (0, import_react12.useState)("30");
+  const [gaOpen, setGaOpen] = (0, import_react12.useState)(true);
+  const [customOpen, setCustomOpen] = (0, import_react12.useState)(true);
+  const [scOpen, setScOpen] = (0, import_react12.useState)(true);
+  const isAll = activeMainSection === "all";
+  const [gaData, setGaData] = (0, import_react12.useState)(null);
+  const [scData, setScData] = (0, import_react12.useState)(null);
+  const [loadingGa, setLoadingGa] = (0, import_react12.useState)(true);
+  const [loadingSc, setLoadingSc] = (0, import_react12.useState)(true);
+  const [gaError, setGaError] = (0, import_react12.useState)(null);
+  const [scError, setScError] = (0, import_react12.useState)(null);
+  const gaAbortRef = (0, import_react12.useRef)(null);
+  const scAbortRef = (0, import_react12.useRef)(null);
   const effectiveScUrl = scApiUrl || apiUrl;
-  const loadGaData = (0, import_react11.useCallback)(async () => {
+  const loadGaData = (0, import_react12.useCallback)(async () => {
     gaAbortRef.current?.abort();
     const controller = new AbortController();
     gaAbortRef.current = controller;
@@ -7434,7 +7591,7 @@ function UnifiedDashboard({
       if (!controller.signal.aborted) setLoadingGa(false);
     }
   }, [apiUrl, dateRange]);
-  const loadScData = (0, import_react11.useCallback)(async () => {
+  const loadScData = (0, import_react12.useCallback)(async () => {
     scAbortRef.current?.abort();
     const controller = new AbortController();
     scAbortRef.current = controller;
@@ -7452,11 +7609,11 @@ function UnifiedDashboard({
       if (!controller.signal.aborted) setLoadingSc(false);
     }
   }, [effectiveScUrl, dateRange]);
-  const loadAllData = (0, import_react11.useCallback)(() => {
+  const loadAllData = (0, import_react12.useCallback)(() => {
     loadGaData();
     loadScData();
   }, [loadGaData, loadScData]);
-  (0, import_react11.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     loadAllData();
     return () => {
       gaAbortRef.current?.abort();
@@ -7813,6 +7970,7 @@ function UnifiedDashboard({
                     /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
                       "button",
                       {
+                        disabled: !isAll,
                         onClick: () => setGaOpen((o) => !o),
                         style: {
                           display: "flex",
@@ -7823,7 +7981,7 @@ function UnifiedDashboard({
                           borderRadius: 6,
                           background: "transparent",
                           border: "none",
-                          cursor: "pointer",
+                          cursor: isAll ? "pointer" : "default",
                           marginBottom: 2
                         },
                         children: [
@@ -7843,11 +8001,11 @@ function UnifiedDashboard({
                               children: "Google Analytics"
                             }
                           ),
-                          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { style: { fontSize: 11, color: "#94a3b8" }, children: gaOpen ? "\u25BE" : "\u25B8" })
+                          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { style: { fontSize: 11, color: "#94a3b8" }, children: isAll ? gaOpen ? "\u25BE" : "\u25B8" : null })
                         ]
                       }
                     ),
-                    gaOpen && GA_SUB_TABS.map((tab) => {
+                    (gaOpen || !isAll) && GA_SUB_TABS.map((tab) => {
                       const active = activeTab === tab.id;
                       return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
                         "button",
@@ -7882,6 +8040,7 @@ function UnifiedDashboard({
                     /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
                       "button",
                       {
+                        disabled: !isAll,
                         onClick: () => setCustomOpen((o) => !o),
                         style: {
                           display: "flex",
@@ -7892,7 +8051,7 @@ function UnifiedDashboard({
                           borderRadius: 6,
                           background: "transparent",
                           border: "none",
-                          cursor: "pointer",
+                          cursor: isAll ? "pointer" : "default",
                           marginBottom: 2
                         },
                         children: [
@@ -7912,11 +8071,11 @@ function UnifiedDashboard({
                               children: "Custom Analytics"
                             }
                           ),
-                          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { style: { fontSize: 11, color: "#94a3b8" }, children: customOpen ? "\u25BE" : "\u25B8" })
+                          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { style: { fontSize: 11, color: "#94a3b8" }, children: isAll ? customOpen ? "\u25BE" : "\u25B8" : null })
                         ]
                       }
                     ),
-                    customOpen && CUSTOM_SUB_TABS.map((tab) => {
+                    (customOpen || !isAll) && CUSTOM_SUB_TABS.map((tab) => {
                       const active = activeTab === tab.id;
                       return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
                         "button",
@@ -7951,6 +8110,7 @@ function UnifiedDashboard({
                     /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
                       "button",
                       {
+                        disabled: !isAll,
                         onClick: () => setScOpen((o) => !o),
                         style: {
                           display: "flex",
@@ -7961,7 +8121,7 @@ function UnifiedDashboard({
                           borderRadius: 6,
                           background: "transparent",
                           border: "none",
-                          cursor: "pointer",
+                          cursor: isAll ? "pointer" : "default",
                           marginBottom: 2
                         },
                         children: [
@@ -7981,11 +8141,11 @@ function UnifiedDashboard({
                               children: "Search Console"
                             }
                           ),
-                          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { style: { fontSize: 11, color: "#94a3b8" }, children: scOpen ? "\u25BE" : "\u25B8" })
+                          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { style: { fontSize: 11, color: "#94a3b8" }, children: isAll ? scOpen ? "\u25BE" : "\u25B8" : null })
                         ]
                       }
                     ),
-                    scOpen && SC_SUB_TABS.map((tab) => {
+                    (scOpen || !isAll) && SC_SUB_TABS.map((tab) => {
                       const isScActive = activeTab === tab.id;
                       return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
                         "button",
@@ -8063,6 +8223,7 @@ function UnifiedDashboard({
                 flex: 1,
                 minHeight: 0,
                 overflowY: "auto",
+                overflowX: "hidden",
                 padding: "24px 28px"
               },
               children: [
@@ -8117,9 +8278,9 @@ function UnifiedDashboard({
                 activeTab === "geography" && gaData && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(GeographyTab, { data: gaData, loading: loadingGa }),
                 activeTab === "events" && gaData && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(EventsTab, { data: gaData, loading: loadingGa, apiUrl, dateRange }),
                 activeTab === "acquisition" && gaData && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(AcquisitionTab, { data: gaData, loading: loadingGa }),
-                activeTab === "conditions-products" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ConditionsProductsTab, { apiUrl, dateRange }),
-                activeTab === "funnel" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(FunnelEventsTab, { apiUrl, dateRange }),
-                activeTab === "pm-funnel" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(PmFunnelTab, { apiUrl, dateRange }),
+                activeTab === "conditions-products" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ConditionsProductsTab, { apiUrl: mixpanelApiUrl, dateRange }),
+                activeTab === "funnel" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(FunnelEventsTab, { apiUrl: mixpanelApiUrl, dateRange }),
+                activeTab === "pm-funnel" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(PmFunnelTab, { apiUrl: mixpanelApiUrl, dateRange }),
                 activeTab.startsWith("sc-") && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                   SearchConsoleDashboard,
                   {
@@ -8159,6 +8320,7 @@ function pharmacyAnalyticsPlugin(config = {}) {
             {
               apiUrl: config.apiUrl || "/api/analytics",
               scApiUrl: config.scApiUrl,
+              mixpanelApiUrl: config.mixpanelApiUrl,
               brandName: toolTitle
             }
           );