https://chatmasters.ai/assets/AdminAnalyticsSection-BYhKP7VO.js

1import{j as e}from"./ui-vendor-DUOsS7Kg.js";import{r as T,h as G}from"./react-vendor-DNa0G1Ye.js";import{T as _,a as D,b as g,c as W}from"./tabs-CVan8YJm.js";import{u as X}from"./useClickAnalytics-BgXl7reZ.js";import{C as o,b as d,a as x,c as j,d as S}from"./card-XFamXwP3.js";import{T as Q,a as J,b as M,c as C,d as Z,e as w}from"./table-UpY9srZ8.js";import{S as h}from"./index-C1moD8BR.js";import{L as ee,C as P}from"./ChartSkeleton-D3wp2HAV.js";import{T as se}from"./TableSkeleton-DWHXi5dE.js";import{M as K}from"./mouse-pointer-click-BN4GgAJy.js";import{T as te}from"./trending-up-ByXRgeEZ.js";import{A as ae}from"./award-D4IGRtKr.js";import{A as V}from"./activity-iuCacm2Y.js";import{R as $,L as le,C as R,X as L,Y as E,T as F,a as re,B as z,b as I,d as ce}from"./chart-vendor-yLHj4I85.js";import{c as ie}from"./query-vendor-CURKn8Lc.js";import{s as ne}from"./client-F5iw3UB_.js";import{s as H}from"./subDays-CVAaGY8X.js";import{U as oe}from"./users-B15K_8pb.js";import{C as de}from"./clock-DRRc_Xdd.js";import"./format-BmZa2Fkx.js";import"./en-US-DSSwd-Ay.js";import"./pdf-vendor-CMKkiHmf.js";import"./supabase-vendor-BtubEpct.js";const xe=()=>{const[u,N]=T.useState("week"),{data:c,isLoading:p}=X(u);return p?e.jsxs("div",{className:"space-y-6",children:[e.jsx(h,{className:"h-10 w-64"}),e.jsxs("div",{className:"grid gap-4 md:grid-cols-2 lg:grid-cols-4",children:[e.jsx(h,{className:"h-28"}),e.jsx(h,{className:"h-28"}),e.jsx(h,{className:"h-28"}),e.jsx(h,{className:"h-28"})]}),e.jsxs("div",{className:"grid gap-4 md:grid-cols-2",children:[e.jsxs(o,{children:[e.jsx(d,{children:e.jsx(h,{className:"h-6 w-48"})}),e.jsx(x,{children:e.jsx(ee,{})})]}),e.jsxs(o,{children:[e.jsx(d,{children:e.jsx(h,{className:"h-6 w-48"})}),e.jsx(x,{children:e.jsx(P,{})})]})]}),e.jsxs(o,{children:[e.jsx(d,{children:e.jsx(h,{className:"h-6 w-48"})}),e.jsx(x,{children:e.jsx(se,{rows:5,columns:5})})]})]}):c?e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"flex justify-between items-center",children:[e.jsx("h3",{className:"text-2xl font-semibold",children:"CTA Click Analytics"}),e.jsx(_,{value:u,onValueChange:t=>N(t),children:e.jsxs(D,{children:[e.jsx(g,{value:"week",children:"7 Days"}),e.jsx(g,{value:"month",children:"30 Days"}),e.jsx(g,{value:"all",children:"All Time"})]})})]}),e.jsxs("div",{className:"grid gap-4 md:grid-cols-2 lg:grid-cols-4",children:[e.jsxs(o,{children:[e.jsxs(d,{className:"flex flex-row items-center justify-between space-y-0 pb-2",children:[e.jsx(j,{className:"text-sm font-medium",children:"Total CTA Clicks"}),e.jsx(K,{className:"h-4 w-4 text-muted-foreground"})]}),e.jsxs(x,{children:[e.jsx("div",{className:"text-2xl font-bold",children:c.totalClicks.toLocaleString()}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"All CTA buttons combined"})]})]}),e.jsxs(o,{children:[e.jsxs(d,{className:"flex flex-row items-center justify-between space-y-0 pb-2",children:[e.jsx(j,{className:"text-sm font-medium",children:"Conversion Rate"}),e.jsx(te,{className:"h-4 w-4 text-muted-foreground"})]}),e.jsxs(x,{children:[e.jsxs("div",{className:"text-2xl font-bold",children:[c.conversionRate.toFixed(1),"%"]}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Clicks that led to signup"})]})]}),e.jsxs(o,{children:[e.jsxs(d,{className:"flex flex-row items-center justify-between space-y-0 pb-2",children:[e.jsx(j,{className:"text-sm font-medium",children:"Most Popular CTA"}),e.jsx(ae,{className:"h-4 w-4 text-muted-foreground"})]}),e.jsxs(x,{children:[e.jsx("div",{className:"text-lg font-bold truncate",children:c.mostPopularButton}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Highest click count"})]})]}),e.jsxs(o,{children:[e.jsxs(d,{className:"flex flex-row items-center justify-between space-y-0 pb-2",children:[e.jsx(j,{className:"text-sm font-medium",children:"CTA Buttons Tracked"}),e.jsx(V,{className:"h-4 w-4 text-muted-foreground"})]}),e.jsxs(x,{children:[e.jsx("div",{className:"text-2xl font-bold",children:c.clicksByButton.length}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Different CTAs on page"})]})]})]}),e.jsxs(o,{children:[e.jsxs(d,{children:[e.jsx(j,{children:"Clicks Over Time"}),e.jsx(S,{children:"Daily click trends"})]}),e.jsx(x,{children:e.jsx($,{width:"100%",height:300,children:e.jsxs(le,{data:c.clicksByDay,children:[e.jsx(R,{strokeDasharray:"3 3"}),e.jsx(L,{dataKey:"date",tickFormatter:t=>new Date(t).toLocaleDateString("en-US",{month:"short",day:"numeric"})}),e.jsx(E,{}),e.jsx(F,{labelFormatter:t=>new Date(t).toLocaleDateString()}),e.jsx(re,{type:"monotone",dataKey:"clicks",stroke:"hsl(var(--primary))",strokeWidth:2})]})})})]}),e.jsxs(o,{children:[e.jsxs(d,{children:[e.jsx(j,{children:"Clicks by Hour"}),e.jsx(S,{children:"When users click CTAs throughout the day"})]}),e.jsx(x,{children:e.jsx($,{width:"100%",height:300,children:e.jsxs(z,{data:c.clicksByHour,children:[e.jsx(R,{strokeDasharray:"3 3"}),e.jsx(L,{dataKey:"hour",tickFormatter:t=>`${t}:00`}),e.jsx(E,{}),e.jsx(F,{labelFormatter:t=>`${t}:00 - ${t}:59`}),e.jsx(I,{dataKey:"clicks",fill:"hsl(var(--primary))"})]})})})]}),e.jsxs(o,{children:[e.jsxs(d,{children:[e.jsx(j,{children:"CTA Performance Breakdown"}),e.jsx(S,{children:"Detailed metrics for each CTA button"})]}),e.jsx(x,{children:e.jsxs(Q,{children:[e.jsx(J,{children:e.jsxs(M,{children:[e.jsx(C,{children:"Button ID"}),e.jsx(C,{children:"Button Text"}),e.jsx(C,{className:"text-right",children:"Total Clicks"}),e.jsx(C,{className:"text-right",children:"Conversions"}),e.jsx(C,{className:"text-right",children:"Conv. Rate"})]})}),e.jsxs(Z,{children:[c.clicksByButton.map(t=>e.jsxs(M,{children:[e.jsx(w,{className:"font-mono text-sm",children:t.button_id}),e.jsx(w,{className:"font-medium",children:t.button_text}),e.jsx(w,{className:"text-right",children:t.total_clicks.toLocaleStr

1ing()}),e.jsx(w,{className:"text-right",children:t.conversions}),e.jsxs(w,{className:"text-right",children:[t.conversion_rate.toFixed(1),"%"]})]},t.button_id)),c.clicksByButton.length===0&&e.jsx(M,{children:e.jsx(w,{colSpan:5,className:"text-center text-muted-foreground",children:"No CTA clicks recorded yet"})})]})]})})]})]}):e.jsx("div",{children:"No analytics data available"})},he=()=>e.jsx("div",{className:"space-y-6",children:e.jsx(xe,{})}),me=(u="/",N="week")=>ie({queryKey:["heatmap-data",u,N],queryFn:async()=>{const c=new Date;let p;N==="day"?p=H(c,1):N==="week"?p=H(c,7):p=H(c,30);const{data:t,error:r}=await ne.from("page_interactions").select("*").eq("page_path",u).gte("created_at",p.toISOString()).order("created_at",{ascending:!1});if(r)throw console.error("Error fetching heatmap data:",r),r;const b=new Map,v=50;t.filter(a=>a.event_type==="click"&&a.click_x!==null&&a.click_y!==null).forEach(a=>{const m=Math.round(a.click_x/v)*v,O=Math.round(a.click_y/v)*v,q=`${m},${O}`,U=b.get(q);U?U.count++:b.set(q,{x:m,y:O,count:1})});const B=Array.from(b.values()),s=new Map;t.filter(a=>a.event_type==="scroll"&&a.scroll_depth_percent!==null).forEach(a=>{const m=a.scroll_depth_percent;s.set(m,(s.get(m)||0)+1)});const l=Array.from(s.entries()).map(([a,m])=>({depth:a,sessions:m})).sort((a,m)=>a.depth-m.depth),n=t.filter(a=>a.event_type==="time_on_page"&&a.time_on_page_seconds!==null),A=n.length>0?Math.round(n.reduce((a,m)=>a+(m.time_on_page_seconds||0),0)/n.length):0,i=new Set(t.map(a=>a.session_id)).size,f=new Map;t.forEach(a=>{if(a.viewport_width&&a.viewport_height){const m=`${a.viewport_width}x${a.viewport_height}`;f.set(m,(f.get(m)||0)+1)}});const k=Array.from(f.entries()).sort((a,m)=>m[1]-a[1])[0],[y,Y]=k?k[0].split("x").map(Number):[1920,1080];return{clicks:B,scrollDepth:l,avgTimeOnPage:A,totalSessions:i,viewportWidth:y,viewportHeight:Y}}}),je=()=>{const[u,N]=T.useState("week"),[c,p]=T.useState("clicks"),t=T.useRef(null),{data:r,isLoading:b}=me("/",u);if(T.useEffect(()=>{if(!t.current||!r||c!=="clicks")return;const s=t.current,l=s.getContext("2d");if(!l)return;const n=.5;s.width=r.viewportWidth*n,s.height=Math.min(r.viewportHeight*3,3e3)*n,l.fillStyle="rgba(255, 255, 255, 0.05)",l.fillRect(0,0,s.width,s.height);const A=Math.max(...r.clicks.map(i=>i.count));r.clicks.forEach(i=>{const f=i.count/A,k=30*n*(.5+f*.5),y=l.createRadialGradient(i.x*n,i.y*n,0,i.x*n,i.y*n,k);f<.3?(y.addColorStop(0,`rgba(59, 130, 246, ${.6*f})`),y.addColorStop(1,"rgba(59, 130, 246, 0)")):f<.7?(y.addColorStop(0,`rgba(234, 179, 8, ${.6*f})`),y.addColorStop(1,"rgba(234, 179, 8, 0)")):(y.addColorStop(0,`rgba(239, 68, 68, ${.7*f})`),y.addColorStop(1,"rgba(239, 68, 68, 0)")),l.fillStyle=y,l.beginPath(),l.arc(i.x*n,i.y*n,k,0,Math.PI*2),l.fill()}),l.font=`${12*n}px sans-serif`,l.textAlign="center",l.textBaseline="middle",r.clicks.filter(i=>i.count>A*.3).forEach(i=>{l.fillStyle="white",l.strokeStyle="black",l.lineWidth=2*n,l.strokeText(`${i.count}`,i.x*n,i.y*n),l.fillText(`${i.count}`,i.x*n,i.y*n)})},[r,c]),b)return e.jsxs("div",{className:"space-y-6",children:[e.jsx(h,{className:"h-10 w-64"}),e.jsxs("div",{className:"grid gap-4 md:grid-cols-4",children:[e.jsx(h,{className:"h-28"}),e.jsx(h,{className:"h-28"}),e.jsx(h,{className:"h-28"}),e.jsx(h,{className:"h-28"})]}),e.jsxs(o,{children:[e.jsx(d,{children:e.jsx(h,{className:"h-6 w-48"})}),e.jsx(x,{children:e.jsx(h,{className:"h-96 w-full"})})]}),e.jsxs("div",{className:"grid gap-6 md:grid-cols-2",children:[e.jsxs(o,{children:[e.jsx(d,{children:e.jsx(h,{className:"h-6 w-48"})}),e.jsx(x,{children:e.jsx(P,{})})]}),e.jsxs(o,{children:[e.jsx(d,{children:e.jsx(h,{className:"h-6 w-48"})}),e.jsx(x,{children:e.jsx(P,{})})]})]})]});if(!r)return e.jsx("div",{children:"No heatmap data available"});const v=r.scrollDepth.map(s=>({depth:`${s.depth}%`,sessions:s.sessions,depthNum:s.depth})),B=s=>s<25?"hsl(var(--destructive))":s<50?"hsl(var(--warning))":s<75?"hsl(var(--primary))":"hsl(var(--success))";return e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"flex justify-between items-center",children:[e.jsx("h3",{className:"text-2xl font-semibold",children:"Page Engagement Heatmap"}),e.jsx(_,{value:u,onValueChange:s=>N(s),children:e.jsxs(D,{children:[e.jsx(g,{value:"day",children:"24 Hours"}),e.jsx(g,{value:"week",children:"7 Days"}),e.jsx(g,{value:"month",children:"30 Days"})]})})]}),e.jsxs("div",{className:"grid gap-4 md:grid-cols-4",children:[e.jsxs(o,{children:[e.jsxs(d,{className:"flex flex-row items-center justify-between space-y-0 pb-2",children:[e.jsx(j,{className:"text-sm font-medium",children:"Total Clicks"}),e.jsx(K,{className:"h-4 w-4 text-muted-foreground"})]}),e.jsxs(x,{children:[e.jsx("div",{className:"text-2xl font-bold",children:r.clicks.reduce((s,l)=>

1s+l.count,0).toLocaleString()}),e.jsxs("p",{className:"text-xs text-muted-foreground",children:[r.clicks.length," hot zones"]})]})]}),e.jsxs(o,{children:[e.jsxs(d,{className:"flex flex-row items-center justify-between space-y-0 pb-2",children:[e.jsx(j,{className:"text-sm font-medium",children:"Unique Sessions"}),e.jsx(oe,{className:"h-4 w-4 text-muted-foreground"})]}),e.jsxs(x,{children:[e.jsx("div",{className:"text-2xl font-bold",children:r.totalSessions.toLocaleString()}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Tracked visitors"})]})]}),e.jsxs(o,{children:[e.jsxs(d,{className:"flex flex-row items-center justify-between space-y-0 pb-2",children:[e.jsx(j,{className:"text-sm font-medium",children:"Avg Time on Page"}),e.jsx(de,{className:"h-4 w-4 text-muted-foreground"})]}),e.jsxs(x,{children:[e.jsxs("div",{className:"text-2xl font-bold",children:[Math.floor(r.avgTimeOnPage/60),":",String(r.avgTimeOnPage%60).padStart(2,"0")]}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Minutes:seconds"})]})]}),e.jsxs(o,{children:[e.jsxs(d,{className:"flex flex-row items-center justify-between space-y-0 pb-2",children:[e.jsx(j,{className:"text-sm font-medium",children:"Max Scroll Depth"}),e.jsx(V,{className:"h-4 w-4 text-muted-foreground"})]}),e.jsxs(x,{children:[e.jsxs("div",{className:"text-2xl font-bold",children:[r.scrollDepth.length>0?Math.max(...r.scrollDepth.map(s=>s.depth)):0,"%"]}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"Page coverage"})]})]})]}),e.jsx(_,{value:c,onValueChange:s=>p(s),children:e.jsxs(D,{className:"grid w-full max-w-md grid-cols-2",children:[e.jsx(g,{value:"clicks",children:"Click Heatmap"}),e.jsx(g,{value:"scroll",children:"Scroll Depth"})]})}),c==="clicks"?e.jsxs(o,{children:[e.jsxs(d,{children:[e.jsx(j,{children:"Click Heatmap"}),e.jsx(S,{children:"Red = high engagement, Yellow = medium, Blue = low. Numbers show click count."})]}),e.jsx(x,{children:e.jsxs("div",{className:"relative border rounded-lg overflow-auto max-h-[600px] bg-muted/10",children:[e.jsx("canvas",{ref:t,className:"max-w-full"}),r.clicks.length===0&&e.jsx("div",{className:"absolute inset-0 flex items-center justify-center text-muted-foreground",children:"No click data available for this time period"})]})})]}):e.jsxs(o,{children:[e.jsxs(d,{children:[e.jsx(j,{children:"Scroll Depth Distribution"}),e.jsx(S,{children:"How far down the page users scroll before leaving"})]}),e.jsx(x,{children:e.jsx($,{width:"100%",height:400,children:e.jsxs(z,{data:v,children:[e.jsx(R,{strokeDasharray:"3 3"}),e.jsx(L,{dataKey:"depth"}),e.jsx(E,{}),e.jsx(F,{formatter:s=>[`${s} sessions`,"Sessions"],labelFormatter:s=>`Scroll Depth: ${s}`}),e.jsx(I,{dataKey:"sessions",children:v.map((s,l)=>e.jsx(ce,{fill:B(s.depthNum)},l))})]})})})]})]})},ue=()=>e.jsx("div",{className:"space-y-6",children:e.jsx(je,{})}),Fe=()=>{const[u,N]=G(),c=u.get("tab")||"clicks",p=t=>{N({tab:t})};return e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{children:[e.jsx("h2",{className:"text-3xl font-bold mb-2",children:"Analytics"}),e.jsx("p",{className:"text-muted-foreground",children:"Track user interactions and visualize engagement patterns"})]}),e.jsxs(_,{value:c,onValueChange:p,children:[e.jsxs(D,{className:"mb-6",children:[e.jsxs(g,{value:"clicks",className:"flex items-center gap-2",children:[e.jsx(K,{className:"h-4 w-4"}),"Click Analytics"]}),e.jsxs(g,{value:"heatmap",className:"flex items-center gap-2",children:[e.jsx(V,{className:"h-4 w-4"}),"Heatmap"]})]}),e.jsx(W,{value:"clicks",children:e.jsx(he,{})}),e.jsx(W,{value:"heatmap",children:e.jsx(ue,{})})]})]})};export{Fe as default};