https://shopsavvy.com/_next/static/chunks/pages/admin/analytics/upsell-ab-1b369b506f7e572a.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[3382],{86332:function(e,t,a){(window.__NEXT_P=window.__NEXT_P||[]).push(["/admin/analytics/upsell-ab",function(){return a(48944)}])},48944:function(e,t,a){"use strict";a.r(t),a.d(t,{default:function(){return UpsellABTestPage}});var r=a(24246),s=a(27378),l=a(14819),n=a(23334);let d=[{bg:"bg-blue-100 dark:bg-blue-900/40",text:"text-blue-700 dark:text-blue-300",border:"border-blue-500",chart:"#3B82F6"},{bg:"bg-purple-100 dark:bg-purple-900/40",text:"text-purple-700 dark:text-purple-300",border:"border-purple-500",chart:"#8B5CF6"},{bg:"bg-pink-100 dark:bg-pink-900/40",text:"text-pink-700 dark:text-pink-300",border:"border-pink-500",chart:"#EC4899"},{bg:"bg-teal-100 dark:bg-teal-900/40",text:"text-teal-700 dark:text-teal-300",border:"border-teal-500",chart:"#14B8A6"},{bg:"bg-orange-100 dark:bg-orange-900/40",text:"text-orange-700 dark:text-orange-300",border:"border-orange-500",chart:"#F97316"}];function getVariantColor(e,t){let a=t.indexOf(e);return d[a%d.length]}function formatVariantName(e){return e.split("_").map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(" ")}let i=[{value:"all",label:"All apps"},{value:"qrcr_ios",label:"QR Code Reader (iOS)"},{value:"shopsavvy_ios",label:"ShopSavvy (iOS)"},{value:"shopsavvy_android",label:"ShopSavvy (Android)"}];function FilterBar(e){var t,a,l;let{selectedTest:d,setSelectedTest:c,availableTests:o,selectedApp:x,setSelectedApp:g}=e,{dateStart:m,dateEnd:u,setDateStart:p,setDateEnd:h}=(0,n.n)(),[y,b]=(0,s.useState)(!0),v=null!==(l=null===(t=i.find(e=>e.value===x))||void 0===t?void 0:t.label)&&void 0!==l?l:"All apps",formatDate=e=>{if(!e)return"";let t=new Date(e+"T00:00:00");return t.toLocaleDateString("en-US",{month:"short",day:"numeric",year:"numeric"})};return(0,r.jsx)("div",{className:"dark:bg-gray-800 sticky top-0 z-20 mb-6 bg-white rounded-lg shadow",children:(0,r.jsxs)("details",{open:!y,children:[(0,r.jsxs)("summary",{className:"hover:bg-gray-50 dark:hover:bg-gray-700 flex items-center justify-between px-6 py-4 rounded-t-lg cursor-pointer",onClick:e=>{e.preventDefault(),b(!y)},children:[y?(0,r.jsxs)("div",{className:"flex flex-wrap items-center gap-4",children:[(0,r.jsx)("span",{className:"dark:text-gray-100 text-sm font-medium text-gray-900",children:m&&u?"".concat(formatDate(m)," - ").concat(formatDate(u)):"Select date range"}),(0,r.jsxs)("span",{className:"dark:text-gray-400 text-sm text-gray-600",children:["Test: ",(null===(a=o.find(e=>e.id===d))||void 0===a?void 0:a.displayName)||d||"—"]}),(0,r.jsxs)("span",{className:"dark:text-gray-400 text-sm text-gray-600",children:["App: ",v]})]}):(0,r.jsx)("span",{className:"dark:text-gray-100 text-sm font-medium text-gray-900",children:"Filters"}),(0,r.jsx)("svg",{className:"dark:text-gray-400 w-5 h-5 text-gray-500 transition-transform ".concat(y?"":"rotate-180"),fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:(0,r.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})]}),(0,r.jsx)("div",{style:{display:y?"none":"block"},className:"dark:border-gray-700 px-6 py-4 border-t border-gray-200",children:(0,r.jsxs)("div",{className:"flex flex-wrap gap-6",children:[(0,r.jsxs)("div",{children:[(0,r.jsx)("label",{className:"dark:text-gray-300 block mb-2 text-sm font-medium text-gray-700",children:"Date Range"}),(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("input",{type:"date",value:m,onChange:e=>p(e.target.value),className:"dark:border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-gray-700 dark:text-gray-100 px-3 py-2 text-sm border border-gray-300 rounded-md"}),(0,r.jsx)("span",{className:"dark:text-gray-400 text-gray-500",children:"to"}),(0,r.jsx)("input",{type:"date",value:u,onChange:e=>h(e.target.value),className:"dark:border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-gray-700 dark:text-gray-100 px-3 py-2 text-sm border border-gray-300 rounded-md"})]})]}),(0,r.jsxs)("div",{children:[(0,r.jsx)("label",{className:"dark:text-gray-300 block mb-2 text-sm font-medium text-gray-700",children:"App"}),(0,r.jsx)("select",{value:x,onChange:e=>g(e.target.value),className:"dark:border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-gray-700 dark:text-gray-100 px-3 py-2 text-sm border border-gray-300 rounded-md",children:i.map(e=>(0,r.jsx)("option",{value:e.value,children:e.label},e.value))})]}),o.length>0&&(0,r.jsxs)("div",{children:[(0,r.jsx)("label",{className:"dark:text-gray-300 block mb-2 text-sm font-medium text-gray-700",children:"A/B Test"}),(0,r.jsx)("select",{value:d,onChange:e=>c(e.target.value),className:"dark:border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-gray-700 dark:text-gray-100 px-3 py-2 text-sm border border-gray-300 rounded-md",children:o.map(e=>(0,r.jsx)("option",{value:e.id,children:e.displayName},e.id))})]})]})})]})})}function VariantCard(e){var t;let{variant:a,metrics:s,variants:l,isLeading:n}=e,d=getVariantColor(a,l),i=(t=s.impressions)<100?{label:"Too early",color:"text-gray-500 dark:text-gray-400"}:t<500?{label:"Directional",color:"text-yellow-600 dark:text-yellow-400"}

1:t<2e3?{label:"Confident",color:"text-blue-600 dark:text-blue-400"}:{label:"Significant",color:"text-green-600 dark:text-green-400"};return(0,r.jsxs)("div",{className:"".concat(d.bg," rounded-lg p-6 border-l-4 ").concat(d.border," relative"),children:[n&&s.impressions>=100&&(0,r.jsx)("span",{className:"absolute top-3 right-3 px-2 py-0.5 text-[10px] font-bold uppercase tracking-wider rounded-full bg-green-600 text-white",children:"Leading"}),(0,r.jsx)("h3",{className:"text-lg font-semibold ".concat(d.text),children:formatVariantName(a)}),(0,r.jsxs)("div",{className:"mt-1 text-xs font-medium ".concat(i.color),children:[i.label," (",s.impressions.toLocaleString()," impressions)"]}),(0,r.jsxs)("div",{className:"mt-4 space-y-2",children:[(0,r.jsxs)("div",{className:"flex justify-between items-baseline",children:[(0,r.jsx)("span",{className:"dark:text-gray-300 text-xs text-gray-600",children:"Unique Devices"}),(0,r.jsx)("span",{className:"text-base font-semibold ".concat(d.text),children:s.uniqueDevicesImpressed.toLocaleString()})]}),(0,r.jsxs)("div",{className:"flex justify-between items-baseline",children:[(0,r.jsx)("span",{className:"dark:text-gray-300 text-xs text-gray-600",children:"Taps"}),(0,r.jsxs)("span",{className:"text-base font-semibold ".concat(d.text),children:[s.taps.toLocaleString(),(0,r.jsxs)("span",{className:"ml-2 text-xs font-normal text-gray-500",children:[(100*s.tapRate).toFixed(1),"%"]})]})]}),(0,r.jsxs)("div",{className:"flex justify-between items-baseline",children:[(0,r.jsx)("span",{className:"dark:text-gray-300 text-xs text-gray-600",children:"Purchases"}),(0,r.jsx)("span",{className:"text-base font-semibold ".concat(d.text),children:s.purchases.toLocaleString()})]}),(0,r.jsxs)("div",{className:"flex justify-between items-baseline",children:[(0,r.jsx)("span",{className:"dark:text-gray-300 text-xs text-gray-600",children:"Dismissals"}),(0,r.jsx)("span",{className:"text-sm text-gray-500",children:s.dismissals.toLocaleString()})]})]}),(0,r.jsxs)("div",{className:"dark:border-gray-600 mt-4 pt-3 border-t border-gray-200",children:[(0,r.jsxs)("div",{className:"flex justify-between items-baseline",children:[(0,r.jsx)("span",{className:"dark:text-gray-300 text-sm font-medium text-gray-600",children:"Conversion"}),(0,r.jsxs)("span",{className:"text-3xl font-bold ".concat(d.text),children:[(100*s.deviceConversionRate).toFixed(2),"%"]})]}),(0,r.jsxs)("div",{className:"mt-1 text-xs text-gray-500 dark:text-gray-400",children:["Device-level: ",s.uniqueDevicesPurchased," / ",s.uniqueDevicesImpressed]})]})]})}function DailyTrendChart(e){let{daily:t,variants:a,metricType:s}=e,l=[...t].sort((e,t)=>e.date.localeCompare(t.date));if(0===l.length)return(0,r.jsx)("div",{className:"dark:text-gray-400 py-8 text-center text-gray-500",children:"No data for selected date range"});let n=Math.max(...l.flatMap(e=>a.map(t=>{var a;return(null===(a=e.variants[t])||void 0===a?void 0:a[s])||0})));return(0,r.jsxs)("div",{className:"space-y-2",children:[(0,r.jsx)("div",{className:"flex flex-wrap justify-center gap-4 mb-4",children:a.map(e=>{let t=getVariantColor(e,a);return(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("div",{className:"w-3 h-3 rounded-full",style:{backgroundColor:t.chart}}),(0,r.jsx)("span",{className:"dark:text-gray-300 text-xs text-gray-600",children:formatVariantName(e)})]},e)})}),(0,r.jsx)("div",{className:"space-y-1 max-h-96 overflow-y-auto",children:l.map(e=>{let t=new Date(e.date+"T00:00:00"),l=t.toLocaleDateString("en-US",{month:"short",day:"numeric"});return(0,r.jsxs)("div",{className:"flex items-center gap-2",children:[(0,r.jsx)("div",{className:"dark:text-gray-400 w-16 text-xs text-gray-500 text-right",children:l}),(0,r.jsx)("div",{className:"flex-1 flex gap-1",children:a.map(t=>{var l;let d=getVariantColor(t,a),i=(null===(l=e.variants[t])||void 0===l?void 0:l[s])||0,c=n>0?i/n*100:0;return(0,r.jsx)("div",{className:"h-5 rounded-sm flex items-center justify-end pr-1",style:{backgroundColor:d.chart,width:"".concat(Math.max(c,1),"%"),minWidth:i>0?"20px":"2px"},title:"".concat(formatVariantName(t),": ").concat(i.toLocaleStr

1ing()),children:i>0&&c>8&&(0,r.jsx)("span",{className:"text-xs text-white font-medium",children:i.toLocaleString()})},t)})})]},e.date)})})]})}function ContextBreakdownTable(e){let{byContext:t,variants:a}=e;return 0===t.length?(0,r.jsx)("div",{className:"dark:text-gray-400 py-4 text-center text-gray-500 text-sm",children:"No context data yet"}):(0,r.jsx)("div",{className:"overflow-x-auto",children:(0,r.jsxs)("table",{className:"min-w-full text-sm",children:[(0,r.jsx)("thead",{children:(0,r.jsxs)("tr",{className:"dark:border-gray-700 border-b border-gray-200",children:[(0,r.jsx)("th",{className:"dark:text-gray-300 px-3 py-2 text-left font-medium text-gray-600",children:"Entry Point"}),a.map(e=>{let t=getVariantColor(e,a);return(0,r.jsx)("th",{className:"px-3 py-2 text-center font-medium ".concat(t.text),children:formatVariantName(e)},e)})]})}),(0,r.jsx)("tbody",{children:t.map(e=>(0,r.jsxs)("tr",{className:"dark:border-gray-700 border-b border-gray-100",children:[(0,r.jsx)("td",{className:"dark:text-gray-100 px-3 py-2 font-medium text-gray-900 capitalize",children:e.context.replace(/_/g," ")}),a.map(t=>{let a=e.variants[t];return(0,r.jsx)("td",{className:"dark:text-gray-300 px-3 py-2 text-center text-gray-600",children:a?(0,r.jsxs)("div",{children:[(0,r.jsxs)("div",{className:"font-semibold",children:[(100*a.conversionRate).toFixed(2),"%"]}),(0,r.jsxs)("div",{className:"text-xs text-gray-500",children:[a.purchases,"/",a.impressions]})]}):"—"},t)})]},e.context))})]})})}function UpsellABContent(){var e;let{dateStart:t,dateEnd:a,getAuthHeaders:l,isReady:d}=(0,n.n)(),[i,c]=(0,s.useState)(null),[o,x]=(0,s.useState)(!1),[g,m]=(0,s.useState)(null),[u,p]=(0,s.useState)(""),[h,y]=(0,s.useState)("all"),[b,v]=(0,s.useState)("impressions");if((0,s.useEffect)(()=>{(async function(){if(d&&t&&a){x(!0),m(null);try{let e=await l(),r=new URLSearchParams({dateStart:t,dateEnd:a});u&&r.set("testId",u),h&&"all"!==h&&r.set("app",h);let s=await fetch("/api/admin/analytics/upsell-ab?".concat(r),{headers:e});if(!s.ok)throw Error("API error: ".concat(s.status));let n=await s.json();c(n),!u&&n.selectedTest&&p(n.selectedTest.id)}catch(e){m(e instanceof Error?e.message:"Failed to fetch data")}finally{x(!1)}}})()},[d,t,a,u,h,l]),!d)return(0,r.jsx)("div",{className:"dark:bg-gray-800 p-6 text-center bg-white rounded-lg shadow",children:"Loading..."});let j=(null==i?void 0:null===(e=i.selectedTest)||void 0===e?void 0:e.variants)||[],f=i&&j.length>0?j.reduce((e,t)=>{var a,r;let s=(null===(a=i.summary[e])||void 0===a?void 0:a.deviceConversionRate)||0,l=(null===(r=i.summary[t])||void 0===r?void 0:r.deviceConversionRate)||0;return l>s?t:e},j[0]):"";return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(FilterBar,{selectedTest:u,setSelectedTest:p,availableTests:(null==i?void 0:i.tests)||[],selectedApp:h,setSelectedApp:e=>{y(e),p("")}}),o&&(0,r.jsxs)("div",{className:"dark:bg-gray-800 p-8 text-center bg-white rounded-lg shadow",children:[(0,r.jsx)("div",{className:"animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600 mx-auto"}),(0,r.jsx)("p",{className:"dark:text-gray-400 mt-4 text-gray-600",children:"Loading upsell A/B data..."})]}),g&&(0,r.jsx)("div",{className:"dark:bg-red-900/30 dark:text-red-300 p-4 mb-6 text-red-700 bg-red-100 rounded-lg",children:g}),i&&!o&&!i.selectedTest&&(0,r.jsxs)("div",{className:"dark:bg-gray-800 p-8 text-center bg-white rounded-lg shadow",children:[(0,r.jsx)("p",{className:"dark:text-gray-300 text-gray-600",children:"No A/B test data yet for this date range."}),(0,r.jsx)("p",{className:"dark:text-gray-500 mt-2 text-sm text-gray-500",children:"Tests start collecting data once the app release with A/B testing is live and users open the upsell screen."})]}),i&&!o&&i.selectedTest&&(0,r.jsxs)("div",{className:"space-y-6",children:[(0,r.jsxs)("div",{className:"dark:bg-gray-800 p-6 bg-white rounded-lg shadow",children:[(0,r.jsx)("h2",{className:"dark:text-gray-100 text-xl font-bold text-gray-900",children:i.selectedTest.displayName}),(0,r.jsx)("p",{className:"dark:text-gray-400 mt-1 text-sm text-gray-600",children:"Funnel: impression → tap_purchase → purchase_complete. Device-level conversion uses unique devices."}),(0,r.jsxs)("p",{className:"dark:text-gray-500 mt-2 text-xs text-gray-500",children:["Test ID: ",(0,r.jsx)("code",{className:"px-1 py-0.5 bg-gray-100 dark:bg-gray-700 rounded",children:i.selectedTest.id}

1)," \xb7 ","Variants: ",i.selectedTest.variants.join(", ")]})]}),(0,r.jsx)("div",{className:"grid grid-cols-1 gap-4 ".concat(2===j.length?"md:grid-cols-2":"md:grid-cols-3"),children:j.map(e=>(0,r.jsx)(VariantCard,{variant:e,metrics:i.summary[e]||{impressions:0,taps:0,purchases:0,dismissals:0,uniqueDevicesImpressed:0,uniqueDevicesPurchased:0,tapRate:0,purchaseRate:0,deviceConversionRate:0,tapConversionRate:0},variants:j,isLeading:e===f},e))}),(0,r.jsxs)("div",{className:"dark:bg-gray-800 p-4 flex flex-wrap justify-center gap-8 bg-white rounded-lg shadow",children:[(0,r.jsxs)("div",{className:"text-center",children:[(0,r.jsx)("div",{className:"dark:text-gray-400 text-xs text-gray-600",children:"Total Impressions"}),(0,r.jsx)("div",{className:"dark:text-gray-100 text-xl font-bold text-gray-900",children:Object.values(i.summary).reduce((e,t)=>e+t.impressions,0).toLocaleString()})]}),(0,r.jsxs)("div",{className:"text-center",children:[(0,r.jsx)("div",{className:"dark:text-gray-400 text-xs text-gray-600",children:"Total Taps"}),(0,r.jsx)("div",{className:"dark:text-gray-100 text-xl font-bold text-gray-900",children:Object.values(i.summary).reduce((e,t)=>e+t.taps,0).toLocaleString()})]}),(0,r.jsxs)("div",{className:"text-center",children:[(0,r.jsx)("div",{className:"dark:text-gray-400 text-xs text-gray-600",children:"Total Purchases"}),(0,r.jsx)("div",{className:"dark:text-gray-100 text-xl font-bold text-gray-900",children:Object.values(i.summary).reduce((e,t)=>e+t.purchases,0).toLocaleString()})]}),(0,r.jsxs)("div",{className:"text-center",children:[(0,r.jsx)("div",{className:"dark:text-gray-400 text-xs text-gray-600",children:"Unique Devices"}),(0,r.jsx)("div",{className:"dark:text-gray-100 text-xl font-bold text-gray-900",children:Object.values(i.summary).reduce((e,t)=>e+t.uniqueDevicesImpressed,0).toLocaleString()})]})]}),(0,r.jsxs)("div",{className:"dark:bg-gray-800 p-6 bg-white rounded-lg shadow",children:[(0,r.jsxs)("div",{className:"flex justify-between items-center mb-4",children:[(0,r.jsx)("h3",{className:"dark:text-gray-100 text-lg font-semibold text-gray-900",children:"Daily Trend"}),(0,r.jsx)("div",{className:"flex gap-2",children:[{key:"impressions",label:"Impressions"},{key:"taps",label:"Taps"},{key:"purchases",label:"Purchases"}].map(e=>{let{key:t,label:a}=e;return(0,r.jsx)("button",{onClick:()=>v(t),className:"px-3 py-1 text-xs rounded ".concat(b===t?"bg-blue-600 text-white":"bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-300"),children:a},t)})})]}),(0,r.jsx)(DailyTrendChart,{daily:i.daily,variants:j,metricType:b})]}),(0,r.jsxs)("div",{className:"dark:bg-gray-800 p-6 bg-white rounded-lg shadow",children:[(0,r.jsx)("h3",{className:"dark:text-gray-100 text-lg font-semibold text-gray-900 mb-4",children:"Conversion by Entry Point"}),(0,r.jsx)(ContextBreakdownTable,{byContext:i.byContext,variants:j})]}),(0,r.jsxs)("div",{className:"text-xs text-gray-500 dark:text-gray-500 text-center",children:["Generated ",new Date(i.generatedAt).toLocaleString()]})]})]})}function UpsellABTestPage(){return(0,r.jsx)(l.B,{title:"Upsell A/B Tests",children:(0,r.jsx)(UpsellABContent,{})})}}},function(e){e.O(0,[9894,9253,4819,9774,2888,179],function(){return e(e.s=86332)}),_N_E=e.O()}]);